专家人才库修改,项目信息管理编辑-附件回显问题修复

史敦盼
Commit 81bd12ad authored Apr 02, 2024 by 史敦盼
Showing with 143 additions and 27 deletions
src/components/Form.vue
src/components/SearchForm.vue
src/components/SearchFormItem.vue
src/views/Main/index.vue
src/views/etpManage/AddExpert.vue
src/views/etpManage/AddTalent.vue
src/views/etpManage/index.vue
src/views/projectInfoManage/index.vue
--- a/src/components/Form.vue
+++ b/src/components/Form.vue
@@ -4,7 +4,7 @@
 * @Autor: pan
 * @Date: 2024-03-12 14:55:59
 * @LastEditors: pan
- * @LastEditTime: 2024-04-01 15:56:14
+ * @LastEditTime: 2024-04-02 09:56:29
 -->
 <template>
  <div class="form-box">
@@ -22,7 +22,11 @@
        <el-form-item :prop="item.prop" :label="item.label" :rules="item.rules">
          <!-- 自定义插槽，可用于特殊表单块 -->
          <template v-if="item.__slotName">
-            <slot :name="item.__slotName" :data="item"></slot>
+            <slot
+              :name="item.__slotName"
+              :form-data="formData"
+              :data="item"
+            ></slot>
          </template>
          <SearchFormItem

--- a/src/components/SearchForm.vue
+++ b/src/components/SearchForm.vue
@@ -4,7 +4,7 @@
 * @Autor: pan
 * @Date: 2024-03-12 14:55:59
 * @LastEditors: pan
