treeselect禁用设置

xiangpei

2025-02-25 c17dba9251df86e0fe23afe87ef540c493fae219

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

@@ -5,7 +5,7 @@
        <div style="font-size: small;margin-bottom: 10px">基础信息：</div>
        <div>
          <el-row :gutter="20">
            <el-col :span="6">
            <el-col :span="10">
              <el-form-item class="item" label="项目名称" label-width="100px" prop="projectName">
                <el-input v-model.trim="projectForm.projectName" class="item" clearable maxlength="255" placeholder="请输入"/>
              </el-form-item>
@@ -16,33 +16,46 @@
                          placeholder="请输入"/>
              </el-form-item>
            </el-col>
            <el-col :span="12" style="position: relative">
              <div style="width: 100%; height: 100%; position: absolute;">
            <el-col :span="3">
                <el-form-item class="item" label="赋码" label-width="50px" prop="coding">
                  <template slot-scope="scope">
                    <!--                <div class="yellow-dot" v-if="scope.row.coding === 'yellow'"></div>-->
                    <!--                <div class="green-dot" v-if="scope.row.coding === 'green'"></div>-->
                    <!--                <div class="red-dot" v-if="scope.row.coding === 'red'"></div>-->
                    <div class="red-dot"></div>
                    <tag-list></tag-list>
                  </template>
                </el-form-item>
                <!--            <img alt="" src="../../../../assets/images/s.png"/>-->
              </div>
                    <template slot-scope="scope">
                      <!--                <div class="yellow-dot" v-if="scope.row.coding === 'yellow'"></div>-->
                      <!--                <div class="green-dot" v-if="scope.row.coding === 'green'"></div>-->
                      <!--                <div class="red-dot" v-if="scope.row.coding === 'red'"></div>-->
                      <div class="red-dot"></div>
                    </template>

                  </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item class="item" label="建设内容" label-width="100px" prop="content">
                <el-input v-model.trim="projectForm.content" style="width: 100%;" clearable maxlength="255"
                          placeholder="请输入" type="textarea"/>
            <el-col :span="5">
              <el-form-item label="标签" label-width="50px" prop="tag">
                <template slot-scope="scope">
                  <tag-list :tag-list="tagList" ref="tagList" @getTags="getTagList"></tag-list>
                </template>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="24">
              <el-form-item class="item" label="建设内容" label-width="100px" prop="content">
                <el-input v-model.trim="projectForm.content" style="width: 100%;" :rows="4" maxlength="1000"
                          placeholder="请输入" type="textarea"/>
              </el-form-item>
            </el-col>
          </el-row>



          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="资金类型" label-width="100px" prop="fundType" style="width: 100%">
                <el-select v-model="projectForm.fundType" clearable placeholder="请选择" style="width: 100%">
              <el-form-item label="资金类型" label-width="100px"  style="width: 100%">
                <el-select
                  v-model="projectForm.fundTypeList"
                  clearable
                  :multiple="true"
                  placeholder="请选择"
                  style="width: 100%"
                  >
                  <el-option v-for="item in dict.type.sys_funding_type" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
@@ -89,21 +102,21 @@
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="项目类型" label-width="100px" prop="projectType" style="width: 100%">
              <el-form-item label="项目推进类型" label-width="100px" prop="projectType" style="width: 100%">
                <el-select v-model="projectForm.projectType" @change="getChildSelect" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_project_type" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="项目子类型" label-width="100px" prop="projectSubType" style="width: 100%">
                <el-select v-model="projectForm.projectSubType" :disabled="projectForm.projectType === ''" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in projectSubTypeList" :key="item.dictCode + 'zd'" :label="item.dictLabel"
                             :value="item.dictValue"/>
                </el-select>
              </el-form-item>
            </el-col>
<!--            <el-col :span="6">-->
<!--              <el-form-item label="项目子类型" label-width="100px" prop="projectSubType" style="width: 100%">-->
<!--                <el-select v-model="projectForm.projectSubType" :disabled="projectForm.projectType === ''" clearable placeholder="请选择" style="width: 100%">-->
<!--                  <el-option v-for="item in projectSubTypeList" :key="item.dictCode + 'zd'" :label="item.dictLabel"-->
<!--                             :value="item.dictValue"/>-->
<!--                </el-select>-->
<!--              </el-form-item>-->
<!--            </el-col>-->

            <el-col :span="6">
              <el-form-item label="项目状态" label-width="100px" prop="projectstatus" style="width: 100%">
