主题、基础组件与业务组件
先查规范与库存
页面视觉以 Obsidian-Neon 和首页为准。先读模块内视觉设计规范与组件资产清单，再检查 src/styles/theme.scss、基础组件和同类业务页。
| 内容 | 统一入口 |
|---|---|
| 颜色、字号、间距和布局 token | src/styles/theme.scss |
| 图标 | TqIcon.vue 与 icon-data.js |
| 按钮 | TqButton.vue |
| 加载与失败 | 页面冷启动骨架、LoadErrorState 等既有组件 |
| 弹层与确认 | 既有抽屉和确认对话框 |
扩展步骤
- 判断需求能否通过现有组件参数或插槽实现。
- 新增视觉原语前，先在主题和治理文档定义，再由页面引用。
- 组件只暴露业务必要的输入和事件，真实请求留在既有服务层。
- 对微信小程序检查组件注册、样式作用域和分包兼容。
- 同步组件清单或运行边界说明，采集真实页面截图并自审。
复用统一页签、卡片和错误状态，参考实际球队管理界面。
QA队长 · 本次微信原生实拍；点击图片可放大。
验证命令
npm run audit:components
npm run audit:icons
npm run guard:garbled-text
命令通过只能证明其覆盖的静态规则；还需检查真实页面的字号、间距、可读性及点击状态。首页与 token 有冲突时先对齐首页，除非产品明确调整首页设计。