组装页2.md 56 KB

汇丰权益组装页需求文档

一、需求范围说明

本文档覆盖“页面管理-组装页”的后台配置能力,以及组装页在移动端运行环境中的展示、分享、权益动态筛选、按钮跳转和弹窗交互规则。后台配置的是跳转目标地址类型,包括 H5 地址或小程序 AppID/页面路径;客户实际使用环境为 App 内 H5 容器或微信小程序内页面。

需求范围包括:

  • 移动端组装页:页面标题、微信分享、图片模块、图文模块、权益商品模块、按钮模块、底部弹窗、第三方跳转拦截提示。移动端运行环境包括 App 内 H5 和微信小程序内页面。
  • 后台管理端:组装页列表、查询、分页、新建、编辑、保存草稿、发布上线、获取链接、模块新增/复制/删除/排序、微信分享卡片配置、各模块字段配置。
  • 关联配置:借记卡/信用卡权益商品的“显示页面-组装页”选择,决定权益商品是否可在指定组装页中被动态展示。
  • 接口范围:当前未提供正式接口说明,本文根据 PDF、PC Demo 与 H5 Demo 设计虚拟接口,均标记为【虚拟接口,待技术确认】。

二、功能范围与模块结构

2.1 移动端模块结构

组装页是可灵活配置的营销活动或线下沙龙引导落地页。页面内容由后台按模块顺序拼装,移动端在 App 内 H5 或微信小程序内按配置顺序自上而下展示。后台的链接配置项用于描述目标类型,选择 H5 时配置 H5 地址,选择小程序时配置 AppID 和页面路径;移动端再根据当前运行环境和端能力执行打开或跳转。

  • 顶部系统状态栏与导航栏:展示返回入口和页面标题。页面标题读取后台“组装页名称”,用于 Page Title 与导航栏标题回显。
  • 微信分享能力:仅小程序环境生效。后台开启自定义微信分享后,前端注入分享标题、缩略图与当前页面链接;关闭时禁用分享菜单。
  • 图片模块:作为页面头图或通栏广告图展示,移动端不支持点击。
  • 图文模块:展示活动说明、正文、文字链接与外链图标。正文由后台富文本配置生成。后台可添加多个图文模块,移动端按排序多次出现时仍属于同一个功能模块,本文只描述一次完整规则。
  • 权益商品模块:展示可配置大标题和当前客户有权限看到的权益商品列表。具体商品来自全局权益商品配置,并结合客户标签、发放资格和组装页展示配置动态筛选。
  • 按钮模块:展示一个或多个操作按钮,支持红色主按钮和白色次按钮;点击动作支持直接跳转或先弹出底部提示弹窗。
  • 底部提示弹窗:由按钮模块配置触发,展示弹窗标题、描述、取消按钮、确认按钮及确认按钮跳转配置。
  • 第三方跳转拦截弹窗:当跳转目标识别为第三方页面时,在真正跳转前提示“您正在离开汇丰中国”,客户确认后才跳转。

2.2 后台/管理端配置结构

后台入口为“汇丰银行 / 页面管理 / 组装页”。后台通过列表和编辑页管理多个组装页。

  • 列表查询区:支持按页面 ID、页面名称筛选组装页。
  • 列表区:展示操作、页面 ID、组装页名称、发布状态、创建时间、更新时间,并提供分页。发布状态包括“草稿”“待发布”“正式”。
  • 新建/编辑页基础信息区:配置组装页名称,页面 ID 由系统保存后自动生成。
  • 微信分享卡片配置区:控制是否启用自定义微信分享,并配置分享缩略图和分享标题。
  • 模块配置区:支持图片模块、权益商品模块、图文模块、按钮模块的组合配置。
  • 模块操作区:支持模块排序、复制、删除;权益商品模块每页仅允许一个,不支持复制。
  • 按钮配置区:支持配置按钮文案、点击动作、按钮样式、跳转目标、弹窗内容和弹窗确认按钮跳转。后台配置的跳转目标可以是 H5 地址、小程序 AppID/页面路径,或固定目标“太古地产”“龙腾”。
  • 获取链接弹窗:支持生成正式环境 H5 链接、小程序链接和草稿预览链接,并可选择 Campaign ID、Channel ID 拼接到链接参数。草稿状态仅生成草稿预览链接;待发布和正式状态可生成正式环境链接与草稿预览链接。

2.3 前后台关系概览

组装页本身由后台模块配置驱动,权益商品列表则由权益商品管理、客户标签和发放状态共同决定。后台保存草稿后可以获取预览链接;发布上线后才展示正式链接。

移动端模块 后台/管理端配置 依赖接口 用户操作影响 说明
页面标题 组装页名称 查询组装页详情【虚拟接口,待技术确认】 同时用于后台列表检索和移动端导航栏标题
微信分享 自定义微信分享、分享缩略图、分享标题 查询组装页详情【虚拟接口,待技术确认】 小程序用户分享页面 分享链接需保留页面 ID、Campaign ID、Channel ID
图片模块 图片模块上传图 查询组装页详情【虚拟接口,待技术确认】 移动端按图片比例自适应展示,不支持点击
图文模块 富文本编辑器内容 查询组装页详情【虚拟接口,待技术确认】 点击正文内文字链接 富文本中的链接通过内置浏览器打开;第三方链接需弹出离开汇丰提示
权益商品模块 权益商品模块大标题;权益商品“显示页面-组装页” 查询组装页可见权益【虚拟接口,待技术确认】 点击权益商品进入承接页 按客户标签和发放资格动态筛选,未匹配则模块隐藏
按钮模块 按钮文案、样式、动作、跳转目标、弹窗 查询组装页详情【虚拟接口,待技术确认】 点击按钮、弹窗确认/取消 后台配置 H5 地址或小程序参数;移动端在 App 内或小程序内执行跳转
获取链接 Campaign ID、Channel ID 选择 查询 Campaign 列表、查询 Channel 列表【虚拟接口,待技术确认】 后台复制链接用于投放 草稿仅展示预览链接;正式/已修改状态展示正式链接和预览链接

三、移动端功能详细说明

3.1 页面头部导航栏与标题

3.1.1 模块说明

页面头部位于组装页顶部,包含返回按钮和标题。标题用于告诉客户当前页面主题,必须读取后台配置的“组装页名称”。

