1.4 KiB
1.4 KiB
P05 订单详情页
- 页面编码:
P05 - 页面层级:
二级页 - 页面目标:完整承接订单履约、售后和复购动作
- 主要依赖组件:
G01、G31、G34、G35
1. 页面结构(从上到下)
- 顶部状态头图区
- 场景信息区
- 履约时间轴区
- 商品清单区
- 费用明细区
- 订单基础信息区
- 底部操作栏
2. 区块说明
2.1 顶部状态头图区
- 展示当前状态文案与辅助说明
- 示例:
- 待支付
- 商家已接单
- 制作中
- 配送中
- 待自提
- 已完成
- 退款中
2.2 场景信息区
- 外卖:收货地址、骑手状态、预计送达
- 自提:取餐码、取餐时间、门店信息
- 堂食:桌号、门店、是否可继续加菜
2.3 履约时间轴区
- 使用
G34 - 展示订单关键节点时间
2.4 商品清单区
- 展示商品、规格、加料、数量
2.5 费用明细区
- 使用
G31 - 展示所有金额构成
2.6 订单基础信息区
- 展示订单号、下单时间、支付方式、支付时间等
2.7 底部操作栏
- 使用
G35 - 动作随状态变化:
- 继续支付
- 取消订单
- 催单
- 申请退款
- 去评价
- 再来一单
3. 页面状态
- 待支付态
- 履约进行态
- 已完成态
- 退款中态
- 已退款态
4. 实现备注
- 订单详情页是强状态页面,顶部状态区必须足够明确