# T01 首页 - 页面编码:`T01` - 页面层级:`Tab` - 适用场景:`外卖 / 自提 / 堂食导流` - 页面目标:完成选店、选场景、看活动、快速进入点餐 - 主要依赖组件:`G02`、`G10`、`G11`、`G12`、`G13`、`G21` ## 1. 页面结构(从上到下) 1. 顶部信息区 2. 门店切换条 3. 场景切换条 4. Banner 活动区 5. 快捷入口区 6. 推荐商品区 7. 门店服务信息区 ## 2. 区块说明 ### 2.1 顶部信息区 - 左侧显示当前位置 / 当前门店简称 - 右侧显示消息入口 - 点击门店或位置进入 `P01 门店选择页` - 点击消息入口进入 `P16 消息中心页` ### 2.2 门店切换条 - 使用 `G10` - 显示当前门店名称、营业状态、距离 - 支持点击切换门店 ### 2.3 场景切换条 - 使用 `G11` - 固定提供 `外卖`、`自提`、`堂食` 三项 - 切换后刷新下方活动和推荐内容 ### 2.4 Banner 活动区 - 展示门店主推活动轮播 - Banner 点击可跳转: - `P09 领券中心页` - `P10 秒杀活动页` - `P11 限时折扣活动页` - `P12 会员中心页` ### 2.5 快捷入口区 - 建议 2 行网格或 1 行宫格 - 包含以下入口: - 新客有礼 - 领券中心 - 满减活动 - 秒杀专区 - 限时折扣 - 储值充值 - 次卡专区 - 会员中心 ### 2.6 推荐商品区 - 按顺序展示: - 热销推荐 - 套餐推荐 - 复购推荐 - 猜你喜欢 - 每个区块使用横滑或纵向卡片列表 - 商品卡点击进入 `C01 商品详情抽屉` ### 2.7 门店服务信息区 - 使用 `G12` + `G13` - 展示: - 营业时间 - 配送范围 / 起送价 / 配送费 - 自提规则 - 堂食规则 - 联系门店 - 到店导航 ## 3. 页面主动作 - 切换门店 - 切换场景 - 进入点餐页 - 进入活动页 - 打开商品详情 ## 4. 页面状态 ### 默认态 - 有门店、有活动、有推荐商品 ### 空态 - 无可用门店时展示空态,并提供重新定位 - 无活动时隐藏活动区,保留推荐区 ### 异常态 - 定位失败时提示手动选店 - 门店休息时展示“休息中”,但可保留浏览 ## 5. 实现备注 - 首页优先是“导流页”,不是深度浏览页 - 推荐商品只展示摘要,不在首页直接承载复杂选配