From 7f6d445305e19e9f2f1c8bda0d148ea9f6576b3c Mon Sep 17 00:00:00 2001
From: cfq <cfq@qq.com>
Date: Fri, 30 Jan 2026 15:55:56 +0800
Subject: [PATCH] =?UTF-8?q?feat(FileTree):=20=E4=B8=BA=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E6=A0=91=E7=A9=BA=E7=99=BD=E5=8C=BA=E5=9F=9F=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E4=B8=8A=E4=B8=8B=E6=96=87=E8=8F=9C=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

新增对文件树空白区域的右键菜单支持，包含新建文件/文件夹、刷新和打开资源管理器选项
---
 src/components/FileTree.vue | 101 +++++++++++++++++++++++-------------
 1 file changed, 65 insertions(+), 36 deletions(-)

diff --git a/src/components/FileTree.vue b/src/components/FileTree.vue
index 782dcf5..bbc9fad 100644
--- a/src/components/FileTree.vue
+++ b/src/components/FileTree.vue
@@ -23,45 +23,56 @@
       <a-empty description="请选择目录" />
     </div>
 
-    <div v-else class="tree-content" ref="treeContentRef">
-      <a-directory-tree ref="treeRef" v-model:expandedKeys="state.expandedKeys" v-model:selectedKeys="selectedKeys" :tree-data="treeData" :field-names="{ title: 'name', key: 'path', children: 'children' }" :load-data="onLoadData" @select="onSelect">
-        <template #icon="{ dataRef, expanded }">
-          <component :is="getFileIcon(dataRef.name, dataRef.type, expanded)" :style="{ color: getFileIconColor(dataRef.name, dataRef.type), fontSize: '18px', marginRight: '6px' }" />
-        </template>
-        <template #title="{ dataRef }">
-          <a-dropdown :trigger="['contextmenu']">
-            <span class="tree-node-title" :title="dataRef.name">{{ dataRef.name }}</span>
-            <template #overlay>
-              <a-menu @click="(e) => handleMenuClick(e, dataRef)">
-                <a-menu-item key="open" v-if="dataRef.type === 'file'">打开</a-menu-item>
+    <a-dropdown v-else :trigger="['contextmenu']">
+      <div class="tree-content" ref="treeContentRef">
+        <a-directory-tree ref="treeRef" v-model:expandedKeys="state.expandedKeys" v-model:selectedKeys="selectedKeys" :tree-data="treeData" :field-names="{ title: 'name', key: 'path', children: 'children' }" :load-data="onLoadData" @select="onSelect">
+          <template #icon="{ dataRef, expanded }">
+            <component :is="getFileIcon(dataRef.name, dataRef.type, expanded)" :style="{ color: getFileIconColor(dataRef.name, dataRef.type), fontSize: '18px', marginRight: '6px' }" />
+          </template>
+          <template #title="{ dataRef }">
+            <a-dropdown :trigger="['contextmenu']">
+              <span class="tree-node-title" :title="dataRef.name">{{ dataRef.name }}</span>
+              <template #overlay>
+                <a-menu @click="(e) => handleMenuClick(e, dataRef)">
+                  <a-menu-item key="open" v-if="dataRef.type === 'file'">打开</a-menu-item>
 
-                <template v-if="isMdFile(dataRef.name)">
-                  <a-menu-item key="pin">
-                    {{ isPinned(dataRef.path) ? "取消置顶" : "置顶" }}
-                  </a-menu-item>
-                </template>
+                  <template v-if="isMdFile(dataRef.name)">
+                    <a-menu-item key="pin">
+                      {{ isPinned(dataRef.path) ? "取消置顶" : "置顶" }}
+                    </a-menu-item>
+                  </template>
 
-                <a-menu-divider />
-
-                <!-- 文件夹操作 -->
-                <template v-if="dataRef.type === 'directory'">
-                  <a-menu-item key="newFile">新建文件</a-menu-item>
-                  <a-menu-item key="newFolder">新建文件夹</a-menu-item>
                   <a-menu-divider />
-                </template>
 
-                <a-menu-item key="rename">重命名</a-menu-item>
-                <a-menu-item key="delete" danger>删除</a-menu-item>
+                  <!-- 文件夹操作 -->
+                  <template v-if="dataRef.type === 'directory'">
+                    <a-menu-item key="newFile">新建文件</a-menu-item>
+                    <a-menu-item key="newFolder">新建文件夹</a-menu-item>
+                    <a-menu-divider />
+                  </template>
 
-                <a-menu-divider />
-                <a-menu-item key="copyPath">复制路径</a-menu-item>
-                <a-menu-item key="openInExplorer">在资源管理器打开</a-menu-item>
-              </a-menu>
-            </template>
-          </a-dropdown>
-        </template>
-      </a-directory-tree>
-    </div>
+                  <a-menu-item key="rename">重命名</a-menu-item>
+                  <a-menu-item key="delete" danger>删除</a-menu-item>
+
+                  <a-menu-divider />
+                  <a-menu-item key="copyPath">复制路径</a-menu-item>
+                  <a-menu-item key="openInExplorer">在资源管理器打开</a-menu-item>
+                </a-menu>
+              </template>
+            </a-dropdown>
+          </template>
+        </a-directory-tree>
+      </div>
+      <template #overlay>
+        <a-menu @click="handleBackgroundMenuClick">
+          <a-menu-item key="newFile">新建文件</a-menu-item>
+          <a-menu-item key="newFolder">新建文件夹</a-menu-item>
+          <a-menu-divider />
+          <a-menu-item key="refresh">刷新</a-menu-item>
+          <a-menu-item key="openInExplorer">在资源管理器打开</a-menu-item>
+        </a-menu>
+      </template>
+    </a-dropdown>
 
     <!-- 重命名/新建弹窗 -->
     <a-modal v-model:open="modalVisible" :title="modalTitle" @ok="handleModalOk">
@@ -362,6 +373,26 @@ const handleMenuClick = async ({ key }, node) => {
   }
 };
 
+const handleBackgroundMenuClick = ({ key }) => {
+  if (key === 'refresh') {
+    handleRefresh();
+    return;
+  }
+
+  // 构建根目录的虚拟节点
+  const separator = window.utools.isWindows() ? "\\" : "/";
+  // 注意：如果是根驱动器（如 C:\），pop() 可能为空字符串，但 state.rootPath 是完整的
+  const rootName = state.rootPath.split(separator).pop() || state.rootPath;
+  
+  const rootNode = {
+    name: rootName,
+    path: state.rootPath,
+    type: "directory"
+  };
+
+  handleMenuClick({ key }, rootNode);
+};
+
 const handleModalOk = async () => {
   if (!modalInputValue.value) {
     message.warning("请输入内容");
@@ -493,10 +524,8 @@ const handleModalOk = async () => {
 }
 
 :deep(.ant-dropdown-trigger) {
-  display: flex;
   flex: 1;
   min-width: 0;
-  align-items: center;
 }
 
 :deep(.ant-tree-node-content-wrapper:hover) {