@@ -114,9 +127,11 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="项目阶段" label-width="100px" prop="fundsType" style="width: 100%">
                <el-input v-model.trim="projectForm.projectPhase" class="item" clearable disabled maxlength="255"
                          placeholder="请输入"/>
              <el-form-item label="项目阶段" label-width="100px" prop="projectPhase" style="width: 100%">
                <el-select v-model="projectForm.projectPhase" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in dict.type.sys_project_phases" :key="item.value" :label="item.label"
                             :value="item.value"/>
                </el-select>
              </el-form-item>
            </el-col>
<!--                    <el-col :span="6">-->
@@ -134,7 +149,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="联系方式" label-width="100px" prop="contact" style="width: 100%">
              <el-form-item label="项目联系方式" label-width="100px" prop="contact" style="width: 100%">
                <el-input v-model.trim="projectForm.contact" class="item" clearable maxlength="255" placeholder="请输入"/>
              </el-form-item>
            </el-col>
@@ -146,7 +161,7 @@
<!--                           style="width: 100%">-->
<!--                <treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择上级部门" />-->

                <treeselect v-model="projectForm.projectOwnerUnit"  :options="selectOptions"  :normalizer="normalizer" placeholder="选择单位" />
                <treeselect v-model="projectForm.projectOwnerUnit" :disabled="disabled" :options="selectOptions"  noChildrenText="无匹配数据" :normalizer="normalizer" placeholder="选择单位" />
                  <!--              <RemoteSelect v-if="selectOptions.length" :hasMore="hasMore" :loading="loading" :page="page" @loadMore="handleLoadMore" />-->
<!--                </el-select>-->
              </el-form-item>
@@ -154,24 +169,41 @@
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="主管部门" label-width="100px" prop="competentDepartmentList" style="width: 100%">
              <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="选择单位" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="主管部门联系人" label-width="140px" style="width: 100%">
                <el-select
                  v-model="projectForm.competentDepartmentList"
                  v-model="projectForm.competentDepartmentPerson"
                  clearable
                  :multiple="true"
                  filterable
                  allow-create
                  placeholder="请选择"
                  style="width: 100%"
                  collapse-tags
                  @change="handleDeptContactChange"
                  style="width: 100%;"
                >
                  <el-option
                    v-for="item in approvalList"
                    :key="item.id"
                    :value="item.id"
                    :label="item.value"
                    v-for="person in deptPersonList"
                    :key="person.userId"
                    :value="person.userId"
                    :label="person.nickName"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="主管部门联系方式" label-width="140px" style="width: 100%">
                <el-input
                  v-model="projectForm.competentDepartmentPhone"
                  clearable
                  placeholder="请输入联系方式"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="行政区划" label-width="100px" prop="area" style="width: 100%">
                <el-select
@@ -193,7 +225,6 @@
                  :multiple="true"
                  placeholder="请选择"
                  style="width: 100%"
                  collapse-tags
                >
                  <el-option v-for="item in dict.type.sys_centralized_management" :key="item.value" :label="item.label"
                             :value="item.value"/>
@@ -224,8 +255,8 @@
            <el-col :span="6">
              <el-form-item label="重点分类" label-width="100px" style="width: 100%">
                <el-select
                  v-model="projectForm.importanceType"
                  clearable
                  v-model="projectForm.importanceTypeList"
                  :multiple="true"
                  placeholder="请选择"
                  style="width: 100%"
                >
@@ -234,6 +265,10 @@
                </el-select>
              </el-form-item>
            </el-col>




          </el-row>
          <el-row :gutter="20">
            <el-col :span="6">
@@ -267,27 +302,16 @@
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="行业主管部门" label-width="100px" prop="industryCompetentDepartment" style="width: 100%">
                  <el-select
                    v-model="projectForm.industryCompetentDepartment"
                    clearable
                    @change="handleDepartmentChange"
                    placeholder="请选择"
                    style="width: 100%;"
                  >
                    <el-option
                      v-for="item in approvalList"
                      :key="item.id"
                      :value="item.id"
                      :label="item.value"
                    />
                  </el-select>
                <treeselect v-model="projectForm.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="100px" style="width: 100%">
              <el-form-item label="行业主管部门联系人" label-width="160px" style="width: 100%">
                <el-select
                  v-model="projectForm.industryCompetentDepartmentPerson"
                  clearable
                  filterable
                  allow-create
                  placeholder="请选择"
                  @change="handleContactChange"
                  style="width: 100%;"
