活动页面展示图片均由后台配置，前端根据接口返回的数据进行展示，
不维护固定图片资源。
页面展示图片模块
页面展示图片包含以下模块：
- 活动内页顶部图
- 活动背景图
- 奖品展示区
- 领取流程
- 未领取按钮
- 已领取按钮
- 活动内容
- 活动规则
展示规则
- 页面初始化时，请求活动详情接口，获取页面展示所需图片资源。
- 未领取按钮、已领取按钮根据奖励领取状态展示对应图片。
- 所有展示图片均采用宽度 100%展示，高度根据图片实际比例自适应，图片不拉伸、不裁剪。
- 页面根据当前终端自动展示对应的移动端（H5/APP）图片资源。
- 当某模块未配置图片时，该模块不展示。
按钮展示规则
| 奖励状态 |
展示图片 |
| 未领取 |
展示「未领取按钮」图片 |
| 已领取 |
展示「已领取按钮」图片 |
按钮点击逻辑保持现有业务逻辑不变，仅按钮样式改为后台配置图片。
备注：以上仅调整页面展示资源获取方式，不涉及页面交互逻辑及业务流程调整。
推广区域
展示规则
推广区域采用轮播图形式展示，展示位置及样式以 UI 设计稿为准。
当仅配置 1 张图片时：
当配置 2 张及以上图片时：
- 按后台配置的排序值进行展示，排序值越小，展示顺序越靠前。
- 页面默认展示第一张图片（排序值最小）。
- 轮播方向为从右向左自动切换图片。
- 用户支持左右滑动切换图片。
- 左滑：展示下一张图片；
- 右滑：展示上一张图片。
- 自动轮播时间以后台配置为准。
- 切换至最后一张图片后，继续从第一张图片开始循环展示。
页面底部展示轮播指示器（小圆点），当前展示图片对应指示器高亮。
点击规则
点击轮播图后，根据配置执行对应操作：
| 配置类型 |
页面表现 |
| 不跳转 |
点击图片无响应 |
| 跳转活动 |
进入对应活动详情页 |
| 跳转场馆 |
进入对应游戏场馆页面 |
异常处理
- 未配置轮播图时，不展示推广区域。
- 图片加载失败时，当前图片不展示，自动切换至下一张图片。
- 当仅有一张有效图片时，不展示轮播效果。
页面布局规则（移动端）
- 页面所有模块均根据后台返回的数据动态展示，不允许写死模块高度。
- 页面图片均采用宽度 100%，高度自适应展示，按照图片原始比例进行缩放，不拉伸、不裁剪。
- 各模块高度根据实际展示内容自适应，页面整体高度随内容动态变化。
- 当某模块未配置展示内容时，不展示该模块，后续模块自动向上补齐，不保留空白区域。
- 当活动内容、活动规则等模块图片高度发生变化时，页面整体高度需同步自适应，保证页面连续展示，不出现内容重叠、截断或留白。
- 页面支持不同活动配置不同尺寸、不同高度的图片资源，均需正常展示。
页面适配要求（移动端）
- 支持不同高度的图片资源展示。
- 支持页面内容增减后的动态布局。
- 页面可正常上下滚动浏览全部内容。
- 各模块之间保持设计稿规定的间距，不因图片尺寸变化导致布局异常。
- 不出现图片拉伸、变形、重叠、遮挡、超出屏幕、异常留白等问题。
宽屏：左侧 H5 原型，右侧本 PRD 并排对照。
真机 / 窄屏：仅看原型，不展示 PRD。