bug 78523

src/components/STreeSelect.vue

@@ -0,0 +1,95 @@
+<template>
+  <a-tree-select
+    v-bind="$attrs"
+    v-on="$listeners"
+    :value="treeValue"
+    :getPopupContainer="(node) => node.parentNode"
+    style="width: 100%"
+    :tree-checkable="treeCheckable"
+    :show-search="canSearch"
+    :search-value.sync="searchValue"
+    :filterTreeNode="filterTreeOption"
+    @change="handleChange"
+    @search="handleSearch">
+
+  </a-tree-select>
+</template>
+
+<script>
+export default {
+  name: 'STreeSelect',
+  props: {
+    value: {
+      required: false
+    },
+    // 是否可以搜索
+    canSearch: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    // 是否多选
+    treeCheckable: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  watch: {
+    value: {
+      handler () {
+        if (this.value) {
+          this.treeValue = JSON.parse(JSON.stringify(this.value))
+        }
+      },
+      immediate: true,
+      deep: true
+    }
+  },
+  data () {
+    return {
+      treeValue: null, // 选中的数据
+      searchValue: null // 查询的字符串
+    }
+  },
+  mounted () {
+    if (this.treeCheckable) {
+      this.$nextTick(() => {
+        document.addEventListener('click', this.clearSearchValue)
+      })
+    }
+  },
+  methods: {
+    filterTreeOption (input, option) {
+      const text = option.componentOptions.propsData.title || option.componentOptions.propsData.label
+      return text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    handleChange (value) {
+      this.treeValue = value
+      this.$emit('change', value)
+    },
+    handleSearch (value) {
+      this.searchValue = value
+    },
+    clearSearchValue (event) {
+      event.stopPropagation()
+      this.searchValue = null
+    }
+  },
+  beforeDestroy () {
+    if (this.treeCheckable) {
+      document.removeEventListener('click', this.clearSearchValue)
+    }
+  },
+  model: {
+    prop: 'value',
+    event: 'change'
+  }
+}
+</script>
+
+<style scoped lang="less">
+/deep/ .ant-select-tree-dropdown {
+  max-height: 50vh !important;
+}
+</style>

src/components/customField/AddForm.vue

@@ -101,20 +101,15 @@
                                     :type="'select'"
                                     :triggerChange="false"
                                     :options="optionsData[item.dbFieldName]"
-                                    :dictCode="item.fieldHref ? null : item.dictField"/>
+                                    :dictCode="item.fieldHref ? null : item.dictField" />
                 <!--   12, 树选择       -->
-                <a-tree-select
+                <s-tree-select
                   v-else-if="item.fieldShowType === FieldType.TREE.value"
                   v-model="formInline[item.dbFieldName]"
-                  :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                  style="width: 100%"
                   :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                   :tree-data="optionsData[item.dbFieldName]"
                   tree-checkable
                   treeCheckStrictly
-                  :label-in-value="false"
-                  show-search
-                  :filterTreeNode="filterTreeOption"
                   :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                 <!--  14, 年份选择 -->
                 <j-date v-else-if="item.fieldShowType === FieldType.YEAR_PICKER.value"
@@ -125,15 +120,13 @@
                         date-format="YYYY"
                         :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                 <!--   15, 树选择（单选）       -->
-                <a-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
+                <s-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
                                v-model="formInline[item.dbFieldName]"
                                :getPopupContainer="triggerNode=> triggerNode.parentNode"
                                style="width: 100%"
                                :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                                :tree-data="optionsData[item.dbFieldName]"
                                :label-in-value="false"
-                               show-search
-                               :filterTreeNode="filterTreeOption"
                                :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                 <!--16、树形弹框选择-->
                 <tree-selection v-else-if="item.fieldShowType === FieldType.TREE_MODAL_SELECT.value"
@@ -177,6 +170,7 @@ import { getAction } from '../../api/manage.js'
 import { getFormDictTreeList } from '../../api/api.js'
 import TreeSelection from '../selection/TreeSelection'
 import { getStandardGradeClassification } from '../../api/enterpriseStandardLibraryApi'
+import STreeSelect from '../STreeSelect'
 
 export default {
   name: 'AddForm',
@@ -187,7 +181,8 @@ export default {
     JDictSelectTag,
     JMultiSelectTag,
     UploadFile,
-    TreeSelection
+    TreeSelection,
+    STreeSelect
   },
   props: {
     url: {
@@ -472,6 +467,7 @@ export default {
                   }
                 }
                 this.formInline[field.dbFieldName] = valueArr
+                console.log(this.formInline[field.dbFieldName])
               } else {
                 this.formInline[field.dbFieldName] = undefined
               }
@@ -674,7 +670,7 @@ export default {
     filterTreeOption (input, option) {
       const text = option.componentOptions.propsData.title || option.componentOptions.propsData.label
       return text.toLowerCase().indexOf(input.toLowerCase()) >= 0
-    }
+    },
   }
 }
 </script>

src/views/documentTool/documentSplit/modules/SplitAddForm.vue

@@ -125,19 +125,15 @@
                                       :triggerChange="false"
                                       :dictCode="item.dictField" />
                   <!--   12, 树选择       -->
-                  <a-tree-select
+                  <s-tree-select
                     v-else-if="item.fieldShowType === FieldType.TREE.value"
                     v-model="formInline[item.dbFieldName]"
-                    :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                    style="width: 100%"
                     :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                     :tree-data="optionsData[item.dbFieldName]"
                     tree-checkable
                     treeCheckStrictly
                     :label-in-value="false"
                     @change="updateDom"
-                    show-search
-                    :filterTreeNode="filterTreeOption"
                     :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                   <!--  14, 年份选择 -->
                   <j-date v-else-if="item.fieldShowType === FieldType.YEAR_PICKER.value"
@@ -148,16 +144,12 @@
                           date-format="YYYY"
                           :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                   <!--   15, 树选择（单选）       -->
-                  <a-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
+                  <s-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
                                  v-model="formInline[item.dbFieldName]"
-                                 :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                                 style="width: 100%"
                                  :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                                  :tree-data="optionsData[item.dbFieldName]"
                                  :label-in-value="false"
                                  @change="updateDom"
-                                 show-search
-                                 :filterTreeNode="filterTreeOption"
                                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                 </a-form-model-item>
               </div>
@@ -232,6 +224,7 @@ import JMultipleDatePicker from '../../../../components/JMultipleDatePicker.vue'
 import { FieldType, TypeOfClauseItem, YesOrNoEnum } from '../../../../enums/commonEnums'
 import { getAction } from '../../../../api/manage'
 import { getFormDictTreeList } from '../../../../api/api'
+import STreeSelect from '../../../../components/STreeSelect'
 
 export default {
   name: 'SplitAddForm',
@@ -240,7 +233,8 @@ export default {
     SplitDetailAddTable,
     UploadFile,
     StandardSelection,
-    SplitDetailAddTypeCheck
+    SplitDetailAddTypeCheck,
+    STreeSelect
   },
   data () {
     return {

src/views/documentTool/documentSplit/modules/SplitDetailBatchEditDrawer.vue

@@ -120,18 +120,14 @@
                                       :triggerChange="false"
                                       :dictCode="item.dictField"/>
                   <!--   12, 树选择       -->
-                  <a-tree-select
+                  <s-tree-select
                     v-else-if="item.fieldShowType === FieldType.TREE.value"
                     v-model="formInline[item.dbFieldName]"
-                    :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                    style="width: 100%"
                     :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                     :tree-data="optionsData[item.dbFieldName]"
                     tree-checkable
                     treeCheckStrictly
                     :label-in-value="false"
-                    show-search
-                    :filterTreeNode="filterTreeOption"
                     :placeholder="$t('pleaseSelect')+item.dbFieldTxt"/>
                   <!--  14, 年份选择 -->
                   <j-date v-else-if="item.fieldShowType === FieldType.YEAR_PICKER.value"
@@ -142,15 +138,13 @@
                           date-format="YYYY"
                           :placeholder="$t('pleaseSelect')+item.dbFieldTxt"/>
                   <!--   15, 树选择（单选）       -->
-                  <a-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
+                  <s-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
                                  v-model="formInline[item.dbFieldName]"
                                  :getPopupContainer="triggerNode=> triggerNode.parentNode"
                                  style="width: 100%"
                                  :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                                  :tree-data="optionsData[item.dbFieldName]"
                                  :label-in-value="false"
-                                 show-search
-                                 :filterTreeNode="filterTreeOption"
                                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt"/>
                 </a-form-model-item>
               </div>
@@ -179,10 +173,11 @@ import { getDocSplitEditForm, editBatchEditClause } from '../../../../api/docume
 import { FieldType, YesOrNoEnum } from '../../../../enums/commonEnums'
 import { getFormDictTreeList } from '../../../../api/api'
 import { getAction } from '../../../../api/manage'
+import STreeSelect from '../../../../components/STreeSelect'
 
 export default {
   name: 'SplitDetailBatchEditDrawer',
-  components: { UserSelection, StandardSelection, UploadFile, JMultipleDatePicker },
+  components: { UserSelection, StandardSelection, UploadFile, JMultipleDatePicker, STreeSelect },
   data () {
     return {
       FieldType,
@@ -453,10 +448,6 @@ export default {
   width: 100%;
 }
 
-/deep/ .ant-select-tree-dropdown {
-  max-height: 50vh !important;
-}
-
 .unscramble-item {
   display: flex;
   justify-content: space-between;

src/views/documentTool/standardWarning/StandardWarningList.vue

@@ -34,15 +34,12 @@
             <a-form-model-item :label="$t('projectLibrary.vehicleItemLibrary.responsibleDepartment')"
                                :labelCol="labelCol"
                                :wrapperCol="wrapperCol">
-              <a-tree-select
+              <s-tree-select
                 tree-node-filter-prop="title"
                 v-model="queryParam.responsibleDepartment"
                 :maxTagCount="1"
-                :show-search="true"
+                can-search
-                :filterTreeNode="filterTreeOption"
-                :getPopupContainer="triggerNode=> triggerNode.parentNode"
                 class="box-input"
-                style="width: 100%"
                 :tree-data="departList"
                 :placeholder="$t('pleaseSelect') + $t('projectLibrary.vehicleItemLibrary.responsibleDepartment')"
                 @change="handleDepartsChange"
@@ -125,10 +122,11 @@ import JTable from '../../../components/jero/JTable'
 import { mapGetters } from 'vuex'
 import { StandardSource } from '../../../enums/commonEnums'
 import { filterObj } from '../../../utils/util'
+import STreeSelect from '../../../components/STreeSelect'
 
 export default {
   name: 'StandardWarningList',
-  components: { JTable },
+  components: { JTable, STreeSelect },
   mixins: [JeroListMixin],
   data () {
     return {

src/views/workCenter/standardEntryOrChangeProcess/StandardEntryOrChangeProcess.vue

@@ -223,11 +223,9 @@
                                         :triggerChange="false"
                                         :dictCode="item.dictField" />
                     <!--   12, 树选择       -->
-                    <a-tree-select
+                    <s-tree-select
                       v-else-if="item.fieldShowType === FieldType.TREE.value"
                       v-model="formInline[item.dbFieldName]"
-                      :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                      style="width: 100%"
                       :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                       :tree-data="optionsData[item.dbFieldName]"
                       tree-checkable
@@ -243,10 +241,8 @@
                             date-format="YYYY"
                             :placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
                     <!--   15, 树选择（单选）       -->
-                    <a-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
+                    <s-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
                                    v-model="formInline[item.dbFieldName]"
-                                   :getPopupContainer="triggerNode=> triggerNode.parentNode"
-                                   style="width: 100%"
                                    :disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
                                    :tree-data="optionsData[item.dbFieldName]"
                                    :label-in-value="false"
@@ -358,6 +354,7 @@ import {
   agreeStandardECProcess, rejectStandardECProcess
 } from '../../../api/workCenter'
 import { WorkCenterMixin } from '../../../mixins/WorkCenterMixin'
+import STreeSelect from '../../../components/STreeSelect'
 
 export default {
   name: 'StandardEntryOrChangeProcess',
@@ -370,7 +367,8 @@ export default {
     InternalDetailPage,
     ProcessDetailList,
     UserSelectModal,
-    TreeSelection
+    TreeSelection,
+    STreeSelect
   },
   mixins: [WorkCenterMixin],
   data () {