113 lines
3.0 KiB
Vue
113 lines
3.0 KiB
Vue
<template>
|
|
<div>
|
|
<div class="basic-info-title">
|
|
<img src="@/assets/enterpriseLibrary/basic-info.png" alt="文件上传">
|
|
<span>文件上传</span>
|
|
</div>
|
|
<el-form :model="form" :rules="rules" ref="basicInfoForm" label-width="110px" label-position="top">
|
|
<!-- 文件上传 -->
|
|
<el-form-item label="文件上传" prop="fileList">
|
|
<UploadMoreFile :fileList="form.fileList" @file-change="handleFileChange" @del-file="handleDelFile"
|
|
type="business_license" :uploadType="uploadType" :maxFileTips="maxFileTips"
|
|
:fileUploadRule="fileUploadRule" :limitUploadNum="limitUploadNum" />
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
// 默认参数
|
|
const defaultParams = {
|
|
fileType: 'technical_solution',
|
|
uploadType: 'pdf、doc、docx',
|
|
maxFileTips: '500MB',
|
|
fileUploadRule: {
|
|
fileUploadType: 'technical_solution',
|
|
fields_json: '',
|
|
suffix: 'technical_solution_database'
|
|
},
|
|
limitUploadNum: 5
|
|
};
|
|
import UploadMoreFile from '@/views/common/UploadMoreFile.vue'
|
|
export default {
|
|
name: 'FileInfoTechnical',
|
|
components: {
|
|
UploadMoreFile
|
|
},
|
|
props: {
|
|
detailData: {
|
|
type: Object,
|
|
default: () => { }
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
fileType: defaultParams.fileType,
|
|
uploadType: defaultParams.uploadType,
|
|
maxFileTips: defaultParams.maxFileTips,
|
|
fileUploadRule: defaultParams.fileUploadRule,
|
|
limitUploadNum: defaultParams.limitUploadNum,
|
|
form: {
|
|
fileList: [],
|
|
delFileList: []
|
|
},
|
|
rules: {
|
|
fileList: [
|
|
{ required: true, message: '请上传文件', trigger: 'change' }
|
|
],
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
},
|
|
methods: {
|
|
// 校验规则
|
|
validate() {
|
|
return new Promise((resolve, reject) => {
|
|
this.$refs.basicInfoForm.validate((valid) => {
|
|
if (valid) {
|
|
resolve(this.form) // 校验成功返回表单数据
|
|
} else {
|
|
reject(new Error('文件上传未完成'))
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
// 文件变化
|
|
handleFileChange(file) {
|
|
console.log(file);
|
|
|
|
this.form.fileList = file;
|
|
|
|
},
|
|
// 文件删除时触发
|
|
handleDelFile(file) {
|
|
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
|
|
if(delPath){
|
|
this.form.delFileList.push(delPath);
|
|
}
|
|
},
|
|
setFormData() {
|
|
},
|
|
},
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.basic-info-title {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 10px 0;
|
|
|
|
span {
|
|
margin: 0 5px;
|
|
font-size: 20px;
|
|
}
|
|
}
|
|
|
|
.form-item {
|
|
width: 100%;
|
|
}
|
|
</style> |