表单验证、项目信息显示bug

xiangpei

2025-02-25 1fd7679f4345963c41dea9ad1c4d4c3e572b6148

 src/views/projectEngineering/projectLibrary/component/BasicInfo.vue

@@ -48,7 +48,7 @@

          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="资金类型" label-width="100px"  style="width: 100%">
              <el-form-item label="资金类型" label-width="100px" prop="fundTypeList"  style="width: 100%">
                <el-select
                  v-model="projectForm.fundTypeList"
                  clearable
@@ -119,7 +119,7 @@
<!--            </el-col>-->

            <el-col :span="6">
              <el-form-item label="项目状态" label-width="100px" prop="projectstatus" style="width: 100%">
              <el-form-item label="项目状态" label-width="100px" prop="projectStatus" style="width: 100%">
                <el-select v-model="projectForm.projectStatus" clearable placeholder="请选择" @change="handleProjectStatusChange" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_project_status" :key="item.value" :label="item.label"
                             :value="item.value"/>
@@ -154,14 +154,13 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <!-- TODO：暂时不做 -->
              <el-form-item label="项目业主单位" label-width="100px" prop="engineering" style="width: 100%">
              <el-form-item label="项目业主单位" label-width="100px" prop="projectOwnerUnit" style="width: 100%">
                <!--            <el-input v-model.trim="getEngineeringName" class="item" clearable disabled maxlength="255" placeholder="请在工程中选择项目" />-->
<!--                <el-select v-model="projectForm.engineeringIdList" :multiple="true" collapse-tags placeholder="请选择"-->
<!--                           style="width: 100%">-->
<!--                <treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择上级部门" />-->

                <treeselect v-model="projectForm.projectOwnerUnit" :disabled="disabled" :options="selectOptions"  noChildrenText="无匹配数据" :normalizer="normalizer" placeholder="选择单位" />
                <treeselect v-model="projectForm.projectOwnerUnit" :disabled="disabled" :options="selectOptions" @input="getProjectOwnerUnit" noChildrenText="无匹配数据" :normalizer="normalizer" placeholder="选择单位" />
                  <!--              <RemoteSelect v-if="selectOptions.length" :hasMore="hasMore" :loading="loading" :page="page" @loadMore="handleLoadMore" />-->
<!--                </el-select>-->
              </el-form-item>
@@ -170,11 +169,11 @@
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="主管部门" label-width="100px" prop="competentDepartment" style="width: 100%">
                <treeselect v-model="projectForm.competentDepartment" :disabled="disabled" @input="getCompetentDepartmentInfo" noChildrenText="无匹配数据" :options="approvalList"  :normalizer="normalizer" placeholder="选择单位" />
                <treeselect v-model="competentDepartment" :disabled="disabled" @input="getCompetentDepartmentInfo" noChildrenText="无匹配数据" :options="approvalList"  :normalizer="normalizer" placeholder="选择单位" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="主管部门联系人" label-width="140px" style="width: 100%">
              <el-form-item label="主管部门联系人" prop="competentDepartmentPerson" label-width="140px" style="width: 100%">
                <el-select
                  v-model="projectForm.competentDepartmentPerson"
                  clearable
@@ -194,7 +193,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="主管部门联系方式" label-width="140px" style="width: 100%">
              <el-form-item label="主管部门联系方式" prop="competentDepartmentPhone" label-width="140px" style="width: 100%">
                <el-input
                  v-model="projectForm.competentDepartmentPhone"
                  clearable
@@ -218,7 +217,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="管理归口" label-width="100px" style="width: 100%">
              <el-form-item label="管理归口" prop="managementCentralizationList" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.managementCentralizationList"
                  clearable
@@ -234,7 +233,7 @@
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="项目审批类型" label-width="100px" style="width: 100%">
              <el-form-item label="项目审批类型" prop="projectApprovalType" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.projectApprovalType"
                  clearable
@@ -247,13 +246,13 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="投资类别" label-width="100px" style="width: 100%">
              <el-form-item label="投资类别" prop="largeCategory" label-width="100px" style="width: 100%">
                <el-input v-model="largeCategory" clearable disabled placeholder="请选择大类" style="width: 49%"/>
                <el-input v-model="subclass" clearable disabled placeholder="请选择小类" style="width: 49%;margin-left: 2%"/>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="重点分类" label-width="100px" style="width: 100%">
              <el-form-item label="重点分类" prop="importanceTypeList" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.importanceTypeList"
                  :multiple="true"
@@ -265,9 +264,6 @@
                </el-select>
              </el-form-item>
            </el-col>




          </el-row>
          <el-row :gutter="20">