3.1.2 展示规则

客户打开组装页后,前端根据页面 ID 查询组装页详情。若接口返回页面名称,则导航栏展示该名称;若页面名称为空或接口异常,展示兜底标题“组装页”,并记录异常日志。

3.1.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
返回按钮 图标按钮 导航栏左侧 系统默认 App 内 H5 或小程序容器固定导航能力 始终展示 点击返回上一页;无上一页时返回权益首页或关闭 WebView,具体承接待技术确认 返回失败时停留当前页
页面标题 文本 导航栏居中 后台配置 后台“组装页名称”字段 单行展示,超长省略 不可点击 为空时展示“组装页”并记录日志

3.1.4 交互规则

点击返回按钮时,优先执行端内返回;若当前页面为外部投放直接打开且无上一页,则应关闭当前 WebView 或跳转权益首页,具体由端能力确认。

3.1.5 状态规则

本模块无业务状态,仅区分正常、标题为空、接口失败三类展示情况。

3.1.6 异常、空数据和边界规则

页面 ID 缺失时,页面不加载组装页内容,展示错误提示“页面不存在或已失效”。页面未发布但非草稿预览链接访问时,展示“页面暂不可访问”。

3.2 微信小程序分享

3.2.1 模块说明

微信分享能力只在小程序环境生效,用于将当前组装页分享给其他客户或群聊。

3.2.2 展示规则

客户在 App 内 H5 环境打开组装页时,不调用微信原生分享控制逻辑。客户在微信小程序内打开组装页时,若后台关闭“自定义微信分享”,前端调用小程序能力禁用分享菜单;若开启,则注入分享标题、分享缩略图和当前页面链接。

3.2.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
自定义微信分享开关 布尔值 不直接展示 后台配置 后台“自定义微信分享”复选框 开启时允许分享,关闭时禁用分享菜单 用户点击小程序分享入口时生效 取值异常按关闭处理
分享标题 文本 微信分享卡片 后台配置 后台“分享标题”字段 开启自定义分享后必填并注入分享 SDK 用户分享时展示 为空时禁用自定义分享并记录日志
分享缩略图 图片 微信分享卡片 后台配置 后台“分享缩略图”字段,建议 100x100 开启自定义分享后必填 用户分享时展示 图片加载失败时使用小程序默认分享图,待技术确认
分享链接 链接 微信分享卡片 前端计算 当前页面 URL + 页面 ID + 原 Campaign ID/Channel ID 参数 分享链接必须携带页面 ID;如原链接含 Campaign ID、Channel ID,需保留 被分享用户打开后按链接参数进入同一页面 参数拼接失败时至少保留页面 ID

3.2.4 交互规则

用户在小程序内点击分享时,前端将当前页面 ID、Campaign ID、Channel ID 作为分享链接参数传出。被分享用户打开链接后,页面按页面 ID 查询配置,Campaign ID 与 Channel ID 用于后续投放归因和埋点。

3.2.5 状态规则

状态值 状态含义 展示文案 展示样式 可操作按钮 规则说明
关闭 后台未启用自定义分享 禁用分享菜单 小程序环境下禁用分享能力
开启且配置完整 后台已启用且标题、缩略图完整 分享标题 微信分享卡片 分享 注入自定义标题、缩略图和页面链接
开启但配置缺失 后台已启用但必填信息缺失 按关闭处理 需记录配置异常

3.2.6 异常、空数据和边界规则

小程序 SDK 初始化失败时,不影响页面浏览,但分享入口不可用。分享参数中 Campaign ID、Channel ID 为空时,不拼接对应参数。

3.3 图片模块

3.3.1 模块说明

图片模块用于展示页面主视觉、广告图或分隔视觉。H5 Demo 中该模块位于页面顶部,作为通栏头图展示。

3.3.2 展示规则

后台可添加多个图片模块,每个图片模块在移动端按后台排序位置展示。图片宽度按屏幕 100% 展示,高度按图片原始比例自适应,不拉伸变形。

3.3.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
图片 图片 模块配置顺序对应位置 后台配置 后台“图片模块-上传图片”字段,建议宽度 750px 100% 宽度展示,高度按比例自适应 移动端不支持点击 图片为空时该模块不应发布;图片加载失败时展示占位并记录日志

3.3.4 交互规则

图片模块仅作静态视觉展示,不支持点击跳转、放大预览或长按操作。

3.3.5 状态规则

本模块无业务状态。

3.3.6 异常、空数据和边界规则

后台保存时必须校验图片已上传;若历史数据中图片为空,前端隐藏该图片模块并上报配置异常。图片格式、大小限制未在 Demo 中体现,需技术和设计补充确认。

3.4 图文模块

3.4.1 模块说明

图文模块用于展示活动说明、沙龙介绍、规则说明等正文内容。后台通过富文本编辑器维护,移动端按富文本内容渲染。H5 Demo 中出现了两个图文区域,但它们都来源于后台同一种“图文模块”;如果后台配置多个图文模块,移动端只按排序重复渲染同一功能模块,不拆成多个不同需求点。

3.4.2 展示规则

图文模块按后台排序展示。每个图文模块都使用同一套展示、交互和异常规则;后台配置几次,移动端就按顺序渲染几段图文内容。富文本支持加粗、斜体、下划线、有序列表、无序列表、一级至三级标题、链接、图片和清除格式。PDF 原始需求强调字体由前端锁定为汇丰标准字体,富文本排版不得破坏移动端阅读。

3.4.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
富文本内容 富文本 图文模块区域 后台配置 后台“图文模块-富文本编辑器内容” 按 HTML 内容渲染,移动端需适配宽度 正文内链接可点击 内容为空时可保存但不建议发布;若 HTML 解析失败,展示纯文本兜底
文字链接 文本链接 富文本正文内 后台配置 富文本中插入的链接 链接文字按加粗或链接样式展示,右侧可渲染外链图标 点击后打开配置链接;第三方链接先弹出离开汇丰提示 链接为空或格式非法时点击无响应并记录日志
外链图标 图标 文字链接右侧 系统默认 H5 Demo 中斜箭头外链图标 与文字链接同行展示 点击图标等同点击文字链接 图标加载失败不影响文字链接

3.4.4 交互规则

