# TDesign Shell Wave A 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:** 将全局 Toast/Confirm、业务弹窗、Monitor 残留搜索/checkbox 迁到 TDesign；调用方 `ui.toast` / `ui.confirm` API 不变。

**Architecture:** uiStore 薄封装 MessagePlugin / DialogPlugin；各页 `modal-backdrop` 改为 `t-dialog`；Monitor 表单控件对齐第一轮约定。

**Tech Stack:** Vue 3、`tdesign-vue-next`（MessagePlugin、DialogPlugin、t-dialog、t-input、t-checkbox）

**Spec:** `docs/superpowers/specs/2026-08-28-tdesign-shell-wave-a-design.md`

---

### Task 1: uiStore Toast + Confirm → TDesign

**Files:**
- Modify: `src/stores/modules/uiStore.js`
- Modify: `src/App.vue`

- [ ] `toast(message)` → `MessagePlugin.info(message, 2200)`（或等价 duration）
- [ ] `confirm(title, desc, checks)` → DialogPlugin.confirm / 自定义 body 含 checks；返回 Promise\<boolean\>
- [ ] 删除 App.vue 自定义 confirm/toast DOM；可只留 `router-view` + icon-library
- [ ] 导出 API 保持：`toast`、`confirm`（`resolveConfirm` 若无外部调用可内聚删除）
- [ ] Commit: `feat: 全局 Toast/Confirm 切换到 TDesign`

---

### Task 2: DockEditModal + Devices 弹窗

**Files:**
- Modify: `src/components/DockEditModal.vue`
- Modify: `src/views/DevicesView/DevicesView.vue`

- [ ] DockEditModal：`modal-backdrop` → `t-dialog`（v-model:visible / header / footer）
- [ ] Devices：添加机巢、固件升级两个弹窗 → `t-dialog`
- [ ] Commit: `feat: 设备相关弹窗切换到 t-dialog`

---

### Task 3: Firmwares + Tasks + Account 弹窗

**Files:**
- Modify: `src/views/FirmwaresView/FirmwaresView.vue`
- Modify: `src/views/TasksView/TasksView.vue`
- Modify: `src/views/AccountView/AccountView.vue`

- [ ] 各页业务 modal-backdrop → t-dialog
- [ ] 表单内容与现有 TDesign 表单控件保持
- [ ] 可并行改三个文件，各自或合并 commit（优先各自）：
  - `feat: 固件弹窗切换到 t-dialog`
  - `feat: 任务弹窗切换到 t-dialog`
  - `feat: 账户弹窗切换到 t-dialog`

---

### Task 4: Monitor 搜索 / checkbox / 状态弹窗

**Files:**
- Modify: `src/views/MonitorView/MonitorView.vue`

- [ ] 搜索 → `t-input` clearable + prefix
- [ ] 设备多选 → `t-checkbox`（Set 语义不变）
- [ ] `dockStatusOpen` 弹窗 → `t-dialog`
- [ ] 地图卫星/街道按钮不改
- [ ] Commit: `feat: 监控页搜索勾选与状态弹窗切换到 TDesign`

---

### Task 5: 验收

- [ ] `rg 'modal-backdrop' src --glob '*.vue'` → 0（或仅注释）
- [ ] `rg 'class=\"toast\"|toastVisible' src` → 无展示 DOM
- [ ] 浏览器：toast、退出确认、添加机巢弹窗、Monitor 搜索/勾选
- [ ] 地图底图按钮仍在

---

## 调用约定

- 业务代码继续 `ui.toast(...)` / `await ui.confirm(...)`，不要散落直接 MessagePlugin（除非 store 内）。
- 不 `git add -A`；跳过全量测试。