From 7e0f347c9ad8dfa5312cbd66239ab6c4d7e24e6d Mon Sep 17 00:00:00 2001
From: liRQ <813144884@qq.com>
Date: Wed, 24 Jun 2026 10:41:56 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 vue/src/App.vue                   | 20 ++++++++++++++++++--
 vue/src/components/FolderTree.vue |  5 +++++
 vue/src/components/TreeNode.vue   | 21 ++++++++++++++++++++-
 3 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/vue/src/App.vue b/vue/src/App.vue
index 92de3c8..0753a1e 100644
--- a/vue/src/App.vue
+++ b/vue/src/App.vue
@@ -267,7 +267,7 @@
             </div>
           
           <!-- 文件夹树形展示 -->
-          <div class="folder-tree-container">
+          <div ref="folderTreeContainerRef" class="folder-tree-container">
             <!-- 创建根级文件夹按钮 -->
             <div v-if="!hasSearched" class="folder-tree-actions">
               <button type="button" class="folder-tree-actions__btn" @click="handleAddFolder(null)">
@@ -290,6 +290,7 @@
             <FolderTree
               v-else
               :tree-data="folderTreeData"
+              :expanded-folder-ids="expandedFolderIds"
               @add-folder="handleAddFolder"
               @add-file="handleAddFile"
               @expand="handleExpandFolder"
@@ -563,7 +564,7 @@
 </template>
 
 <script setup>
-import { computed, onBeforeUnmount, onMounted, reactive, ref, watch, onUnmounted } from 'vue'
+import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref, watch, onUnmounted } from 'vue'
 import LoginView from './components/LoginView.vue'
 import PosterCard from './components/PosterCard.vue'
 import RecordDialog from './components/RecordDialog.vue'
@@ -628,6 +629,8 @@ const showRecordDialog = ref(false)
 const showFolderDialog = ref(false)
 const editingFolder = ref(null)         // 编辑时传入的文件夹对象，null 表示新建
 const folderDialogParentId = ref(0)     // 新建时的父文件夹ID
+const folderTreeContainerRef = ref(null) // 文件夹树容器引用（用于保持滚动位置）
+const expandedFolderIds = reactive(new Set()) // 全局展开状态追踪，防止 buildTree 重建丢失展开
 
 // 确认弹窗状态
 const showConfirmDialog = ref(false)
@@ -1044,6 +1047,9 @@ async function handleExpandFolder(node) {
   const driveId = activeSheetId.value
   if (!driveId) return
 
+  // 保存当前滚动位置
+  const scrollTop = folderTreeContainerRef.value?.scrollTop || 0
+
   setFolderLoadingState(driveId, node.id, true)
 
   try {
@@ -1063,6 +1069,15 @@ async function handleExpandFolder(node) {
       ),
       ...childrenItems,
     ]
+
+    // 将当前文件夹加入全局展开状态
+    expandedFolderIds.add(node.id)
+
+    // 恢复滚动位置（等待 DOM 更新后）
+    await nextTick()
+    if (folderTreeContainerRef.value) {
+      folderTreeContainerRef.value.scrollTop = scrollTop
+    }
   } catch (err) {
     setFolderLoadingState(driveId, node.id, false)
     console.error(`加载文件夹[${node.title}]内容失败`, err)
@@ -1918,6 +1933,7 @@ watch(
 
 // 切换网盘时自动加载该网盘下的文件夹
 watch(activeSheetId, (newId) => {
+  expandedFolderIds.clear() // 切换网盘时清空展开状态
   if (newId && currentView.value === 'manage') {
     loadDriveFolders(newId)
   }
diff --git a/vue/src/components/FolderTree.vue b/vue/src/components/FolderTree.vue
index 529ffde..8cb86b0 100644
--- a/vue/src/components/FolderTree.vue
+++ b/vue/src/components/FolderTree.vue
@@ -4,6 +4,7 @@
       <TreeNode
         :node="node"
         :depth="0"
+        :expanded-folder-ids="expandedFolderIds"
         @add-folder="handleAddFolder"
         @add-file="handleAddFile"
         @expand="handleExpand"
@@ -22,6 +23,10 @@ defineProps({
     type: Array,
     default: () => [],
   },
+  expandedFolderIds: {
+    type: Set,
+    default: () => new Set(),
+  },
 })
 
 const emit = defineEmits(['add-folder', 'add-file', 'expand', 'edit', 'delete'])
diff --git a/vue/src/components/TreeNode.vue b/vue/src/components/TreeNode.vue
index be67866..0a267aa 100644
--- a/vue/src/components/TreeNode.vue
+++ b/vue/src/components/TreeNode.vue
@@ -97,6 +97,7 @@
           :key="child.id"
           :node="child"
           :depth="depth + 1"
+          :expanded-folder-ids="expandedFolderIds"
           @add-folder="$emit('add-folder', $event)"
           @add-file="$emit('add-file', $event)"
           @expand="$emit('expand', $event)"
@@ -109,7 +110,7 @@
 </template>
 
 <script setup>
-import { ref, computed } from 'vue'
+import { ref, computed, watch } from 'vue'
 
 const props = defineProps({
   node: {
@@ -120,6 +121,10 @@ const props = defineProps({
     type: Number,
     default: 0,
   },
+  expandedFolderIds: {
+    type: Set,
+    default: () => new Set(),
+  },
 })
 
 const emit = defineEmits(['add-folder', 'add-file', 'expand', 'edit', 'delete'])
@@ -129,6 +134,17 @@ const showTooltip = ref(false)
 const tooltipPos = ref({ top: 0, left: 0 })
 let tooltipTimer = null
 
+// 当 buildTree 重建节点时，通过全局展开状态恢复 isExpanded
+watch(
+  () => props.expandedFolderIds.has(props.node.id),
+  (shouldExpand) => {
+    if (shouldExpand && !isExpanded.value) {
+      isExpanded.value = true
+    }
+  },
+  { immediate: true },
+)
+
 const tooltipStyle = computed(() => ({
   position: 'fixed',
   top: `${tooltipPos.value.top}px`,
@@ -161,6 +177,9 @@ function toggleExpand() {
     isExpanded.value = nextExpanded
     if (nextExpanded) {
       emit('expand', props.node)
+    } else {
+      // 收起时从全局展开状态中移除
+      props.expandedFolderIds.delete(props.node.id)
     }
   }
 }