用户点击正文内链接时,前端判断链接目标。后台富文本中维护的是链接地址,移动端根据当前运行环境执行打开:App 内 H5 环境优先在 App WebView 或端内浏览器打开;小程序环境按小程序 WebView 能力或端约定打开。第三方链接需先展示“您正在离开汇丰中国”确认弹窗,用户点击“继续前往”后再打开目标链接。

3.4.5 状态规则

本模块无业务状态。

3.4.6 异常、空数据和边界规则

富文本内图片宽度不得超出屏幕。富文本中含不可识别标签时,前端应过滤高风险脚本,仅保留安全展示内容。具体白名单规则待技术确认。

3.5 权益商品模块

3.5.1 模块说明

权益商品模块用于在组装页中展示客户可见的权益商品。该模块是组装页的核心动态区域,支持千人千面展示。

3.5.2 展示规则

每个组装页最多配置一个权益商品模块。后台可配置模块大标题,若大标题为空,移动端隐藏标题但仍可展示商品列表。商品列表不在组装页内手工录入,而是从全局权益商品列表中筛选出“显示页面-组装页”包含当前组装页、且客户满足权限/发放条件的商品。

若当前客户没有任何匹配商品,则整个权益商品模块隐藏,不展示空态文案。

3.5.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
模块大标题 文本 权益商品模块顶部 后台配置 组装页“权益商品模块-可配置大标题” 为空时隐藏标题 不可点击 超长按一行或多行展示规则待设计确认
权益图标 图片/图标 每个权益商品左侧 接口获取 查询组装页可见权益接口返回“权益图标” 圆形区域展示 点击商品行任意区域触发跳转 图片为空时展示系统默认图标
权益名称 文本 每个权益商品主标题 接口获取 查询组装页可见权益接口返回“权益名称” 单行展示,超长省略 点击商品行进入承接页 为空时隐藏该商品并记录异常
权益简介 文本 权益名称下方 接口获取 查询组装页可见权益接口返回“权益简介” 单行或两行展示,超长省略 点击商品行进入承接页 为空时仅展示权益名称
右侧箭头 图标 商品行右侧 系统默认 H5 Demo 固定展示 表示可点击进入 点击等同商品行点击

3.5.4 交互规则

用户点击权益商品后,前端执行 SSO 登录或端内登录态校验,再打开该权益商品对应承接目标。后台权益商品可配置 H5 地址或小程序参数;移动端根据当前运行环境执行打开。承接页规则与权益商品配置有关:有详情页的商品进入详情页;无详情页的商品可直接从组装页跳转到外部列表页、第三方详情页、H5 地址或小程序页面。

3.5.5 状态规则

状态值 状态含义 展示文案 展示样式 可操作按钮 规则说明
有可见商品 客户标签、发放资格、展示页面均匹配 后台配置的大标题和商品列表 标题 + 列表行 商品行 正常展示
无可见商品 客户无权限或未发放任何关联商品 模块整体隐藏 不展示空态
权益未上架 商品未处于可展示状态 不展示该商品 根据权益商品状态过滤
组装页未关联 商品未选择当前组装页 不展示该商品 根据权益商品“组装页”配置过滤

3.5.6 异常、空数据和边界规则

查询客户标签或可见权益失败时,权益商品模块隐藏,并记录接口异常日志,不影响其他模块展示。若单个权益商品字段异常,仅剔除异常商品,不阻断页面整体展示。

3.6 按钮模块

3.6.1 模块说明

按钮模块用于承载活动报名、了解更多、外部服务跳转等操作。一个按钮模块内可配置多个按钮,H5 Demo 展示为底部两个按钮。

3.6.2 展示规则

按钮模块按后台排序展示。按钮样式支持“突出显示(红色)”和“次要操作(白色)”。按钮文案必填。按钮点击动作支持“跳转链接”和“弹窗提示”。

3.6.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
按钮文案 文本 按钮内部 后台配置 按钮模块“按钮文案” 必填;按配置展示 点击按钮触发动作 为空时后台阻断保存
按钮样式 枚举 按钮视觉 后台配置 “突出显示(红色)”或“次要操作(白色)” 红色按钮为主操作,白色按钮为次操作 不影响动作 异常值按次要操作展示
点击动作 枚举 不直接展示 后台配置 “跳转链接”或“弹窗提示” 按动作类型执行 点击按钮触发 未配置时后台阻断保存
跳转目标配置 链接/枚举 不直接展示 后台配置 H5地址、小程序 AppID/页面路径、太古地产、龙腾 动作为跳转链接时必填或选择固定目标 点击后由 App 或小程序环境执行打开;第三方跳转先拦截确认 缺失时后台阻断保存

3.6.4 交互规则

当按钮动作为“跳转链接”时,用户点击按钮后按后台配置的目标执行跳转。后台选择 H5 时配置 H5 地址,移动端在 App 内 H5 环境优先使用 App WebView 或端内浏览器打开,在小程序环境按小程序 WebView 或端约定打开;后台选择小程序时配置 AppID 和页面路径,移动端按当前端能力拉起对应小程序页面;太古地产、龙腾为固定跳转项,实际 URL 或端能力待技术确认。若识别为第三方页面,先弹出离开汇丰确认弹窗。

当按钮动作为“弹窗提示”时,用户点击按钮后从页面底部拉起半屏弹窗。点击弹窗右上角关闭图标或左侧取消按钮时,仅关闭弹窗。若右侧确认按钮展示且配置了跳转,点击确认后执行确认按钮跳转;若右侧确认按钮关闭展示,则弹窗不展示右侧确认按钮,用户只能取消或关闭。

3.6.5 状态规则

状态值 状态含义 展示文案 展示样式 可操作按钮 规则说明
直接跳转 点击动作=跳转链接 按钮文案 红色或白色 当前按钮 点击后执行链接跳转
弹窗提示-有确认 点击动作=弹窗提示且确认按钮展示 按钮文案;弹窗标题/描述/取消/确认 底部弹窗 取消、确认、关闭 确认后按确认按钮链接跳转
弹窗提示-无确认 点击动作=弹窗提示且确认按钮不展示 按钮文案;弹窗标题/描述/取消 底部弹窗 取消、关闭 不触发跳转

3.6.6 异常、空数据和边界规则

