docs(迭代09/10): Tab 设置统一管理 + UI 主题适配 全量文档

迭代09 (R-011 Tab 设置统一管理):
- 需求 R-011 (定稿 Q1-Q5) + 需求池索引
- 计划 PLAN-010 + 迭代09 四件套 (目标/技术方案/验收/复盘)
- 约束: 产品约束-009 / UI约束-003 / 技术约束-014
- UI约束-002 修订: 通用设置→Tab 设置

迭代10 (R-012 UI 适配 DSH 主题):
- 需求 R-012 (定稿: 暂定跟随系统) + 需求池索引
- 计划 PLAN-011 + 迭代10 四件套
- 约束: UI约束-004 (主题适配约定)
This commit is contained in:
2026-09-02 14:01:08 +08:00
parent 4ac8a29805
commit f1e7e785a1
16 changed files with 536 additions and 1 deletions
+55
View File
@@ -0,0 +1,55 @@
# 计划:UI 适配 DSH 主题(浅色 / 深色 / 跟随系统)(阶段航点)
> 编号:PLAN-011 | 粒度:阶段航点 创建:2026-09-02 状态:**执行中**
> 派生自终极目标:目标-001(神之一手工具集)
> 依据需求:**R-012(已定稿,2026-09-02,暂定跟随系统)** —— 符合入范围门槛
> 设计约束:UI约束-003Tab 设置)、UI约束-002(QMT 卡片)沿用;本次新增色值 token 化约定
## 目标
神之一手客户端 UI 全部硬编码色值替换为宿主 `--dsw-*` token,使各页面在 DSH 浅色 / 深色 / 跟随系统主题下均可读、协调,随主题切换自动适配,不自行维护主题偏好。
## 范围
**做**
1. 客户端 10 个文件 141 处硬编码颜色按语义映射表替换为 `var(--dsw-*)``color-mix`(随主题淡色底);
2. 确认 QmtConnectionChip 已用 token 与硬编码混杂处统一;
3. 涨跌色(红涨绿跌)→ 宿主 state-error/success;主按钮 / 徽标 / 提示底色 → 宿主语义 token + color-mix
4. 构建 + typecheck + 深浅主题人工验收。
**不做**
- 自定义 `--odl-*` 覆盖 tokenD5 暂缓);
- 布局 / 间距 / 圆角改动;
- 服务端 / API / 数据改动;
- 插件自维护主题偏好(跟随宿主)。
## 涉及文件
```
src/client/views/
├── SettingsSection.jsx # 55 处(最大)
├── StrategyTab.jsx # 24
├── TradeRecordsTab.jsx # 21
├── QmtConnectionChip.jsx # 13(部分已 token
├── RangeSelector.jsx # 7
├── PriceCell.jsx # 5(涨跌色)
├── AllPositionsTab.jsx # 4
├── LoadState.jsx # 3
├── Toast.jsx # 2
└── PlaceholderTab.jsx # 1
```
## 实现步骤
1. **文档骨架**PLAN-011 + 迭代 10(本步);
2. **批量替换**:按文件逐处替换(先小文件确认模式,再大文件);
3. **验证**build + typecheck;人工切 DSH 浅/深主题检查各页;
4. **验收 + 复盘**
## 验收要点
- 浅色主题下观感与现状基本一致(无突兀色差);
- 深色主题下所有页面可读(背景/文字/边框/按钮/涨跌/徽标/提示/下拉菜单均协调);
- 跟随系统切换实时生效;
- 无残留硬编码色(#xxx / rgb / rgba 全部清理,注释可留);
- 布局与交互不变(仅色值)。