From 70a0adc6076f9141ed30598b0744671b3d65ec34 Mon Sep 17 00:00:00 2001
From: Ling0402 <cjy081219@Gmail.com>
Date: Sun, 14 Jun 2026 15:27:05 +0800
Subject: [PATCH 1/6] =?UTF-8?q?refactor:=20=E6=B8=85=E7=90=86=E9=87=8D?=
 =?UTF-8?q?=E5=A4=8D=E4=BB=A3=E7=A0=81=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. 按钮 -> Tooltip
2. DeviceSnapshotGroups 被“去业务化”
3. useDevicePlus 删除两个功能
4. HomeSnapshotGroups 删除重复“查看”
5. useHomePlus
6. Router 清理
---
 src/components/ActionCard.vue                 | 19 +++++---
 .../plus/device/DeviceSnapshotGroups.vue      | 38 ++++++++++------
 .../plus/home/HomeSnapshotGroups.vue          | 12 +----
 src/composables/plus/useDevicePlus.ts         | 45 -------------------
 src/composables/plus/useHomePlus.ts           | 15 -------
 src/router.ts                                 |  4 +-
 src/views/DevicePage.vue                      |  2 +
 src/views/plus/DevicePage.vue                 | 11 ++++-
 src/views/plus/SelectorPage.vue               |  7 ---
 src/views/plus/SvgPage.vue                    |  7 ---
 .../plus/__tests__/adapter.contract.test.ts   |  6 +++
 11 files changed, 58 insertions(+), 108 deletions(-)
 delete mode 100644 src/views/plus/SelectorPage.vue
 delete mode 100644 src/views/plus/SvgPage.vue

