From 4af11fb04340d68d3047252732818337447f3c6a Mon Sep 17 00:00:00 2001
From: liumangmang <a362165265@qq.com>
Date: Fri, 3 Apr 2026 16:14:14 +0800
Subject: [PATCH] feat: add expand/collapse all functionality

- Add expandAll() and collapseAll() methods to sessionTree store
- Add toggle button in toolbar to expand/collapse all folders
- Track expansion state with allExpanded ref
- Improve toolbar layout with flex spacing

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/components/SessionTree.vue | 23 ++++++++++++++++++++++-
 frontend/src/stores/sessionTree.ts      | 20 ++++++++++++++++++++
 2 files changed, 42 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/SessionTree.vue b/frontend/src/components/SessionTree.vue
index 33e35d6..9f12277 100644
--- a/frontend/src/components/SessionTree.vue
+++ b/frontend/src/components/SessionTree.vue
@@ -8,7 +8,7 @@ import { useTreeSearch } from '../composables/useTreeSearch'
 import SessionTreeNode from './SessionTreeNode.vue'
 import ContextMenu from './ContextMenu.vue'
 import type { ContextMenuItem } from './ContextMenu.vue'
-import { FolderPlus, Edit2, Trash2, Search, X } from 'lucide-vue-next'
+import { FolderPlus, Edit2, Trash2, Search, X, ChevronDown, ChevronRight } from 'lucide-vue-next'
 
 const treeStore = useSessionTreeStore()
 const workspaceStore = useWorkspaceStore()
@@ -18,6 +18,7 @@ const newFolderName = ref('')
 const showRenameDialog = ref(false)
 const renameNodeId = ref<string | null>(null)
 const renameValue = ref('')
+const allExpanded = ref(true)
 
 // Search functionality
 const nodesRef = computed(() => treeStore.nodes)
@@ -175,6 +176,16 @@ function deleteNode(nodeId: string) {
     treeStore.deleteNode(nodeId)
   }
 }
+
+function toggleExpandAll() {
+  if (allExpanded.value) {
+    treeStore.collapseAll()
+    allExpanded.value = false
+  } else {
+    treeStore.expandAll()
+    allExpanded.value = true
+  }
+}
 </script>
 
 <template>
@@ -188,6 +199,16 @@ function deleteNode(nodeId: string) {
         <FolderPlus class="w-4 h-4" />
         文件夹
       </button>
+
+      <div class="flex-1" />
+
+      <button
+        @click="toggleExpandAll"
+        class="flex items-center gap-1 px-2 py-1.5 rounded text-xs text-slate-400 hover:text-slate-200 hover:bg-slate-800 transition-colors"
+        :title="allExpanded ? '折叠全部' : '展开全部'"
+      >
+        <component :is="allExpanded ? ChevronDown : ChevronRight" class="w-3.5 h-3.5" />
+      </button>
     </div>
 
     <!-- Search Bar -->
diff --git a/frontend/src/stores/sessionTree.ts b/frontend/src/stores/sessionTree.ts
index 5d579a7..666be17 100644
--- a/frontend/src/stores/sessionTree.ts
+++ b/frontend/src/stores/sessionTree.ts
@@ -212,5 +212,25 @@ export const useSessionTreeStore = defineStore('sessionTree', {
         this.renameNode(node.id, newName)
       }
     },
+
+    // Expand all folders
+    expandAll() {
+      this.nodes.forEach(node => {
+        if (node.type === 'folder') {
+          node.expanded = true
+        }
+      })
+      this.persist()
+    },
+
+    // Collapse all folders
+    collapseAll() {
+      this.nodes.forEach(node => {
+        if (node.type === 'folder') {
+          node.expanded = false
+        }
+      })
+      this.persist()
+    },
   },
 })