没有现成的图,我直接在充值页面里把这个「支付确认中」的过渡态做出来给你看:
已有支付成功状态的弹窗,但缺少「从 Stripe 返回后的过渡确认态」。在 Stripe 模式下补充这个完整流程:
现在在充值页顶部插入 Stripe 返回后的过渡态 UI:
已在充值页面做出三个状态的完整视觉演示:
- 轮询中:蓝色加载图标 + 进度条动态填充,直观表达「正在确认」,右侧有模拟按钮可切换状态
- 成功态:绿色勾 + 金额高亮展示 + 订单号,清晰告知用户已到账
- 超时态:琥珀色时钟 + 平静文案安抚用户 + 订单号 + 手动刷新按钮
点击「确认支付」后会模拟跳转 Stripe 并返回,自动触发轮询确认流程。