按钮模块内按钮数量为 0 时,后台阻断保存。H5 地址为空、小程序 AppID 为空、小程序页面路径为空、弹窗标题为空、弹窗描述为空、取消按钮文案为空、确认按钮展示但确认跳转目标缺失时,后台均阻断保存。

3.7 第三方跳转拦截弹窗

3.7.1 模块说明

第三方跳转拦截弹窗用于在客户离开汇丰中国页面前进行风险提示。

3.7.2 展示规则

当按钮跳转、弹窗确认跳转或富文本链接被识别为第三方页面时,展示居中弹窗。弹窗标题固定为“您正在离开汇丰中国”,说明文案固定提示外部网站政策与汇丰网站条款、隐私政策不同。

3.7.3 字段说明

字段/元素 类型 展示位置 数据来源 来源说明 展示规则 交互规则 异常规则
弹窗标题 文本 拦截弹窗顶部 写死 “您正在离开汇丰中国” 固定展示 不可点击
提示说明 文本 弹窗正文 写死 外部网站政策提示 固定展示 不可点击
取消按钮 按钮 弹窗底部左侧 写死 “取消” 固定展示 点击关闭弹窗并停留当前页
继续前往按钮 按钮 弹窗底部右侧 写死 “继续前往” 固定展示 点击后打开第三方链接 跳转失败时提示“跳转失败,请稍后重试”

3.7.4 交互规则

用户点击取消或遮罩区域时,关闭拦截弹窗并停留当前页。用户点击继续前往后,关闭弹窗并打开原目标链接。

3.7.5 状态规则

本模块仅在第三方跳转前触发,不独立存在业务状态。

3.7.6 异常、空数据和边界规则

第三方识别规则未在材料中明确,当前按“非汇丰域名、太古地产、龙腾”等外部目标推定为第三方,需技术和合规确认。

四、后台/管理端功能详细说明

4.1 页面管理-组装页

4.1.1 页面入口

菜单路径为“汇丰银行 / 页面管理 / 组装页”。页面用于管理营销活动、沙龙引导等可配置落地页。管理人员可在列表中查询历史配置,进入新建或编辑页面后,通过模块组合生成 H5/小程序端页面。

4.1.2 查询筛选区

查询区用于快速定位已有组装页。Demo 中页面 ID 和页面名称均为输入框,查询逻辑为包含匹配;PDF 描述为精准查询,二者存在疑似冲突,已列入待确认问题。

字段名称 字段类型 是否必填 默认值 数据来源 查询规则 校验规则 说明
页面ID 文本输入框 用户操作产生 按页面 ID 查询;Demo 为包含匹配 不限制为空 用于查找指定页面
页面名称 文本输入框 用户操作产生 按组装页名称查询;Demo 为包含匹配 不限制为空 用于按名称查找页面

4.1.3 列表区

列表按页面 ID 倒序展示组装页。分页支持 10、20、50 条每页,并显示 Total 数量。

列表字段 字段类型 数据来源 展示规则 排序规则 空值规则 说明
操作 按钮组 系统默认 固定展示“编辑”“链接” 不参与排序 用于进入编辑页或获取页面链接
页面ID 文本 接口获取 居中展示 默认按 ID 倒序 为空时显示“-” 保存后系统生成
组装页名称 文本 接口获取 超长显示 tooltip 默认按 ID 倒序 为空时显示“-” 同步影响 H5/小程序端标题
发布状态 枚举标签 接口获取 published 展示“正式”,其他展示“草稿” 默认按 ID 倒序 异常值按草稿展示 编辑页中 modified 状态按“有未保存修改/草稿”处理
创建时间 日期时间 接口获取 yyyy-MM-dd HH:mm:ss 默认按 ID 倒序 为空显示“-” 新建保存时生成
更新时间 日期时间 接口获取 yyyy-MM-dd HH:mm:ss 默认按 ID 倒序 为空显示“-” 每次保存时更新

4.1.4 新增/编辑弹窗或配置表单

后台编辑页不是弹窗,而是列表页内切换到编辑视图。新建时页面 ID 显示“保存后生成”;编辑时回显已有配置。

字段名称 字段类型 是否必填 默认值 数据来源 配置用途 校验规则 H5/小程序端影响
页面ID 系统只读文本 保存后生成 系统默认 唯一标识组装页 不允许手工编辑 作为页面访问和分享链接的页面 ID
组装页名称 文本输入框 用户操作产生 后台管理名称和移动端标题 为空阻断保存,提示“保存失败:基本信息-组装页名称未填写” 展示为移动端导航栏标题
自定义微信分享 复选框 关闭 用户操作产生 控制是否启用小程序分享 关闭时无需校验缩略图和标题 开启后小程序可分享
分享缩略图 图片上传 开启分享时必填 用户操作产生 微信分享卡片缩略图 开启分享且为空阻断保存 展示在微信分享卡片
分享标题 文本输入框 开启分享时必填 用户操作产生 微信分享卡片标题 开启分享且为空阻断保存 展示在微信分享卡片
图片模块图片 图片上传 用户操作产生 配置通栏图片 图片模块存在时,未上传阻断保存 展示为页面图片模块
权益商品模块大标题 文本输入框 用户操作产生 配置权益商品区标题 可为空 为空时 H5/小程序端隐藏标题
权益商品列表 系统回显列表 接口获取 预览当前关联商品 组装页内不手工新增商品 由权益商品配置和客户身份决定展示
图文模块内容 富文本编辑器 否,PDF 标注必填待确认 <p></p> 用户操作产生 配置活动说明正文 Demo 未强制校验;是否必填待确认 展示为图文内容
按钮文案 文本输入框 用户操作产生 配置按钮展示文字 为空阻断保存 展示为按钮文字
点击动作 下拉选择 跳转链接 用户操作产生 决定按钮行为 必须为跳转链接或弹窗提示 控制点击后跳转或弹窗
按钮样式 下拉选择 次要操作;新增按钮模块默认首个按钮为突出显示 用户操作产生 配置按钮视觉层级 异常值按次要操作处理 展示红色或白色按钮
链接类型 单选 动作为跳转时必填 H5链接跳转 用户操作产生 配置按钮跳转方式 H5、小程序需补充必填字段;太古地产/龙腾为固定项 决定跳转方式
H5链接 文本输入框 链接类型为 H5 时必填 用户操作产生 配置目标 H5 URL 为空阻断保存 点击后打开 H5
小程序 AppID 文本输入框 链接类型为小程序时必填 用户操作产生 配置目标小程序 为空阻断保存 点击后打开小程序
小程序页面路径 文本输入框 链接类型为小程序时必填 用户操作产生 配置目标小程序页面 为空阻断保存 点击后打开小程序指定页面
弹窗标题 文本输入框 动作为弹窗提示时必填 用户操作产生 配置底部弹窗标题 为空阻断保存 展示为底部弹窗标题
弹窗描述 富文本编辑器 动作为弹窗提示时必填 用户操作产生 配置底部弹窗正文 空富文本阻断保存 展示为底部弹窗说明
左侧取消按钮配置 文本输入框 动作为弹窗提示时必填 取消 用户操作产生 配置取消按钮文案 为空阻断保存 点击关闭弹窗
右侧确认按钮展示 复选框 展示 用户操作产生 控制确认按钮是否展示 关闭时不校验确认按钮文案和跳转 展示或隐藏确认按钮
右侧确认按钮配置 文本输入框 右侧确认按钮展示时必填 确认 用户操作产生 配置确认按钮文案 为空阻断保存 点击确认后跳转
确认按钮跳转链接配置 单选 + 输入 右侧确认按钮展示时必填 H5链接跳转 用户操作产生 配置弹窗确认后的跳转 同按钮跳转校验 点击确认后执行

