From 52f9301240fe5f5e9314ee02ee189ea2c9833567 Mon Sep 17 00:00:00 2001
From: baiqi <qi.bai@fit2cloud.com>
Date: Wed, 24 Jul 2024 11:04:58 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E7=BB=84=E4=BB=B6):=20=E6=A0=91=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6&=E7=A9=BF=E6=A2=AD=E6=A1=86=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=B1=95=E5=BC=80=E6=8A=98=E5=8F=A0=E9=80=BB=E8=BE=91=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/business/ms-transfer/index.vue |  3 +-
 .../src/components/business/ms-tree/index.vue | 45 ++++++++++++++-----
 2 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/frontend/src/components/business/ms-transfer/index.vue b/frontend/src/components/business/ms-transfer/index.vue
index 57214d4dc5..3e70d81d22 100644
--- a/frontend/src/components/business/ms-transfer/index.vue
+++ b/frontend/src/components/business/ms-transfer/index.vue
@@ -33,7 +33,6 @@
         :data="getTreeData()"
         :keyword="sourceKeyword"
         block-node
-        default-expand-all
         :selectable="false"
         :virtual-list-props="{
           height: '100%',
@@ -159,7 +158,7 @@
             key: itemKey,
             label: itemTitle,
             children: itemChildren ? travel(itemChildren) : [],
-            expanded: true,
+            expanded: item.expanded,
           });
         }
       });
diff --git a/frontend/src/components/business/ms-tree/index.vue b/frontend/src/components/business/ms-tree/index.vue
index 931978c873..8780b37ed0 100644
--- a/frontend/src/components/business/ms-tree/index.vue
+++ b/frontend/src/components/business/ms-tree/index.vue
@@ -98,7 +98,7 @@
   import type { ActionsItem } from '@/components/pure/ms-table-more-action/types';
 
   import useContainerShadow from '@/hooks/useContainerShadow';
-  import { mapTree, traverseTree } from '@/utils';
+  import { findNodeByKey, mapTree, traverseTree } from '@/utils';
 
   import type { MsTreeExpandedData, MsTreeFieldNames, MsTreeNodeData, MsTreeSelectedData } from './types';
   import { VirtualListProps } from '@arco-design/web-vue/es/_components/virtual-list-v2/interface';
@@ -177,7 +177,7 @@
     (e: 'moreActionSelect', item: ActionsItem, node: MsTreeNodeData): void;
     (e: 'moreActionsClose'): void;
     (e: 'check', val: Array<string | number>, node: MsTreeNodeData): void;
-    (e: 'expand', node: MsTreeExpandedData): void;
+    (e: 'expand', node: MsTreeExpandedData, _expandKeys: Array<string | number>): void;
   }>();
 
   const data = defineModel<MsTreeNodeData[]>('data', {
@@ -195,6 +195,7 @@
   const focusNodeKey = defineModel<string | number>('focusNodeKey', {
     default: '',
   });
+  const expandKeys = ref<Set<string | number>>(new Set([]));
 
   const treeContainerRef: Ref = ref(null);
   const treeRef = ref<TreeInstance>();
@@ -262,33 +263,46 @@
     }
   }, props.searchDebounce);
 
+  onBeforeMount(() => {
+    if (props.useMapData) {
+      filterTreeData.value = mapTree(data.value, (node) => {
+        node.expanded = props.defaultExpandAll;
+        return node;
+      });
+    } else {
+      traverseTree(data.value, (node) => {
+        node.expanded = props.defaultExpandAll;
+      });
+      filterTreeData.value = data.value;
+    }
+    nextTick(() => {
+      if (props.defaultExpandAll && treeRef.value) {
+        treeRef.value.expandAll(true);
+      }
+    });
+  });
+
   watch(
     () => data.value,
     debounce((val) => {
       if (!props.keyword) {
         if (props.useMapData) {
           filterTreeData.value = mapTree(val, (node) => {
-            node.expanded = props.defaultExpandAll;
+            node.expanded = expandKeys.value.has(node[props.fieldNames.key]);
             return node;
           });
         } else {
           traverseTree(val, (node) => {
-            node.expanded = props.defaultExpandAll;
+            node.expanded = expandKeys.value.has(node[props.fieldNames.key]);
           });
           filterTreeData.value = val;
         }
-        nextTick(() => {
-          if (props.defaultExpandAll && treeRef.value) {
-            treeRef.value.expandAll(true);
-          }
-        });
       } else {
         updateDebouncedSearch();
       }
     }, 0),
     {
       deep: true,
-      immediate: true,
     }
   );
 
@@ -447,11 +461,18 @@
 
   function handleExpand(node: MsTreeNodeData) {
     node.expanded = !node.expanded;
+    if (props.useMapData) {
+      const realNode = findNodeByKey<MsTreeNodeData>(data.value, node[props.fieldNames.key]);
+      if (realNode) {
+        realNode.expanded = node.expanded;
+      }
+    }
     treeRef.value?.expandNode(node[props.fieldNames.key], node.expanded);
   }
 
-  function expand(expandKeys: Array<string | number>, node: MsTreeExpandedData) {
-    emit('expand', node);
+  function expand(_expandKeys: Array<string | number>, node: MsTreeExpandedData) {
+    expandKeys.value = new Set(_expandKeys);
+    emit('expand', node, _expandKeys);
   }
 
   function checkAll(val: boolean) {