| | |
| | | <template> |
| | | <div class="policy-info"> |
| | | <el-form ref="demoFormRef" :disabled="disabled" :model="fileIdList" class="dialog_form"> |
| | | <el-form ref="demoFormRef" :disabled="disabled" :model="documentsInfoForm" class="dialog_form"> |
| | | <el-row :gutter="0"> |
| | | <el-col :span="20"> |
| | | <el-form-item label="附件:" label-width="100px" prop="appendix" style="width: 100%"> |
| | | <div style="display: flex;gap: 10px"> |
| | | <file-upload v-model="documentsInfoList" |
| | | <file-upload v-model="fileList" |
| | | :fileType="accept" |
| | | :isShowTip="false"/> |
| | | <div v-if="documentsInfoList.length === 0" style="color: #a9afbc">支持上传PDF格式文件</div> |
| | | <div v-if="fileList.length === 0" style="color: #a9afbc">支持上传PDF格式文件</div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | import {addDocumentInfo, getDocumentInfoById} from "@/api/projectEngineering/projectInfo"; |
| | | |
| | | export default { |
| | | props: { |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | fileIdList: [], |
| | | documentsInfoList: [], |
| | | accept: ['pdf', 'docx', 'xlsx', 'jpg','jpeg'], |
| | | documentsInfoForm: { |
| | | // fileList: [], |
| | | // projectId: '' |
| | | }, |
| | | fileList: [], |
| | | projectForm: {}, |
| | | accept: ['pdf'], |
| | | }; |
| | | }, |
| | | watch: { |
| | | // 监听 documentsInfoList 的变化,并更新 fileIdList |
| | | documentsInfoList(newVal) { |
| | | this.fileIdList = newVal.map(item => item.fileId); |
| | | } |
| | | }, |
| | | methods: { |
| | | submit() { |
| | | console.log("文件submit") |
| | | getDocumentsInfo() { |
| | | getDocumentInfoById(this.$route.query.projectId).then(res => { |
| | | this.documentsInfoForm = res.data; |
| | | this.fileList = this.documentsInfoForm.fileList |
| | | }); |
| | | }, |
| | | handleRemove(file) { |
| | | if (file) { |
| | | this.fileIdList = this.documentsInfoList.map(item => item.fileId); |
| | | localStorage.setItem('fileIdList', JSON.stringify(file)); |
| | | submit() { |
| | | if (!this.projectForm.id) { |
| | | this.$message.error("请先保存投资管理基本信息") |
| | | } else { |
| | | this.documentsInfoForm.projectId = this.projectForm.id; |
| | | this.documentsInfoForm.fileList = this.fileList |
| | | addDocumentInfo(this.documentsInfoForm).then(response => { |
| | | this.$modal.msgSuccess("提交成功"); |
| | | }); |
| | | } |
| | | }, |
| | | handleAdd(file) { |
| | | if (file && file.length > 0) { |
| | | localStorage.setItem('fileIdList', JSON.stringify(file)); |
| | | }, |
| | | mounted() { |
| | | const documentsInfoForm = localStorage.getItem("documentsInfoForm"); |
| | | const projectForm = localStorage.getItem("projectForm"); |
| | | |
| | | const parsedDocumentsInfoForm = documentsInfoForm ? JSON.parse(documentsInfoForm) : null; |
| | | const parsedProjectForm = projectForm ? JSON.parse(projectForm) : null; |
| | | if (parsedDocumentsInfoForm) { |
| | | this.documentsInfoForm = parsedDocumentsInfoForm |
| | | if(this.documentsInfoForm.fileList) this.fileList = this.documentsInfoForm.fileList |
| | | } |
| | | if (parsedProjectForm) { |
| | | this.projectForm = parsedProjectForm |
| | | } |
| | | // 如果路由存在id且没有缓存,视为编辑或查看,调用api |
| | | if (this.$route.query.projectId && !parsedDocumentsInfoForm) { |
| | | this.getDocumentsInfo(); |
| | | } |
| | | |
| | | this.documentsInfoForm.projectId = this.projectForm.id; |
| | | }, |
| | | beforeDestroy() { |
| | | if(Object.keys(this.documentsInfoForm).length !==0) localStorage.setItem("documentsInfoForm", JSON.stringify(this.documentsInfoForm)); |
| | | }, |
| | | watch: { |
| | | documentsInfoForm:{ |
| | | deep: true, |
| | | handler(newVal) { |
| | | this.$emit('documentsInfoForm', newVal) |
| | | } |
| | | }, |
| | | fileList: { |
| | | deep: true, |
| | | handler(newVal) { |
| | | this.documentsInfoForm.fileList = newVal |
| | | } |
| | | } |
| | | }, |
| | | |
| | | mounted() { |
| | | } |
| | | |
| | | }; |
| | | </script> |
| | | |