@@ -281,7 +277,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="计划开工时间" label-width="100px" style="width: 100%">
              <el-form-item label="计划开工时间" prop="planStartTime" label-width="100px" style="width: 100%">
                <el-date-picker v-model="projectForm.planStartTime "
                                placeholder="选择时间"
                                style="width: 100%"
@@ -290,7 +286,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="计划竣工时间" label-width="100px" style="width: 100%">
              <el-form-item label="计划竣工时间" prop="planCompleteTime" label-width="100px" style="width: 100%">
                <el-date-picker v-model="projectForm.planCompleteTime "
                                placeholder="选择时间"
                                style="width: 100%"
@@ -302,11 +298,11 @@
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="行业主管部门" label-width="100px" prop="industryCompetentDepartment" style="width: 100%">
                <treeselect v-model="projectForm.industryCompetentDepartment" :disabled="disabled" noChildrenText="无匹配数据" @input="getIndustryCompetentDepartmentInfo" :options="approvalList"  :normalizer="normalizer" placeholder="选择单位" />
                <treeselect v-model="industryCompetentDepartment" :disabled="disabled" noChildrenText="无匹配数据" @input="getIndustryCompetentDepartmentInfo" :options="approvalList"  :normalizer="normalizer" placeholder="选择单位" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="行业主管部门联系人" label-width="160px" style="width: 100%">
              <el-form-item label="行业主管部门联系人" prop="industryCompetentDepartmentPerson" label-width="160px" style="width: 100%">
                <el-select
                  v-model="projectForm.industryCompetentDepartmentPerson"
                  clearable
@@ -326,7 +322,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="行业主管部门联系方式" label-width="160px" style="width: 100%">
              <el-form-item label="行业主管部门联系方式" prop="departmentPersonPhone" label-width="160px" style="width: 100%">
                <el-input
                  v-model="projectForm.departmentPersonPhone"
                  clearable