- * @LastEditTime: 2024-04-01 11:54:48
+ * @LastEditTime: 2024-04-02 10:49:45
 -->
 <!-- /**
 * 搜索栏公共组件
@@ -134,7 +134,7 @@ export default {
      this.$refs.formRef.validate((valid) => {
        if (valid) {
          // console.log('提交成功')
-          console.log(this.formData)
+          // console.log(this.formData)
          callback()
        }
      })

--- a/src/components/SearchFormItem.vue
+++ b/src/components/SearchFormItem.vue
@@ -4,7 +4,7 @@
 * @Autor: pan
 * @Date: 2024-03-12 15:11:47
 * @LastEditors: pan
- * @LastEditTime: 2024-04-02 09:29:25
+ * @LastEditTime: 2024-04-02 10:13:55
 -->
 <template>
  <div class="form-item">
@@ -149,7 +149,11 @@ export default {
    currentVal: {
      get() {
        if (this.isSelect) {
-          return this.value && this.value + ''
+          if (Array.isArray(this.value)) {
+            return this.value
+          } else {
+            return this.value && this.value + ''
+          }
        } else {
          return this.value
        }

--- a/src/views/Main/index.vue
+++ b/src/views/Main/index.vue
@@ -496,3 +496,9 @@ export default {
 @import '@/styles/elementui.scss';
 @import './index.scss';
 </style>
+<style>
+.el-tooltip__popper {
+  max-width: 50%;
+}
+</style>
+>
--- a/src/views/etpManage/AddExpert.vue
+++ b/src/views/etpManage/AddExpert.vue
@@ -4,7 +4,7 @@
 * @Autor: pan
 * @Date: 2024-04-01 14:39:48
 * @LastEditors: pan
- * @LastEditTime: 2024-04-02 08:56:20
+ * @LastEditTime: 2024-04-02 11:11:39
 -->
 <template>
  <el-dialog
@@ -17,6 +17,24 @@
  >
    <div>
      <Form ref="addForm" :form-options="formOptions" label-width="120px">
+        <template #talentPoolName="{ formData }">
+          <el-select
+            v-model="formData.talentPoolName"
+            placeholder="请选择"
+            clearable
+            class="w-100"
+          >
+            <el-input placeholder="请输入内容" v-model="addTalentPoolName">
+              <div slot="append" @click="fnAddTalentPoolName()">新增</div>
+            </el-input>
+            <el-option
+              v-for="(item, idnex) in talentPoolNameOptions"
+              :key="idnex"
+              :label="item.label"
+              :value="item.label"
+            ></el-option>
+          </el-select>
+        </template>
      </Form>
    </div>
    <span slot="footer" class="dialog-footer">
@@ -35,6 +53,7 @@ import {
  getETPManagePoolName,
  getETPManageAdd,
  getETPManageUpdate,
+  getETPManagePoolNameAdd,
 } from '@/api'
 export default {
  props: {
@@ -54,6 +73,7 @@ export default {
  data() {
    return {
      talentPoolNameOptions: [],
+      addTalentPoolName: '',
    }
  },
  components: {
@@ -74,11 +94,12 @@ export default {
        {
          label: '所属专家库', // label文字
          prop: 'talentPoolName', // 字段名
-          element: 'el-select', // 指定elementui组件
+          // element: 'el-select', // 指定elementui组件
-          placeholder: '请输入内容', // elementui组件属性
+          // placeholder: '请输入内容', // elementui组件属性
-          options: this.talentPoolNameOptions,
+          // options: this.talentPoolNameOptions,
-          filterable: true,
+          // filterable: true,
          rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
+          __slotName: 'talentPoolName',
        },
        {
          label: '专家姓名', // label文字
@@ -128,6 +149,8 @@ export default {
          element: 'el-select', // 指定elementui组件
          placeholder: '请选择', // elementui组件属性
          dictType: 'sys_professional_field',
+          multiple: true,
+          initValue: [],
          rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
        },
        {
@@ -165,6 +188,20 @@ export default {
    },
  },
  methods: {
+    fnAddTalentPoolName() {
+      //新增专家库名称
+      const params = {
+        talentPoolName: this.addTalentPoolName,
+      }
+      this.$refs['addForm'].$refs['formRef'].clearValidate('talentPoolName')
+      getETPManagePoolNameAdd(params).then((res) => {
+        if (res.code == 200) {
+          this.$message.success('新增成功!')
+          this.addTalentPoolName = ''
+          this.fnGetETPManagePoolName()
+        }
+      })
+    },
    handleSubmit() {
      this.$refs['addForm'].onValidate(() => {
        const loading = this.$loading({
@@ -178,13 +215,14 @@ export default {
        const params = {
          ...this.rowData,
          ...formInfo,
+          professionalField: formInfo.professionalField.join(','),
        }
        typeApi(params).then((res) => {
          loading.close()
          if (res.code === 200) {
            this.$message.success('保存成功')
            this.showDialog = false
-            this.handleClose()
+            // this.handleClose()
            this.$emit('querySearch')
          } else {
            this.$message.error(res.msg)
@@ -194,13 +232,18 @@ export default {
    },
    handleClose() {
      this.showDialog = false
+      console.log('this.formOptions', this.formOptions)
      this.formOptions.forEach((v) => {
-        v.initValue = ''
+        if (v.prop === 'professionalField') {
+          v.initValue = []
+        } else {
+          v.initValue = undefined
+        }
      })
      this.$refs['addForm'].addInitValue()
      this.$refs['addForm'].onReset()
    },
-    async handleOpen() {
+    fnGetETPManagePoolName() {
      getETPManagePoolName().then((res) => {
        if (res.code == 200) {
          this.talentPoolNameOptions = res.data.map((v) => {
@@ -211,10 +254,17 @@ export default {
          })
        }
      })
+    },
+    async handleOpen() {
+      this.fnGetETPManagePoolName()
      if (Object.keys(this.rowData).length) {
        this.formOptions.forEach((v) => {
-          v.initValue = this.rowData[v.prop]
+          if (v.prop === 'professionalField') {
+            v.initValue = this.rowData[v.prop].split(',')
+          } else {
+            v.initValue = this.rowData[v.prop]
+          }
        })
        this.$nextTick(() => {
          this.$refs['addForm'].addInitValue()
@@ -231,4 +281,10 @@ export default {
 </script>
 <style scoped lang="scss">
 @import '@/styles/elementui.scss';
+@import '@/styles/common.scss';
+/deep/ .el-input-group__append {
+  background-color: #0d867f;
+  color: #fff;
+  cursor: pointer;
+}
 </style>
--- a/src/views/etpManage/AddTalent.vue
+++ b/src/views/etpManage/AddTalent.vue
@@ -4,7 +4,7 @@
 * @Autor: pan
 * @Date: 2024-04-01 14:38:41
 * @LastEditors: pan
- * @LastEditTime: 2024-04-01 17:00:27
+ * @LastEditTime: 2024-04-02 11:09:12
 -->
 <template>
  <el-dialog
@@ -113,6 +113,8 @@ export default {
          element: 'el-select', // 指定elementui组件
          placeholder: '请选择', // elementui组件属性
          dictType: 'sys_professional_field',
+          multiple: true,
+          initValue: [],
          rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
        },
        {
@@ -152,10 +154,12 @@ export default {
        const typeApi = this.isEdit ? updKlPerson : addKlPerson
        const formInfo = this.$refs['addForm'].getData()
+        console.log('professionalField', formInfo.professionalField)
        const params = {
          ...this.rowData,
          ...formInfo,
          type: 1,
+          professionalField: formInfo.professionalField.join(','),
        }
        typeApi(params).then((res) => {
          loading.close()
@@ -173,7 +177,11 @@ export default {
    handleClose() {
      this.showDialog = false
      this.formOptions.forEach((v) => {
-        v.initValue = ''
+        if (v.prop === 'professionalField') {
+          v.initValue = []
+        } else {
+          v.initValue = undefined
+        }
      })
      this.$refs['addForm'].addInitValue()
      this.$refs['addForm'].onReset()
@@ -181,7 +189,11 @@ export default {
    async handleOpen() {
      if (Object.keys(this.rowData).length) {
        this.formOptions.forEach((v) => {
-          v.initValue = this.rowData[v.prop]
+          if (v.prop === 'professionalField') {
+            v.initValue = this.rowData[v.prop].split(',')
+          } else {
+            v.initValue = this.rowData[v.prop]
+          }
        })
        this.$nextTick(() => {
          this.$refs['addForm'].addInitValue()

--- a/src/views/etpManage/index.vue
+++ b/src/views/etpManage/index.vue
@@ -4,7 +4,7 @@
 * @Autor: pan
 * @Date: 2024-04-01 14:05:50
 * @LastEditors: pan
- * @LastEditTime: 2024-04-02 09:28:36
+ * @LastEditTime: 2024-04-02 11:16:06
 -->
 <template>
  <div class="searchTable">
@@ -45,6 +45,19 @@
          :columns="columns"
          :key="activeName"
        >
+          <template #professionalField="{ data }">
+            <el-tag
+              :class="{
+                'm-r-10':
+                  idx != getTagList(data.row.professionalField).length - 1,
+              }"
+              v-for="(item, idx) in getTagList(data.row.professionalField)"
+              :key="idx"
+            >
+              {{ item }}
+            </el-tag>
+            <!-- <span>{{ handleText(data.row.professionalField) }}</span> -->
+          </template>
        </table-config>
      </template>
    </list-page>
@@ -134,10 +147,11 @@ export default {
        {
          label: '专业领域', // label文字
          prop: 'professionalField', // 字段名
-          initValue: '',
+          initValue: [],
          element: 'el-select', // 指定elementui组件
          placeholder: '请选择', // elementui组件属性
          dictType: 'sys_professional_field',
+          multiple: true,
        },
      ]
      return arr
@@ -168,23 +182,23 @@ export default {
            options: this.sexOptions,
            collectionType: true,
          },
-          { label: '出生年月', prop: 'birthday' },
+          { label: '出生年月', prop: 'birthday', width: '120px' },
          {
            label: '学历',
            prop: 'education',
            options: this.educationOptions,
            collectionType: true,
          },
-          { label: '联系方式', prop: 'telephone' },
+          { label: '联系方式', prop: 'telephone', width: '120px' },
          { label: '邮箱', prop: 'email', width: '120px' },
          {
            label: '专业领域',
            prop: 'professionalField',
-            options: this.professionalFieldOptions,
+            __slotName: 'professionalField',
-            collectionType: true,
+            width: '200px',
          },
          { label: '专家级别', prop: 'level' },
-          { label: '成果简介', prop: 'remark' },
+          { label: '成果简介', prop: 'remark', width: '200px' },
          {
            label: '专家状态',
            prop: 'state_',
@@ -251,8 +265,8 @@ export default {
          {
            label: '专业领域',
            prop: 'professionalField',
-            options: this.professionalFieldOptions,
+            __slotName: 'professionalField',
-            collectionType: true,
+            width: '200px',
          },
          { label: '成果简介', prop: 'remark' },
          {
@@ -288,6 +302,16 @@ export default {
    this.getDicts()
  },
  methods: {
+    getTagList(codes) {
+      const arr = codes.split(',')
+      let arrStr = []
+      arr.forEach((v) => {
+        const obj =
+          this.professionalFieldOptions.find((val) => val.value == v) || {}
+        arrStr.push(obj.label)
+      })
+      return arrStr
+    },
    getDicts() {
      getDictTypeOptions('talent_status').then((res) => {
        this.talentStatusOptions = res
@@ -324,9 +348,11 @@ export default {
      this.selectRows = data
    },
    querySearch(data) {
+      const professionalField = data?.professionalField.join(',')
      this.query.queryParam = {
        ...this.query.queryParam,
        ...data,
+        professionalField,
      }
      this.$refs.searchTable.queryData()
    },
@@ -396,4 +422,5 @@ export default {
 </script>
 <style scoped lang="scss">
 @import '@/styles/common.scss';
+@import '@/styles/elementui.scss';
 </style>
--- a/src/views/projectInfoManage/index.vue
+++ b/src/views/projectInfoManage/index.vue
@@ -241,6 +241,7 @@
      :center="false"
      :close-on-click-modal="false"
      width="80%"
+      @close="handleClose()"
    >
      <el-form
        :model="ruleForm"
@@ -975,6 +976,12 @@ export default {
        })
      })
    },
+    handleClose() {
+      this.tableData4.forEach((item, index) => {
+        item.fileList = []
+        item.fileArray = []
+      })
+    },
    async editItem(row) {
      //编辑
      this.add_dialog = true