quyun-v2/docs/design/portal/PAGE_USER_CENTER.md

页面设计: 个人中心 (User Center)

路由: /me/* 布局: LayoutMain 结构: 侧边栏导航布局 (Sidebar Layout)

1. 布局结构 (Structure)

[ Container ]
|  [ Sidebar Nav ]  |  [      Main Content Area      ]  |
|  (250px Fixed)    |  (Flex Grow, White Card)          |
|                   |                                   |
|  - Dashboard      |  H2 Page Title                    |
|  - Orders         |  -------------------------------  |
|  - Wallet         |  [ Content Form / List ]          |
|  - Settings       |                                   |

2. 侧边栏导航 (Sidebar Nav)

• 用户信息: 顶部展示小头像 + 昵称。
• 菜单组:
  • 交易中心: 我的订单、我的钱包、售后记录。
  • 内容管理: 我的收藏、浏览历史。
  • 账号设置: 个人资料、账号安全(密码/绑定)、收货地址。
  • 租户入口: (如果是租户管理员) [切换到创作者中心] 按钮。
• 样式: 选中项背景高亮 bg-primary-50 text-primary-600 border-r-2 border-primary-600。

3. 核心子页面设计

3.1 个人资料 (Profile)

• 表单:
  • 头像上传 (点击更换)。
  • 昵称、简介 (Textarea)。
  • 性别、生日 (Datepicker)。
• 操作: [保存修改] 按钮。

3.2 账号安全 (Security)

• 列表项:
  • 登录密码: 已设置 [修改]。
  • 手机绑定: 138****8888 [更换]。
  • 邮箱绑定: 未绑定 [绑定]。
  • 注销账号: 红色链接，需二次确认。

3.3 我的收藏 (Favorites)

• 布局: 网格或列表展示收藏的内容。
• 操作: [取消收藏] 按钮，支持批量管理。

3.4 浏览历史 (History)

• 时间轴: 按日期分组 (今天 / 昨天 / 更早)。
• 列表: 简单的标题 + 时间列表。
• 操作: [清空历史]。