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,86 @@
# 信息架构与路由
## 1. 顶层信息架构
小程序采用 `4 个 Tab + 若干二级页面 + 若干弹层 / 抽屉组件` 的结构。
### 1.1 Tab 页面
| 编码 | 页面名称 | 路由建议 | 页面层级 | 说明 |
| --- | --- | --- | --- | --- |
| `T01` | 首页 | `pages/tab/home/index` | Tab | 选店、活动导流、推荐 |
| `T02` | 点餐 | `pages/tab/menu/index` | Tab | 商品浏览、加购、结算入口 |
| `T03` | 订单 | `pages/tab/orders/index` | Tab | 订单列表、履约、售后 |
| `T04` | 我的 | `pages/tab/me/index` | Tab | 资产、消息、服务、复购 |
### 1.2 二级页面
| 编码 | 页面名称 | 路由建议 | 页面层级 | 入口来源 |
| --- | --- | --- | --- | --- |
| `P01` | 门店选择页 | `pages/store/select/index` | 二级页 | 首页、点餐页 |
| `P02` | 地址管理页 | `pages/address/list/index` | 二级页 | 我的、结算页 |
| `P03` | 结算确认页 | `pages/checkout/index` | 二级页 | 点餐页 |
| `P04` | 支付成功页 | `pages/payment/success/index` | 二级页 | 结算确认页 |
| `P05` | 订单详情页 | `pages/order/detail/index` | 二级页 | 订单页、支付成功页 |
| `P06` | 退款申请页 | `pages/order/refund/apply/index` | 二级页 | 订单详情页 |
| `P07` | 退款详情页 | `pages/order/refund/detail/index` | 二级页 | 订单页、订单详情页 |
| `P08` | 评价页 | `pages/review/create/index` | 二级页 | 订单详情页 |
| `P09` | 领券中心页 | `pages/coupon/center/index` | 二级页 | 首页、我的 |
| `P10` | 秒杀活动页 | `pages/activity/seckill/index` | 二级页 | 首页、点餐页 |
| `P11` | 限时折扣活动页 | `pages/activity/flash-sale/index` | 二级页 | 首页、点餐页 |
| `P12` | 会员中心页 | `pages/member/center/index` | 二级页 | 我的 |
| `P13` | 积分商城页 | `pages/points/mall/index` | 二级页 | 我的 |
| `P14` | 储值充值页 | `pages/prepaid/index` | 二级页 | 我的 |
| `P15` | 次卡页 | `pages/pass-card/index` | 二级页 | 我的 |
| `P16` | 消息中心页 | `pages/message/center/index` | 二级页 | 我的 |
| `P17` | 帮助中心页 | `pages/help/center/index` | 二级页 | 我的 |
| `P18` | 堂食扫码确认页 | `pages/dine-in/confirm/index` | 二级页 | 扫码入口、首页 |
### 1.3 弹层 / 抽屉 / 组件级页面
| 编码 | 名称 | 建议形态 | 所属页面 | 说明 |
| --- | --- | --- | --- | --- |
| `C01` | 商品详情抽屉 | 底部抽屉 / 右滑抽屉 | 点餐页 | 规格、加料、数量选择 |
| `C02` | 购物车抽屉 | 底部抽屉 | 点餐页 | 已选商品清单 |
| `C03` | 登录授权弹层 | 中央弹窗 / 底部弹层 | 全局 | 订单与资产前拦截 |
| `C04` | 优惠选择弹层 | 底部抽屉 | 结算页 | 券、积分、余额选择 |
| `C05` | 支付方式弹层 | 底部抽屉 | 结算页 | 微信支付 / 余额支付 |
| `C06` | 地址选择抽屉 | 底部抽屉 | 结算页 | 快捷切换地址 |
## 2. 页面层级关系
### 2.1 主链路关系
`首页 / 点餐 / 我的``门店选择`
`点餐``商品详情抽屉``购物车抽屉``结算确认页``支付成功页``订单详情页`
`订单页``订单详情页``退款申请页 / 评价页`
`我的``会员中心 / 积分商城 / 储值充值 / 次卡 / 消息中心 / 帮助中心`
### 2.2 堂食链路关系
`扫码``堂食扫码确认页``点餐页(堂食场景)``商品详情抽屉``购物车抽屉``结算确认页``订单详情页`
## 3. Tab 与二级页切换规则
- Tab 页面之间通过底部导航切换
- 二级页面统一采用顶部导航栏返回
- `商品详情抽屉``购物车抽屉` 不单独占用路由栈
- `结算确认页``订单详情页``会员中心页` 等重要业务页使用完整页面承载
## 4. 页面显示规则
### 4.1 Tab 页面
- 保持底部 TabBar 可见
- 顶部导航不显示返回按钮
- 页面滚动位置可按产品需要保留
### 4.2 二级页面
- 显示顶部导航和返回按钮
- 进入后覆盖当前 Tab 内容
- 返回时回到来源页面
### 4.3 抽屉与弹层
- 不应中断当前页面上下文
- 应支持手势关闭 / 点击遮罩关闭(支付与关键确认除外)
- 关闭后保留当前页面已选状态