增加压缩图片

This commit is contained in:
qijq 2025-06-26 02:09:26 +08:00
parent f54aacadfc
commit 1f763ac279
8 changed files with 388 additions and 499 deletions

View File

@ -10,18 +10,18 @@
* @seehttps://mall.gpxscs.cn/mobile/shop/oss/upload * @seehttps://mall.gpxscs.cn/mobile/shop/oss/upload
*/ */
import http from '../utils/http' import http from "../utils/http";
import config from '../config/config' import config from "../config/config";
export function UploadFilePromise(filePath, formData) { export function UploadFilePromise(filePath, formData) {
let ukey = uni.getStorageSync('ukey'); let ukey = uni.getStorageSync("ukey");
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
uni.uploadFile({ uni.uploadFile({
// 完整上传路径 H5端需要解决跨域问题 // 完整上传路径 H5端需要解决跨域问题
url: 'https://mall.gpxscs.cn/mobile/shop/oss/upload', url: "https://mall.gpxscs.cn/mobile/shop/oss/upload",
method: 'POST', method: "POST",
filePath: filePath, filePath: filePath,
name: 'upfile', name: "upfile",
formData: { perm_key: ukey, ...formData }, formData: { perm_key: ukey, ...formData },
success: (res) => { success: (res) => {
const result = JSON.parse(res.data); const result = JSON.parse(res.data);
@ -34,36 +34,35 @@ export function UploadFilePromise(filePath, formData) {
}); });
} }
export function batchNoApi(filePath, file, type) {
export function batchNoApi (filePath, file, type){ return new Promise((resolve, reject) => {
return new Promise((resolve, reject) => {
uni.uploadFile({ uni.uploadFile({
url:'https://mall.gpxscs.cn/mobile/shop/lakala/tk/uploadOcrImg', url: "https://mall.gpxscs.cn/mobile/shop/lakala/tk/uploadOcrImg",
method: "POST", method: "POST",
filePath, filePath,
name:'upfile', name: "upfile",
formData: { formData: {
imgType: type, imgType: type,
}, },
success: (res) =>{ success: (res) => {
if(res?.data){ if (res?.data) {
resolve(JSON.parse(res?.data)?.data) resolve(JSON.parse(res?.data)?.data);
} }
}, },
fail: (res) =>{ fail: (res) => {
reject(res) reject(res);
} },
}) });
}) });
} }
export function imgOcrResultApi (data){ export function imgOcrResultApi(data) {
return http({ return http({
url:'/shop/lakala/tk/imgOcrResult', url: "/shop/lakala/tk/imgOcrResult",
method:'POST', method: "POST",
headers: { headers: {
'content-type': 'application/x-www-form-urlencoded', "content-type": "application/x-www-form-urlencoded",
}, },
data, data,
}) });
} }

View File

@ -1,173 +1,177 @@
{ {
"name" : "小发同城商家版", "name": "小发同城商家版",
"appid" : "__UNI__95F809F", "appid": "__UNI__95F809F",
"package" : "com.xiaofa.shopAdmin", "package": "com.xiaofa.shopAdmin",
"description" : "", "description": "",
"versionName" : "1.0.0", "versionName": "1.0.0",
"versionCode" : 102, "versionCode": 102,
"transformPx" : false, "transformPx": false,
/* 5+App */ /* 5+App */
"app-plus" : { "app-plus": {
"usingComponents" : true, "usingComponents": true,
"nvueStyleCompiler" : "uni-app", "nvueStyleCompiler": "uni-app",
"compilerVersion" : 3, "compilerVersion": 3,
"splashscreen" : { "splashscreen": {
"alwaysShowBeforeRender" : true, "alwaysShowBeforeRender": true,
"waiting" : true, "waiting": true,
"autoclose" : true, "autoclose": true,
"delay" : 0 "delay": 0
},
"ios": {
"capabilities": {
"com.apple.SafariKeychain": true
}
},
/* */
"modules": {
"Maps": {},
"Camera": {},
"Record": {},
"VideoPlayer": {},
"UIWebview": {},
"Push": {}
},
/* */
"distribute": {
/* android */
"android": {
"permissions": [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios */
"ios": {
"privacyDescription": {
"NSPhotoLibraryAddUsageDescription": "此App会在上传头像图片服务中访问您的相机权限",
"NSPhotoLibraryUsageDescription": "此App会在上传头像图片服务中访问您的相机权限",
"NSCameraUsageDescription": "此App会在上传头像图片服务中访问您的相机权限",
"NSMicrophoneUsageDescription": "此APP会在使用声音识别服务中使用您的麦克风权限",
"NSLocationWhenInUseUsageDescription": "此App会在使用导航服务中使用您的定位权限",
"NSLocationAlwaysUsageDescription": "此App会在使用导航服务中使用您的定位权限",
"NSLocationAlwaysAndWhenInUseUsageDescription": "此App会在使用导航服务中使用您的定位权限"
}, },
/* */ "dSYMs": false
"modules" : { },
"Maps" : {}, /* SDK */
"Camera" : {}, "sdkConfigs": {
"Record" : {}, "maps": {},
"VideoPlayer" : {}, "push": {
"UIWebview" : {}, "igexin": {
"Push" : {} "appid": "KXgzOaKSzd5HG3p9IPaVa8",
}, "appkey": "neXXX9r1Tc7gMxN2PIcHA1",
/* */ "appsecret": "aQQys9eufd8KHH1Y0kfQm6"
"distribute" : { },
/* android */ "unipush": {
"android" : { "version": "2",
"permissions" : [ "offline": true,
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", "hms": {},
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", "oppo": {},
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", "vivo": {},
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", "mi": {},
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", "meizu": {},
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", "honor": {},
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", "fcm": {}
"<uses-permission android:name=\"android.permission.CAMERA\"/>", }
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios */
"ios" : {
"privacyDescription" : {
"NSPhotoLibraryAddUsageDescription" : "此App会在上传头像图片服务中访问您的相机权限",
"NSPhotoLibraryUsageDescription" : "此App会在上传头像图片服务中访问您的相机权限",
"NSCameraUsageDescription" : "此App会在上传头像图片服务中访问您的相机权限",
"NSMicrophoneUsageDescription" : "此APP会在使用声音识别服务中使用您的麦克风权限",
"NSLocationWhenInUseUsageDescription" : "此App会在使用导航服务中使用您的定位权限",
"NSLocationAlwaysUsageDescription" : "此App会在使用导航服务中使用您的定位权限",
"NSLocationAlwaysAndWhenInUseUsageDescription" : "此App会在使用导航服务中使用您的定位权限"
},
"dSYMs" : false
},
/* SDK */
"sdkConfigs" : {
"maps" : {},
"push" : {
"igexin" : {
"appid" : "KXgzOaKSzd5HG3p9IPaVa8",
"appkey" : "neXXX9r1Tc7gMxN2PIcHA1",
"appsecret" : "aQQys9eufd8KHH1Y0kfQm6"
},
"unipush" : {
"version" : "2",
"offline" : true,
"hms" : {},
"oppo" : {},
"vivo" : {},
"mi" : {},
"meizu" : {},
"honor" : {},
"fcm" : {}
}
}
},
"icons" : {
"android" : {
"hdpi" : "unpackage/res/icons/72x72.png",
"xhdpi" : "unpackage/res/icons/96x96.png",
"xxhdpi" : "unpackage/res/icons/144x144.png",
"xxxhdpi" : "unpackage/res/icons/192x192.png"
},
"ios" : {
"appstore" : "unpackage/res/icons/1024x1024.png",
"ipad" : {
"app" : "unpackage/res/icons/76x76.png",
"app@2x" : "unpackage/res/icons/152x152.png",
"notification" : "unpackage/res/icons/20x20.png",
"notification@2x" : "unpackage/res/icons/40x40.png",
"proapp@2x" : "unpackage/res/icons/167x167.png",
"settings" : "unpackage/res/icons/29x29.png",
"settings@2x" : "unpackage/res/icons/58x58.png",
"spotlight" : "unpackage/res/icons/40x40.png",
"spotlight@2x" : "unpackage/res/icons/80x80.png"
},
"iphone" : {
"app@2x" : "unpackage/res/icons/120x120.png",
"app@3x" : "unpackage/res/icons/180x180.png",
"notification@2x" : "unpackage/res/icons/40x40.png",
"notification@3x" : "unpackage/res/icons/60x60.png",
"settings@2x" : "unpackage/res/icons/58x58.png",
"settings@3x" : "unpackage/res/icons/87x87.png",
"spotlight@2x" : "unpackage/res/icons/80x80.png",
"spotlight@3x" : "unpackage/res/icons/120x120.png"
}
}
},
"splashscreen" : {
"androidStyle" : "common"
}
} }
}, },
/* */ "icons": {
"quickapp" : {}, "android": {
/* */ "hdpi": "unpackage/res/icons/72x72.png",
"mp-weixin" : { "xhdpi": "unpackage/res/icons/96x96.png",
"appid" : "", "xxhdpi": "unpackage/res/icons/144x144.png",
"setting" : { "xxxhdpi": "unpackage/res/icons/192x192.png"
"urlCheck" : false
}, },
"usingComponents" : true "ios": {
}, "appstore": "unpackage/res/icons/1024x1024.png",
"h5" : { "ipad": {
// "devServer" : { "app": "unpackage/res/icons/76x76.png",
// "https" : true, "app@2x": "unpackage/res/icons/152x152.png",
// "host" : "127.0.0.1", "notification": "unpackage/res/icons/20x20.png",
// "port" : 8080, "notification@2x": "unpackage/res/icons/40x40.png",
// "disableHostCheck" : true, "proapp@2x": "unpackage/res/icons/167x167.png",
// "proxy" : { "settings": "unpackage/res/icons/29x29.png",
// "/place/v2/suggestion" : { "settings@2x": "unpackage/res/icons/58x58.png",
// "target" : "https://api.map.baidu.com", "spotlight": "unpackage/res/icons/40x40.png",
// "changeOrigin" : true, "spotlight@2x": "unpackage/res/icons/80x80.png"
// "secure" : false },
// }, "iphone": {
// "/admin/shop/shop-base-product-category/list" : { "app@2x": "unpackage/res/icons/120x120.png",
// "target" : "https://mall.gpxscs.cn", "app@3x": "unpackage/res/icons/180x180.png",
// "changeOrigin" : true "notification@2x": "unpackage/res/icons/40x40.png",
// } "notification@3x": "unpackage/res/icons/60x60.png",
// } "settings@2x": "unpackage/res/icons/58x58.png",
// }, "settings@3x": "unpackage/res/icons/87x87.png",
"title" : "小发商城商家中心", "spotlight@2x": "unpackage/res/icons/80x80.png",
"template" : "index.html", "spotlight@3x": "unpackage/res/icons/120x120.png"
"router" : { }
"mode" : "history",
"base" : "/mchapp/"
} }
},
"splashscreen": {
"androidStyle": "common"
}
}
},
/* */
"quickapp": {},
/* */
"mp-weixin": {
"appid": "",
"setting": {
"urlCheck": false
}, },
"mp-alipay" : { "usingComponents": true
"usingComponents" : true },
}, "h5": {
"mp-baidu" : { // "devServer" : {
"usingComponents" : true // "https" : true,
}, // "host" : "127.0.0.1",
"mp-toutiao" : { // "port" : 8080,
"usingComponents" : true // "disableHostCheck" : true,
}, // "proxy" : {
"uniStatistics" : { // "/place/v2/suggestion" : {
"enable" : false // "target" : "https://api.map.baidu.com",
}, // "changeOrigin" : true,
"vueVersion" : "2" // "secure" : false
// },
// "/admin/shop/shop-base-product-category/list" : {
// "target" : "https://mall.gpxscs.cn",
// "changeOrigin" : true
// }
// }
// },
"title": "小发商城商家中心",
"template": "index.html",
"router": {
"mode": "history",
"base": "/mchapp/"
}
},
"mp-alipay": {
"usingComponents": true
},
"mp-baidu": {
"usingComponents": true
},
"mp-toutiao": {
"usingComponents": true
},
"uniStatistics": {
"enable": false
},
"vueVersion": "2"
} }
/* 5+App */ /* 5+App */

View File

@ -455,6 +455,13 @@
@cancel="showEndTime = false" @cancel="showEndTime = false"
></u-datetime-picker> ></u-datetime-picker>
<u-toast ref="uToast" /> <u-toast ref="uToast" />
<u-loading-page
:loading="loading"
bgColor="rgba(0,0,0,0.5)"
fontSize="32rpx"
color="#fff"
loadingText="数据正在加载中..."
></u-loading-page>
</view> </view>
</template> </template>
@ -468,8 +475,7 @@ import {
import navBar from "@/components/uni-nav-bar/uni-nav-bar"; import navBar from "@/components/uni-nav-bar/uni-nav-bar";
import tuiRadio from "@/components/tui-radio/tui-radio.vue"; import tuiRadio from "@/components/tui-radio/tui-radio.vue";
import tuiRadioGroup from "@/components/tui-radio-group/tui-radio-group.vue"; import tuiRadioGroup from "@/components/tui-radio-group/tui-radio-group.vue";
import { compressImg } from '@/utils/tool.js' import { H5compressImg, getBase64Size } from "@/utils/tool.js";
const orcImgTypeConf = { const orcImgTypeConf = {
FR_ID_CARD_FRONT: "FR_ID_CARD_FRONT", FR_ID_CARD_FRONT: "FR_ID_CARD_FRONT",
@ -493,6 +499,7 @@ export default {
showPicker: false, showPicker: false,
showStartTime: false, showStartTime: false,
showEndTime: false, showEndTime: false,
loading: false,
startTime: null, startTime: null,
endTime: null, endTime: null,
startMinDate: 0, startMinDate: 0,
@ -549,9 +556,9 @@ export default {
license_type_name: "", license_type_name: "",
orcTimeout: null, orcTimeout: null,
action: "", action: "",
limitType: ['png', 'jpg', 'jpeg'], // limitType: ["png", "jpg", "jpeg"], //
fileMaxSize: 1 * 1024 * 1024, // 1M fileMaxSize: 1 * 1024 * 1024, // 1M
maxSize:5 * 1024 * 1024, //20M maxSize: 5 * 1024 * 1024, //20M
fileMinSize: 5 * 1024, // 5KB fileMinSize: 5 * 1024, // 5KB
fileList: [], fileList: [],
fileList2: [], fileList2: [],
@ -716,50 +723,47 @@ export default {
uni.navigateBack(); uni.navigateBack();
}, },
overSize(e) { overSize(e) {
uni.$u.toast("上传图片大小不能超过8MB!"); uni.$u.toast("上传图片大小不能超过5MB!");
}, },
compressImage(url) { compressImage(url) {
return new Promise((reslove, reject) => { return new Promise((reslove, reject) => {
const tempFilePath = url //url const tempFilePath = url; //url
uni.compressImage({ uni.compressImage({
src: tempFilePath, src: tempFilePath,
quality: 90, // quality: 75, //
success: (res) => { success: (res) => {
reslove(res.tempFilePath) // reslove(res.tempFilePath); //
}, },
fail: (error) => { fail: (error) => {
console.log('压缩失败', error) console.log("压缩失败", error);
} },
}) });
}) });
},
async handerCompressImg(source, compressionRatio) {
let that = this;
return new Promise((resolve, reject) => {
compressImg(source.url, compressionRatio, source.type, compressRes => {
resolve(compressRes);
})
}).then((res) => {
source.size = res.size
// window.URL.revokeObjectURL(source.url) // ,
source.url = res.source
source.thumb = res.source
return source
}).catch(err => {
console.log('图片压缩失败', err)
})
}, },
async getOcrText(filePath, file, type) { async getOcrText(filePath, file, type) {
return new Promise(async (resolve, reject) => { return new Promise(async (resolve, reject) => {
this.loading = true;
//#ifdef APP-PLUS //#ifdef APP-PLUS
filePath = await this.compressImage(filePath); filePath = await this.compressImage(filePath);
//#endif //#endif
// base64
//#ifdef H5
filePath = await H5compressImg(filePath, 0.75);
//#endif
let size = getBase64Size(filePath);
console.log(size);
const batchNoRes = await batchNoApi(filePath, file, type); const batchNoRes = await batchNoApi(filePath, file, type);
const batchNo = batchNoRes.batchNo; const batchNo = batchNoRes.batchNo;
if (!batchNoRes) {
this.loading = false;
reject(batchNoRes);
}
const formData = new FormData(); const formData = new FormData();
let formDataStr = ""; let formDataStr = "";
@ -778,132 +782,71 @@ export default {
}); });
const imgOcrRes = await imgOcrResultApi(formDataStr); const imgOcrRes = await imgOcrResultApi(formDataStr);
if (imgOcrRes.status == 250) {
switch (type) {
case "FR_ID_CARD_FRONT":
uni.showToast({
title: "上传身份证正面图片错误,请重新上传",
icon: "error",
duration: 2000,
});
this.form.legal_person_id_images == "";
this.fileList3 = [];
break;
case "FR_ID_CARD_BEHIND":
uni.showToast({
title: "上传身份证反面图片错误,请重新上传",
icon: "error",
duration: 2000,
});
this.form.legal_person_id_images2 == "";
this.fileList4 = [];
break;
case "ID_CARD_FRONT":
uni.showToast({
title: "上传身份证正面图片错误,请重新上传",
icon: "error",
duration: 2000,
});
this.form2.individual_id_images == "";
this.fileList5 = [];
break;
case "ID_CARD_BEHIND":
uni.showToast({
title: "上传身份证反面图片错误,请重新上传",
icon: "error",
duration: 2000,
});
this.form2.individual_id_images2 == "";
this.fileList6 = [];
break;
case "BUSINESS_LICENCE":
uni.showToast({
title: "营业图片上传有误,请重新上传",
icon: "error",
duration: 2000,
});
this.form.biz_license_image == "";
this.fileList = [];
break;
}
}
clearTimeout(this.orcTimeout); clearTimeout(this.orcTimeout);
this.loading = false;
resolve(imgOcrRes?.data); resolve(imgOcrRes?.data);
}, 1000); }, 1000);
}); });
}, },
/**判断文件类型是否正确 */ /**判断文件类型是否正确 */
isAssetTypeAnImage(ext) { isAssetTypeAnImage(ext) {
const str = ext.split('.')[1]; const str = ext.split(".")[1];
return this.limitType.indexOf(str.toLowerCase()) !== -1; return this.limitType.indexOf(str.toLowerCase()) !== -1;
}, },
getCompressionRatio(fileSize) {
const multiple = (fileSize / this.fileMaxSize).toFixed(2);
let compressionRatio = 1;
if (multiple > 5) {
compressionRatio = 0.5
} else if (multiple > 4) {
compressionRatio = 0.6
} else if (multiple > 3) {
compressionRatio = 0.7
} else if (multiple > 2) {
compressionRatio = 0.8
} else if (multiple > 1) {
compressionRatio = 0.9
} else {
compressionRatio = 2
}
return compressionRatio;
},
translate(imgSrc, scale) {
//imgSrc:
//scale: 0-1
return new Promise((reslove, reject) => {
var img = new Image(); //Image<img>
img.src = imgSrc; //<img>src
img.onload = () => {//onloadonload
var h = img.height/2; //
var w = img.width/2; //,
var canvas = document.createElement('canvas');//
var ctx = canvas.getContext('2d'); //2d
var width = document.createAttribute("width"); //
width.nodeValue = w; //
var height = document.createAttribute("height");
height.nodeValue = h;
canvas.setAttributeNode(width); //
canvas.setAttributeNode(height);
ctx.drawImage(img, 0, 0, w,h);//
//img: 0,0: w,h:
var base64 = canvas.toDataURL('image/png', scale);
//'image/png': scale:
//base64
canvas = null; //
var blob = this.base64ToBlob(base64); //
let blobUrl = window.URL.createObjectURL(blob);//blob
reslove(blobUrl)
}
})
},
// base64Blob
base64ToBlob(base64) {
var arr = base64.split(','),
mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], {
type: mime,
});
},
// //
async afterRead(event, type) { async afterRead(event, type) {
var item = event.file; var item = event.file;
console.log("压缩前:",item.url);
var a = await this.translate(item.url,0.9)
item.url = a;
// let lists = [].concat(event.file);
// let fileListLen = this[`fileList${event.name}`].length;
// for (let index in lists) {
// const fileItem = lists[index];
// const fileSize = fileItem.size;
// const fileName = fileItem.name ?? '';
// if(!this.isAssetTypeAnImage(fileItem.name)) {
// this.$.msg('');
// return false
// }
// console.log('',fileSize);
// if (fileSize > this.fileMaxSize) {
// const compressionRatio = this.getCompressionRatio(fileSize);
// if (compressionRatio > 1) {
// uni.$u.toast("5MB!");
// return false
// }
// // 1M
// item = await this.handerCompressImg(fileItem, compressionRatio)
// if (fileItem.size > this.maxSize) {
// uni.$u.toast("5MB!");
// return false
// }
// }
// if (fileItem.size < this.fileMinSize) {
// uni.$u.toast("5MB!");
// return false
// }
// }
console.log("压缩后:",item.url);
var imgUrl = item.url; var imgUrl = item.url;
const group = { const group = {
url: imgUrl, url: imgUrl,
}; };
@ -929,7 +872,7 @@ export default {
this.fileList6.push(group); this.fileList6.push(group);
break; break;
} }
console.log(imgUrl) console.log(imgUrl);
let res = await UploadFilePromise(imgUrl); let res = await UploadFilePromise(imgUrl);
if (res && res.status == 200) { if (res && res.status == 200) {
@ -1099,7 +1042,7 @@ export default {
this.$refs.uToast.show({ this.$refs.uToast.show({
message: "请上营业执照片", message: "请上营业执照片",
type: "error", type: "error",
duration: 1000, duration: 2000,
}); });
return; return;
} }
@ -1108,7 +1051,7 @@ export default {
// this.$refs.uToast.show({ // this.$refs.uToast.show({
// message: "", // message: "",
// type: "error", // type: "error",
// duration: 1000, // duration: 2000,
// }); // });
// return; // return;
// } // }
@ -1117,7 +1060,7 @@ export default {
this.$refs.uToast.show({ this.$refs.uToast.show({
message: "请上身份证图片正面照片", message: "请上身份证图片正面照片",
type: "error", type: "error",
duration: 1000, duration: 2000,
}); });
return; return;
} }
@ -1126,7 +1069,7 @@ export default {
this.$refs.uToast.show({ this.$refs.uToast.show({
message: "请上身份证图片反面照片", message: "请上身份证图片反面照片",
type: "error", type: "error",
duration: 1000, duration: 2000,
}); });
return; return;
} }
@ -1154,7 +1097,7 @@ export default {
this.$refs.uToast.show({ this.$refs.uToast.show({
message: "请上身份证图片反面照片", message: "请上身份证图片反面照片",
type: "error", type: "error",
duration: 1000, duration: 2000,
}); });
return; return;
} }
@ -1163,7 +1106,7 @@ export default {
this.$refs.uToast.show({ this.$refs.uToast.show({
message: "请上身份证图片反面照片", message: "请上身份证图片反面照片",
type: "error", type: "error",
duration: 1000, duration: 2000,
}); });
return; return;
} }

View File

@ -172,7 +172,7 @@ import { batchNoApi, imgOcrResultApi } from "../../api/upload";
import { mapState } from "vuex"; import { mapState } from "vuex";
import { throttle, debounce } from "lodash"; import { throttle, debounce } from "lodash";
import navBar from "@/components/uni-nav-bar/uni-nav-bar"; import navBar from "@/components/uni-nav-bar/uni-nav-bar";
import { compressImg } from '@/utils/tool.js' import { H5compressImg } from "@/utils/tool.js";
const orcImgTypeConf = { const orcImgTypeConf = {
FR_ID_CARD_FRONT: "FR_ID_CARD_FRONT", FR_ID_CARD_FRONT: "FR_ID_CARD_FRONT",
@ -231,9 +231,9 @@ export default {
}, },
], ],
}, },
limitType: ['png', 'jpg', 'jpeg'], // limitType: ["png", "jpg", "jpeg"], //
fileMaxSize: 1 * 1024 * 1024, // 1M fileMaxSize: 1 * 1024 * 1024, // 1M
maxSize:5 * 1024 * 1024, //20M maxSize: 5 * 1024 * 1024, //20M
fileMinSize: 5 * 1024, // 5KB fileMinSize: 5 * 1024, // 5KB
}; };
}, },
@ -263,67 +263,33 @@ export default {
}, },
compressImage(url) { compressImage(url) {
return new Promise((reslove, reject) => { return new Promise((reslove, reject) => {
const tempFilePath = url //url const tempFilePath = url; //url
uni.compressImage({ uni.compressImage({
src: tempFilePath, src: tempFilePath,
quality: 90, // quality: 90, //
success: (res) => { success: (res) => {
reslove(res.tempFilePath) // reslove(res.tempFilePath); //
}, },
fail: (error) => { fail: (error) => {
console.log('压缩失败', error) console.log("压缩失败", error);
} },
}) });
}) });
},
async handerCompressImg(source, compressionRatio) {
let that = this;
return new Promise((resolve, reject) => {
compressImg(source.url, compressionRatio, source.type, compressRes => {
resolve(compressRes);
})
}).then((res) => {
source.size = res.size
// window.URL.revokeObjectURL(source.url) // ,
source.url = res.source
source.thumb = res.source
return source
}).catch(err => {
console.log('图片压缩失败', err)
})
},
/**判断文件类型是否正确 */
isAssetTypeAnImage(ext) {
const str = ext.split('.')[1];
return this.limitType.indexOf(str.toLowerCase()) !== -1;
},
getCompressionRatio(fileSize) {
const multiple = (fileSize / this.fileMaxSize).toFixed(2);
let compressionRatio = 1;
if (multiple > 5) {
compressionRatio = 0.5
} else if (multiple > 4) {
compressionRatio = 0.6
} else if (multiple > 3) {
compressionRatio = 0.7
} else if (multiple > 2) {
compressionRatio = 0.8
} else if (multiple > 1) {
compressionRatio = 0.9
} else {
compressionRatio = 2
}
return compressionRatio;
}, },
getOcrText(filePath, file, type) { getOcrText(filePath, file, type) {
//#ifdef APP-PLUS
filePath = await this.compressImage(filePath);
//#endif
return new Promise(async (resolve, reject) => { return new Promise(async (resolve, reject) => {
this.loading = true; this.loading = true;
//#ifdef APP-PLUS
filePath = await this.compressImage(filePath);
//#endif
// base64
//#ifdef H5
filePath = await H5compressImg(filePath, 0.75);
//#endif
const batchNoRes = await batchNoApi(filePath, file, type); const batchNoRes = await batchNoApi(filePath, file, type);
const batchNo = batchNoRes.batchNo; const batchNo = batchNoRes.batchNo;
@ -356,6 +322,17 @@ export default {
this.showBankDialog = true; this.showBankDialog = true;
resolve(imgOcrRes?.data); resolve(imgOcrRes?.data);
} else { } else {
uni.showToast({
title: "银行号图片上传错误,请重新上传",
icon: "error",
duration: 2000,
});
this.form = {
branch_name: "",
account_number: "",
account_holder_name: "",
};
this.bankCardFiles = [];
reject(imgOcrRes); reject(imgOcrRes);
} }
@ -385,40 +362,6 @@ export default {
url: imgUrl, url: imgUrl,
}; };
let lists = [].concat(event.file);
let fileListLen = this[`fileList${event.name}`].length;
for (let index in lists) {
const group = lists[index];
const fileSize = group.size;
const fileName = group.name ?? '';
if(!this.isAssetTypeAnImage(group.name)) {
this.$.msg('不允许该文件类型上传');
return false
}
console.log('文件大小',fileSize);
if (fileSize > this.fileMaxSize) {
const compressionRatio = this.getCompressionRatio(fileSize);
if (compressionRatio > 1) {
this.$.msg('文件' + fileName + '大于5M');
return false
}
// 1M
item = await this.handerCompressImg(item, compressionRatio)
if (item.size > this.maxSize) {
this.$.msg('文件' + fileName + '压缩后超出20M')
return false
}
}
if (item.size < this.fileMinSize) {
this.$.msg('文件' + fileName + '不能小于5KB');
return false
}
}
console.log(e);
this.currentBankFile = { this.currentBankFile = {
file: item, file: item,
path: imgUrl, path: imgUrl,

View File

@ -65,6 +65,7 @@
:height="60" :height="60"
:auto-height="true" :auto-height="true"
style="margin-bottom: 20rpx" style="margin-bottom: 20rpx"
:maxlength="4"
> >
<template slot="prefix"> <template slot="prefix">
<text class="input-label">验证码</text> <text class="input-label">验证码</text>

View File

@ -54,6 +54,7 @@
:height="60" :height="60"
:auto-height="true" :auto-height="true"
:placeholder-style="'color: #999999;'" :placeholder-style="'color: #999999;'"
:maxlength="showPassWord() == 'number' ? 4 : 99"
> >
<template slot="prefix"> <template slot="prefix">
<text class="input-label"> <text class="input-label">
@ -98,6 +99,7 @@
:auto-height="true" :auto-height="true"
:placeholder-style="'color: #999999;'" :placeholder-style="'color: #999999;'"
style="margin-bottom: 20rpx" style="margin-bottom: 20rpx"
:maxlength="4"
> >
<template slot="prefix"> <template slot="prefix">
<text class="input-label">验证码</text> <text class="input-label">验证码</text>

View File

@ -35,6 +35,7 @@
:auto-height="true" :auto-height="true"
:placeholder-style="'color: #999999;'" :placeholder-style="'color: #999999;'"
style="margin-bottom: 20rpx" style="margin-bottom: 20rpx"
:maxlength="4"
> >
<template slot="prefix"> <template slot="prefix">
<text class="input-label">验证码</text> <text class="input-label">验证码</text>

View File

@ -4,72 +4,68 @@
* scale 压缩质量 0-1 * scale 压缩质量 0-1
* type 文件类型 * type 文件类型
*/ */
export function compressImg (imgSrc, scale, type, callback) { export async function H5compressImg(imgSrc, scale) {
// uni.$u.toast('压缩中') //imgSrc:图片的路径
var img = new Image(); //scale:缩放比例 0-1之间
img.src = imgSrc; return new Promise((reslove, reject) => {
img.onload = function() { var img = new Image(); //创建Image对象生成一个<img>标签
var that = this; img.src = imgSrc; //将图片路径赋给<img>标签的src
var h = (img.height * scale).toFixed(0); // 默认按质量比例压缩 img.onload = () => {
var w = (img.width * scale).toFixed(0); //onload在图片加载成功后触发在onload中完成压缩功能
var canvas = document.createElement('canvas'); var h = img.height / 2; // 获取原本图片的宽高
var ctx = canvas.getContext('2d'); var w = img.width / 2; //默认按比例压缩,根据需求修改
var width = document.createAttribute("width"); var canvas = document.createElement("canvas"); //创建画布
width.nodeValue = w; var ctx = canvas.getContext("2d"); //设置为2d效果
var height = document.createAttribute("height"); var width = document.createAttribute("width"); //创建属性节点
height.nodeValue = h; width.nodeValue = w; //设置属性值
canvas.setAttributeNode(width); var height = document.createAttribute("height");
canvas.setAttributeNode(height); height.nodeValue = h;
ctx.drawImage(that, 0, 0, w, h); canvas.setAttributeNode(width); //设置画布宽高
var base64 = canvas.toDataURL('image/jpeg', scale); //压缩比例 canvas.setAttributeNode(height);
canvas = null; ctx.drawImage(img, 0, 0, w, h); //将图片贴到画布上
if (type == 'base64') { //img:图片 0,0:粘贴的位置 w,h:粘贴图片的大小
let data = { var base64 = canvas.toDataURL("image/png", scale);
size: getBase64Size(base64), //'image/png':压缩返回图片的类型 scale:图片质量
type: type, //如果要base64的流可以直接将结果返回了
source: base64 canvas = null; //清除画布
} // var blob = base64ToBlob(base64); //需要二进制流调用该方法拿到
callback(base64); // let blobUrl = window.URL.createObjectURL(blob); //blob地址
} else { reslove(base64);
let blob = base64ToBlob(base64); };
console.log('压缩后的大小', blob.size); });
const blobUrl = window.URL.createObjectURL(blob); //blob地址 }
blob.source = blobUrl
callback(blob);
}
}
};
/**base转Blob */ /**base转Blob */
export function base64ToBlob (base64) { export function base64ToBlob(base64) {
var arr = base64.split(','), var arr = base64.split(","),
mime = arr[0].match(/:(.*?);/)[1], mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]), bstr = atob(arr[1]),
n = bstr.length, n = bstr.length,
u8arr = new Uint8Array(n); u8arr = new Uint8Array(n);
while (n--) { while (n--) {
u8arr[n] = bstr.charCodeAt(n); u8arr[n] = bstr.charCodeAt(n);
} }
return new Blob([u8arr], { return new Blob([u8arr], {
type: mime type: mime,
}); });
}; }
/**获取base64的文件大小 */ /**获取base64的文件大小 */
export function getBase64Size () { export function getBase64Size(base64Str) {
let size = 0; let size = 0;
if (base64Str) { // 获取base64图片byte大小 if (base64Str) {
const equalIndex = base64Str.indexOf('='); // 获取=号下标 // 获取base64图片byte大小
if (equalIndex > 0) { const equalIndex = base64Str.indexOf("="); // 获取=号下标
const str = base64Str.substring(0, equalIndex); // 去除=号 if (equalIndex > 0) {
const strLength = str.length; const str = base64Str.substring(0, equalIndex); // 去除=号
const fileLength = strLength - (strLength / 8) * 2; // 真实的图片byte大小 const strLength = str.length;
size = Math.floor(fileLength); // 向下取整 const fileLength = strLength - (strLength / 8) * 2; // 真实的图片byte大小
} else { size = Math.floor(fileLength); // 向下取整
const strLength = base64Str.length; } else {
const fileLength = strLength - (strLength / 8) * 2; const strLength = base64Str.length;
size = Math.floor(fileLength); // 向下取整 const fileLength = strLength - (strLength / 8) * 2;
} size = Math.floor(fileLength); // 向下取整
} else { }
size = null; } else {
} size = null;
return size }
}; return size;
}