From a06e081bcd7a68952306e045ad898d36daca930c Mon Sep 17 00:00:00 2001
From: xiaosi <2652281683@qq.com>
Date: Mon, 31 Aug 2026 10:27:37 +0800
Subject: [PATCH] =?UTF-8?q?docs:=20=E5=A2=9E=E5=8A=A0=20Devices=20?=
 =?UTF-8?q?=E7=9C=9F=E5=88=86=E9=A1=B5=E4=B8=8E=E5=BC=B9=E7=AA=97=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E6=94=B6=E5=8F=A3=E8=AE=BE=E8=AE=A1=E8=AE=A1=E5=88=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

覆盖 destroy-on-close、列表专用分页与死 CSS 清理。
---
 .../2026-08-28-devices-pagination-cleanup.md  | 61 +++++++++++++++++++
 ...08-28-devices-pagination-cleanup-design.md | 59 ++++++++++++++++++
 2 files changed, 120 insertions(+)
 create mode 100644 docs/superpowers/plans/2026-08-28-devices-pagination-cleanup.md
 create mode 100644 docs/superpowers/specs/2026-08-28-devices-pagination-cleanup-design.md

diff --git a/docs/superpowers/plans/2026-08-28-devices-pagination-cleanup.md b/docs/superpowers/plans/2026-08-28-devices-pagination-cleanup.md
new file mode 100644
index 0000000..e443b2d
--- /dev/null
+++ b/docs/superpowers/plans/2026-08-28-devices-pagination-cleanup.md
@@ -0,0 +1,61 @@
+# Devices 真分页 + 弹窗/样式收口 Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** 全仓 `t-dialog` 补 `destroy-on-close`；Devices 列表专用真分页；删除 `prototype.css` 死样式。
+
+**Architecture:** 弹窗统一销毁重建；DevicesView 自管分页请求，不改 `devicesStore.load` 近全量语义；CSS 只删确认无引用的规则。
+
+**Tech Stack:** Vue 3、tdesign-vue-next、现有 `/v1/docks` `/v1/drones` 分页契约
+
+**Spec:** `docs/superpowers/specs/2026-08-28-devices-pagination-cleanup-design.md`
+
+---
+
+### Task 1: A — t-dialog destroy-on-close
+
+**Files:** 所有含 `<t-dialog` 的 vue（DockEditModal、DevicesView、FirmwaresView、TasksView、AccountView、MonitorView、LoginView 等）
+
+- [ ] 每个业务 `t-dialog` 增加 `destroy-on-close`（或 `:destroy-on-close="true"`）
+- [ ] 确认打开时仍有表单 init（已有则不动）
+- [ ] Commit: `fix: 业务弹窗启用 destroy-on-close`
+
+---
+
+### Task 2: B — Devices 列表真分页
+
+**Files:**
+- Modify: `src/views/DevicesView/DevicesView.vue`
+- 不改坏：`src/stores/modules/devicesStore.js` 的 Monitor 近全量 `load()`
+
+- [ ] View 增加 `pageNum`/`pageSize=20`/`total`/`tableRecords`
+- [ ] `loadTable()`：按 tab 请求 `urls.DOCKS` 或 `urls.DRONES`，params 含 pageNum/pageSize/keyword；写入 records+total
+- [ ] `t-pagination` 外置绑定；tab/搜索变更重置 pageNum=1 再 loadTable
+- [ ] 状态/绑定筛：仅过滤当前页；角标优先用接口 total
+- [ ] 写操作成功后 `loadTable()`，并可选 `devices.load()` 刷新全局缓存
+- [ ] Commit: `feat: 设备列表接入服务端分页`
+
+---
+
+### Task 3: C — 删除死 CSS
+
+**Files:**
+- Modify: `src/styles/prototype.css`
+
+- [ ] 删除已无 Vue 引用的 `.primary-command` / `.plain-command` / `.icon-command`、`.business-tabs`、`.mode-segment`、裸 `.asset-table` 等（删除前再 `rg` 确认）
+- [ ] 保留 `.asset-table-wrap`、`.table-footer`、业务 layout、地图/控制样式
+- [ ] Commit: `chore: 清理 TDesign 迁移后无用的按钮与表样式`
+
+---
+
+### Task 4: 验收
+
+- [ ] 抽检弹窗关闭再开无脏数据
+- [ ] Devices 翻页网络 `pageNum` 变化；Monitor 地图仍有点
+- [ ] 死 class 无引用；关键页按钮/表可见
+
+---
+
+## 约定
+
+- 不改后台；不 `git add -A`；Main 统一冒烟。
diff --git a/docs/superpowers/specs/2026-08-28-devices-pagination-cleanup-design.md b/docs/superpowers/specs/2026-08-28-devices-pagination-cleanup-design.md
new file mode 100644
index 0000000..fce2d5f
--- /dev/null
+++ b/docs/superpowers/specs/2026-08-28-devices-pagination-cleanup-design.md
@@ -0,0 +1,59 @@
+# Devices 真分页 + 弹窗/样式收口
+
+## 背景
+
+TDesign A/B/C 已完成。Devices 列表仍通过共用 `devicesStore.load()` 拉 `pageSize=100` 近全量，丢弃 `total/pages`；footer 仅展示条数。全仓 `t-dialog` 缺 `destroy-on-close`。`prototype.css` 残留已无 Vue 引用的命令按钮/旧 tabs/裸表样式。
+
+后端 `/v1/docks`、`/v1/drones` 已支持 `pageNum`/`pageSize`/`keyword`（及 dock `registerStatus`），返回 `{ pageNum, pageSize, pages, total, records }`。
+
+## 目标
+
+1. **A. 弹窗收口：** 全仓业务 `t-dialog` 补 `destroy-on-close`；打开时重置表单（对齐现有 open 逻辑）。
+2. **B. Devices 真分页：** 列表页专用分页请求；Monitor/Control 等继续用近全量 `devicesStore.load`。
+3. **C. 样式收口：** 删除已无引用的死 CSS；保留仍在用的布局类。
+
+## 非目标
+
+- 不改后台 API。
+- 不把共用 `devicesStore.load` 改成真分页（避免地图/下拉缺设备）。
+- 不做 Monitor/Alarms 卡列表组件化。
+- 不把状态/绑定筛强行接到后端（后端无等价筛选时保持本页客户端过滤）。
+
+## 设计
+
+### A. destroy-on-close
+
+涉及：`DockEditModal`、Devices 添加机巢/固件升级、Firmwares、Tasks 新建/航点、Account 两弹窗、Monitor 机巢状态、Login 找回密码等所有业务 `t-dialog`。
+
+- 统一加 `:destroy-on-close="true"`（或组件默认等价属性）。
+- 打开路径已赋值表单的保持；依赖“关闭后 DOM 残留状态”的逻辑改为打开时显式 init。
+
+### B. Devices 列表专用分页
+
+- `DevicesView` 维护 `pageNum` / `pageSize=20` / `total`；按当前 tab 请求 `DOCKS` 或 `DRONES`。
+- Query：`pageNum`、`pageSize`、`keyword`（搜索框）；dock 可附带后端已有 `registerStatus` 若与 UI 对齐，否则不传。
+- 列表数据用 View 本地 `tableRecords`，**不覆盖** `devicesStore.docks/drones` 全量缓存。
+- Tab 角标：可用 store 近全量 length（进入页可顺带 `devices.load()` 刷新缓存），或显示当前 `total`；推荐角标用本次列表接口 `total`，避免与分页语义打架。
+- 外置 `t-pagination`：`v-model:current` + `:total` + `:page-size`，翻页重新请求。
+- 状态/绑定等仅前端有的筛：在**当前页 records** 上过滤；空态文案可提示「仅筛选当前页结果」。
+- 增删改成功后：刷新当前列表页 + 可选 `devices.load()` 更新全局缓存。
+
+### C. 死样式删除
+
+可删（确认 Vue 无引用后）：`.primary-command` / `.plain-command` / `.icon-command`、`.business-tabs`、`.mode-segment`、裸 `.asset-table` 表样式等。
+
+保留：`.asset-table-wrap`、`.business-workspace` / `.business-panel`、`.table-footer`（仍包着 pagination）、地图/控制相关、Monitor 卡样式等。
+
+## 切分
+
+1. A 弹窗 `destroy-on-close`  
+2. B Devices 真分页  
+3. C 删死 CSS  
+4. 验收
+
+## 验收
+
+1. 关闭再开业务弹窗无脏数据；DOM 无长期残留多实例（抽检 Devices/Firmwares/Tasks）。  
+2. Devices：翻页请求 `pageNum` 变化；`total` 正确；Monitor 地图设备点仍在。  
+3. `prototype.css` 已删死 class；页面无样式回归到「按钮消失」级别问题。  
+4. 不改后台。