From 763af5c37e52834de566e30fb26f8ab41aa615b6 Mon Sep 17 00:00:00 2001
From: shenmo <jifengshenmo@outlook.com>
Date: Sun, 12 Apr 2026 22:02:01 +0800
Subject: [PATCH] =?UTF-8?q?feat(update-center):=20=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E5=85=A8=E9=80=89=E5=8A=9F=E8=83=BD=E5=8F=8A=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加全选复选框组件及相关状态管理逻辑
实现全选/取消全选功能
添加部分选中状态显示
更新工具栏组件以支持新功能
---
 src/components/UpdateCenterModal.vue          |  3 ++
 .../update-center/UpdateCenterList.vue        |  2 +-
 .../update-center/UpdateCenterToolbar.vue     | 33 +++++++++++++++++++
 src/modules/updateCenter.ts                   | 29 ++++++++++++++++
 4 files changed, 66 insertions(+), 1 deletion(-)

diff --git a/src/components/UpdateCenterModal.vue b/src/components/UpdateCenterModal.vue
index 0bd8372c..c65aa62d 100644
--- a/src/components/UpdateCenterModal.vue
+++ b/src/components/UpdateCenterModal.vue
@@ -20,9 +20,12 @@
         <UpdateCenterToolbar
           :search-query="store.searchQuery.value"
           :selected-count="selectedCount"
+          :all-selected="store.allSelected.value"
+          :some-selected="store.someSelected.value"
           @refresh="store.refresh"
           @start-selected="emit('request-start-selected')"
           @request-close="store.requestClose"
+          @toggle-select-all="store.toggleSelectAll"
           @update:search-query="emit('update:search-query', $event)"
         />
 
diff --git a/src/components/update-center/UpdateCenterList.vue b/src/components/update-center/UpdateCenterList.vue
index f85ce2aa..99b11bc4 100644
--- a/src/components/update-center/UpdateCenterList.vue
+++ b/src/components/update-center/UpdateCenterList.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="min-h-0 overflow-y-auto overscroll-contain border-r border-slate-200/70 p-6 dark:border-slate-800/70"
+    class="min-h-0 overflow-y-auto overscroll-contain scrollbar-muted border-r border-slate-200/70 p-6 dark:border-slate-800/70"
   >
     <div
       v-if="items.length === 0"
diff --git a/src/components/update-center/UpdateCenterToolbar.vue b/src/components/update-center/UpdateCenterToolbar.vue
index 5480d935..edae6529 100644
--- a/src/components/update-center/UpdateCenterToolbar.vue
+++ b/src/components/update-center/UpdateCenterToolbar.vue
@@ -40,6 +40,22 @@
       </div>
     </div>
 
+    <div class="flex items-center gap-3">
+      <label class="inline-flex cursor-pointer items-center gap-2 select-none">
+        <input
+          ref="selectAllRef"
+          type="checkbox"
+          class="h-4 w-4 rounded border-slate-300 accent-brand focus:ring-brand"
+          :checked="allSelected"
+          @change="$emit('toggle-select-all')"
+        />
+        <span class="text-sm font-medium text-slate-700 dark:text-slate-200">全选</span>
+      </label>
+      <span class="text-sm text-slate-400 dark:text-slate-500">
+        已选 {{ selectedCount }} 项
+      </span>
+    </div>
+
     <label class="block">
       <span class="sr-only">搜索更新</span>
       <input
@@ -54,18 +70,35 @@
 </template>
 
 <script setup lang="ts">
+import { ref, watch } from "vue";
+
 const props = defineProps<{
   searchQuery: string;
   selectedCount: number;
+  allSelected: boolean;
+  someSelected: boolean;
 }>();
 
 const emit = defineEmits<{
   (e: "refresh"): void;
   (e: "start-selected"): void;
   (e: "request-close"): void;
+  (e: "toggle-select-all"): void;
   (e: "update:search-query", value: string): void;
 }>();
 
+const selectAllRef = ref<HTMLInputElement | null>(null);
+
+watch(
+  [() => props.someSelected, () => props.allSelected],
+  () => {
+    if (selectAllRef.value) {
+      selectAllRef.value.indeterminate = props.someSelected && !props.allSelected;
+    }
+  },
+  { flush: "post" },
+);
+
 const handleInput = (event: Event): void => {
   const target = event.target as HTMLInputElement | null;
   emit("update:search-query", target?.value ?? props.searchQuery);
diff --git a/src/modules/updateCenter.ts b/src/modules/updateCenter.ts
index ba129bff..c2b2ec7b 100644
--- a/src/modules/updateCenter.ts
+++ b/src/modules/updateCenter.ts
@@ -23,11 +23,14 @@ export interface UpdateCenterStore {
   selectedTaskKeys: Ref<Set<string>>;
   snapshot: Ref<UpdateCenterSnapshot>;
   filteredItems: ComputedRef<UpdateCenterItem[]>;
+  allSelected: ComputedRef<boolean>;
+  someSelected: ComputedRef<boolean>;
   bind: () => void;
   unbind: () => void;
   open: () => Promise<void>;
   refresh: () => Promise<void>;
   toggleSelection: (taskKey: string) => void;
+  toggleSelectAll: () => void;
   getSelectedItems: () => UpdateCenterItem[];
   closeNow: () => void;
   startSelected: () => Promise<void>;
@@ -74,11 +77,25 @@ export const createUpdateCenterStore = (): UpdateCenterStore => {
     snapshot.value = nextSnapshot;
   };
 
+  const selectableItems = computed(() =>
+    snapshot.value.items.filter((item) => item.ignored !== true),
+  );
+
   const filteredItems = computed(() => {
     const query = searchQuery.value.trim();
     return snapshot.value.items.filter((item) => matchesSearch(item, query));
   });
 
+  const allSelected = computed(() => {
+    const selectable = selectableItems.value;
+    return selectable.length > 0 && selectable.every((item) => selectedTaskKeys.value.has(item.taskKey));
+  });
+
+  const someSelected = computed(() => {
+    const selectable = selectableItems.value;
+    return selectable.length > 0 && selectable.some((item) => selectedTaskKeys.value.has(item.taskKey));
+  });
+
   const handleState = (nextSnapshot: UpdateCenterSnapshot): void => {
     applySnapshot(nextSnapshot);
   };
@@ -133,6 +150,15 @@ export const createUpdateCenterStore = (): UpdateCenterStore => {
     selectedTaskKeys.value = nextSelection;
   };
 
+  const toggleSelectAll = (): void => {
+    const selectable = selectableItems.value;
+    if (allSelected.value) {
+      selectedTaskKeys.value = new Set();
+    } else {
+      selectedTaskKeys.value = new Set(selectable.map((item) => item.taskKey));
+    }
+  };
+
   const getSelectedItems = (): UpdateCenterItem[] => {
     return snapshot.value.items.filter(
       (item) =>
@@ -217,11 +243,14 @@ export const createUpdateCenterStore = (): UpdateCenterStore => {
     selectedTaskKeys,
     snapshot,
     filteredItems,
+    allSelected,
+    someSelected,
     bind,
     unbind,
     open,
     refresh,
     toggleSelection,
+    toggleSelectAll,
     getSelectedItems,
     closeNow,
     startSelected,