/pages/food-benefits/food-benefitspages/food-benefits/food-benefits.uvue| 功能 | 当前实现 | 后续接口目标 |
|---|---|---|
| 顶部主图 | 展示当前选中图册项的大图,**主图自身支持左右滑动**切换图册项,与下方缩略图双向联动(点缩略图主图滑过去、滑主图缩略图跟着走)。 | 使用后台返回的 HTTPS 图片 URL,并提供加载失败占位图。 |
| 横向图册 | 体验版使用 6 项重复演示数据验证横向滑动,仅由 2 张图片交替复用;点击或滑动结束后,中心项自动选中、放大并带动画吸附到容器中央。 | 后台返回图片、名称、排序和启用状态,正式版图片走后台/CDN。 |
| 动态菜名 | 主图上显示当前菜品名称,使用古典艺术行楷字体子集。 | 正式环境通过完整字体包或 CDN 字体覆盖后台任意名称字符。 |
| 专题描述 | 橙色渐变卡片显示后台返回的专题固定描述,不随图册选择变化。 | 后台返回专题级纯文本描述,并限制长度及换行数量。 |
| 餐饮服务列表 | 使用 12 条演示商户数据,首批展示 4 条,滚动到底部分批追加;包含首屏/下一页失败重试、加载动画、到底和空列表状态。 | 接入分类关联商户分页列表及可用状态。 |
| 商户详情 | 点击商户进入 /pages/merchant/merchant,当前同步传递餐饮类型、商户名称、图片、地址和优惠快照。 |
使用商户或权益 ID 请求真实详情,接口返回后覆盖路由快照。 |
| 返回 | 点击左上角返回按钮回到人才权益页。 | 无。 |
| 场景 | 页面处理要求 |
|---|---|
| 图册为空 | 展示专题默认图和“暂无图册内容”,隐藏缩略图区域。 |
| 图片加载失败 | 使用统一餐饮占位图,不能出现高度塌陷或黑块。 |
| 名称字符不在字体子集 | 回退系统中文字体;正式发布前接入完整字体。 |
| 描述为空 | 隐藏描述卡或展示后台确认的默认文案。 |
| 商户列表为空 | 展示“暂无相关餐饮服务”的空状态。 |
| 首屏加载失败 | 展示“餐饮服务加载失败”和重新加载,不误显示空状态。 |
| 下一页加载失败 | 保留已加载商户,底部显示“加载失败,点击重试”,重试前不推进页码。 |
| 商户已下架 | 列表显示不可用状态,不允许继续领取或核销。 |
static/common/image-placeholder.png(全站唯一兜底图,24KB),图册/商户/商品/支付/订单相关展示都用它。icon/吃 素材库,正式版由后台/CDN配置,不直接打入小程序代码包。/data/talent-card/uploads/fonts/gudian-xingkai.ttf(/uploads/fonts/gudian-xingkai.ttf),由 App.uvue 启动时用 uni.loadFontFace({ family:'FoodCalligraphyFull', global:true }) 动态加载;专题页的 .scene-name/.dish-name 全局优先用它,加载失败或缺字回退到包内子集与系统字体。food-calligraphy-subset.ttf 子集,只用于设计稿演示字符。