9:41
我的积分
15769
我的赏袋
我的订单
积分商城
扫码兑换
我的图鉴 全部
28
全部系列
42%
收集进度
服务中心
兑换记录
协议管理
我的地址
联系我们
首页
积分商城
抽卡机
手册
我的
用户信息
1
头像 / 昵称
展示当前登录用户（王小贱），点击进入个人资料（原型示意）
2
消息铃铛
未读消息入口，角标 99+（无未读时隐藏），点击进消息列表
3
用户 ID
展示 ID 38472910，点复制图标复制到剪贴板，toast「已复制用户ID」
4
会员箭头
进入会员中心（原型示意）
积分
5
我的积分条
展示积分余额 15769，点击进入积分明细（原型示意）
核心功能
6
我的赏袋
跳转「我的赏袋」页（latest）
7
我的订单
跳转「我的订单」页（latest）
8
积分商城
跳转「积分商城」页（latest）
9
扫码兑换
进入扫码兑换流程（原型示意）
我的图鉴
10
图鉴概览
全部系列 28 / 收集进度 42%，点「全部」进图鉴页（atlas.html）
服务中心
11
四项服务
兑换记录 / 协议管理 / 我的地址 / 联系我们（原型示意）
退出登录
12
退出登录
二次确认「确认退出登录？」后退出（原型示意）
底部 Tab
13
Tab 栏
首页 / 积分商城 / 抽卡机（中心凸起）/ 手册 / 我的，当前「我的」高亮
📋 说明面板 / 开发交付文档 — 我的 v2.2▶
📌 功能概述

一句话

个人中心页 = 用户信息 + 积分入口 + 核心功能宫格 + 图鉴概览 + 服务中心 + 退出登录。

页面说明

顶部展示当前登录用户（头像/昵称/消息入口/用户ID 可复制/会员箭头）；「我的积分」条展示积分余额（15769）；核心功能宫格 4 项（我的赏袋/我的订单/积分商城/扫码兑换）跳转对应页面；「我的图鉴」卡概览收藏情况（全部系列 28、收集进度 42%，点「全部」进图鉴页）；服务中心 4 项（兑换记录/协议管理/我的地址/联系我们）；底部「退出登录」；底部 Tab 栏「我的」高亮。

🧱 页面结构
模块内容数据来源
用户信息头部背景图 + 头像/昵称（王小贱）/消息铃铛（角标 99+）/用户ID（38472910，可复制）/会员箭头用户信息（mock）
我的积分条「我的积分」+ 余额 15769 + 箭头，点击进积分明细（示意）积分账户（mock）
核心功能宫格我的赏袋 / 我的订单 / 积分商城 / 扫码兑换（4 宫格）固定入口
我的图鉴卡标题「我的图鉴」+ 全部入口 + 全部系列 28 / 收集进度 42%图鉴数据（mock）
服务中心兑换记录 / 协议管理 / 我的地址 / 联系我们（4 宫格）固定入口
退出登录居中渐变描边按钮固定
底部 Tab 栏首页 / 积分商城 / 抽卡机（中心凸起）/ 手册 / 我的（激活高亮）固定
📋 功能说明（需求）

① 用户信息展示：头像、昵称、用户 ID（可点击复制）、消息入口（未读角标，无未读时隐藏）；② 积分入口：展示当前积分余额，点击进入积分明细；③ 核心宫格：我的赏袋/我的订单/积分商城跳转对应页面，扫码兑换占位（原型示意）；④ 我的图鉴：展示全部系列数与收集进度，点「全部」进入图鉴页（atlas.html）；⑤ 服务中心：兑换记录/协议管理/我的地址/联系我们（占位入口）；⑥ 退出登录：确认后退出（原型示意）。

🖱️ 交互行为
操作页面行为
点核心宫格我的赏袋/我的订单/积分商城 → 跳转对应页面 latest；扫码兑换 → 占位（原型示意）
点积分条进入积分明细页（原型示意）
点图鉴「全部」跳转 /小程序我的/latest/atlas.html 图鉴页
点用户 ID 复制图标复制用户 ID 到剪贴板，toast「复制成功」（原型示意）
点退出登录二次确认弹窗，确认后退出（原型示意）
底部 Tab切换首页/积分商城/抽卡机/手册/我的，当前页「我的」高亮
📐 数据口径

用户 ID 38472910；积分余额 15769；全部系列 28；收集进度 42%（收集系列数 ÷ 全部系列数）；消息角标 99+（未读消息数，mock）。

❌ 错误提示清单
页面按钮/操作场景提示
我的退出登录点击退出（原型示意）二次确认弹窗「确认退出登录？」
我的复制 ID点击复制（原型示意）toast「已复制用户ID」
🔲 状态说明
状态说明完成情况
默认用户已登录，完整展示各模块✅ 已实现
无消息消息角标隐藏（无未读）✅ 已实现（mock 99+ 演示）
未登录引导登录态（原型示意）🔲 未模拟
🔄 版本更新日志▶