Genarrative/docs/technical/MY_TAB_ACCOUNT_RECHARGE_IMPLEMENTATION_2026-04-25.md

“我的”账户充值弹窗落地设计

日期：2026-04-25

1. 范围

本轮在“我的”页面的“会员充值”入口落地账户充值弹窗，包含两个页签：

1. 陶泥币充值
2. 会员卡充值

前端只负责展示与发起购买，套餐、价格、赠送规则、会员权益、生效时间、钱包余额与交易流水统一由 server-rs 后端返回。当前没有真实支付网关，本轮采用服务端模拟支付成功：创建订单后立即写入余额或会员状态，并返回最新账户中心快照。后续接入真实支付时，只替换订单支付状态推进，不改前端套餐与账户快照 contract。

2. 产品规则

2.1 陶泥币充值套餐

productId	陶泥币	金额分	徽标	说明
points_60	60	600	首充双倍	首充送60陶泥币
points_180	180	1800	首充双倍	首充送180陶泥币
points_300	300	3000	首充双倍	首充送300陶泥币
points_680	680	6800	首充双倍	首充送680陶泥币
points_1280	1280	12800	首充双倍	首充送1280陶泥币
points_3280	3280	32800	首充双倍	首充送3280陶泥币

陶泥币充值固定为 ¥6 / ¥18 / ¥30 / ¥68 / ¥128 / ¥328 六个档位。全部档位参与首充双倍：用户历史上没有 points_recharge 流水时，本次购买到账陶泥币为基础陶泥币与等额赠送陶泥币之和；已有充值流水后只到账基础陶泥币。实际到账陶泥币写入交易流水，余额以 SpacetimeDB projection 为准。

2.2 会员卡套餐

productId	类型	天数	金额分	权益
member_month	月卡	30	2800	免陶泥币回合数100，每日签到加成0%
member_season	季卡	90	7800	免陶泥币回合数100，每日签到加成100%
member_year	年卡	365	24800	免陶泥币回合数100，每日签到加成210%

购买会员时，如果当前会员仍有效，则从当前到期时间顺延；如果已过期或从未购买，则从当前服务端时间开始计算。状态只区分 普通 与已生效会员，前端不自行推断。

3. 后端接口

3.1 GET /api/profile/recharge-center

需要 Bearer JWT。返回：

1. 当前陶泥币余额、会员状态、到期时间
2. 陶泥币套餐与会员套餐
3. 会员权益表
4. 最近订单摘要

兼容路径：GET /api/runtime/profile/recharge-center

3.2 POST /api/profile/recharge/orders

需要 Bearer JWT。请求：

{
  "productId": "points_300",
  "paymentChannel": "mock"
}

行为：

1. 校验 productId
2. 后端创建已支付订单
3. 陶泥币套餐写入钱包余额与流水
4. 会员套餐写入会员状态
5. 返回最新账户中心快照与订单摘要

兼容路径：POST /api/runtime/profile/recharge/orders

4. 前端交互

1. “我的”页会员充值按钮打开独立弹窗，不在当前面板下方展开。
2. 弹窗顶部标题为 账户充值，右上角关闭。
3. 默认打开 陶泥币充值，可切换到 会员卡充值。
4. 点击套餐后调用下单接口，按钮进入处理中状态，成功后刷新 profileDashboard。
5. 弹窗内不写大段说明文案，只保留必要金额、陶泥币、会员权益和状态反馈。
6. 会员卡充值区以套餐卡片优先展示周期、价格和处理状态；移动端单列，桌面端三列，权益表允许横向滚动，避免小屏挤压。

5. 验收

1. 普通用户打开弹窗能看到陶泥币与会员套餐。
2. 陶泥币购买后余额增加，流水来源为 points_recharge。
3. 首充赠送只在首次陶泥币充值时生效。
4. 会员购买后会员状态与到期时间立即更新。
5. 移动端弹窗单列可滚动，桌面端接近参考图卡片网格。