docs: split prototype specs and add execution guides

This commit is contained in:
2026-03-06 11:24:40 +08:00
parent ba1c5009d2
commit 70b651ad39
33 changed files with 2702 additions and 0 deletions

View File

@@ -0,0 +1,72 @@
# P03 结算确认页
- 页面编码:`P03`
- 页面层级:`二级页`
- 适用场景:`外卖 / 自提 / 堂食`
- 页面目标:让用户确认履约信息、优惠和金额,并完成支付
- 主要依赖组件:`G01``G30``G31``G32``G35`
## 1. 页面结构(从上到下)
1. 顶部导航栏
2. 场景信息卡
3. 商品清单区
4. 优惠资产区
5. 备注与附加信息区
6. 费用明细区
7. 底部支付栏
## 2. 区块说明
### 2.1 场景信息卡
- 外卖:展示收货地址、预计送达
- 自提:展示门店、自提时间、取餐人信息
- 堂食:展示门店、桌号、堂食说明
### 2.2 商品清单区
- 展示商品、规格、加料、数量、小计
### 2.3 优惠资产区
- 使用 `G32`
- 入口包含:
- 优惠券选择
- 积分抵扣
- 储值余额支付
- 次卡核销(适用时)
### 2.4 备注与附加信息区
- 订单备注
- 餐具选择
- 其他补充字段(按场景可选)
### 2.5 费用明细区
- 使用 `G31`
- 必须清楚展示所有金额构成
### 2.6 底部支付栏
- 使用 `G35`
- 左侧显示实付金额
- 右侧主按钮:提交订单并支付
## 3. 场景差异
### 外卖
- 必须完成地址校验、起送价校验
### 自提
- 必须完成自提时间选择和取餐人信息校验
### 堂食
- 必须展示桌号,不展示配送相关字段
## 4. 页面状态
- 优惠不可用时展示原因
- 地址超范围时禁止提交
- 门店休息时禁止支付
## 5. 实现备注
- 结算页核心是“信息确认 + 金额确认”
- 所有会影响实付金额的项目都必须可见