4.1.5 按钮说明

按钮名称 出现场景 操作对象 点击后行为 权限控制 二次确认 成功提示 失败提示
查询 列表查询区 查询条件 按页面 ID、页面名称刷新列表 需有组装页查看权限 接口失败提示“查询失败,请稍后重试”
重置 列表查询区 查询条件 清空页面 ID、页面名称并刷新列表 需有组装页查看权限
新建组装页 列表操作区 新组装页 进入编辑视图,初始化空配置 需有组装页新建权限
编辑 列表操作列 当前行组装页 进入编辑视图并回显配置 需有组装页编辑权限 若有未保存修改离开其他页面需确认 详情获取失败提示“页面不存在或已删除”
链接/获取链接 列表操作列、编辑页顶部 当前组装页 打开获取页面链接弹窗 需有组装页查看权限 复制时提示“链接已复制到剪贴板” 未保存页面提示“请先保存组装页再获取链接!”
返回 编辑页顶部 当前编辑页 返回列表;有未保存修改时弹出确认 需有查看权限 有未保存修改时确认“确定离开/继续编辑”
保存草稿 编辑页顶部 当前组装页配置 执行校验,通过后保存为草稿或已修改 需有组装页保存权限 “已保存组装页配置草稿!” 按具体校验项提示“保存失败:...”
发布上线 编辑页顶部 当前组装页配置 仅在已保存且状态为草稿/已修改时可发布 需有组装页发布权限 Demo 未展示二次确认,建议补充 “已发布组装页配置!” 有未保存修改提示“请先保存草稿后再发布上线”
排序 模块/权益商品/按钮右上角 当前模块、商品或按钮 输入目标序号并移动到对应位置 需有编辑权限 序号越界时不移动
复制 模块右上角 当前模块 克隆当前模块及内部数据并插入到当前模块后 需有编辑权限 权益商品模块提示“权益商品模块每页仅限配置一个,无法复制!”
删除 模块/按钮右上角 当前模块或按钮 删除当前对象 需有编辑权限 模块删除确认“确定删除该模块吗?” 取消后不删除
添加按钮 按钮模块标题区 当前按钮模块 在按钮模块内新增按钮 需有编辑权限
复制链接 获取链接弹窗 生成链接 复制当前链接到剪贴板 需有查看权限 “链接已复制到剪贴板” 浏览器剪贴板权限失败时提示“复制失败,请手动复制”

4.1.6 校验规则

字段/操作 校验规则 触发时机 不通过提示 是否阻断提交
组装页名称 必填 保存草稿、发布上线 保存失败:基本信息-组装页名称未填写
分享缩略图 开启自定义微信分享时必填 保存草稿、发布上线 保存失败:微信分享卡片配置-分享缩略图未上传
分享标题 开启自定义微信分享时必填 保存草稿、发布上线 保存失败:微信分享卡片配置-分享标题未填写
图片模块图片 每个图片模块必须上传图片 保存草稿、发布上线 保存失败:图片模块-第 N 个-图片未上传
按钮模块按钮数量 每个按钮模块至少一个按钮 保存草稿、发布上线 保存失败:按钮模块-第 N 个模块-至少配置一个按钮
按钮文案 必填 保存草稿、发布上线 保存失败:按钮模块-第 N 个模块-第 M 个按钮-按钮文案未填写
H5链接 链接类型为 H5 时必填 保存草稿、发布上线 保存失败:...跳转链接配置-配置链接未填写
小程序 AppID 链接类型为小程序时必填 保存草稿、发布上线 保存失败:...跳转链接配置-AppID未填写
小程序页面路径 链接类型为小程序时必填 保存草稿、发布上线 保存失败:...跳转链接配置-页面路径未填写
弹窗标题 动作为弹窗提示时必填 保存草稿、发布上线 保存失败:...弹窗内容配置-弹窗标题未填写
弹窗描述 动作为弹窗提示时必填,去除 HTML 标签后不能为空 保存草稿、发布上线 保存失败:...弹窗内容配置-弹窗描述未填写
左侧取消按钮配置 动作为弹窗提示时必填 保存草稿、发布上线 保存失败:...弹窗内容配置-左侧取消按钮配置未填写
右侧确认按钮配置 右侧确认按钮展示时必填 保存草稿、发布上线 保存失败:...弹窗内容配置-右侧确认按钮配置未填写
确认按钮跳转链接 右侧确认按钮展示时必填,规则同普通跳转 保存草稿、发布上线 保存失败:...确认按钮跳转链接配置-具体缺失项
发布上线 必须先保存草稿且无未保存修改 点击发布上线 请先保存草稿后再发布上线

