From de064194c1117799cf1c5bbeb9293aabf41ae8f1 Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Thu, 10 Oct 2024 15:20:54 +0800
Subject: [PATCH] =?UTF-8?q?fix(account):=20=E4=BF=AE=E5=A4=8D=E4=B8=AA?=
 =?UTF-8?q?=E4=BA=BA=E6=96=87=E6=A1=A3=E8=B7=AF=E5=BE=84=E6=8B=BC=E6=8E=A5?=
 =?UTF-8?q?=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/vue/src/views/account/center/Cloud.vue | 42 ++++++++++++++++-----
 1 file changed, 33 insertions(+), 9 deletions(-)

diff --git a/apps/vue/src/views/account/center/Cloud.vue b/apps/vue/src/views/account/center/Cloud.vue
index 0e0f4b73e..f860130dc 100644
--- a/apps/vue/src/views/account/center/Cloud.vue
+++ b/apps/vue/src/views/account/center/Cloud.vue
@@ -6,6 +6,7 @@
           <template #description>
             <DirectoryTree
               :tree-data="folderTree"
+              :loadedKeys="loadedKeys"
               :expandedKeys="expandedKeys"
               @expand="fetchFolders"
               @select="handleSelectFolder"
@@ -29,7 +30,7 @@
 <script lang="ts" setup>
   import { computed, ref, shallowRef } from 'vue';
   import { Card, Tree } from 'ant-design-vue';
-  import { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
+  import { AntTreeNodeBaseEvent, TreeDataItem } from 'ant-design-vue/es/tree/Tree';
   import { useLocalization } from '/@/hooks/abp/useLocalization';
   import { usePermission } from '/@/hooks/web/usePermission';
   import { OssObject } from '/@/api/oss-management/objects/model';
@@ -52,6 +53,12 @@
     dataRef: any;
   }
 
+  interface NodeInfo {
+    path?: string;
+    node: NodeInfo;
+    parent?: NodeInfo;
+  }
+
   const { hasPermission } = usePermission();
   const { L } = useLocalization(['AbpOssManagement', 'AbpUi']);
   const folderTreeRef = ref<{ [key: string]: TreeDataItem }>({
@@ -97,28 +104,36 @@
         return false;
     }
   });
+  const loadedKeys = ref<string[]>([]);
   const expandedKeys = ref<string[]>([]);
 
-  function fetchFolders(keys) {
+  function fetchFolders(keys, e) {
     expandedKeys.value = keys;
+    if (!e.expanded) {
+      const keys = loadedKeys.value;
+      const findIndex = keys.findLastIndex((key) => key === e.node.key);
+      findIndex >= 0 && keys.splice(findIndex);
+      loadedKeys.value = keys;
+    }
   }
 
-  function handleSelectFolder(_, e) {
-    switch (e.node.dataRef.group) {
+  function handleSelectFolder(_, e: AntTreeNodeBaseEvent) {
+    const path = calculateFilePath(e.node as any);
+    switch (e.node.group) {
       case 'private':
       case 'public':
         switchComponent.value = {
           name: 'FileList',
-          group: e.node.dataRef.group,
-          path: e.node.dataRef.path,
+          group: e.node.group,
+          path: path,
           dataRef: e.node.dataRef,
         };
         break;
       case 'share':
         switchComponent.value = {
           name: 'ShareList',
-          group: e.node.dataRef.group,
-          path: e.node.dataRef.path,
+          group: e.node.group,
+          path: path,
           dataRef: e.node.dataRef,
         };
         break;
@@ -128,7 +143,7 @@
   function handleAppendFolder(folders: OssObject[]) {
     switchComponent.value.dataRef.children = folders.map((obj) => {
       return {
-        key: obj.name,
+        key: switchComponent.value.path + obj.name,
         group: switchComponent.value.group,
         title: obj.name,
         path: obj.name,
@@ -136,4 +151,13 @@
       };
     });
   }
+
+  function calculateFilePath(e: NodeInfo) {
+    let path = e.path ?? '';
+    if (e.parent?.node?.path) {
+      path = e.parent.node.path + path;
+      path = calculateFilePath(e.parent) + path;
+    }
+    return path;
+  }
 </script>