refactor: unify layout, adopt Semi UI Forms, dynamic presets, and fix duplicate requests

- Unify TopUp into a single-page layout and remove tabs
- Replace custom inputs with Semi UI Form components (Form.Input, Form.InputNumber, Form.Slot)
- Move online recharge form into the stats Card content for tighter, consistent layout
- Add account stats Card with blue theme (consistent with InvitationCard style)
- Remove RightStatsCard and inline the stats UI directly in RechargeCard
- Change preset amount UI to horizontal quick-action Buttons; swap order with payment methods
- Replace payment method Cards with Semi UI Buttons
  - Use Button icon prop for Alipay/WeChat/Stripe with brand colors
  - Use built-in Button loading; remove custom “processing...” text
- Replace custom spinners with Semi UI Spin and keep Skeleton for amount loading
- Wrap Redeem Code in a Card; use Typography for “Looking for a code? Buy Redeem Code” link
- Show info Banner when online recharge is disabled (instead of warning)

TopUp data flow and logic
- Generate preset amounts from min_topup using multipliers [1,5,10,30,50,100,300,500]
- Deduplicate /api/user/aff using a ref guard; fetch only once on mount
- Simplify user self fetch: update context only; remove unused local states and helpers
- Normalize payment method keys to alipay/wxpay/stripe and assign default colors

Cleanup
- Delete web/src/components/topup/RightStatsCard.jsx
- Remove unused helpers and local states in index.jsx (userQuota, userDataLoading, getUsername)

Dev notes
- No API changes; UI/UX refactor only
- Lint clean (no new linter errors)

Files
- web/src/components/topup/RechargeCard.jsx
- web/src/components/topup/index.jsx
- web/src/components/topup/InvitationCard.jsx (visual parity reference)
- web/src/components/topup/RightStatsCard.jsx (removed)
This commit is contained in:
t0ng7u
2025-08-23 01:32:54 +08:00
parent d47190f1fd
commit 60dc032cb8
7 changed files with 255 additions and 294 deletions

View File

@@ -159,7 +159,6 @@
"测试所有已启用通道": "Test all enabled channels",
"更新所有已启用通道余额": "Update balance for all enabled channels",
"刷新": "Refresh",
"处理中...": "Processing...",
"绑定成功!": "Binding successful!",
"登录成功!": "Login successful!",
"操作失败,重定向至登录界面中...": "Operation failed, redirecting to login page...",
@@ -168,7 +167,7 @@
"渠道": "Channel",
"渠道管理": "Channels",
"令牌": "Tokens",
"兑换": "Redeem",
"兑换额度": "Redeem",
"充值": "Recharge",
"用户": "Users",
"日志": "Logs",
@@ -846,7 +845,6 @@
"充值记录": "Recharge record",
"返利记录": "Rebate record",
"确定要充值 $": "Confirm to top up $",
"兑换中...": "Redemming",
"微信/支付宝 实付金额:": "WeChat/Alipay actual payment amount:",
"Stripe 实付金额:": "Stripe actual payment amount:",
"支付中...": "Paying",
@@ -857,7 +855,9 @@
"兑换码充值": "Redemption code recharge",
"奖励说明": "Reward description",
"选择支付方式": "Select payment method",
"处理中": "Processing",
"在找兑换码?": "Looking for a redemption code? ",
"购买兑换码": "Buy redemption code",
"账户统计": "Account statistics",
"账户充值": "Account recharge",
"多种充值方式,安全便捷": "Multiple recharge methods, safe and convenient",
"支付方式": "Payment method",