4.1.7 后台边界规则

  • 新建页面未保存时点击“获取链接”,提示“请先保存组装页再获取链接!”。
  • 编辑页有未保存修改时点击返回或离开路由,弹出“当前有未保存修改,离开后修改内容将丢失,确定离开吗?”。
  • 编辑页有未保存修改时点击“获取链接”,弹窗仍可打开,但提示“当前链接基于上一次保存内容,最新修改需保存后生效”。
  • 草稿状态仅展示草稿预览链接;正式或已修改状态展示正式环境链接和草稿预览链接。
  • 权益商品模块每页仅限一个;添加后底部“权益商品模块”新增按钮隐藏。
  • 权益商品模块不支持复制。
  • 模块排序、按钮排序、权益商品排序输入目标序号范围为 1 至当前列表长度,越界不移动。
  • 删除模块需二次确认;删除按钮 Demo 未展示二次确认,建议补充确认规则。

五、接口与字段说明

当前材料未提供真实接口说明。以下接口根据 PC Demo mock、PDF 与 H5 Demo 反推,均为【虚拟接口,待技术确认】。虚拟接口名称和字段使用中文,后续如提供真实接口,应建立字段映射并替换为真实技术字段。

5.1 查询组装页列表

接口名称:查询组装页列表
接口类型:查询
接口用途:后台组装页列表页按页面 ID、页面名称查询配置记录,并展示分页列表。

是否虚拟接口:【虚拟接口,待技术确认】
调用时机:后台进入组装页列表、点击查询、点击重置、保存/删除后刷新列表。
使用页面/模块:后台“页面管理-组装页”列表。

入参:

字段名称 是否必填 字段类型 字段说明 示例值
页面编号 文本 后台列表筛选条件,对应页面 ID 1
页面名称 文本 后台列表筛选条件,对应组装页名称 双十一迎新专属活动页

出参:

字段名称 字段类型 字段说明 使用位置 异常规则
组装页列表 列表 符合条件的组装页记录 后台列表 为空时列表展示空态
页面编号 文本 组装页唯一标识 列表、编辑、链接生成 为空时该条记录不可生成链接
组装页名称 文本 后台管理名称和移动端标题 列表、编辑、移动端标题 为空时展示“-”
发布状态 枚举 草稿、正式、已修改 列表状态标签、链接弹窗 异常值按草稿处理
创建时间 日期时间 创建记录时间 列表 为空显示“-”
更新时间 日期时间 最近保存时间 列表 为空显示“-”

接口异常规则:

异常场景 页面表现 是否允许重试 提示文案
接口超时 保留原列表或展示空列表 查询失败,请稍后重试
无查询结果 列表为空态 暂无数据
无权限 返回上级或展示无权限页 当前账号无权查看组装页

5.2 查询组装页详情

接口名称:查询组装页详情
接口类型:查询
接口用途:后台编辑页回显配置;H5/小程序端加载页面标题、分享配置和各模块内容。

是否虚拟接口:【虚拟接口,待技术确认】
调用时机:后台点击编辑;H5/小程序端打开组装页。
使用页面/模块:后台编辑页、H5/小程序端组装页。

入参:

字段名称 是否必填 字段类型 字段说明 示例值
页面编号 文本 组装页唯一标识 1
是否草稿预览 布尔 为 true 时读取草稿预览内容 true

出参:

字段名称 字段类型 字段说明 使用位置 异常规则
页面编号 文本 组装页唯一标识 页面标题、链接参数 为空时页面不可访问
组装页名称 文本 移动端标题和后台名称 导航栏、后台基础信息 为空时移动端兜底“组装页”
发布状态 枚举 草稿、正式、已修改 后台标签、访问控制 非预览访问草稿时不展示页面
分享配置 对象 是否启用分享、标题、缩略图 微信分享 配置缺失按关闭处理
模块列表 列表 图片、权益商品、图文、按钮模块及排序 H5/小程序端页面内容 为空时展示空页面或页面失效提示,待确认

接口异常规则:

异常场景 页面表现 是否允许重试 提示文案
页面不存在 H5 展示失效页;后台提示错误 页面不存在或已失效
页面未发布且非预览 H5 展示不可访问 页面暂不可访问
接口超时 H5 展示加载失败 加载失败,请稍后重试

5.3 保存组装页配置

接口名称:保存组装页配置
接口类型:保存
接口用途:后台保存草稿、保存已发布页面的修改或发布上线。

是否虚拟接口:【虚拟接口,待技术确认】
调用时机:点击“保存草稿”或“发布上线”。
使用页面/模块:后台组装页编辑页。

入参:

字段名称 是否必填 字段类型 字段说明 示例值
页面编号 文本 新建时为空,编辑时必填 1
组装页名称 文本 后台名称和移动端标题 双十一迎新专属活动页
保存类型 枚举 草稿、发布 草稿
发布状态 枚举 保存后的目标状态 草稿
分享配置 对象 微信分享配置 开启、标题、缩略图
模块列表 列表 按顺序保存所有模块 图片模块、图文模块

出参:

字段名称 字段类型 字段说明 使用位置 异常规则
页面编号 文本 新建保存后生成的页面 ID 编辑页、链接生成 为空时保存视为失败
保存结果 文本 保存成功或失败信息 后台提示 失败时展示接口返回文案

接口异常规则:

异常场景 页面表现 是否允许重试 提示文案
必填缺失 阻断提交 保存失败:具体字段未填写
多人同时编辑冲突 阻断提交或提示覆盖风险 当前配置已被更新,请刷新后重试
发布失败 停留编辑页 发布失败,请稍后重试

5.4 查询组装页可见权益

接口名称:查询组装页可见权益
接口类型:查询
接口用途:H5/小程序端根据当前客户身份、发放状态和权益商品展示页面配置,返回当前组装页可展示的权益商品。

是否虚拟接口:【虚拟接口,待技术确认】
调用时机:H5/小程序端打开组装页且页面包含权益商品模块时。
使用页面/模块:H5/小程序端权益商品模块。

入参:

字段名称 是否必填 字段类型 字段说明 示例值
页面编号 文本 当前组装页 ID 1
客户编号 文本 当前登录客户标识,由登录态或 SSO 获得 CUST001
Campaign编号 文本 投放活动编号 CAMP202511
Channel编号 文本 渠道编号 CH_APP

出参:

