[update] 修改企标和内部工作组的左侧树

src/views/enterpriseStandardLibrary/standard/EnterpriseStandardList.vue

@@ -15,16 +15,22 @@
 
         <template #custom="record">
           <div class="tree-operate-node" @mouseenter="handleTreeMouseover(record.key)" @mouseleave="handleTreeMouseout(record.key)">
+            <!--<a-tooltip>-->
+            <!--  <template #title>-->
+            <!--    {{ record.title }}-->
+            <!--  </template>-->
+            <!--  <span v-if="record.title.indexOf(treeInput) > -1" class="tree-node-custom-title">-->
+            <!--    {{ record.title.substr(0, record.title.indexOf(treeInput)) }}-->
+            <!--    <span style="color: #f50">{{ treeInput }}</span>-->
+            <!--    {{ record.title.substr(record.title.indexOf(treeInput) + treeInput.length) }}-->
+            <!--  </span>-->
+            <!--  <span v-else class="tree-node-custom-title">{{ record.title }}</span>-->
+            <!--</a-tooltip>-->
             <a-tooltip>
               <template #title>
                 {{ record.title }}
               </template>
-              <span v-if="record.title.indexOf(treeInput) > -1" class="tree-node-custom-title">
+              <span class="tree-node-custom-title">{{ record.title }}</span>
-                {{ record.title.substr(0, record.title.indexOf(treeInput)) }}
-                <span style="color: #f50">{{ treeInput }}</span>
-                {{ record.title.substr(record.title.indexOf(treeInput) + treeInput.length) }}
-              </span>
-              <span v-else class="tree-node-custom-title">{{ record.title }}</span>
             </a-tooltip>
             <template v-if="record.key === mouseInNodeKey && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value">
               <!--              新增-->
