CRM_26-07-21#story#8995,调度app上传行驶证自动压缩

This commit is contained in:
2026-07-15 16:43:34 +08:00
parent 6c0db0163a
commit 257d7fd4c6

View File

@@ -23,7 +23,7 @@
@delete="vehicleLicenseFrontDelete" @delete="vehicleLicenseFrontDelete"
max-count="1" max-count="1"
:preview-size="54" :preview-size="54"
accept="image " accept="image/*"
/> />
</div> </div>
<div class="itemContent"> <div class="itemContent">
@@ -37,7 +37,7 @@
@delete="vehicleLicenseBackDelete" @delete="vehicleLicenseBackDelete"
max-count="1" max-count="1"
:preview-size="54" :preview-size="54"
accept="image " accept="image/*"
/> />
</div> </div>
<div class="itemContent"> <div class="itemContent">
@@ -51,7 +51,7 @@
@delete="vehicleLicenseCarPhotoDelete" @delete="vehicleLicenseCarPhotoDelete"
max-count="1" max-count="1"
:preview-size="54" :preview-size="54"
accept="image " accept="image/*"
/> />
</div> </div>
<div class="itemContent"> <div class="itemContent">
@@ -65,7 +65,7 @@
@delete="vehicleFrontPhotoDelete" @delete="vehicleFrontPhotoDelete"
max-count="1" max-count="1"
:preview-size="54" :preview-size="54"
accept="image " accept="image/*"
/> />
</div> </div>
@@ -795,6 +795,18 @@ export default {
onOversize() { onOversize() {
this.$toast(`文件大小不能超过5M`) this.$toast(`文件大小不能超过5M`)
}, },
// 将 base64 dataURL 转为 Blob用于 APP WebView 只返回 content 的场景
dataURLToBlob(dataURL) {
const arr = dataURL.split(',');
const mime = arr[0].match(/:(.*?);/)[1];
const bstr = atob(arr[1]);
let n = bstr.length;
const u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], { type: mime });
},
blobToDataURL(blob) { blobToDataURL(blob) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const reader = new FileReader(); const reader = new FileReader();
@@ -864,14 +876,42 @@ export default {
}); });
}, },
async compressFileItem(fileItem, maxSize = 5 * 1024 * 1024) { async compressFileItem(fileItem, maxSize = 5 * 1024 * 1024) {
const rawFile = fileItem.file; let rawFile = fileItem?.file;
console.log('rawFile',rawFile) const rawContent = fileItem?.content;
// 打印可序列化的基础信息VConsole 中对象会显示为空,但 name/size/type 能看到
console.log('rawFile info:', {
name: rawFile?.name,
size: rawFile?.size,
type: rawFile?.type,
constructor: rawFile?.constructor?.name
});
console.log('rawContent prefix:', typeof rawContent === 'string' ? rawContent.slice(0, 60) : rawContent);
// 部分 APP WebView 返回的文件对象异常或为空,但 content 是 base64此时用 content 兜底
if ((!rawFile || !(rawFile instanceof File) || rawFile.size === 0) &&
typeof rawContent === 'string' && rawContent.startsWith('data:')) {
try {
const blob = this.dataURLToBlob(rawContent);
const ext = blob.type === 'image/png' ? 'png' : 'jpg';
rawFile = new File([blob], `upload_${Date.now()}.${ext}`, { type: blob.type || 'image/jpeg' });
console.log('fallback file from content, size:', rawFile.size);
} catch (e) {
console.error('content to file error:', e);
throw new Error('文件解析失败,请重新上传');
}
}
if (!rawFile) {
throw new Error('未获取到文件,请重新上传');
}
if (rawFile.size <= maxSize) return rawFile; if (rawFile.size <= maxSize) return rawFile;
const blob = await this.compressImage(rawFile, maxSize); const blob = await this.compressImage(rawFile, maxSize);
if (blob.size > maxSize) { if (blob.size > maxSize) {
throw new Error('超过5M'); throw new Error('超过5M');
} }
const fileName = rawFile.name.replace(/\.[^.]+$/, '') + '.jpg'; const fileName = (rawFile.name || 'image').replace(/\.[^.]+$/, '') + '.jpg';
const compressedFile = new File([blob], fileName, { type: 'image/jpeg' }); const compressedFile = new File([blob], fileName, { type: 'image/jpeg' });
fileItem.file = compressedFile; fileItem.file = compressedFile;
fileItem.size = compressedFile.size; fileItem.size = compressedFile.size;
@@ -895,7 +935,12 @@ export default {
this.vehicleLicenseFront = res.data; this.vehicleLicenseFront = res.data;
await this.vehicleOcrHandler(); await this.vehicleOcrHandler();
} catch (e) { } catch (e) {
console.error('upload compress error:', e);
if (e && e.message === '超过5M') {
this.onOversize(); this.onOversize();
} else {
this.$toast(e && e.message ? e.message : '上传失败,请重试');
}
} }
}, },
async vehicleLicenseBackHandler(file) { // 上传 行驶证副页 async vehicleLicenseBackHandler(file) { // 上传 行驶证副页
@@ -912,7 +957,12 @@ export default {
this.vehicleLicenseBack = res.data; this.vehicleLicenseBack = res.data;
await this.vehicleBackOcrHandler(); await this.vehicleBackOcrHandler();
} catch (e) { } catch (e) {
console.error('upload compress error:', e);
if (e && e.message === '超过5M') {
this.onOversize(); this.onOversize();
} else {
this.$toast(e && e.message ? e.message : '上传失败,请重试');
}
} }
}, },
async vehicleLicenseCarHandler(file) { // 上传 行驶证车辆照片 async vehicleLicenseCarHandler(file) { // 上传 行驶证车辆照片
@@ -927,7 +977,12 @@ export default {
let res = await uploadImage(formData); let res = await uploadImage(formData);
this.vehicleLicenseCarPhoto = res.data; this.vehicleLicenseCarPhoto = res.data;
} catch (e) { } catch (e) {
console.error('upload compress error:', e);
if (e && e.message === '超过5M') {
this.onOversize(); this.onOversize();
} else {
this.$toast(e && e.message ? e.message : '上传失败,请重试');
}
} }
}, },
async vehicleFrontPhotoHandler(file) { // 上传 车头照 async vehicleFrontPhotoHandler(file) { // 上传 车头照
@@ -943,7 +998,12 @@ export default {
this.vehicleFrontPhoto = res.data; this.vehicleFrontPhoto = res.data;
await this.ocrCarFrontHandler() await this.ocrCarFrontHandler()
} catch (e) { } catch (e) {
console.error('upload compress error:', e);
if (e && e.message === '超过5M') {
this.onOversize(); this.onOversize();
} else {
this.$toast(e && e.message ? e.message : '上传失败,请重试');
}
} }
}, },
vehicleLicenseFrontDelete() { // 删除 行驶证首页 vehicleLicenseFrontDelete() { // 删除 行驶证首页