字段名称 字段类型 字段说明 使用位置 异常规则
权益列表 列表 当前客户可见权益商品 权益商品模块 为空时隐藏整个模块
权益编号 文本 权益商品唯一标识 点击跳转、埋点 为空时剔除该商品
权益名称 文本 商品名称 商品列表主标题 为空时剔除该商品
权益简介 文本 商品简要描述 商品列表副标题 为空时仅展示名称
权益图标 图片链接 商品图标 商品列表左侧 为空时展示默认图标
承接页类型 枚举 详情页、H5链接、小程序、第三方固定链接 点击商品 异常值不允许跳转
承接页地址 链接/对象 目标页面地址或小程序参数 点击商品 为空时点击提示“暂不可访问”

接口异常规则:

异常场景 页面表现 是否允许重试 提示文案
客户未登录 触发 SSO 或登录 无或端内登录提示
无可见权益 隐藏权益商品模块
接口失败 隐藏权益商品模块并记录日志 不在页面展示错误

5.5 查询 Campaign 与 Channel 下拉选项

接口名称:查询链接参数选项
接口类型:查询
接口用途:后台获取页面链接弹窗中选择 Campaign ID 和 Channel ID,并拼接到生成链接。

是否虚拟接口:【虚拟接口,待技术确认】
调用时机:后台打开“获取页面链接”弹窗。
使用页面/模块:获取页面链接弹窗。

入参:

字段名称 是否必填 字段类型 字段说明 示例值
选项类型 枚举 Campaign、Channel;也可由两个接口分别返回 Campaign

出参:

| 字段名称 | 字段类型 | 字段说明 | 使用位置 | 异常规则 |
| --- | --- | --- | --- |
| Campaign选项列表 | 列表 | 可选 Campaign ID 与名称 | Campaign ID 下拉框 | 获取失败时下拉为空 |
| Channel选项列表 | 列表 | 可选 Channel ID 与名称 | Channel ID 下拉框 | 获取失败时下拉为空 |
| 编号 | 文本 | 选项 ID | URL 参数值 | 为空不展示该选项 |
| 名称 | 文本 | 选项显示名称 | 下拉 label | 为空展示编号 |

接口异常规则:

异常场景 页面表现 是否允许重试 提示文案
选项获取失败 下拉框为空,仍可复制不带参数的链接 参数选项获取失败
无选项 下拉框为空

六、前台与后台字段映射关系

后台配置字段 后台位置 H5/小程序端展示字段或模块 影响规则 是否必填 空值处理
组装页名称 基本信息 导航栏标题、Page Title 保存后移动端读取并回显 后台阻断保存;历史空值移动端兜底“组装页”
自定义微信分享 微信分享卡片配置 小程序分享菜单 开启后注入自定义分享配置,关闭后禁用分享 默认关闭
分享缩略图 微信分享卡片配置 微信分享卡片图片 开启自定义分享时展示 条件必填 后台阻断保存
分享标题 微信分享卡片配置 微信分享卡片标题 开启自定义分享时展示 条件必填 后台阻断保存
图片模块图片 图片模块 页面通栏图片 按模块排序展示 后台阻断保存
权益商品模块大标题 权益商品模块 权益商品区标题 为空隐藏标题,不影响列表 隐藏标题
权益商品“显示页面-组装页” 权益商品新增/编辑页 权益商品模块列表 只有选择当前组装页且客户有权限时才展示 条件必填 未选择则不在组装页展示
权益名称 权益商品配置 权益商品列表名称 商品行主标题 异常商品剔除
权益图标 权益商品配置 权益商品列表图标 商品行左侧圆形图标 展示默认图标
权益简介/副标题 权益商品配置 权益商品列表简介 商品行副标题 仅展示名称
图文模块内容 图文模块 活动说明正文 按富文本渲染 待确认 空内容不展示正文或展示空白模块,待确认
按钮文案 按钮模块 按钮文字 按排序展示 后台阻断保存
按钮样式 按钮模块 按钮颜色与层级 primary 展示红色,secondary 展示白色 异常值按 secondary
点击动作 按钮模块 按钮点击行为 link 直接跳转,dialog 先弹底部弹窗 后台阻断保存
H5链接 按钮/弹窗跳转配置 跳转目标 点击后打开 H5 条件必填 后台阻断保存
小程序 AppID/页面路径 按钮/弹窗跳转配置 跳转目标 点击后打开指定小程序页面 条件必填 后台阻断保存
太古地产/龙腾 按钮/弹窗跳转配置 固定跳转目标 点击后打开固定服务 条件必填 具体地址待技术确认
弹窗标题 弹窗内容配置 底部弹窗标题 动作为弹窗提示时展示 条件必填 后台阻断保存
弹窗描述 弹窗内容配置 底部弹窗正文 动作为弹窗提示时展示 条件必填 后台阻断保存
左侧取消按钮配置 弹窗内容配置 底部弹窗取消按钮 点击关闭弹窗 条件必填 后台阻断保存
右侧确认按钮展示 弹窗内容配置 底部弹窗确认按钮 开启时展示确认按钮和跳转配置,关闭时隐藏 默认展示
右侧确认按钮配置 弹窗内容配置 底部弹窗确认按钮文案 开启确认按钮时展示 条件必填 后台阻断保存

七、业务流程图 / 泳道图 / 状态流转图 / 接口调用时序图

7.1 组装页发布与访问流程

flowchart TD
  A["运营进入页面管理-组装页"] --> B["新建或编辑组装页"]
  B --> C["配置基础信息、分享卡片和页面模块"]
  C --> D{"保存校验是否通过"}
  D -- "否" --> E["提示具体缺失字段,停留编辑页"]
  D -- "是" --> F["保存草稿或已修改配置"]
  F --> G{"是否发布上线"}
  G -- "否" --> H["可生成草稿预览链接"]
  G -- "是" --> I{"是否存在未保存修改"}
  I -- "是" --> J["提示请先保存草稿后再发布上线"]
  I -- "否" --> K["发布为正式页面"]
  K --> L["生成正式 H5 链接、小程序链接和草稿预览链接"]
  L --> M["客户通过链接打开组装页"]

7.2 H5/小程序端加载时序

sequenceDiagram
  participant U as 客户
  participant P as H5/小程序端
  participant A as 组装页配置服务
  participant E as 权益可见性服务
  participant S as SSO服务

  U->>P: 打开组装页链接
  P->>A: 查询组装页详情(页面编号, 是否草稿预览)
  A-->>P: 返回标题、分享配置、模块列表
  P->>P: 渲染图片、图文、按钮模块
  P->>E: 查询组装页可见权益(页面编号, 客户编号)
  E-->>P: 返回客户可见权益列表
  P->>P: 有权益则渲染权益商品模块,无权益则隐藏模块
  U->>P: 点击权益商品或按钮
  P->>S: 校验登录态或执行SSO
  S-->>P: 返回登录结果
  P->>P: 内部链接直接跳转,第三方链接先展示离开汇丰提示

