Appearance
我的活动
版本: V1.2
更新日期: 2026-01-21
状态: 草稿
一、模块定位
入口：「我的」Tab → 「我的活动」
核心价值：统一管理用户参与的所有活动，提供报名记录查询、订单管理和发起人管理入口。
二、页面结构
2.1 主页面
┌────────────────────────────────────┐
│ ← 我的活动 [筛选] │
├────────────────────────────────────┤
│ [我报名的] [我发起的] │
├────────────────────────────────────┤
│ 进行中 │
│ ┌─────────────────────────────────┐│
││┌─────┐ ││
│││ 封面 │ 崇礼里程挑战赛 [进行中]││
│││ 图片 │ 排名 #42 · 32.5km ││
│││挑战 │ 📅 01/15 - 02/15 ││
││└─────┘ ││
│└─────────────────────────────────┘│
│ ┌─────────────────────────────────┐│
││┌─────┐ ││
│││ 封面 │ 周五拼车去崇礼 [待参加]││
│││ 图片 │ 3/4人 | 北土城 ││
│││拼车 │ 📅 01/24 周五 06:00 ││
││└─────┘ ││
│└─────────────────────────────────┘│
└────────────────────────────────────┘2.2 Tab 切换
| Tab | 内容 |
|---|---|
| 我报名的 | 用户作为参与者报名的活动 |
| 我发起的 | 用户作为发起人发布的活动 |
2.3 我发起的 - 身份筛选
适用场景：俱乐部主理人/官方运营可能同时有个人身份和机构身份的活动
交互：
┌────────────────────────────────────┐
│ [我报名的] [我发起的] │
├────────────────────────────────────┤
│ [个人 ▼] │ ← 身份下拉筛选
│ ├── 个人（默认） │
│ └── 崇礼雪友会 │ ← 俱乐部名称
├────────────────────────────────────┤场景覆盖：
| 用户身份 | 可见选项 |
|---|---|
| 普通雪友 | 仅「个人」（无下拉） |
| 俱乐部主理人 | 个人 + 俱乐部名称 |
| 官方运营 | 个人 + 官方俱乐部 |
三、活动卡片规范
3.1 卡片布局
采用左图右文布局，与发现页卡片风格保持一致：
┌─────────────────────────────────────┐
│┌────────┐ │
││ 封面图 │ 活动标题 [状态] │
││ (1:0.75)│ 俱乐部 │ ← 可选
││ ┌────┐ │ 详情信息 │
││ │类型│ │ 📅 时间 │
││ └────┘ │ │
│└────────┘ │
└─────────────────────────────────────┘3.2 封面图片
| 属性 | 规范 |
|---|---|
| 尺寸 | 宽 112px × 高 96px |
| 圆角 | 左侧圆角 16px |
| 填充 | object-cover |
| 降级 | 加载失败时显示灰色渐变 + 🎿 图标 |
3.3 类型标签
位于封面图片左上角，半透明黑底白字：
| 活动类型 | 标签文案 |
|---|---|
| 里程挑战 | 挑战 |
| 雪友组局 | 聚会 |
| 拼车 | 拼车 |
| 拼房 | 拼房 |
| 搭子 | 搭子 |
| 团购 | 团购 |
| 跟拍 | 跟拍 |
3.4 差异化展示
| 活动类型 | 详情信息 |
|---|---|
| 里程挑战（参与者） | 排名 #N · 成绩 |
| 里程挑战（发起人） | N/M人参与 · 奖池 X 雪币 |
| 雪友组局 | N/M人 | 场地 |
| 拼车 | N/M人 | 出发地 |
| 团购 | ¥价格 · 档位 |
3.5 俱乐部标识
俱乐部身份发起的活动，在标题下方显示蓝色「俱乐部」角标。
3.6 状态标签
| 状态 | 样式 | 适用场景 |
|---|---|---|
| 待参加 | 黄色 | 已报名，活动未开始 |
| 进行中 | 绿色 | 活动正在进行 |
| 报名中 | 绿色 | 我发起的活动，正在招募 |
| 已满员 | 黄色 | 我发起的活动，名额已满 |
| 已完成 | 灰色 | 活动已结束 |
| 已取消 | 红色 | 用户取消或发起人取消 |
| 待支付 | 橙色 | 报名未完成支付 |
四、交互规范
4.1 卡片操作
| 操作 | 行为 |
|---|---|
| 点击卡片 | 跳转活动详情页 |
| 左滑卡片 | 显示操作按钮（取消报名/删除记录） |
4.2 取消报名
条件：活动未开始且在可取消时间范围内
流程：
- 左滑 → 点击「取消报名」
- 弹窗确认
- 根据退款规则处理
4.3 筛选
| 筛选维度 | 选项 |
|---|---|
| 活动类型 | 全部/里程挑战/雪友组局/团购/跟拍 |
| 时间范围 | 近7天/近30天/全部 |
| 状态 | 全部/进行中/已完成/已取消 |
五、空状态
┌────────────────────────────────────┐
│ │
│ 🎿 │
│ │
│ 还没有报名任何活动 │
│ │
│ [去发现活动] │
│ │
└────────────────────────────────────┘六、验收标准
- 可正确展示所有活动类型的报名记录
- Tab 切换「我报名的」/「我发起的」正常
- 状态标签与活动实际状态一致
- 点击卡片可跳转对应详情页
- 取消报名遵循各活动类型的退款规则
- 筛选功能可正常使用