@@ -302,7 +326,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="联系人联系方式" label-width="100px" style="width: 100%">
              <el-form-item label="行业主管部门联系方式" label-width="160px" style="width: 100%">
                <el-input
                  v-model="projectForm.departmentPersonPhone"
                  clearable
@@ -317,7 +341,7 @@
        <div style="font-size: small;margin-bottom: 10px">中标单位：</div>
        <div>
          <el-row :gutter="20" v-for="(winUnit,index) in projectForm.winUnitList" :key="'zb' + index">
            <el-col :span="4">
            <el-col :span="5">
              <el-form-item label="单位名称" label-width="100px" prop="setTime" style="width: 100%">
                <el-input v-model.trim="winUnit.winUnit" class="item" clearable maxlength="255" placeholder="请输入"/>
              </el-form-item>
@@ -328,7 +352,7 @@
                          type="number"/>
              </el-form-item>
            </el-col>
            <el-col :span="4">
            <el-col :span="5">
              <el-form-item label="中标时间" label-width="100px" style="width: 100%">
                <el-date-picker v-model="winUnit.winTime"
                                placeholder="选择时间"
@@ -337,7 +361,7 @@
                                value-format="yyyy-MM-dd HH:mm:ss"/>
              </el-form-item>
            </el-col>
            <el-col :span="4">
            <el-col :span="3">
              <el-form-item label="单位联系人" label-width="100px" style="width: 100%">
                <el-input v-model.trim="winUnit.contacts" class="item" clearable maxlength="20" placeholder="请输入"/>
              </el-form-item>
@@ -348,7 +372,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="1">
              <el-button type="danger" icon="el-icon-delete" v-show="projectForm.winUnitList.length > 1" @click="removeWinUnit(index)" circle></el-button>
              <el-button type="danger" icon="el-icon-delete" @click="removeWinUnit(index)" circle></el-button>
            </el-col>
          </el-row>
        </div>
@@ -374,7 +398,7 @@
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
            <el-col :span="7">
              <el-form-item label="年度投资金额" label-width="100px" prop="company" style="width: 100%; min-width: 260px">
                <el-input v-model.trim="yearPlan.yearTotalMoney" clearable maxlength="255" placeholder="请输入"
                          style="width: 90%" type="number"/>
@@ -387,7 +411,7 @@
              </el-form-item>
            </el-col>
            <el-col :span="1">
              <el-button type="danger" icon="el-icon-delete" v-show="projectForm.yearPlanList.length > 1" @click="removeYearPlan(index)" circle></el-button>
              <el-button type="danger" icon="el-icon-delete" @click="removeYearPlan(index)" circle></el-button>
            </el-col>
          </el-row>
        </div>
@@ -409,15 +433,15 @@
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="0">
        <el-col :span="18">
          <el-form-item label="审批计划书:" label-width="100px" prop="medicalAddr" style="width: 100%">
            <file-upload v-model="projectForm.fileList"
                         :fileType="accept"
                         :isShowTip="false"/>
          </el-form-item>
        </el-col>
      </el-row>
<!--      <el-row :gutter="0">-->
<!--        <el-col :span="18">-->
<!--          <el-form-item label="审批计划书:" label-width="100px" prop="medicalAddr" style="width: 100%">-->
<!--            <file-upload v-model="projectForm.fileList"-->
<!--                         :fileType="accept"-->
<!--                         :isShowTip="false"/>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->
    </el-form>

    <el-dialog :visible.sync="dialogMap" width="900px">
