xiangpei
2025-03-11 84a14c24edf92f7072e50b51ee37143d658ecfd4
src/views/projectEngineering/projectLibrary/component/DocumentsInfo.vue
@@ -1,14 +1,14 @@
<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>
@@ -18,6 +18,8 @@
</template>
<script>
import {addDocumentInfo, getDocumentInfoById} from "@/api/projectEngineering/projectInfo";
export default {
  props: {
@@ -29,36 +31,72 @@
  },
  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>