@@ -503,6 +499,8 @@
    return {
      tagList: [],
      projectSubTypeList: [], // 项目子类型
      competentDepartment: '',
      industryCompetentDepartment: '',
      projectForm: {
        id: '',
        projectName: '',
@@ -579,8 +577,32 @@
      mapCreateInfo: {},
      demoFormRef: null,
      rules: {
        projectName: [{required: true, message: '请输入项目名称', trigger: 'blur'}]
      }
        projectName: [{required: true, message: '请输入项目名称', trigger: 'blur'}],
        content: [{required: true, message: '请输入建设内容', trigger: 'blur'}],
        fundTypeList: [{required: true, message: '请选择资金类型', trigger: 'change'}],
        investType: [{required: true, message: '请选择项目投资类别', trigger: 'change'}],
        constructionNature: [{required: true, message: '请选择建设性质', trigger: 'change'}],
        attractInvestment: [{required: true, message: '请选择是否招商引资项目', trigger: 'change'}],
        projectType: [{required: true, message: '请选择项目推进类型', trigger: 'change'}],
        projectStatus: [{required: true, message: '请选择项目状态', trigger: 'change'}],
        projectPhase: [{required: true, message: '请选择项目阶段', trigger: 'change'}],
        projectContactPerson: [{required: true, message: '请输入项目联系人', trigger: 'blur'}],
        contact: [{required: true, message: '请输入项目联系方式', trigger: 'blur'}],
        projectOwnerUnit: [{required: true, message: '请选择项目业主单位', trigger: 'change'}],
        competentDepartment: [{required: true, message: '请选择主管部门', trigger: 'change'}],
        competentDepartmentPerson: [{required: true, message: '请选择主管部门联系人', trigger: 'change'}],
        competentDepartmentPhone: [{required: true, message: '请输入主管部门联系方式', trigger: 'blur'}],
        area: [{required: true, message: '请选择行政区划', trigger: 'change'}],
        managementCentralizationList: [{required: true, message: '请选择管理归口', trigger: 'change'}],
        projectApprovalType: [{required: true, message: '请选择项目审批类型', trigger: 'change'}],
        importanceTypeList: [{required: true, message: '请选择重点分类', trigger: 'change'}],
        planStartTime: [{required: true, message: '请选择计划开工时间', trigger: 'change'}],
        planCompleteTime: [{required: true, message: '请选择计划竣工时间', trigger: 'change'}],
        industryCompetentDepartment: [{required: true, message: '请选择行业主管部门', trigger: 'change'}],
        industryCompetentDepartmentPerson: [{required: true, message: '请输入行业主管部门联系人', trigger: 'blur'}],
        departmentPersonPhone: [{required: true, message: '请输入行业主管部门联系方式', trigger: 'blur'}],
      },
      needClearPeople: true
    };
  },
  computed: {
@@ -601,12 +623,6 @@

    if (projectForm) {
      this.projectForm = JSON.parse(projectForm);
      if (this.projectForm.industryCompetentDepartment) {
        // 根据选中的部门ID查询人员
        getByDept(this.projectForm.industryCompetentDepartment).then((res) => {
          this.personList = res.data;
        })
      }
      if (this.projectForm.projectType) {
        // 根据项目类型查子类型
        getDicts("sys_project_type").then(res => {
@@ -619,6 +635,8 @@
        })
      }
      this.$emit('updateIsShow', true);
      this.competentDepartment = this.projectForm.competentDepartment
      this.industryCompetentDepartment = this.projectForm.industryCompetentDepartment
    } else {
      this.projectForm.id = this.$route.query.projectId;
      // 在组件创建时获取项目信息，如果 projectId 存在
@@ -630,17 +648,29 @@
      }
      // this.handleLoadMore(1);
    }
    console.log(this.projectForm, "原始值")

    this.$nextTick(() => {
      console.log("设置了")
      this.tagList = this.projectForm.tag ? this.projectForm.tag.split(",") : []
      console.log(this.tagList)
    })
  },
  beforeDestroy() {
    localStorage.setItem("projectForm", JSON.stringify(this.projectForm));
  },
  methods: {
    getIndustryCompetentDepartmentPeople(deptId) {
      // 根据选中的部门ID查询人员
      getByDept(deptId).then((res) => {
        this.personList = res.data;
        this.personList.forEach(item => item.userId += '')
      })
    },
    getCompetentDepartmentPeople(deptId) {
      // 根据选中的部门ID查询人员
      getByDept(deptId).then((res) => {
        this.deptPersonList = res.data;
        this.deptPersonList.forEach(item => item.userId += '')
      })
    },
    getTagList(list) {
      console.log("拿到了")
      if (!list || list.length < 1) {
@@ -691,28 +721,41 @@
    },
    getIndustryCompetentDepartmentInfo(deptId) {
      if (deptId) {
        getByDept(deptId).then((res) => {
          this.personList = res.data;
        })
        if (this.projectForm.industryCompetentDepartment != deptId) {
          this.projectForm.industryCompetentDepartmentPerson = ""
          this.projectForm.departmentPersonPhone = ""
        }
        this.projectForm.industryCompetentDepartment = deptId
        this.getIndustryCompetentDepartmentPeople(deptId)
      } else {
        this.projectForm.industryCompetentDepartment = ''
        this.personList = [];
      }
    },
    getProjectOwnerUnit(deptId) {
      if (deptId) {
        this.projectForm.projectOwnerUnit = deptId
      } else {
        this.projectForm.projectOwnerUnit = ''
      }
    },
    getCompetentDepartmentInfo(deptId) {
      if (deptId) {
        getByDept(deptId).then((res) => {
          this.deptPersonList = res.data;
        })
        if (this.projectForm.competentDepartment != deptId) {
          this.projectForm.competentDepartmentPerson = ""
          this.projectForm.competentDepartmentPhone = ""
        }
        this.projectForm.competentDepartment = deptId
        this.getCompetentDepartmentPeople(deptId)
      } else {
        this.projectForm.competentDepartment = ''
        this.deptPersonList = [];
      }
    },
    handleDepartmentChange(departmentId) {
      if (departmentId) {
        // 根据选中的部门ID查询人员
        getByDept(departmentId).then((res) => {
          this.personList = res.data;
        })
        this.getIndustryCompetentDepartmentPeople(departmentId)
      } else {
        // 如果未选择部门，清空人员列表
        this.personList = [];
@@ -779,18 +822,21 @@
          this.tagList = this.projectForm.tag ? this.projectForm.tag.split(",") : []
          console.log(this.tagList)
        })
        this.competentDepartment = this.projectForm.competentDepartment
        this.industryCompetentDepartment = this.projectForm.industryCompetentDepartment
      });
    },
    getApprovalList() {
      approvalList().then(res => {
        this.approvalList = this.handleTree(res.data, "deptId");;
        this.approvalList = this.handleTree(res.data, "deptId");
        this.approvalList.push({deptId: '', deptName: '无', children: []})
      });
    },
    getDeptList(){
      listDept().then(response => {
        console.log(response.data)

        this.selectOptions = this.handleTree(response.data, "deptId");
        this.selectOptions.push({deptId: '', deptName: '无', children: []})
      });
    },