P12 西湖有礼商城首页

页面定位

作为统一商品浏览入口，支持搜索与排序，并分发到商品详情与下单确认链路。

适用角色与入口

• 适用角色：全部用户
• 页面入口：底部 Tab「商城」

页面组成

1. 顶部 Banner

字段：bannerImage、jumpUrl

用于承载商城运营 Banner。

2. 搜索区

字段：keyword

支持当前页商品模糊搜索。

3. 排序区

字段：sortType

支持：

• 综合排序
• 价格高到低
• 价格低到高

4. 商品列表区

字段：goodsId、goodsImage、title、channel、cashPrice、pointsPrice、linePrice、supportModes、goodsType、status

统一商品列表可同时展示：

• 积分商品
• 周边商品

商品卡片需明确表达以下状态：

• 可兑换
• 可购买
• 不可用（如下架、售罄）

关键交互

• 搜索：输入关键字后刷新列表
• 排序切换：切换排序条件后刷新列表
• 点击商品卡片：进入 P18 商品详情页

业务逻辑

• 进入页面后拉取商城首页聚合数据
• 支持关键字模糊搜索与排序
• 页面返回时需保留滚动位置

校验规则

• keyword 长度上限 30 字
• 切换排序条件时，需保留当前 keyword 条件

状态与异常处理

• 空状态：暂无商品
• 加载中：展示骨架屏
• 失败态：提供重试入口
• 异常文案：商城数据加载失败，请稍后再试

跳转关系

P12 -> P18

埋点建议

• mall_home_show
• mall_search
• mall_sort_change
• mall_goods_click