47 lines
2.4 KiB
Plaintext
47 lines
2.4 KiB
Plaintext
---
|
||
description: OneOS V2 详情/表单页头强制对齐（禁止自建白卡片顶栏）
|
||
alwaysApply: true
|
||
---
|
||
|
||
# OneOS V2 · 详情 / 表单页头（强制）
|
||
|
||
凡**离开台账进入全页**（查看详情、处置/填报、档案工作台等），页头必须对齐已定版母版，**禁止**再发明「白底描边整条卡片顶栏」。
|
||
|
||
## 必须对齐的母版
|
||
|
||
| 场景 | 对照 |
|
||
|------|------|
|
||
| 结构化工单 / 处置填报 | `DESIGN.md` **§4.8** + `lease-contract-redesign/FaultDispositionForm.tsx` |
|
||
| 档案 / 只读详情全页 | `vehicle-management` 的 `va-form-header`（`DetailView.tsx`） |
|
||
| 合同详情 | `LeaseContractView` 顶栏至少含「返回列表」 |
|
||
|
||
## 页头强制结构（PC）
|
||
|
||
```text
|
||
[← 返回…] | 页面标题（20px / font-weight 800） · 单号紫色胶囊（若有） [次操作] [主 CTA]
|
||
```
|
||
|
||
硬性要求：
|
||
|
||
1. **扁平页头行**：返回 + 竖分割线 + 文案区 + 右侧操作；**不要**再包一层 `border + border-radius + 白底卡片` 当顶栏容器。
|
||
2. **返回**：描边/次按钮，文案如「返回列表 / 返回台账」。
|
||
3. **不展示面包屑**：页头**不要**再挂「条线 / 模块」路径文案（外壳顶栏标签页已承担切换/定位，再挂易重复）。
|
||
4. **单号**：有单据号时用主色浅底**紫色胶囊**（等宽/monospace），放在标题旁；不要把单号当普通灰字塞进标题。
|
||
5. **标题**：业务页名（如「新增工单」「故障处置详情」），**不要**把车牌/主键顶成唯一大标题替代页名（主键可放在下方上下文卡）。
|
||
6. **状态标签**：任务态 / 解决情况 / 临期逾期等放在**上下文卡**，不要和页头标题挤成一行装饰条。
|
||
7. **表单页右侧**：至少「暂存/保存」描边 +「提交/归档」主色 CTA（§4.8）。
|
||
|
||
## 明确禁止
|
||
|
||
- 自绘「返回 + 车牌大字 + 副文案 + 状态 Tag」白卡片顶栏（故障页曾出现的错误形态）
|
||
- 用台账三视角 `V2SegmentedControl` 顶栏冒充详情/表单页头
|
||
- 详情/表单全页默认改回抽屉（用户明确要求抽屉除外）
|
||
- 页头重复展示与外壳标签页同义的面包屑路径
|
||
|
||
## 新建 / 改造检查
|
||
|
||
- [ ] 已对照 §4.8 或 `va-form-header`，而非临摹错误旧页
|
||
- [ ] 页头无整条白卡片外壳
|
||
- [ ] 有返回、20px 标题；有单号则紫胶囊；**无**条线/模块面包屑
|
||
- [ ] 状态 Tag 在内容卡，不在页头主标题行
|