文件上传
This commit is contained in:
parent
65c8e59812
commit
714d0dd534
|
|
@ -0,0 +1,13 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 上传小文件---5M以内,使用OCR识别
|
||||
export function uploadSmallFileByOcr(data) {
|
||||
return request({
|
||||
url: '/smartBid/commonUpload/uploadSmallFileByOcr',
|
||||
method: 'post',
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
},
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="upload-container">
|
||||
<el-upload class="upload-demo" drag action="#" multiple :show-file-list="true" :before-upload="beforeUpload"
|
||||
:on-change="handleFileChange" :on-remove="handleRemove" :on-exceed="handleExceed" :file-list="files"
|
||||
:accept="accept" :limit="limitUploadNum" :auto-upload="false">
|
||||
:accept="accept" :limit="limitUploadNum" :auto-upload="autoUpload">
|
||||
<div class="upload-content">
|
||||
<!-- 当只有一张图片时显示缩略图 -->
|
||||
<div v-if="showImagePreview" class="image-preview">
|
||||
|
|
@ -43,6 +43,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import {uploadSmallFileByOcr} from '@/api/common/uploadFile.js'
|
||||
export default {
|
||||
name: 'UploadFile',
|
||||
props: {
|
||||
|
|
@ -62,6 +63,14 @@ export default {
|
|||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
fileUploadRule: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
autoUpload: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -98,7 +107,6 @@ export default {
|
|||
},
|
||||
// 文件状态改变
|
||||
handleFileChange(file, fileList) {
|
||||
|
||||
this.files = fileList;
|
||||
|
||||
// 生成预览
|
||||
|
|
@ -115,7 +123,34 @@ export default {
|
|||
this.clearPreview();
|
||||
}
|
||||
console.log('文件列表更新:', this.files.length, '个文件');
|
||||
this.$emit('file-change', this.files);
|
||||
// this.$emit('file-change', this.files);
|
||||
|
||||
// 如果启用自动上传且文件验证通过,触发上传
|
||||
if (this.autoUpload && file.status === 'ready') {
|
||||
|
||||
if(Object.keys(this.fileUploadRule).length !== 0){
|
||||
// 文件需要ocr识别
|
||||
this.uploadFile(file);
|
||||
}else{
|
||||
// 文件不需要ocr识别
|
||||
this.uploadFile(file);
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// 上传文件
|
||||
uploadFile(file){
|
||||
console.log(file);
|
||||
const formData = new FormData();
|
||||
formData.append('file', file.raw);
|
||||
formData.append('params', JSON.stringify(this.fileUploadRule));
|
||||
uploadSmallFileByOcr(formData).then(res => {
|
||||
console.log(res);
|
||||
this.$message.success(res.msg);
|
||||
}).catch(err => {
|
||||
this.$message.error(err.msg);
|
||||
})
|
||||
},
|
||||
// 处理文件超出限制
|
||||
handleExceed(files, fileList) {
|
||||
|
|
@ -298,8 +333,8 @@ export default {
|
|||
}
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<el-form :model="form" :rules="rules" ref="basicInfoForm" label-width="110px" label-position="top">
|
||||
<!-- 营业执照 -->
|
||||
<el-form-item label="营业执照" prop="fileList">
|
||||
<UploadFile :fileList="form.fileList" />
|
||||
<UploadFile :fileList="form.fileList" :fileUploadRule="fileUploadRule" />
|
||||
</el-form-item>
|
||||
<el-form-item label="企业名称" prop="enterpriseName">
|
||||
<el-input v-model="form.enterpriseName" placeholder="自动提取"></el-input>
|
||||
|
|
@ -38,6 +38,7 @@ export default {
|
|||
components: {
|
||||
UploadFile
|
||||
},
|
||||
dicts: ['identification_tag'],
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
|
|
@ -50,6 +51,10 @@ export default {
|
|||
businessScope: '',
|
||||
fileList: []
|
||||
},
|
||||
// OCR 识别规则
|
||||
// ocrRuleList: ['business_license', 'face_id_card_portrait', 'national_emblem_id_card', 'account_opening_license'],
|
||||
ocrRuleList: ['business_license'],
|
||||
fileUploadList: [],
|
||||
rules: {
|
||||
fileList: [
|
||||
{ required: true, message: '请上传营业执照', trigger: 'blur' }
|
||||
|
|
@ -75,6 +80,9 @@ export default {
|
|||
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 校验规则
|
||||
|
|
@ -89,6 +97,41 @@ export default {
|
|||
})
|
||||
})
|
||||
},
|
||||
// ocr文件识别规则
|
||||
ocrRule(type) {
|
||||
const foundItem = this.dict.type.identification_tag.find(item => item.value === type);
|
||||
const item = foundItem ? {
|
||||
fileUploadType: foundItem.value,
|
||||
fields_json: foundItem.raw.remark,
|
||||
suffix: 'mainDatabase'
|
||||
} : null;
|
||||
console.log(item);
|
||||
|
||||
this.fileUploadList.push(item)
|
||||
},
|
||||
// 添加ocr文件识别规则
|
||||
addOcrRule() {
|
||||
this.ocrRuleList.forEach(item => {
|
||||
this.ocrRule(item)
|
||||
})
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
fileUploadRule() {
|
||||
return this.fileUploadList[0] || {};
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 监听字典数据加载完成
|
||||
'dict.type.identification_tag': {
|
||||
handler(newVal) {
|
||||
if (newVal && newVal.length > 0) {
|
||||
console.log('字典数据加载完成:', newVal);
|
||||
this.addOcrRule();
|
||||
}
|
||||
},
|
||||
immediate: true // 立即执行一次
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue