还款 H5 页面改造 — 反馈解决方案

本文逐条回应 32-还款H5页面改造-feedback.md 的反馈,并以当前 Figma 设计分区 0817 · Repayment page revamp 为核对依据。对应需求正文见 32-还款H5页面改造

1. 最新 Figma 结论

页面当前设计已覆盖缺口/不一致
91.01 Payment methodsLoan ID、服务提供方、支付方式、协议入口已将虚拟账户置于首位并设为默认选中。
91.02 Card OTP / 91.02a脱敏手机号、OTP 输入、60 秒重发、切卡不展示协议入口;91.02a 表示达到 OTP 最大发送次数后最后一次 OTP 的倒计时,倒计时结束自动进入 91.03。默认配置下为第 2 次 OTP。
91.03 Phone verification未收到 OTP 的后 4 位提示、4 位输入及输入中样式主按钮为 Confirm Repayment;后 4 位验证通过后直接确认还款。
91.04 Switch card已保存卡选择、确认使用需补充单卡时不可切换、无卡时银行卡方式不可选的状态。

2. 反馈逐项解决方案

编号反馈问题解决方案
F01手机号后 4 位验证后如何继续还款。91.03 定义为直接确认还款态:用户输入后 4 位并点击 Confirm Repayment,验证通过即确认还款;不再发送恢复 OTP,也不返回 OTP 输入态。
F02OTP 到后 4 位验证没有完整入口和状态衔接。达到当前配置的 OTP 最大发送次数并成功发送后,展示最后 60 秒倒计时;倒计时结束时自动进入 91.03,不设置可点击入口,也不向用户解释内部机制。默认配置下,该次为第 2 次 OTP。
F03短信重发间隔、总次数、后 4 位展示条件与 OTP 有效期待确认。重发间隔固定为 60 秒;同一会话成功发送 OTP 的最大次数支持业务配置,默认值为 2。达到配置上限后的最后一次 OTP 倒计时结束即自动切换后 4 位验证;后 4 位最多校验 3 次;OTP 有效期 10 分钟,新码使旧码失效。
F04确认页需要协议入口,但银行卡验证页不需要展示。协议入口保留在详情页和还款确认页;91.02/91.02a 银行卡 OTP 验证页及 91.03 后 4 位验证页均不展示 Privacy PolicyTerms & Conditions。不增加勾选框或二次确认。
F05是否需要单独保存用户同意协议的记录。本期不新增独立同意记录或勾选动作;用户点击当前页面主按钮即确认当前展示协议。
F06默认选中哪种还款方式。默认选中 Transfer Repayment(Virtual Account),并置于方式列表首位;用户可主动切换到银行卡或其他可用方式。
F07没有绑定卡且本期不支持新增卡时,Change 应如何处理。无有效卡时,91.01 的 Bank Card 不可选;仅有一张有效卡时,91.02 的 Change 不可用;有两张及以上有效卡时才打开 91.04。
F08协议需要按不同 bizCode 区分。每个 bizCode 只展示本业务线对应的服务提供方、Privacy Policy 与 Terms & Conditions;不得交叉展示。
F09短信频控与既有缓存控制可能冲突。对用户只保留一套统一的短信可用状态、倒计时和次数结果;不同模块不得分别放宽、重置或重复消耗短信次数。发生冲突时,以更严格的限制为准并展示统一剩余等待时间。

3. OTP 补充验证的完整业务流程

选择 Bank Card
  → 发送首次 OTP,进入 91.02
  → 60 秒后,如未达到配置上限可正常重发 OTP
  → 达到配置上限并成功发送后,进入 91.02a 最后倒计时(默认第 2 次)
  → 倒计时结束,自动进入 91.03
  → 校验手机号后 4 位并点击 Confirm Repayment
     ├─ 通过:直接确认还款,进入既有还款结果
     ├─ 不通过:提示重试;最多 3 次
     └─ 次数耗尽:关闭补充验证,引导选择其他还款方式或联系支持

4. 需要补齐的设计状态

  1. 91.01:虚拟账户置于首位并默认选中、无有效卡时银行卡不可选。
  2. 91.02a:达到 OTP 最大发送配置后的最后倒计时,以及结束后的自动切换;设计展示默认 2 次的状态,但不向用户展示次数。
  3. 91.03Confirm Repayment 主按钮、未满 4 位不可点击、验证失败与次数耗尽状态。
  4. 91.04:仅一张有效卡时不进入切卡页;无有效卡时不展示该页。

5. 埋点补充

为衡量 OTP 未收到后的转化,使用 repayment_phone_verification_popup_view 记录最后一次 OTP 倒计时结束后的自动进入,使用 repayment_phone_verification_result 记录后 4 位验证和直接确认还款结果。不得采集 OTP、手机号后 4 位、卡尾号、OTP 配置值或内部触发阈值。