From f8ee1df96cd40fb60aa6eeda80cdd0ce2dbeab68 Mon Sep 17 00:00:00 2001
From: Wenjie Zhang <xerrors@163.com>
Date: Fri, 2 Jan 2026 15:02:04 +0800
Subject: [PATCH] =?UTF-8?q?feat(FileTable):=20=E6=B7=BB=E5=8A=A0=E5=A4=9A?=
 =?UTF-8?q?=E9=80=89=E6=A8=A1=E5=BC=8F=E5=88=87=E6=8D=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加多选按钮用于切换表格的选择模式，当退出多选模式时清空已选项
---
 web/src/components/FileTable.vue | 29 ++++++++++++++++++++++++++---
 1 file changed, 26 insertions(+), 3 deletions(-)

diff --git a/web/src/components/FileTable.vue b/web/src/components/FileTable.vue
index 8dd2a31b..62cbe15a 100644
--- a/web/src/components/FileTable.vue
+++ b/web/src/components/FileTable.vue
@@ -33,6 +33,14 @@
           title="刷新"
           class="panel-action-btn"
         />
+        <a-button
+          type="text"
+          @click="toggleSelectionMode"
+          :icon="h(CheckSquare)"
+          title="多选"
+          class="panel-action-btn"
+          :class="{ 'active': isSelectionMode }"
+        />
         <!-- <a-button
           @click="toggleAutoRefresh"
           size="small"
@@ -130,11 +138,11 @@
         :pagination="paginationCompact"
         v-model:expandedRowKeys="expandedRowKeys"
         :custom-row="customRow"
-        :row-selection="{
+        :row-selection="isSelectionMode ? {
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
           getCheckboxProps: getCheckboxProps
-        }"
+        } : null"
         :locale="{
           emptyText: emptyText
         }">
@@ -230,6 +238,7 @@ import {
   ChevronLast,
   Ellipsis,
   FolderPlus,
+  CheckSquare,
 } from 'lucide-vue-next';
 
 const store = useDatabaseStore();
@@ -259,6 +268,8 @@ const selectedRowKeys = computed({
   set: (keys) => store.selectedRowKeys = keys,
 });
 
+const isSelectionMode = ref(false);
+
 const expandedRowKeys = ref([]);
 
 // 新建文件夹相关
@@ -288,6 +299,13 @@ const toggleExpand = (record) => {
   }
 };
 
+const toggleSelectionMode = () => {
+  isSelectionMode.value = !isSelectionMode.value;
+  if (!isSelectionMode.value) {
+    selectedRowKeys.value = [];
+  }
+};
+
 const handleCreateFolder = async () => {
   if (!newFolderName.value.trim()) {
     message.warning('请输入文件夹名称');
@@ -863,7 +881,7 @@ import ChunkParamsConfig from '@/components/ChunkParamsConfig.vue';
 .panel-actions {
   display: flex;
   align-items: center;
-  gap: 6px;
+  gap: 0px;
 
   .action-searcher {
     width: 120px;
@@ -1030,6 +1048,11 @@ import ChunkParamsConfig from '@/components/ChunkParamsConfig.vue';
   /* border: 1px solid var(--main-100); */
 }
 
+.panel-action-btn.active {
+  color: var(--main-color);
+  background-color: var(--main-10);
+}
+
 .action-trigger-btn {
   padding: 0;
   width: 24px;