# 业务表单控件迁移到 TDesign

## 背景

项目已接入 `tdesign-vue-next`（Vite `TDesignResolver` 按需引入）。登录页已用 `t-input` / `t-button` 等，但业务页筛选栏与弹窗表单仍大量使用原生 `<select>` / `<input>`。全站 `t-select` 用量为 0。

目标方向：**能换的表单控件尽量全换**。本需求按页面分轮推进。

## 目标

1. 统一业务页表单控件为 TDesign，优先视觉与交互一致。
2. 第一轮完成高频页：`DevicesView` / `TasksView` / `FirmwaresView`。
3. 不改变业务逻辑与接口契约。

## 非目标

- 不改后台。
- 不重做页面布局 / 表格体系。
- 不在本轮替换地图内特殊控件、自定义外观开关（若强绑定原型 CSS，可暂留并标注）。
- 不在本轮做完整 TDesign 主题定制（与 `prototype.css` 深度对齐另开）。
- 第二轮页面（Users / OperationLogs / Account / DeviceDetail 等）不纳入本轮实现。

## 第一轮范围

| 页面 | 控件 |
|------|------|
| `DevicesView` | 搜索 input、状态/绑定 select、新增机巢表单 inputs、升级固件 select |
| `TasksView` | 各 Tab 搜索 input、计划/设备/结果 select、任务/航线/航点表单 inputs、number、time、星期 select；原始视频录制自定义 checkbox → `t-switch` 或 `t-checkbox`（保持布尔语义） |
| `FirmwaresView` | 搜索 input、状态 select、创建/编辑表单 inputs + number + select |

## 控件映射

| 原生 | TDesign | 约定 |
|------|---------|------|
| `<select>` | `t-select` | `:options="[{ label, value }]"`；少用 `<option>` 插槽 |
| 文本 `<input>` | `t-input` | 搜索框可 `clearable`；短必填码按需 |
| `type="number"` | `t-input-number` | 保留 `min/max/step`；`v-model` 数值语义不变 |
| `type="time"` | `t-time-picker` | 绑定现有 `HH:mm` 字符串字段 |
| 自定义录制 checkbox | `t-switch`（优先）或 `t-checkbox` | 仍绑定 `boolean` |
| 纯展示/地图专用 input | 暂不换 | 标注原因 |

尺寸：默认 `size="medium"`。筛选栏与工具栏用现有容器 class 限宽，尽量少覆盖 TDesign 主题变量。

## 行为约定

1. **v-model 类型不变**：空筛选项继续用 `''`；数值 select（如星期）继续 number。
2. **事件**：原 `@change="reload"` 改为 `t-select` 的 `@change` 调同一 `reload`（或等价 watch，但优先显式事件以免双触发）。
3. **选项数据**：在 `<script setup>` 提成常量/computed（如 `statusOptions`），模板只绑 `:options`。
4. **无障碍**：原 `aria-label` 迁到 `t-select` 的 `placeholder` / 外层 label。
5. **依赖**：不新增 npm 包；沿用自动按需引入。

## 验收

1. 上述三页无业务表单原生 `<select>`；可换的文本/数字/时间输入已换 TDesign。
2. 筛选变更仍触发列表刷新；创建/编辑提交字段与改前一致。
3. 登录页与其它未纳入页面行为不回归。
4. 每页至少一次浏览器冒烟：打开筛选、改 select、打开一个表单弹窗填报。

## 风险

- TDesign 高度/边框与 `prototype.css` 工具栏不完全一致 → 用有限 class 调宽高，不全局改主题。
- `t-input-number` / `t-time-picker` 空值与原生 string/number 混用 → 提交前保持与现有校验一致。
- 任务页控件多 → 按页面拆 commit，避免巨石 diff。

## 后续轮次（不在本轮）

- Users / OperationLogs / Account / DeviceDetail 等剩余原生 select/input。
- 可选：TDesign 主题 token 与原型色板对齐。