## 一、项目级 UI 约定
> 来源:prototype/*.html 实测 + docs/01 REQ 卡片 UI 描述 + docs/06 已有布局。经用户确认。
| 约定项 | 锁定值 | 依据 |
| --- | --- | --- |
| 整体布局骨架 | {{LAYOUT_SKELETON}} | {{LAYOUT_SOURCE}} |
| 最小支持视口 / 响应式策略 | {{VIEWPORT_POLICY}} | {{VIEWPORT_SOURCE}} |
| 列表页交互范式 | {{LIST_PATTERN}} | {{LIST_SOURCE}} |
| 表单展现规则(Modal / Drawer / 独立页阈值) | {{FORM_PATTERN}} | {{FORM_SOURCE}} |
| 操作反馈范式(成功 / 失败 / 二次确认) | {{FEEDBACK_PATTERN}} | {{FEEDBACK_SOURCE}} |
| 数据展示约定(状态 / 日期 / 金额 / 空值 / 操作列) | {{DISPLAY_PATTERN}} | {{DISPLAY_SOURCE}} |
| 前端权限控制方式 | {{AUTH_PATTERN}} | {{AUTH_SOURCE}} |
## 二、Design Tokens
> 单元格写 token 名(`--color-xxx`),不写裸 hex;色值默认值落地于 `src/styles/tokens.css`。命名规范见 docs/04 § 2.5。
### 2.1 全局调色板
| 语义 | 变量名 | 默认值 | 用途 |
| --- | --- | --- | --- |
| {{TOKEN_SEMANTIC}} | {{TOKEN_VAR}} | {{TOKEN_VALUE}} | {{TOKEN_USAGE}} |
### 2.2 组件级状态色
| 序号 | 组件 | 编辑 bg | 只读 bg | 悬浮 bg | 编辑 fg | 只读 fg | 悬浮 fg | 备注 |
| --- | --- | --- | --- | --- | --- | --- | --- | --- |
| {{COMP_NO}} | {{COMP_NAME}} | {{COMP_BG_EDIT}} | {{COMP_BG_READONLY}} | {{COMP_BG_HOVER}} | {{COMP_FG_EDIT}} | {{COMP_FG_READONLY}} | {{COMP_FG_HOVER}} | {{COMP_NOTE}} |
## 三、组件库选型
| 项 | 锁定值 | 依据 / 备注 |
| --- | --- | --- |
| 前端 UI 组件库 | {{UI_LIB}} | {{UI_LIB_SOURCE}} |
| 版本 | {{UI_LIB_VERSION}} | 与 docs/04 § 零 一致 |
| 主题接入方式 | {{UI_LIB_THEME}} | 如 ConfigProvider.theme.token 引用 § 二全局调色板 |
| 图标库 | {{ICON_LIB}} | {{ICON_LIB_SOURCE}} |
| 表格 / 表单封装策略 | {{WRAP_STRATEGY}} | 是否二次封装、统一 props 约定 |
## 四、前端栈摘要(同步 docs/04 § 二)
| 分层 | 技术 | 版本 | 说明 |
| --- | --- | --- | --- |
| {{FE_LAYER}} | {{FE_TECH}} | {{FE_VERSION}} | {{FE_NOTE}} |
## 五、各 FE 设计决策表
> 一 FE 一行,FE 清单来自 docs/08 § 三。每行锁定该 FE 的页面骨架来源、页面类型、组件库选型与状态机要点,供 Coding 阶段前端循环直接消费(不再二次问人)。
| FE-NN | 功能名 | 关联 REQ | 关联原型 | 页面类型 | 核心组件树要点 | 关键状态机(loading/empty/error/正常/提交中) | 引用 Design Tokens |
| --- | --- | --- | --- | --- | --- | --- | --- |
| {{FE_ID}} | {{FE_NAME}} | {{FE_REQS}} | {{FE_PROTOTYPES}} | {{FE_PAGE_TYPE}} | {{FE_COMPONENT_TREE}} | {{FE_STATE_MACHINE}} | {{FE_TOKENS}} |