From bea979f9b4bbecbae04f8950bb25460438919e7f Mon Sep 17 00:00:00 2001
From: cfq <cfq@qq.com>
Date: Tue, 27 Jan 2026 17:13:43 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=BC=BA=E5=8E=86=E5=8F=B2?=
 =?UTF-8?q?=E7=9B=AE=E5=BD=95=E9=80=89=E6=8B=A9=E5=BC=B9=E7=AA=97=E7=9A=84?=
 =?UTF-8?q?=E4=BA=A4=E4=BA=92=E4=BD=93=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加删除历史目录功能，支持从历史记录中移除特定路径
- 优化历史目录列表的视觉呈现，添加文件夹图标和悬停效果
- 增加空状态提示，当无历史记录时显示友好信息
- 调整弹窗宽度为600px以提供更好的空间展示长路径
- 使用更紧凑的列表项布局，提升信息密度和可操作性
---
 src/App.vue | 84 +++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 78 insertions(+), 6 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index e94754b..06f5dbe 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -10,7 +10,7 @@ import { useFileTree } from "./composables/useFileTree";
 import { useConfig } from "./composables/useConfig";
 import { useTheme } from "./composables/useTheme";
 import { ConfigProvider } from 'ant-design-vue';
-import { SettingOutlined } from '@ant-design/icons-vue';
+import { SettingOutlined, DeleteOutlined, FolderOpenOutlined } from '@ant-design/icons-vue';
 
 const { setRootPath } = useFileTree();
 const { loadConfig } = useConfig();
@@ -222,6 +222,14 @@ const handleSelectDirectory = async () => {
     }
 };
 
+const removeHistoryDir = async (path) => {
+  const index = historyDirs.value.indexOf(path);
+  if (index > -1) {
+    historyDirs.value.splice(index, 1);
+    await saveGlobalConfig();
+  }
+};
+
 const handleHistorySelect = (path) => {
   openDirectory(path);
   showHistory.value = false;
@@ -313,12 +321,25 @@ const { state } = useFileTree(); // 需要获取 rootPath 用于保存
       </a-modal>
 
       <!-- 历史记录弹窗 -->
-      <a-modal v-model:open="showHistory" title="选择历史目录" :footer="null">
-        <a-list :data-source="historyDirs">
+      <a-modal v-model:open="showHistory" title="选择历史目录" :footer="null" width="600px">
+        <div v-if="historyDirs.length === 0" class="empty-history">
+          暂无历史记录
+        </div>
+        <a-list v-else :data-source="historyDirs" size="small" :split="false">
           <template #renderItem="{ item }">
-            <a-list-item>
-              <a-button type="link" @click="handleHistorySelect(item)">
-                {{ item }}
+            <a-list-item class="history-item">
+              <div class="history-content" @click="handleHistorySelect(item)">
+                <FolderOpenOutlined class="history-icon" />
+                <span class="history-text" :title="item">{{ item }}</span>
+              </div>
+              <a-button 
+                type="text" 
+                danger 
+                size="small"
+                class="delete-btn"
+                @click.stop="removeHistoryDir(item)"
+              >
+                <DeleteOutlined />
               </a-button>
             </a-list-item>
           </template>
@@ -419,4 +440,55 @@ const { state } = useFileTree(); // 需要获取 rootPath 用于保存
   border-color: var(--text-color);
   box-shadow: 0 0 0 2px var(--primary-color-bg);
 }
+
+.history-item {
+  padding: 4px 8px !important;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.history-item:hover {
+  background-color: rgba(0, 0, 0, 0.04);
+}
+
+.history-content {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  overflow: hidden;
+  margin-right: 8px;
+}
+
+.history-icon {
+  margin-right: 8px;
+  color: var(--primary-color, #1890ff);
+  font-size: 16px;
+  flex-shrink: 0;
+}
+
+.history-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--text-color);
+}
+
+.delete-btn {
+  opacity: 0;
+  transition: opacity 0.2s;
+}
+
+.history-item:hover .delete-btn {
+  opacity: 1;
+}
+
+.empty-history {
+  text-align: center;
+  padding: 40px 0;
+  color: #999;
+}
 </style>