1.2 KiB
1.2 KiB
C01 商品详情抽屉
- 页面编码：
C01 - 页面层级：
组件级抽屉 - 页面目标：完成商品选配，并把用户送入购物车
- 主要依赖组件：
G22、G23、G24
1. 抽屉结构（从上到下）
- 商品图片区
- 商品基础信息区
- 规格做法区
- 加料区
- 数量与金额区
- 底部主操作区
2. 区块说明
2.1 商品图片区
- 展示主图，允许左右切换附图（可选）
2.2 商品基础信息区
- 展示：
- 商品名称
- 标签
- 描述
- 售价
- 划线价
- 月售 / 热销信息（可选）
2.3 规格做法区
- 使用
G23 - 支持单选 / 多组单选
- 选择后实时刷新价格和库存
2.4 加料区
- 使用
G24 - 支持多选和附加价格
2.5 数量与金额区
- 使用
G22 - 实时展示当前组合总价
2.6 底部主操作区
- 主按钮：加入购物车
- 次按钮：立即购买（可选）
3. 状态规则
- 规格未选全时，主按钮不可用
- 商品售罄时，显示不可售状态
- 库存不足时，数量步进器受限
4. 实现备注
- 抽屉应保留当前点餐页上下文
- 关闭抽屉不应导致列表位置丢失