diff --git a/src/components/ActionCard.vue b/src/components/ActionCard.vue
index 104006ce..5168b058 100644
--- a/src/components/ActionCard.vue
+++ b/src/components/ActionCard.vue
@@ -105,13 +105,18 @@ const copy = async (content: string) => {
 </script>
 <template>
   <div flex gap-16px>
-    <a v-if="showPreview" flex target="_blank" :href="previewUrl">
-      <NButton text title="查看">
-        <template #icon>
-          <SvgIcon name="code" />
-        </template>
-      </NButton>
-    </a>
+    <NTooltip v-if="showPreview">
+      <template #trigger>
+        <a flex target="_blank" :href="previewUrl">
+          <NButton text>
+            <template #icon>
+              <SvgIcon name="code" />
+            </template>
+          </NButton>
+        </a>
+      </template>
+      查看
+    </NTooltip>
 
     <NPopover v-if="showExport">
       <template #trigger>
diff --git a/src/components/plus/device/DeviceSnapshotGroups.vue b/src/components/plus/device/DeviceSnapshotGroups.vue
index cdd105e0..3d6291de 100644
--- a/src/components/plus/device/DeviceSnapshotGroups.vue
+++ b/src/components/plus/device/DeviceSnapshotGroups.vue
@@ -8,6 +8,14 @@ const props = defineProps<{
   snapshots: Snapshot[];
   checkedRowKeys: number[];
   refreshSnapshots: () => Promise<void>;
+  previewSnapshot: {
+    loading: Record<number, boolean | undefined>;
+    invoke: (row: Snapshot) => unknown;
+  };
+  deleteSnapshot: {
+    loading: Record<number, boolean | undefined>;
+    invoke: (row: Snapshot) => unknown;
+  };
 }>();
 
 const emit = defineEmits<{
@@ -29,12 +37,10 @@ const {
   previewUrlMap,
   previewLoadingMap,
   previewErrorMap,
-  previewSnapshot,
   downloadSnapshotZip,
   downloadSnapshotImage,
   shareSnapshotZipUrl,
   shareSnapshotImageUrl,
-  deleteSnapshot,
   ensurePreview,
   getGroupSnapshotIds,
   getActivitySnapshotIds,
@@ -230,15 +236,21 @@ const {
                       </div>
                     </div>
                   </NPopover>
-                  <NButton
-                    text
-                    size="small"
-                    class="ml-auto shrink-0"
-                    :loading="previewSnapshot.loading[item.id]"
-                    @click="previewSnapshot.invoke(item)"
-                  >
-                    <template #icon><SvgIcon name="code" /></template>
-                  </NButton>
+                  <NTooltip>
+                    <template #trigger>
+                      <span class="ml-auto inline-flex shrink-0">
+                        <NButton
+                          text
+                          size="small"
+                          :loading="props.previewSnapshot.loading[item.id]"
+                          @click="props.previewSnapshot.invoke(item)"
+                        >
+                          <template #icon><SvgIcon name="code" /></template>
+                        </NButton>
+                      </span>
+                    </template>
+                    查看
+                  </NTooltip>
                   <NPopover>
                     <template #trigger>
                       <NButton text>
@@ -287,8 +299,8 @@ const {
                         <NButton
                           text
                           type="error"
-                          :loading="deleteSnapshot.loading[item.id]"
-                          @click="deleteSnapshot.invoke(item)"
+                          :loading="props.deleteSnapshot.loading[item.id]"
+                          @click="props.deleteSnapshot.invoke(item)"
                         >
                           <template #icon><SvgIcon name="delete" /></template>
                         </NButton>
diff --git a/src/components/plus/home/HomeSnapshotGroups.vue b/src/components/plus/home/HomeSnapshotGroups.vue
index ef47681a..39864604 100644
--- a/src/components/plus/home/HomeSnapshotGroups.vue
+++ b/src/components/plus/home/HomeSnapshotGroups.vue
@@ -2,7 +2,6 @@
 import { computed, toRef } from 'vue';
 import ActionCard from '@/components/ActionCard.vue';
 import DeviceControlTools from '@/components/plus/device/DeviceControlTools.vue';
-import SvgIcon from '@/components/SvgIcon.vue';
 import { useHomePlus } from '@/composables/plus/useHomePlus';
 
 const props = defineProps<{
@@ -50,7 +49,6 @@ const {
   getActivityRemarkKey,
   openGroupRemarkModal,
   saveGroupRemark,
-  goToSnapshot,
   getItemShortTimeText,
   getItemCreateTimeText,
   getItemImportTimeText,
@@ -317,17 +315,9 @@ const {
                         </div>
                       </div>
                     </NPopover>
-                    <NButton
-                      text
-                      size="small"
-                      class="ml-auto shrink-0"
-                      @click="goToSnapshot(item.id)"
-                    >
-                      <template #icon><SvgIcon name="code" /></template>
-                    </NButton>
                     <ActionCard
+                      class="ml-auto shrink-0"
                       :snapshot="item"
-                      :showPreview="false"
                       :onDelete="updateSnapshots"
                     />
                   </div>
diff --git a/src/composables/plus/useDevicePlus.ts b/src/composables/plus/useDevicePlus.ts
index e541db1f..2f26c358 100644
--- a/src/composables/plus/useDevicePlus.ts
+++ b/src/composables/plus/useDevicePlus.ts
@@ -32,7 +32,6 @@ export function useDevicePlus(options: UseDevicePlusOptions) {
   type SnapshotGroup = ReturnType<typeof buildGroupedSnapshots>[number];
   type SnapshotActivity = SnapshotGroup['activities'][number];
 
-  const router = useRouter();
   const { settingsStore, snapshotImportTime, snapshotViewedTime } =
     useStorageStore();
   const deviceLink = useStorage('device_link', '');
@@ -137,20 +136,6 @@ export function useDevicePlus(options: UseDevicePlusOptions) {
       cacheLimit: previewCacheLimit,
     });
 
-  const previewSnapshot = useBatchTask(
-    async (row: Snapshot) => {
-      await ensureLocalSnapshotData(row);
-      snapshotViewedTime[row.id] = Date.now();
-      window.open(
-        router.resolve({
-          name: 'snapshot',
-          params: { snapshotId: row.id },
-        }).href,
-      );
-    },
-    (row) => row.id,
-  );
-
   const downloadSnapshotZip = useBatchTask(
     async (row: Snapshot) => {
       await ensureLocalSnapshotData(row);
@@ -196,34 +181,6 @@ export function useDevicePlus(options: UseDevicePlusOptions) {
     (row) => row.id,
   );
 
-  const deleteSnapshot = useBatchTask(
-    async (row: Snapshot) => {
-      await new Promise((resolve, reject) => {
-        dialog.warning({
-          title: '删除',
-          content: '是否删除此快照？',
-          negativeText: '取消',
-          positiveText: '确认',
-          onClose: reject,
-          onEsc: reject,
-          onMaskClick: reject,
-          onNegativeClick: reject,
-          onPositiveClick: resolve,
-        });
-      });
-
-      await api.deleteSnapshot({ id: row.id });
-      await snapshotStorage.removeItem(row.id);
-      await screenshotStorage.removeItem(row.id);
-      message.success('快照删除成功');
-      await options.refreshSnapshots();
-      options.checkedRowKeys.value = options.checkedRowKeys.value.filter(
-        (id) => id !== row.id,
-      );
-    },
-    (row) => row.id,
-  );
-
   const batchDelete = useTask(async () => {
     await new Promise((resolve, reject) => {
       dialog.warning({
@@ -290,12 +247,10 @@ export function useDevicePlus(options: UseDevicePlusOptions) {
     previewUrlMap,
     previewLoadingMap,
     previewErrorMap,
-    previewSnapshot,
     downloadSnapshotZip,
     downloadSnapshotImage,
     shareSnapshotZipUrl,
     shareSnapshotImageUrl,
-    deleteSnapshot,
     ensurePreview,
     getGroupSnapshotIds,
     getActivitySnapshotIds,
diff --git a/src/composables/plus/useHomePlus.ts b/src/composables/plus/useHomePlus.ts
index b8dea54a..55d389d5 100644
--- a/src/composables/plus/useHomePlus.ts
+++ b/src/composables/plus/useHomePlus.ts
@@ -3,7 +3,6 @@ import { computed, shallowReactive, shallowRef, toValue, watch } from 'vue';
 import type { MaybeRefOrGetter, Ref } from 'vue';
 import { usePreviewCache } from '@/composables/plus/usePreviewCache';
 import { getAppInfo, getDevice } from '@/utils/node';
-import { filterQuery } from '@/utils/others';
 import { buildGroupedSnapshots } from '@/utils/plus/snapshotGroup';
 import { screenshotStorage } from '@/utils/snapshot';
 
@@ -13,8 +12,6 @@ interface UseHomePlusOptions {
 }
 
 export function useHomePlus(options: UseHomePlusOptions) {
-  const route = useRoute();
-  const router = useRouter();
   const { settingsStore, snapshotImportTime, snapshotViewedTime } =
     useStorageStore();
 
@@ -196,17 +193,6 @@ export function useHomePlus(options: UseHomePlusOptions) {
       cacheLimit: previewCacheLimit,
     });
 
-  const goToSnapshot = (snapshotId: number) => {
-    snapshotViewedTime[snapshotId] = Date.now();
-    window.open(
-      router.resolve({
-        name: 'snapshot',
-        params: { snapshotId },
-        query: filterQuery(route.query, ['str', 'gkd']),
-      }).href,
-    );
-  };
-
   const getItemShortTimeText = (item: Snapshot) =>
     dayjs(item.id).format('MM-DD HH:mm:ss');
   const getItemCreateTimeText = (item: Snapshot) =>
@@ -245,7 +231,6 @@ export function useHomePlus(options: UseHomePlusOptions) {
     getActivityRemarkKey,
     openGroupRemarkModal,
     saveGroupRemark,
-    goToSnapshot,
     getItemShortTimeText,
     getItemCreateTimeText,
     getItemImportTimeText,
diff --git a/src/router.ts b/src/router.ts
index 94591b5d..c9501253 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -97,12 +97,12 @@ const router = createRouter({
     },
     {
       path: '/selector',
-      component: recordModule(() => import('@/views/plus/SelectorPage.vue')),
+      component: recordModule(() => import('@/views/SelectorPage.vue')),
       meta: { title: '选择器' },
     },
     {
       path: '/svg',
-      component: recordModule(() => import('@/views/plus/SvgPage.vue')),
+      component: recordModule(() => import('@/views/SvgPage.vue')),
       meta: { title: 'SVG' },
     },
     {
diff --git a/src/views/DevicePage.vue b/src/views/DevicePage.vue
index 7efbdada..49633cc8 100644
--- a/src/views/DevicePage.vue
+++ b/src/views/DevicePage.vue
@@ -534,6 +534,8 @@ const placeholder = `
       :pagination="pagination"
       :handleSorterChange="handleSorterChange"
       :refreshSnapshots="refreshSnapshots"
+      :previewSnapshot="previewSnapshot"
+      :deleteSnapshot="deleteSnapshot"
     >
       <NDataTable
         striped
diff --git a/src/views/plus/DevicePage.vue b/src/views/plus/DevicePage.vue
index 7aaa8baa..cdc9bf21 100644
--- a/src/views/plus/DevicePage.vue
+++ b/src/views/plus/DevicePage.vue
@@ -65,11 +65,20 @@ const checkedRowKeys = shallowRef<number[]>([]);
       </NTooltip>
     </template>
 
-    <template #content="{ snapshots, refreshSnapshots }">
+    <template
+      #content="{
+        snapshots,
+        refreshSnapshots,
+        previewSnapshot,
+        deleteSnapshot,
+      }"
+    >
       <DeviceSnapshotGroups
         v-model:checked-row-keys="checkedRowKeys"
         :snapshots="snapshots"
         :refresh-snapshots="refreshSnapshots"
+        :preview-snapshot="previewSnapshot"
+        :delete-snapshot="deleteSnapshot"
       />
     </template>
   </BaseDevicePage>
diff --git a/src/views/plus/SelectorPage.vue b/src/views/plus/SelectorPage.vue
deleted file mode 100644
index 6d3dafad..00000000
--- a/src/views/plus/SelectorPage.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<script setup lang="ts">
-import BaseSelectorPage from '@/views/SelectorPage.vue';
-</script>
-
-<template>
-  <BaseSelectorPage />
-</template>
diff --git a/src/views/plus/SvgPage.vue b/src/views/plus/SvgPage.vue
deleted file mode 100644
index 069128b6..00000000
--- a/src/views/plus/SvgPage.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<script setup lang="ts">
-import BaseSvgPage from '@/views/SvgPage.vue';
-</script>
-
-<template>
-  <BaseSvgPage />
-</template>
diff --git a/src/views/plus/__tests__/adapter.contract.test.ts b/src/views/plus/__tests__/adapter.contract.test.ts
index 8467e5ed..f142727e 100644
--- a/src/views/plus/__tests__/adapter.contract.test.ts
+++ b/src/views/plus/__tests__/adapter.contract.test.ts
@@ -34,6 +34,8 @@ vi.mock('@/views/DevicePage.vue', () => ({
     setup(_, { slots }) {
       const captureSnapshot = { loading: false, invoke: vi.fn() };
       const downloadAllSnapshot = { loading: false, invoke: vi.fn() };
+      const previewSnapshot = { loading: {}, invoke: vi.fn() };
+      const deleteSnapshot = { loading: {}, invoke: vi.fn() };
       return () =>
         h('section', { 'data-testid': 'base-device-page' }, [
           h(
@@ -50,6 +52,8 @@ vi.mock('@/views/DevicePage.vue', () => ({
             slots.content?.({
               snapshots: [{ id: 10 }, { id: 20 }],
               refreshSnapshots: spies.refreshSnapshots,
+              previewSnapshot,
+              deleteSnapshot,
             }),
           ),
         ]);
@@ -97,6 +101,8 @@ vi.mock('@/components/plus/device/DeviceSnapshotGroups.vue', () => ({
       checkedRowKeys: { type: Array, required: true },
       snapshots: { type: Array, required: true },
       refreshSnapshots: { type: Function, required: true },
+      previewSnapshot: { type: Object, required: true },
+      deleteSnapshot: { type: Object, required: true },
     },
     emits: ['update:checkedRowKeys'],
     setup(props, { emit }) {

From e5a0e664435dc065b748e52cdaa85f90232b52be Mon Sep 17 00:00:00 2001
From: Ling0402 <cjy081219@Gmail.com>
Date: Sun, 14 Jun 2026 16:06:19 +0800
Subject: [PATCH 2/6] =?UTF-8?q?test:=20=E9=9D=99=E6=80=81=E6=B5=8B?=
 =?UTF-8?q?=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |   5 +
 src/test/setup.ts                             | 200 ++++++++++++++++++
 src/test/utils.ts                             | 183 ++++++++++++++++
 src/types/plus/index.d.ts                     |   2 +-
 .../plus/__tests__/adapter.contract.test.ts   |  94 ++++----
 vitest.config.ts                              |  69 ++++--
 6 files changed, 475 insertions(+), 78 deletions(-)
 create mode 100644 src/test/setup.ts
 create mode 100644 src/test/utils.ts

diff --git a/package.json b/package.json
index b64f621c..de17bea0 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,11 @@
     "build-only": "vite build",
     "test": "vitest",
     "test:run": "vitest run",
+    "test:watch": "vitest watch",
+    "test:coverage": "vitest run --coverage",
+    "test:report": "vitest run --reporter=junit --reporter=verbose",
+    "test:ui": "vitest --ui",
+    "test:debug": "vitest run --inspect-brk",
     "type-check": "vue-tsc --noEmit",
     "lint": "eslint --cache --fix .",
     "format": "prettier --cache --write --ignore-unknown .",
diff --git a/src/test/setup.ts b/src/test/setup.ts
new file mode 100644
index 00000000..c5904fd3
--- /dev/null
+++ b/src/test/setup.ts
@@ -0,0 +1,200 @@
+/* eslint-disable vue/one-component-per-file */
+import { vi } from 'vitest';
+import { defineComponent, h } from 'vue';
+
+globalThis.console = {
+  ...console,
+  warn: vi.fn(),
+  error: vi.fn(),
+};
+
+vi.mock('@/components/SvgIcon.vue', () => ({
+  default: defineComponent({
+    name: 'SvgIconStub',
+    props: {
+      name: { type: String, required: true },
+    },
+    setup(props: { name: string }) {
+      return () => h('span', { 'data-testid': `svg-${props.name}` });
+    },
+  }),
+}));
+
+vi.mock('naive-ui', () => ({
+  NTooltip: defineComponent({
+    name: 'NTooltipStub',
+    setup(
+      _: unknown,
+      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+    ) {
+      return () => h('div', [slots.trigger?.(), slots.default?.()]);
+    },
+  }),
+  NButton: defineComponent({
+    name: 'NButtonStub',
+    emits: ['click'],
+    setup(
+      _: unknown,
+      {
+        emit,
+        slots,
+      }: {
+        emit: (e: string) => void;
+        slots: Record<string, () => ReturnType<typeof h>>;
+      },
+    ) {
+      return () =>
+        h(
+          'button',
+          {
+            type: 'button',
+            onClick: () => emit('click'),
+          },
+          slots.default?.(),
+        );
+    },
+  }),
+  NModal: defineComponent({
+    name: 'NModalStub',
+    props: {
+      show: { type: Boolean, default: false },
+    },
+    setup(
+      _: unknown,
+      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+    ) {
+      return () => h('div', { 'data-testid': 'modal' }, slots.default?.());
+    },
+  }),
+  NSpin: defineComponent({
+    name: 'NSpinStub',
+    setup(
+      _: unknown,
+      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+    ) {
+      return () => h('div', { 'data-testid': 'spin' }, slots.default?.());
+    },
+  }),
+  NSpace: defineComponent({
+    name: 'NSpaceStub',
+    setup(
+      _: unknown,
+      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+    ) {
+      return () => h('div', { 'data-testid': 'space' }, slots.default?.());
+    },
+  }),
+  NCheckbox: defineComponent({
+    name: 'NCheckboxStub',
+    props: {
+      modelValue: { type: Boolean, default: false },
+    },
+    emits: ['update:modelValue'],
+    setup(
+      props: { modelValue: boolean },
+      { emit }: { emit: (e: string, v: boolean) => void },
+    ) {
+      return () =>
+        h('input', {
+          type: 'checkbox',
+          checked: props.modelValue,
+          onChange: (e: Event) =>
+            emit('update:modelValue', (e.target as HTMLInputElement).checked),
+        });
+    },
+  }),
+  NInput: defineComponent({
+    name: 'NInputStub',
+    props: {
+      modelValue: { type: String, default: '' },
+    },
+    emits: ['update:modelValue'],
+    setup(
+      props: { modelValue: string },
+      { emit }: { emit: (e: string, v: string) => void },
+    ) {
+      return () =>
+        h('input', {
+          type: 'text',
+          value: props.modelValue,
+          onChange: (e: Event) =>
+            emit('update:modelValue', (e.target as HTMLInputElement).value),
+        });
+    },
+  }),
+  NSelect: defineComponent({
+    name: 'NSelectStub',
+    props: {
+      modelValue: { type: [String, Number], default: '' },
+      options: {
+        type: Array,
+        default: () => [] as Array<{ label: string; value: string }>,
+      },
+    },
+    emits: ['update:modelValue'],
+    setup(
+      props: {
+        modelValue: string | number;
+        options: Array<{ label: string; value: string }>;
+      },
+      { emit }: { emit: (e: string, v: string) => void },
+    ) {
+      return () =>
+        h(
+          'select',
+          {
+            value: props.modelValue,
+            onChange: (e: Event) =>
+              emit('update:modelValue', (e.target as HTMLSelectElement).value),
+          },
+          props.options.map((option: { label: string; value: string }) =>
+            h('option', { value: option.value }, option.label),
+          ),
+        );
+    },
+  }),
+  NMessageProvider: defineComponent({
+    name: 'NMessageProviderStub',
+    setup(
+      _: unknown,
+      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+    ) {
+      return () =>
+        h('div', { 'data-testid': 'message-provider' }, slots.default?.());
+    },
+  }),
+  NDialogProvider: defineComponent({
+    name: 'NDialogProviderStub',
+    setup(
+      _: unknown,
+      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+    ) {
+      return () =>
+        h('div', { 'data-testid': 'dialog-provider' }, slots.default?.());
+    },
+  }),
+}));
+
+vi.mock('@vueuse/core', () => ({
+  useStorage: vi.fn(() => ({
+    value: '',
+  })),
+  useEventListener: vi.fn(),
+  useDebounceFn: vi.fn((fn: (...args: unknown[]) => void) => fn),
+}));
+
+vi.mock('@/store/global', () => ({
+  useGlobalStore: vi.fn(() => ({
+    ruleTest: {
+      enabled: false,
+      setEnabled: vi.fn(),
+    },
+  })),
+}));
+
+vi.mock('@/store/storage', () => ({
+  useStorageStore: vi.fn(() => ({
+    snapshots: [],
+    selectedSnapshotId: null,
+  })),
+}));
diff --git a/src/test/utils.ts b/src/test/utils.ts
new file mode 100644
index 00000000..38e49fbe
--- /dev/null
+++ b/src/test/utils.ts
@@ -0,0 +1,183 @@
+/* eslint-disable vue/one-component-per-file */
+import {
+  defineComponent,
+  h,
+  type Component,
+  type ComponentPublicInstance,
+  type DefineComponent,
+} from 'vue';
+import { mount, type MountingOptions } from '@vue/test-utils';
+import { expect, vi } from 'vitest';
+
+export const createStubComponent = (
+  name: string,
+  options: {
+    props?: string[];
+    slots?: string[];
+    emits?: string[];
+    render?: (props: Record<string, unknown>) => ReturnType<typeof h>;
+  },
+): DefineComponent => {
+  return defineComponent({
+    name: `${name}Stub`,
+    props: options.props,
+    emits: options.emits,
+    setup(
+      props: Record<string, unknown>,
+      {
+        slots,
+        emit,
+      }: {
+        slots: Record<string, () => ReturnType<typeof h>>;
+        emit: (e: string, ...args: unknown[]) => void;
+      },
+    ) {
+      const renderProps = {
+        ...props,
+        emit,
+      };
+      if (options.render) {
+        return options.render(renderProps);
+      }
+      return () =>
+        h(
+          'div',
+          {
+            'data-testid': name
+              .replace(/([A-Z])/g, '-$1')
+              .toLowerCase()
+              .slice(1),
+          },
+          slots.default?.(),
+        );
+    },
+  });
+};
+
+export const createMockFn = <T extends (...args: unknown[]) => unknown>(
+  mockImplementation?: T,
+) => {
+  return vi.fn(mockImplementation);
+};
+
+export const createSpies = <
+  T extends Record<string, (...args: unknown[]) => unknown>,
+>(
+  spyMap: T,
+): Record<keyof T, ReturnType<typeof vi.fn>> => {
+  const result: Record<string, ReturnType<typeof vi.fn>> = {};
+  for (const key in spyMap) {
+    result[key] = vi.fn(spyMap[key]);
+  }
+  return result as Record<keyof T, ReturnType<typeof vi.fn>>;
+};
+
+export const mountWithStubs = <T extends ComponentPublicInstance>(
+  component: Component,
+  options?: MountingOptions<T>,
+) => {
+  const defaultStubs = {
+    NTooltip: defineComponent({
+      name: 'NTooltipStub',
+      setup(
+        _: unknown,
+        { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
+      ) {
+        return () => h('div', [slots.trigger?.(), slots.default?.()]);
+      },
+    }),
+    NButton: defineComponent({
+      name: 'NButtonStub',
+      emits: ['click'],
+      setup(
+        _: unknown,
+        {
+          emit,
+          slots,
+        }: {
+          emit: (e: string) => void;
+          slots: Record<string, () => ReturnType<typeof h>>;
+        },
+      ) {
+        return () =>
+          h(
+            'button',
+            {
+              type: 'button',
+              onClick: () => emit('click'),
+            },
+            slots.default?.(),
+          );
+      },
+    }),
+    SvgIcon: defineComponent({
+      name: 'SvgIconStub',
+      props: ['name'],
+      setup(props: { name: string }) {
+        return () => h('span', { 'data-testid': `svg-${props.name}` });
+      },
+    }),
+  };
+
+  return mount(component, {
+    global: {
+      stubs: {
+        ...defaultStubs,
+        ...options?.global?.stubs,
+      },
+    },
+    ...options,
+  });
+};
+
+export const waitForComponentToMount = async (): Promise<void> => {
+  await new Promise((resolve) => setTimeout(resolve, 0));
+};
+
+export const triggerClick = async (
+  wrapper: ReturnType<typeof mount>,
+  selector: string,
+): Promise<void> => {
+  await wrapper.find(selector).trigger('click');
+};
+
+export const expectElementExists = (
+  wrapper: ReturnType<typeof mount>,
+  selector: string,
+  exists: boolean = true,
+): void => {
+  expect(wrapper.find(selector).exists()).toBe(exists);
+};
+
+export const expectElementText = (
+  wrapper: ReturnType<typeof mount>,
+  selector: string,
+  text: string | RegExp,
+): void => {
+  const element = wrapper.find(selector);
+  expect(element.exists()).toBe(true);
+  if (typeof text === 'string') {
+    expect(element.text()).toBe(text);
+  } else {
+    expect(element.text()).toMatch(text);
+  }
+};
+
+export const expectSpyCalled = (
+  spy: ReturnType<typeof vi.fn>,
+  times?: number,
+  ...args: unknown[]
+): void => {
+  if (times !== undefined) {
+    expect(spy).toHaveBeenCalledTimes(times);
+  }
+  if (args.length > 0) {
+    expect(spy).toHaveBeenCalledWith(...args);
+  } else {
+    expect(spy).toHaveBeenCalled();
+  }
+};
+
+export const expectSpyNotCalled = (spy: ReturnType<typeof vi.fn>): void => {
+  expect(spy).not.toHaveBeenCalled();
+};
diff --git a/src/types/plus/index.d.ts b/src/types/plus/index.d.ts
index 04909c34..85c1bcdf 100644
--- a/src/types/plus/index.d.ts
+++ b/src/types/plus/index.d.ts
@@ -7,7 +7,7 @@ type FastQueryIndicatorMeta = {
 
 declare module '@gkd-kit/selector' {
   // The generic parameter comes from the upstream declaration we are merging.
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
   interface QueryPath<T> {
     // Keep the selector path formatting hook in the Plus layer so base typings
     // stay close to upstream.
diff --git a/src/views/plus/__tests__/adapter.contract.test.ts b/src/views/plus/__tests__/adapter.contract.test.ts
index f142727e..3ca764a7 100644
--- a/src/views/plus/__tests__/adapter.contract.test.ts
+++ b/src/views/plus/__tests__/adapter.contract.test.ts
@@ -1,7 +1,7 @@
 /* eslint-disable vue/one-component-per-file */
-import { mount } from '@vue/test-utils';
 import { defineComponent, h } from 'vue';
 import { describe, expect, it, vi } from 'vitest';
+import { createStubComponent, mountWithStubs } from '@/test/utils';
 
 const spies = vi.hoisted(() => ({
   setCheckedRowKeys: vi.fn(),
@@ -11,7 +11,12 @@ const spies = vi.hoisted(() => ({
 vi.mock('@/views/home/HomePage.vue', () => ({
   default: defineComponent({
     name: 'BaseHomePageStub',
-    setup(_, { slots }) {
+    setup(
+      _: unknown,
+      {
+        slots,
+      }: { slots: Record<string, (props: unknown) => ReturnType<typeof h>> },
+    ) {
       return () =>
         h(
           'section',
@@ -31,7 +36,12 @@ vi.mock('@/views/home/HomePage.vue', () => ({
 vi.mock('@/views/DevicePage.vue', () => ({
   default: defineComponent({
     name: 'BaseDevicePageStub',
-    setup(_, { slots }) {
+    setup(
+      _: unknown,
+      {
+        slots,
+      }: { slots: Record<string, (props: unknown) => ReturnType<typeof h>> },
+    ) {
       const captureSnapshot = { loading: false, invoke: vi.fn() };
       const downloadAllSnapshot = { loading: false, invoke: vi.fn() };
       const previewSnapshot = { loading: {}, invoke: vi.fn() };
@@ -71,7 +81,15 @@ vi.mock('@/components/plus/home/HomeSnapshotGroups.vue', () => ({
       updateSnapshots: { type: Function, required: true },
     },
     emits: ['update:checkedRowKeys'],
-    setup(props, { emit }) {
+    setup(
+      props: {
+        checkedRowKeys: number[];
+        snapshots: Array<{ id: number }>;
+        loading: boolean;
+        updateSnapshots: () => void;
+      },
+      { emit }: { emit: (e: string, v: number[]) => void },
+    ) {
       return () =>
         h(
           'button',
@@ -86,12 +104,7 @@ vi.mock('@/components/plus/home/HomeSnapshotGroups.vue', () => ({
 }));
 
 vi.mock('@/components/plus/device/DeviceControlTools.vue', () => ({
-  default: defineComponent({
-    name: 'DeviceControlToolsStub',
-    setup() {
-      return () => h('div', { 'data-testid': 'device-control-tools' });
-    },
-  }),
+  default: createStubComponent('DeviceControlTools', {}),
 }));
 
 vi.mock('@/components/plus/device/DeviceSnapshotGroups.vue', () => ({
@@ -105,7 +118,16 @@ vi.mock('@/components/plus/device/DeviceSnapshotGroups.vue', () => ({
       deleteSnapshot: { type: Object, required: true },
     },
     emits: ['update:checkedRowKeys'],
-    setup(props, { emit }) {
+    setup(
+      props: {
+        checkedRowKeys: number[];
+        snapshots: Array<{ id: number }>;
+        refreshSnapshots: () => void;
+        previewSnapshot: unknown;
+        deleteSnapshot: unknown;
+      },
+      { emit }: { emit: (e: string, v: number[]) => void },
+    ) {
       return () =>
         h(
           'button',
@@ -125,58 +147,18 @@ vi.mock('@/components/plus/settings/SettingsModal.vue', () => ({
     props: {
       show: { type: Boolean, required: true },
     },
-    setup(props) {
+    setup(props: { show: boolean }) {
       return () =>
         h('div', { 'data-testid': 'settings-modal' }, `settings:${props.show}`);
     },
   }),
 }));
 
-vi.mock('@/components/SvgIcon.vue', () => ({
-  default: defineComponent({
-    name: 'SvgIconStub',
-    props: {
-      name: { type: String, required: true },
-    },
-    setup(props) {
-      return () => h('span', { 'data-testid': `svg-${props.name}` });
-    },
-  }),
-}));
-
-const globalStubs = {
-  NTooltip: defineComponent({
-    name: 'NTooltipStub',
-    setup(_, { slots }) {
-      return () => h('div', [slots.trigger?.(), slots.default?.()]);
-    },
-  }),
-  NButton: defineComponent({
-    name: 'NButtonStub',
-    emits: ['click'],
-    setup(_, { emit, slots }) {
-      return () =>
-        h(
-          'button',
-          {
-            type: 'button',
-            onClick: () => emit('click'),
-          },
-          slots.default?.(),
-        );
-    },
-  }),
-};
-
 describe('Plus route adapters', () => {
   it('wires HomePage content slot into the base home page', async () => {
     const { default: HomePage } =
       await import('@/views/plus/home/HomePage.vue');
-    const wrapper = mount(HomePage, {
-      global: {
-        stubs: globalStubs,
-      },
-    });
+    const wrapper = mountWithStubs(HomePage);
 
     expect(wrapper.find('[data-testid="base-home-page"]').exists()).toBe(true);
     expect(wrapper.get('[data-testid="home-snapshot-groups"]').text()).toBe(
@@ -189,11 +171,7 @@ describe('Plus route adapters', () => {
 
   it('wires DevicePage action and content slots into the base device page', async () => {
     const { default: DevicePage } = await import('@/views/plus/DevicePage.vue');
-    const wrapper = mount(DevicePage, {
-      global: {
-        stubs: globalStubs,
-      },
-    });
+    const wrapper = mountWithStubs(DevicePage);
 
     expect(wrapper.find('[data-testid="base-device-page"]').exists()).toBe(
       true,
diff --git a/vitest.config.ts b/vitest.config.ts
index 8db4eea0..46b85cf4 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -4,26 +4,57 @@ import process from 'node:process';
 import { defineConfig } from 'vitest/config';
 import unocss from 'unocss/vite';
 import data from 'unplugin-data/vite';
-import { unAutoImport } from './plugins';
+import autoImport from 'unplugin-auto-import/vite';
+import components from 'unplugin-vue-components/vite';
+import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';
 
-export default defineConfig(async () => {
-  return {
-    plugins: [
-      vue(),
-      vueJsx(),
-      unocss({ inspector: false }),
-      await unAutoImport(),
-      data(),
-    ],
-    resolve: {
-      alias: {
-        '@': process.cwd() + '/src',
-      },
+export default defineConfig({
+  plugins: [
+    vue(),
+    vueJsx(),
+    unocss({ inspector: false }),
+    data(),
+    autoImport({
+      dts: process.cwd() + '/auto-import.d.ts',
+      imports: ['vue', 'vue-router', '@vueuse/core'],
+      dirs: [process.cwd() + '/src/store/**'],
+    }),
+    components({
+      include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/],
+      dts: process.cwd() + '/auto-import-components.d.ts',
+      resolvers: [NaiveUiResolver()],
+      dirs: [],
+    }),
+  ],
+  resolve: {
+    alias: {
+      '@': process.cwd() + '/src',
     },
-    test: {
-      environment: 'happy-dom',
-      include: ['src/**/*.test.ts'],
-      testTimeout: 10000,
+  },
+  test: {
+    environment: 'happy-dom',
+    include: ['src/**/*.test.ts'],
+    exclude: ['node_modules', 'dist', '.git'],
+    testTimeout: 10000,
+    hookTimeout: 10000,
+    setupFiles: ['src/test/setup.ts'],
+    coverage: {
+      provider: 'v8',
+      reporter: ['text', 'json', 'html'],
+      exclude: [
+        'node_modules/',
+        'dist/',
+        '.git/',
+        '**/*.d.ts',
+        '**/main.ts',
+        '**/router.ts',
+        '**/store/*.ts',
+      ],
     },
-  };
+    globals: true,
+    passWithNoTests: true,
+    outputFile: {
+      junit: './test-results/junit.xml',
+    },
+  },
 });

From 6966462881bf76bdc19be100a95a8fcb85e62b73 Mon Sep 17 00:00:00 2001
From: Ling0402 <cjy081219@Gmail.com>
Date: Sun, 14 Jun 2026 16:48:06 +0800
Subject: [PATCH 3/6] =?UTF-8?q?fix:=20=E6=96=B0=E5=BB=BA=E6=A0=87=E7=AD=BE?=
 =?UTF-8?q?=E9=A1=B5=E5=AD=98=E5=9C=A8=E5=8F=8D=E5=90=91=E5=8A=AB=E6=8C=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

target="_blank" 缺少 rel，存在反向标签劫持风险。
---
 src/components/ActionCard.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ActionCard.vue b/src/components/ActionCard.vue
index 5168b058..c1ce2d9f 100644
--- a/src/components/ActionCard.vue
+++ b/src/components/ActionCard.vue
@@ -107,7 +107,7 @@ const copy = async (content: string) => {
   <div flex gap-16px>
     <NTooltip v-if="showPreview">
       <template #trigger>
-        <a flex target="_blank" :href="previewUrl">
+        <a flex target="_blank" rel="noopener noreferrer" :href="previewUrl">
           <NButton text>
             <template #icon>
               <SvgIcon name="code" />

From 65dbc10664fe3dcc1d4345d875c4bce7e48169c5 Mon Sep 17 00:00:00 2001
From: Ling0402 <cjy081219@Gmail.com>
Date: Sun, 14 Jun 2026 17:44:01 +0800
Subject: [PATCH 4/6] =?UTF-8?q?test:=20=E4=BF=AE=E6=AD=A3=20Naive=20UI=20?=
 =?UTF-8?q?=E6=B5=8B=E8=AF=95=E6=A1=A9=E5=A5=91=E7=BA=A6=E5=B9=B6=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E6=B5=8B=E8=AF=95=E5=B7=A5=E5=85=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 修正 NCheckbox 测试桩为 checked/update:checked
- 修正 NInput、NSelect 测试桩为 value/update:value
- 修复 createStubComponent 返回值错误
- 为 useEventListener 补充清理函数模拟
- 优化 mountWithStubs 的 global 合并逻辑
- 在测试桩中放宽类型以兼容 Vue 3.5 的 slots 类型限制
---
 src/test/setup.ts | 92 ++++++++++++++---------------------------------
 src/test/utils.ts | 44 ++++++++---------------
 2 files changed, 41 insertions(+), 95 deletions(-)

diff --git a/src/test/setup.ts b/src/test/setup.ts
index c5904fd3..7d78b711 100644
--- a/src/test/setup.ts
+++ b/src/test/setup.ts
@@ -23,26 +23,14 @@ vi.mock('@/components/SvgIcon.vue', () => ({
 vi.mock('naive-ui', () => ({
   NTooltip: defineComponent({
     name: 'NTooltipStub',
-    setup(
-      _: unknown,
-      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-    ) {
+    setup(_: unknown, { slots }: any) {
       return () => h('div', [slots.trigger?.(), slots.default?.()]);
     },
   }),
   NButton: defineComponent({
     name: 'NButtonStub',
     emits: ['click'],
-    setup(
-      _: unknown,
-      {
-        emit,
-        slots,
-      }: {
-        emit: (e: string) => void;
-        slots: Record<string, () => ReturnType<typeof h>>;
-      },
-    ) {
+    setup(_: unknown, { emit, slots }: any) {
       return () =>
         h(
           'button',
@@ -59,95 +47,75 @@ vi.mock('naive-ui', () => ({
     props: {
       show: { type: Boolean, default: false },
     },
-    setup(
-      _: unknown,
-      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-    ) {
+    setup(_: unknown, { slots }: any) {
       return () => h('div', { 'data-testid': 'modal' }, slots.default?.());
     },
   }),
   NSpin: defineComponent({
     name: 'NSpinStub',
-    setup(
-      _: unknown,
-      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-    ) {
+    setup(_: unknown, { slots }: any) {
       return () => h('div', { 'data-testid': 'spin' }, slots.default?.());
     },
   }),
   NSpace: defineComponent({
     name: 'NSpaceStub',
-    setup(
-      _: unknown,
-      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-    ) {
+    setup(_: unknown, { slots }: any) {
       return () => h('div', { 'data-testid': 'space' }, slots.default?.());
     },
   }),
+  // 完美符合 Naive UI 契约的表单桩
   NCheckbox: defineComponent({
     name: 'NCheckboxStub',
     props: {
-      modelValue: { type: Boolean, default: false },
+      checked: { type: Boolean, default: false },
     },
-    emits: ['update:modelValue'],
-    setup(
-      props: { modelValue: boolean },
-      { emit }: { emit: (e: string, v: boolean) => void },
-    ) {
+    emits: ['update:checked'],
+    setup(props, { emit }) {
       return () =>
         h('input', {
           type: 'checkbox',
-          checked: props.modelValue,
+          checked: props.checked,
           onChange: (e: Event) =>
-            emit('update:modelValue', (e.target as HTMLInputElement).checked),
+            emit('update:checked', (e.target as HTMLInputElement).checked),
         });
     },
   }),
   NInput: defineComponent({
     name: 'NInputStub',
     props: {
-      modelValue: { type: String, default: '' },
+      value: { type: String, default: '' },
     },
-    emits: ['update:modelValue'],
-    setup(
-      props: { modelValue: string },
-      { emit }: { emit: (e: string, v: string) => void },
-    ) {
+    emits: ['update:value'],
+    setup(props, { emit }) {
       return () =>
         h('input', {
           type: 'text',
-          value: props.modelValue,
-          onChange: (e: Event) =>
-            emit('update:modelValue', (e.target as HTMLInputElement).value),
+          value: props.value,
+          onInput: (e: Event) =>
+            emit('update:value', (e.target as HTMLInputElement).value),
         });
     },
   }),
   NSelect: defineComponent({
     name: 'NSelectStub',
     props: {
-      modelValue: { type: [String, Number], default: '' },
+      value: { type: [String, Number], default: '' },
       options: {
         type: Array,
-        default: () => [] as Array<{ label: string; value: string }>,
+        default: () => [] as any[],
       },
     },
-    emits: ['update:modelValue'],
-    setup(
-      props: {
-        modelValue: string | number;
-        options: Array<{ label: string; value: string }>;
-      },
-      { emit }: { emit: (e: string, v: string) => void },
-    ) {
+    emits: ['update:value'],
+    setup(props, { emit }) {
       return () =>
         h(
           'select',
           {
-            value: props.modelValue,
+            value: props.value as any,
             onChange: (e: Event) =>
-              emit('update:modelValue', (e.target as HTMLSelectElement).value),
+              emit('update:value', (e.target as HTMLSelectElement).value),
           },
-          props.options.map((option: { label: string; value: string }) =>
+          (props.options as any[]).map((option: any) =>
             h('option', { value: option.value }, option.label),
           ),
         );
@@ -155,20 +123,14 @@ vi.mock('naive-ui', () => ({
   }),
   NMessageProvider: defineComponent({
     name: 'NMessageProviderStub',
-    setup(
-      _: unknown,
-      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-    ) {
+    setup(_: unknown, { slots }: any) {
       return () =>
         h('div', { 'data-testid': 'message-provider' }, slots.default?.());
     },
   }),
   NDialogProvider: defineComponent({
     name: 'NDialogProviderStub',
-    setup(
-      _: unknown,
-      { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-    ) {
+    setup(_: unknown, { slots }: any) {
       return () =>
         h('div', { 'data-testid': 'dialog-provider' }, slots.default?.());
     },
@@ -179,7 +141,7 @@ vi.mock('@vueuse/core', () => ({
   useStorage: vi.fn(() => ({
     value: '',
   })),
-  useEventListener: vi.fn(),
+  useEventListener: vi.fn(() => vi.fn()),
   useDebounceFn: vi.fn((fn: (...args: unknown[]) => void) => fn),
 }));
 
diff --git a/src/test/utils.ts b/src/test/utils.ts
index 38e49fbe..8b07a074 100644
--- a/src/test/utils.ts
+++ b/src/test/utils.ts
@@ -17,28 +17,21 @@ export const createStubComponent = (
     emits?: string[];
     render?: (props: Record<string, unknown>) => ReturnType<typeof h>;
   },
-): DefineComponent => {
+): DefineComponent<any, any, any> => {
   return defineComponent({
     name: `${name}Stub`,
     props: options.props,
     emits: options.emits,
-    setup(
-      props: Record<string, unknown>,
-      {
-        slots,
-        emit,
-      }: {
-        slots: Record<string, () => ReturnType<typeof h>>;
-        emit: (e: string, ...args: unknown[]) => void;
-      },
-    ) {
+    setup(props: Record<string, unknown>, { slots, emit }: any) {
       const renderProps = {
         ...props,
         emit,
       };
+
       if (options.render) {
-        return options.render(renderProps);
+        return () => options.render!(renderProps);
       }
+
       return () =>
         h(
           'div',
@@ -51,7 +44,7 @@ export const createStubComponent = (
           slots.default?.(),
         );
     },
-  });
+  }) as any;
 };
 
 export const createMockFn = <T extends (...args: unknown[]) => unknown>(
@@ -79,26 +72,14 @@ export const mountWithStubs = <T extends ComponentPublicInstance>(
   const defaultStubs = {
     NTooltip: defineComponent({
       name: 'NTooltipStub',
-      setup(
-        _: unknown,
-        { slots }: { slots: Record<string, () => ReturnType<typeof h>> },
-      ) {
+      setup(_: unknown, { slots }: any) {
         return () => h('div', [slots.trigger?.(), slots.default?.()]);
       },
     }),
     NButton: defineComponent({
       name: 'NButtonStub',
       emits: ['click'],
-      setup(
-        _: unknown,
-        {
-          emit,
-          slots,
-        }: {
-          emit: (e: string) => void;
-          slots: Record<string, () => ReturnType<typeof h>>;
-        },
-      ) {
+      setup(_: unknown, { emit, slots }: any) {
         return () =>
           h(
             'button',
@@ -112,21 +93,24 @@ export const mountWithStubs = <T extends ComponentPublicInstance>(
     }),
     SvgIcon: defineComponent({
       name: 'SvgIconStub',
-      props: ['name'],
-      setup(props: { name: string }) {
+      props: {
+        name: { type: String, required: false },
+      },
+      setup(props: { name?: string }) {
         return () => h('span', { 'data-testid': `svg-${props.name}` });
       },
     }),
   };
 
   return mount(component, {
+    ...options,
     global: {
+      ...options?.global,
       stubs: {
         ...defaultStubs,
         ...options?.global?.stubs,
       },
     },
-    ...options,
   });
 };
 

From ca72a62ea62c9d602d1ab7aad548571d8587fc8f Mon Sep 17 00:00:00 2001
From: Ling0402 <cjy081219@Gmail.com>
Date: Sun, 14 Jun 2026 18:12:58 +0800
Subject: [PATCH 5/6] =?UTF-8?q?fix:=20=E5=A4=9A=E9=80=89=E4=B8=8B=E8=A2=AB?=
 =?UTF-8?q?=E5=88=A0=E9=99=A4=E5=B9=BD=E7=81=B5=E5=BF=AB=E7=85=A7id?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

当一个被选中的快照被删除后，checkedRowKeys 仍然包含已删除的 ID，导致批量操作栏显示过时的计数，后续批量删除可能尝试删除已不存在的快照
---
 .../plus/device/DeviceSnapshotGroups.vue      |  9 ++----
 src/composables/plus/useDevicePlus.ts         | 28 +++++++++++++++++++
 src/views/plus/DevicePage.vue                 | 10 +------
 .../plus/__tests__/adapter.contract.test.ts   |  2 --
 4 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/src/components/plus/device/DeviceSnapshotGroups.vue b/src/components/plus/device/DeviceSnapshotGroups.vue
index 3d6291de..6df1f334 100644
--- a/src/components/plus/device/DeviceSnapshotGroups.vue
+++ b/src/components/plus/device/DeviceSnapshotGroups.vue
@@ -12,10 +12,6 @@ const props = defineProps<{
     loading: Record<number, boolean | undefined>;
     invoke: (row: Snapshot) => unknown;
   };
-  deleteSnapshot: {
-    loading: Record<number, boolean | undefined>;
-    invoke: (row: Snapshot) => unknown;
-  };
 }>();
 
 const emit = defineEmits<{
@@ -34,6 +30,7 @@ const {
   checkedSet,
   snapshotViewedTime,
   batchDelete,
+  deleteSnapshot,
   previewUrlMap,
   previewLoadingMap,
   previewErrorMap,
@@ -299,8 +296,8 @@ const {
                         <NButton
                           text
                           type="error"
-                          :loading="props.deleteSnapshot.loading[item.id]"
-                          @click="props.deleteSnapshot.invoke(item)"
+                          :loading="deleteSnapshot.loading[item.id]"
+                          @click="deleteSnapshot.invoke(item)"
                         >
                           <template #icon><SvgIcon name="delete" /></template>
                         </NButton>
diff --git a/src/composables/plus/useDevicePlus.ts b/src/composables/plus/useDevicePlus.ts
index 2f26c358..8712d02c 100644
--- a/src/composables/plus/useDevicePlus.ts
+++ b/src/composables/plus/useDevicePlus.ts
@@ -181,6 +181,33 @@ export function useDevicePlus(options: UseDevicePlusOptions) {
     (row) => row.id,
   );
 
+  const deleteSnapshot = useBatchTask(
+    async (row: Snapshot) => {
+      const confirmed = await new Promise<boolean>((res) => {
+        dialog.warning({
+          title: '删除快照',
+          content: `是否确认删除快照 ID: ${row.id}？此操作不可恢复。`,
+          positiveText: '确认删除',
+          negativeText: '取消',
+          onPositiveClick: () => res(true),
+          onNegativeClick: () => res(false),
+          onClose: () => res(false),
+        });
+      });
+      if (!confirmed) return;
+      await api.deleteSnapshot({ id: row.id });
+      await Promise.all([
+        snapshotStorage.removeItem(row.id),
+        screenshotStorage.removeItem(row.id),
+      ]);
+      options.checkedRowKeys.value = options.checkedRowKeys.value.filter(
+        (id) => id !== row.id,
+      );
+      message.success('删除成功');
+    },
+    (r) => r.id,
+  );
+
   const batchDelete = useTask(async () => {
     await new Promise((resolve, reject) => {
       dialog.warning({
@@ -244,6 +271,7 @@ export function useDevicePlus(options: UseDevicePlusOptions) {
     checkedSet,
     snapshotViewedTime,
     batchDelete,
+    deleteSnapshot,
     previewUrlMap,
     previewLoadingMap,
     previewErrorMap,
diff --git a/src/views/plus/DevicePage.vue b/src/views/plus/DevicePage.vue
index cdc9bf21..3b563c38 100644
--- a/src/views/plus/DevicePage.vue
+++ b/src/views/plus/DevicePage.vue
@@ -65,20 +65,12 @@ const checkedRowKeys = shallowRef<number[]>([]);
       </NTooltip>
     </template>
 
-    <template
-      #content="{
-        snapshots,
-        refreshSnapshots,
-        previewSnapshot,
-        deleteSnapshot,
-      }"
-    >
+    <template #content="{ snapshots, refreshSnapshots, previewSnapshot }">
       <DeviceSnapshotGroups
         v-model:checked-row-keys="checkedRowKeys"
         :snapshots="snapshots"
         :refresh-snapshots="refreshSnapshots"
         :preview-snapshot="previewSnapshot"
-        :delete-snapshot="deleteSnapshot"
       />
     </template>
   </BaseDevicePage>
diff --git a/src/views/plus/__tests__/adapter.contract.test.ts b/src/views/plus/__tests__/adapter.contract.test.ts
index 3ca764a7..6d05257d 100644
--- a/src/views/plus/__tests__/adapter.contract.test.ts
+++ b/src/views/plus/__tests__/adapter.contract.test.ts
@@ -115,7 +115,6 @@ vi.mock('@/components/plus/device/DeviceSnapshotGroups.vue', () => ({
       snapshots: { type: Array, required: true },
       refreshSnapshots: { type: Function, required: true },
       previewSnapshot: { type: Object, required: true },
-      deleteSnapshot: { type: Object, required: true },
     },
     emits: ['update:checkedRowKeys'],
     setup(
@@ -124,7 +123,6 @@ vi.mock('@/components/plus/device/DeviceSnapshotGroups.vue', () => ({
         snapshots: Array<{ id: number }>;
         refreshSnapshots: () => void;
         previewSnapshot: unknown;
-        deleteSnapshot: unknown;
       },
       { emit }: { emit: (e: string, v: number[]) => void },
     ) {

From a960f648825c3cd54b6daef529c71f1f82b7db90 Mon Sep 17 00:00:00 2001
From: Ling0402 <cjy081219@Gmail.com>
Date: Sun, 14 Jun 2026 18:19:33 +0800
Subject: [PATCH 6/6] =?UTF-8?q?fix:=20=E6=A8=A1=E6=8B=9F=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=9C=9F=E5=AE=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix: 根据 props.show 的值来决定是否渲染
---
 src/test/setup.ts | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/test/setup.ts b/src/test/setup.ts
index 7d78b711..22bf3ed1 100644
--- a/src/test/setup.ts
+++ b/src/test/setup.ts
@@ -47,8 +47,11 @@ vi.mock('naive-ui', () => ({
     props: {
       show: { type: Boolean, default: false },
     },
-    setup(_: unknown, { slots }: any) {
-      return () => h('div', { 'data-testid': 'modal' }, slots.default?.());
+    setup(props: any, { slots }: any) {
+      return () => {
+        if (!props.show) return null;
+        return h('div', { 'data-testid': 'modal' }, slots.default?.());
+      };
     },
   }),
   NSpin: defineComponent({