@@ -167,9 +173,6 @@ export default {
       flag: '3',
       treeInput: '', // 左侧树搜索框内容
       treeData: [], // 左侧树数据
-      treeDataList: [], // 左侧树的数组结构，用于搜索
-      expandedKeys: [],
-      autoExpandParent: true,
       defaultExpandAll: false, // 左侧树默认展开所有
       currentTreeNode: null, // 当前选中的树节点
       mouseInNodeKey: null, // 鼠标悬浮的节点key值
@@ -245,25 +248,6 @@ export default {
       this.treeData = []
       this.initTreeData({ nodeName: this.treeInput })
     },
-    // 左侧树搜索框改变
-    // handleTreeChange (e) {
-    //   const value = e.target.value
-    //   const expandedKeys = this.treeDataList
-    //     .map(item => {
-    //       if (item.title.indexOf(value) > -1) {
-    //         return item.parentId
-    //       }
-    //       return null
-    //     })
-    //     .filter((item, i, self) => item && self.indexOf(item) === i)
-    //   this.expandedKeys = expandedKeys
-    //   this.autoExpandParent = true
-    // },
-    // 左侧树点击展开
-    treeExpand (expandedKeys) {
-      this.expandedKeys = expandedKeys
-      this.autoExpandParent = false
-    },
     // 左侧树点击选中
     treeSelect (selectedKeys) {
       this.currentTreeNode = selectedKeys

src/views/system/internalWorkGroup/WorkingGroupList.vue

@@ -2,16 +2,14 @@
   <a-card :bordered="false" class="page-left-right-layout">
     <div class="page-left-box">
       <a-input-search v-model="treeInput" :placeholder="$t('system.internalWorkGroup.treeSearchPlaceholder')"
-                      @change="handleTreeChange" />
+                      @search="handleTreeSearch" />
       <a-tree
         :show-line="true"
         :show-icon="true"
         :tree-data="treeData"
         :selectedKeys="currentTreeNode"
         :replaceFields="{children: 'subset', title: 'name', key: 'id'}"
-        :expanded-keys="expandedKeys"
+        :default-expand-all="defaultExpandAll"
-        :auto-expand-parent="autoExpandParent"
-        @expand="treeExpand"
         @select="treeSelect">
 <!--        <template #iconCustom="{title}">-->
 <!--          <div class="tree-node">-->
@@ -28,16 +26,22 @@
         <!--   没有删除  -->
         <template #customNoDelete="{name, id}">
           <div class="tree-operate-node" @mouseenter="handleTreeMouseover(id)" @mouseleave="handleTreeMouseout(id)">
+            <!--<a-tooltip>-->
+            <!--  <template #title>-->
+            <!--    {{ name }}-->
+            <!--  </template>-->
+            <!--  <span v-if="name.indexOf(treeInput) > -1" class="tree-node-custom-title">-->
+            <!--    {{ name.substr(0, name.indexOf(treeInput)) }}-->
+            <!--    <span style="color: #f50">{{ treeInput }}</span>-->
+            <!--    {{ name.substr(name.indexOf(treeInput) + treeInput.length) }}-->
+            <!--  </span>-->
+            <!--  <span v-else class="tree-node-custom-title">{{ name }}</span>-->
+            <!--</a-tooltip>-->
             <a-tooltip>
               <template #title>
                 {{ name }}
               </template>
-              <span v-if="name.indexOf(treeInput) > -1" class="tree-node-custom-title">
+              <span class="tree-node-custom-title">{{ name }}</span>
-                {{ name.substr(0, name.indexOf(treeInput)) }}
-                <span style="color: #f50">{{ treeInput }}</span>
-                {{ name.substr(name.indexOf(treeInput) + treeInput.length) }}
-              </span>
-              <span v-else class="tree-node-custom-title">{{ name }}</span>
             </a-tooltip>
             <template v-if="id === mouseInNodeKey">
               <!--              新增-->
@@ -52,16 +56,22 @@
 
         <template #custom="{name, id}">
           <div class="tree-operate-node" @mouseenter="handleTreeMouseover(id)" @mouseleave="handleTreeMouseout(id)">
+            <!--<a-tooltip>-->
+            <!--  <template #title>-->
+            <!--    {{ name }}-->
+            <!--  </template>-->
+            <!--  <span v-if="name.indexOf(treeInput) > -1" class="tree-node-custom-title">-->
+            <!--    {{ name.substr(0, name.indexOf(treeInput)) }}-->
+            <!--    <span style="color: #f50">{{ treeInput }}</span>-->
+            <!--    {{ name.substr(name.indexOf(treeInput) + treeInput.length) }}-->
+            <!--  </span>-->
+            <!--  <span v-else class="tree-node-custom-title">{{ name }}</span>-->
+            <!--</a-tooltip>-->
             <a-tooltip>
               <template #title>
                 {{ name }}
               </template>
-              <span v-if="name.indexOf(treeInput) > -1" class="tree-node-custom-title">
+              <span class="tree-node-custom-title">{{ name }}</span>
-                {{ name.substr(0, name.indexOf(treeInput)) }}
-                <span style="color: #f50">{{ treeInput }}</span>
-                {{ name.substr(name.indexOf(treeInput) + treeInput.length) }}
-              </span>
-              <span v-else class="tree-node-custom-title">{{ name }}</span>
             </a-tooltip>
             <template v-if="id === mouseInNodeKey">
               <!--              新增-->
@@ -183,9 +193,7 @@ export default {
     return {
       treeInput: null, // 树查询绑定值
       treeData: [],
-      treeDataList: [], // 左侧树的数组结构，用于搜索
+      defaultExpandAll: false, // 左侧树默认展开所有
-      expandedKeys: [],
-      autoExpandParent: true,
       currentTreeNode: null, // 当前选中的树节点
       mouseInNodeKey: null, // 鼠标悬浮的节点key值
       columns: [
@@ -251,10 +259,13 @@ export default {
           this.treeData = this.dealTreeData(res.result)
           // this.treeData = res.result
           this.treeData[0].scopedSlots = { title: 'customNoDelete' }
-          this.generateList(this.treeData)
         } else {
           this.treeData = []
         }
+      }).finally(() => {
+        this.$nextTick(() => {
+          this.defaultExpandAll = true
+        })
       })
     },
     // 处理左侧树数据结构
@@ -267,35 +278,10 @@ export default {
         return item
       })
     },
-    // 获取左侧树的数组结构（非树结构）
+    // 左侧树搜索框搜索
-    generateList (data) {
+    handleTreeSearch () {
-      for (let i = 0; i < data.length; i++) {
+      this.treeData = []
-        const node = data[i]
+      this.initTreeData({ name: this.treeInput })
-        const id = node.id
-        this.treeDataList.push({ id, name: node.name, pid: node.pid })
-        if (node.subset) {
-          this.generateList(node.subset)
-        }
-      }
-    },
-    // 左侧树搜索框改变
-    handleTreeChange (e) {
-      const value = e.target.value
-      const expandedKeys = this.treeDataList
-        .map(item => {
-          if (item.name.indexOf(value) > -1) {
-            return item.pid
-          }
-          return null
-        })
-        .filter((item, i, self) => item && self.indexOf(item) === i)
-      this.expandedKeys = expandedKeys
-      this.autoExpandParent = true
-    },
-    // 左侧树点击展开
-    treeExpand (expandedKeys) {
-      this.expandedKeys = expandedKeys
-      this.autoExpandParent = false
     },
     // 左侧树鼠标移入
     handleTreeMouseover (key) {