@@ -457,7 +481,7 @@
  name: 'BasicInfo',
  dicts: ['sys_funding_type', 'sys_investment_type', 'sys_project_type', 'sys_project_status', 'sys_competent_department'
    , 'sys_administrative_divisions', 'sys_centralized_management', 'sys_approval_type', 'sys_key_categories', 'sys_annual_plan'
    , 'construction_nature', 'attract_investment'],
    , 'construction_nature', 'attract_investment', 'sys_project_phases'],
  components: {
    Treeselect,
    Map,
@@ -477,6 +501,7 @@
  },
  data() {
    return {
      tagList: [],
      projectSubTypeList: [], // 项目子类型
      projectForm: {
        id: '',
@@ -486,12 +511,14 @@
        projectType: '',
        projectSubType: '',
        projectStatus: 'pendding',
        fundType: '',
        fundTypeList: [], //资金类型
        investType: '',
        importanceType: '',
        importanceTypeList: [], //重点分类
        projectPhase: '储备规划阶段',
        tag: '',
        competentDepartment: '',
        competentDepartmentPerson: '',
        competentDepartmentPhone: '',
        projectLocation: '',
        longitude: '',
        latitude: '',
@@ -527,7 +554,6 @@
        projectContactPerson: '',
        fileList: [],
        engineeringInfos: [],
        competentDepartmentList: [],
        managementCentralizationList: [],
        remark: '',
        industryCompetentDepartment: null,
@@ -535,6 +561,7 @@
        departmentPersonPhone: null,
      },
      personList: [],
      deptPersonList: [],
      subclass: '',
      largeCategory: '',
      approvalList: [],
@@ -603,11 +630,25 @@
      }
      // 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: {
    getTagList(list) {
      console.log("拿到了")
      if (!list || list.length < 1) {
        this.projectForm.tag = ''
      } else {
        this.projectForm.tag = list.join(",");
      }
    },
    getChildSelect(select) {
      this.projectForm.projectSubType = ''
      if (select) {
@@ -632,16 +673,38 @@
      if (userId) {
        // 根据选中的userId查找对应的联系人
        const selectedPerson = this.personList.find(person => person.userId === userId);
        if (selectedPerson) {
        if (selectedPerson && selectedPerson.phonenumber) {
          // 将联系人的phone字段回填到联系电话输入框
          this.projectForm.departmentPersonPhone = selectedPerson.phonenumber;
        } else {
          // 如果未找到联系人，清空联系电话
          this.projectForm.departmentPersonPhone = '';
        }
      }
    },
    handleDeptContactChange(userId) {
      if (userId) {
        // 根据选中的userId查找对应的联系人
        const selectedPerson = this.deptPersonList.find(person => person.userId === userId);
        if (selectedPerson && selectedPerson.phonenumber) {
          // 将联系人的phone字段回填到联系电话输入框
          this.projectForm.competentDepartmentPhone = selectedPerson.phonenumber;
        }
      }
    },
    getIndustryCompetentDepartmentInfo(deptId) {
      if (deptId) {
        getByDept(deptId).then((res) => {
          this.personList = res.data;
        })
      } else {
        // 如果userId为空，清空联系电话
        this.projectForm.departmentPersonPhone = '';
        this.personList = [];
      }
    },
    getCompetentDepartmentInfo(deptId) {
      if (deptId) {
        getByDept(deptId).then((res) => {
          this.deptPersonList = res.data;
        })
      } else {
        this.deptPersonList = [];
      }
    },
    handleDepartmentChange(departmentId) {
@@ -710,11 +773,17 @@
          })
        }
        this.$emit('updateIsShow', true);
        console.log(this.projectForm, "原始值")
        this.$nextTick(() => {
          console.log("设置了")
          this.tagList = this.projectForm.tag ? this.projectForm.tag.split(",") : []
          console.log(this.tagList)
        })
      });
    },
    getApprovalList() {
      approvalList().then(res => {
        this.approvalList = res.data;
        this.approvalList = this.handleTree(res.data, "deptId");;
      });
    },
    getDeptList(){
@@ -726,6 +795,7 @@
    },

    submit(usedStatus) {
      console.log((this.projectForm));
      this.$refs["projectForm"].validate(valid => {
        if (valid) {
          this.projectForm.usedStatus = usedStatus;
@@ -821,12 +891,6 @@
              .filter(item => newVal.managementCentralizationList.includes(item.value))
              .map(item => item.label);
            this.subclass = labels.join(',');
          }
          if (newVal.competentDepartmentList) {
            const labels = this.approvalList
              .filter(item => newVal.competentDepartmentList.includes(item.id))
              .map(item => item.value);
            this.largeCategory = labels.join(',');
          }
        }, 1000);
        this.$emit('basicInfoForm', newVal)