文件上传

This commit is contained in:
cwchen 2025-10-21 17:46:04 +08:00
parent 65c8e59812
commit 714d0dd534
3 changed files with 97 additions and 6 deletions

View File

@ -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
})
}

View File

@ -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>

View File

@ -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>