diff --git a/.specs/prds/user-center-sidebar-vip-entry.md b/.specs/prds/user-center-sidebar-vip-entry.md new file mode 100644 index 00000000..9a73ea4d --- /dev/null +++ b/.specs/prds/user-center-sidebar-vip-entry.md @@ -0,0 +1,95 @@ +# 用户中心侧栏 VIP 入口卡片 + +## Problem Statement + +用户中心侧栏当前在统计信息卡片后直接展示账户资产卡片,会员入口仅存在于资产页内容区。会员入口缺少侧栏层级的持续曝光,并且与参考主题的“统计信息 → VIP 入口 → 账户资产”信息架构不一致;同时,用户中心内重复出现会员入口会造成导航冗余。 + +## Current State + +- 用户中心侧栏按“统计信息、账户资产、创作/收益、服务、设置”的顺序组织内容。 +- 已存在独立的“我的会员”用户中心页面,并使用现有 VIP 等级、会员状态和到期状态能力展示会员信息及承接续费、升级、开通等操作。 +- 资产页内容区当前已有一个进入“我的会员”页面的 VIP 入口。 +- 会员功能可由后台 VIP 等级开关控制;未启用任何 VIP 等级时,会员中心不应成为可用入口。 +- 移动端用户中心侧栏会收纳至既有抽屉中。 + +## Solution + +在用户中心侧栏中,统计信息卡片下方、账户资产卡片上方新增一个醒目的 VIP 入口横卡;整体顺序调整为“统计信息 → VIP 入口 → 账户资产”。 + +入口采用参考主题的会员横卡视觉方向:金色或会员感渐变背景、会员图标、动态状态文案及右侧箭头。卡片为完整可点击区域,点击后以现有用户中心 URL 进入“我的会员”页面。 + +入口仅在至少一个 VIP 等级启用时展示。未启用会员功能时,不渲染入口,也不提供不可用状态或管理员例外。 + +卡片根据当前登录用户的既有会员状态展示: + +- 未开通会员:展示开通会员及会员权益引导文案。 +- 当前有效会员:展示当前会员等级和既有有效期状态文案,例如“VIP1 · 还有 30 天到期”。 +- 已过期会员:展示当前或最近会员等级及既有“已过期”等状态文案。 + +状态文案沿用现有会员状态语义,不新增精确到期日期格式或新的会员状态计算规则。 + +移动端不额外创建内容区入口;卡片随现有侧栏收纳至抽屉,并保持与桌面端相同的顺序。 + +为消除重复入口,移除账户资产页内容区中现有的 VIP 入口卡片。独立“我的会员”页面、会员套餐展示、购买弹窗、支付流程和会员状态逻辑保持不变。 + +## User Stories + +1. 作为未开通会员的登录用户,我可以在用户中心侧栏统计信息下方看到会员入口,了解开通会员可获得权益,并可进入我的会员页面。 +2. 作为有效会员,我可以在侧栏入口直接看到当前会员等级和既有到期状态提示,并进入我的会员页面进行续费或升级。 +3. 作为已过期会员,我可以在侧栏入口看到已过期状态,并进入我的会员页面重新开通或续费。 +4. 作为普通用户,当站点没有启用任何 VIP 等级时,我不会看到失效或不可访问的会员入口。 +5. 作为移动端用户,我可以在用户中心侧栏抽屉中按“统计信息、VIP 入口、账户资产”的顺序找到会员入口。 +6. 作为用户,我在账户资产页不再看到重复的会员入口,但原有资产余额、积分、签到及记录功能不受影响。 +7. 作为用户,我点击 VIP 横卡后会通过现有可分享、可刷新、可返回的用户中心链接进入“我的会员”页面。 + +## Implementation Decisions + +### New Modules + +- **侧栏 VIP 入口渲染器**:基于既有用户中心渲染上下文,在统计信息与账户资产之间输出一个完整可点击的会员横卡;负责会员功能启用判断、状态展示数据和目标链接的组合。 +- **侧栏 VIP 入口样式模块**:为会员横卡定义桌面端与抽屉端一致的会员视觉、图标、状态文本、箭头、悬停和窄屏布局;不改变现有统计卡或资产卡的布局职责。 + +### Architectural Decisions + +- 复用既有 VIP 启用判断、会员等级解析和到期状态文本;不复制或重新定义会员状态业务逻辑。 +- 复用现有“我的会员”用户中心目标页和 `tab=vip` 导航方式;不采用未开通即打开购买弹窗的分流行为。 +- 侧栏顺序由侧栏组合层负责,VIP 入口置于统计信息渲染之后、账户资产渲染之前。 +- 删除资产页内容区仅作为导航入口的现有 VIP 卡片;不删除独立会员页面及其中的套餐、权益、续费、升级、兑换和支付能力。 +- 不引入新设置项;可见性完全由现有 VIP 等级启用配置决定。 + +### Schema Changes + +无。复用已有会员配置、用户会员状态和到期状态数据。 + +### API Contracts + +无。入口仅使用既有用户中心页面路由和现有服务端渲染数据。 + +### Navigation + +- 桌面端:用户中心侧栏展示“统计信息 → VIP 入口 → 账户资产”。 +- 移动端:上述顺序在既有用户中心侧栏抽屉中保持一致。 +- 点击 VIP 入口:进入现有用户中心“我的会员”目标页(`tab=vip`)。 +- 账户资产页:移除其内容区内已有的 VIP 导航入口,避免重复。 + +## Testing Decisions + +采用静态契约审计与人工响应式验收。 + +- 运行现有管理员契约审计,确保本次模板与样式调整没有引入管理端契约回归。 +- 人工验收未开通会员:卡片显示权益引导文案,点击进入我的会员页面。 +- 人工验收有效会员:卡片显示会员等级及既有剩余有效期状态文案。 +- 人工验收过期会员:卡片显示既有过期状态文案,跳转仍可用。 +- 人工验收未启用任何 VIP 等级:侧栏不显示 VIP 入口。 +- 人工验收桌面端顺序:统计信息、VIP 入口、账户资产依次显示,会员横卡视觉与资产双卡区分明显。 +- 人工验收移动端:入口随侧栏进入抽屉,顺序、可点击性和窄屏样式正确。 +- 人工验收资产页:原 VIP 入口已移除,余额、积分及其他资产功能仍正常。 + +## Out of Scope + +- 修改“我的会员”页面的布局、文案、套餐卡、权益内容或购买流程。 +- 修改支付弹窗、支付渠道、续费、升级、兑换、卡密兑换或订单逻辑。 +- 新增、修改或迁移会员数据、会员状态算法、到期日期格式、数据库表或 REST API。 +- 新增后台会员配置、侧栏开关、管理员例外显示规则或运营统计。 +- 记录 VIP 入口的曝光、点击或转化数据。 +- 在移动端内容区额外置顶或复制 VIP 入口。