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>