7.3 组装页状态流转

stateDiagram-v2
  [*] --> 草稿: 新建后保存草稿
  草稿 --> 草稿: 编辑后保存草稿
  草稿 --> 正式: 发布上线
  正式 --> 已修改: 已发布页面编辑后保存草稿
  已修改 --> 正式: 发布上线
  已修改 --> 已修改: 继续编辑并保存

八、权限规则

权限点 适用对象 控制范围 无权限表现 说明
组装页查看权限 后台运营/产品人员 菜单入口、列表、详情、链接弹窗 菜单不可见或进入后提示无权限 至少可查看列表和复制链接
组装页新建权限 后台运营/产品人员 新建组装页按钮 按钮隐藏或禁用 无权限不得创建页面
组装页编辑权限 后台运营/产品人员 编辑按钮、模块配置、保存草稿 编辑入口隐藏或只读 保存草稿需单独校验权限
组装页发布权限 后台运营/产品负责人 发布上线按钮 按钮隐藏或禁用 建议与编辑权限分离
链接复制权限 后台运营/投放人员 获取链接弹窗和复制按钮 按钮隐藏或禁用 可与查看权限合并
权益商品可见权限 H5/小程序客户 权益商品模块 未授权商品不展示 由客户标签、发放计划、权益商品展示页面共同决定
第三方跳转确认 H5/小程序客户 外部链接跳转 必须确认后跳转 属于合规提示,不应绕过

九、埋点与日志需求

事件/日志名称 触发时机 记录字段 使用目的 备注
组装页访问事件 客户打开组装页 页面编号、组装页名称、Campaign编号、Channel编号、客户编号、访问时间、环境 统计页面访问和投放归因 客户编号需脱敏或使用内部标识
微信分享事件 小程序用户触发分享 页面编号、分享标题、Campaign编号、Channel编号、客户编号、分享时间 统计分享行为 仅小程序环境记录
权益商品曝光事件 权益商品模块渲染成功 页面编号、客户编号、权益编号列表、曝光时间 评估权益展示效果 无可见权益时记录空结果日志
权益商品点击事件 客户点击权益商品 页面编号、客户编号、权益编号、承接页类型、Campaign编号、Channel编号 分析权益转化 跳转失败需记录失败原因
按钮点击事件 客户点击按钮 页面编号、按钮文案、按钮序号、动作类型、链接类型 分析按钮转化 弹窗提示按钮需继续记录弹窗确认
弹窗展示事件 客户点击弹窗提示按钮 页面编号、按钮序号、弹窗标题 分析提示触达 无确认按钮也需记录
弹窗确认事件 客户点击底部弹窗确认按钮 页面编号、按钮序号、确认按钮文案、跳转类型 分析二次确认转化 关闭/取消需单独记录
第三方拦截确认事件 出现离开汇丰弹窗并点击继续前往 页面编号、触发来源、目标类型、目标地址、客户编号 合规审计和转化分析 目标地址记录需脱敏规则
后台保存日志 后台保存草稿或发布上线 操作人、页面编号、保存类型、变更摘要、操作时间 审计和问题追溯 建议记录模块变更前后摘要
后台复制链接日志 后台复制页面链接 操作人、页面编号、链接类型、Campaign编号、Channel编号、操作时间 投放链路追踪 可选

十、待确认问题

序号 问题类型 问题描述 影响范围 建议确认对象 当前处理方式
1 疑似冲突点 PDF 描述列表支持按页面 ID 或名称“精准查询”,PC Demo mock 为 includes 包含匹配。 后台查询规则、测试用例 产品、后端 文档按包含匹配描述,并标记需确认
2 接口缺失 未提供正式接口文档,本文接口均为虚拟接口。 前后端开发、联调 后端、架构 标记【虚拟接口,待技术确认】
3 展示规则 图文模块 PDF 标注“必填”,PC Demo 未在保存校验中强制图文模块内容必填。 后台校验、发布规则 产品 文档标记为待确认,不强行定为必填
4 跳转规则 太古地产、龙腾固定跳转项的真实地址、端能力、是否第三方拦截未提供。 按钮跳转、弹窗确认跳转 技术、合规 暂按固定第三方目标处理
5 第三方识别 哪些域名或链接类型需展示“离开汇丰中国”拦截弹窗未明确。 富文本链接、按钮跳转、权益商品跳转 合规、技术 暂按非汇丰域名和固定外部服务推定
6 客户身份 查询客户标签、客户权益发放资格、SSO 登录态的真实接口和字段未提供。 权益商品模块千人千面展示 后端、客户系统 设计“查询组装页可见权益”虚拟接口
7 权益排序 组装页权益商品模块内展示的商品排序来源不明确:Demo 可在模块内排序已有 items,但商品实际来源为权益商品列表。 H5 权益列表排序 产品、后端 当前推定按权益商品配置或接口返回顺序展示
8 图片限制 图片模块和分享缩略图仅给出建议尺寸,未明确格式、大小、比例、压缩规则。 后台上传校验、移动端展示 设计、技术 文档仅写建议尺寸,格式大小待确认
9 草稿访问 草稿预览链接是否需要登录后台权限、是否可外部访问未明确。 预览安全、测试流程 产品、技术、安全 当前仅说明草稿预览用于内部测试
10 发布确认 PC Demo 发布上线未展示二次确认,但发布属于线上生效动作,是否需要确认弹窗未明确。 后台发布流程 产品 当前记录 Demo 行为,并建议补充确认
11 删除能力 PC Demo 中存在删除接口和方法,但列表操作列未展示删除按钮。是否需要组装页删除能力未明确。 后台列表操作、权限 产品 文档未作为列表显性按钮要求,仅在边界规则中保留
12 移动端空页面 若组装页仅有权益商品模块且客户无可见权益,页面是否展示空白、失效页或其他兜底文案未明确。 H5/小程序端体验 产品、设计 当前按“隐藏权益模块,其他模块正常展示”处理