# 平台首页移动端信息流与作品卡设计

更新时间：`2026-04-28`

## 1. 本次目标

1. 桌面端首页布局保持现有顶部栏、侧边导航、Hero、趋势区与下方网格结构，不调整桌面端区块顺序。
2. 移动端首页改为参考图式信息流：顶部搜索框、横向频道 Tab、纵向作品列表、底部主导航。
3. 双端公开作品卡统一结构：上方 `16:9` 封面图，下方作品名称、作者信息、作品描述与玩法类型。
4. 点赞数必须来自作品读模型字段，前端只负责展示，不把游玩数或评分临时改名成点赞。

## 2. 数据契约

### 2.1 统一字段

公开作品卡和创作中心复用的作品摘要都增加：

```ts
likeCount: number;
```

当前阶段只做只读展示，不新增点赞按钮和点击 reducer。后端对尚未接入真实点赞表的作品返回 `0`，保证接口 shape 稳定，后续可无 UI 结构迁移地接入真实互动计数。

### 2.2 各玩法映射

1. RPG 公开广场：`CustomWorldLibraryEntry` 与 `CustomWorldGalleryCard` 返回 `likeCount`，当前由 Rust facade 返回 `0`。
2. 拼图公开广场：`PuzzleWorkSummary` 返回 `likeCount`，当前由 Rust facade 返回 `0`，`playCount` 继续仅表示游玩次数。
3. 大鱼公开广场：`BigFishWorkSummary` 返回 `likeCount`，当前由 Rust facade 返回 `0`，`playCount` 继续仅表示游玩次数。
4. 前端聚合类型 `PlatformPublicGalleryCard` 透传 `likeCount`，`WorldCard` 不再依赖 `badge/metaLabel` 决定主要信息结构。

### 2.3 首页读链路核对

首页公开作品流的读取链路固定为：

```text
RpgEntryHomeView
→ platformPublicGalleryClient / puzzleGalleryClient / bigFishGalleryClient
→ Rust api-server
→ spacetime-client 生成绑定
→ spacetime-module procedure
→ SpacetimeDB 表
```

1. 公开读取必须匿名可用，前端 `GET` 列表与详情统一传 `skipAuth: true`、`skipRefresh: true`，避免未登录首页被刷新 token 链路阻断。
2. 拼图公开广场走 `list_puzzle_gallery` / `get_puzzle_gallery_detail`，返回 `coverImageSrc`、`summary`、`themeTags`、`playCount`、`remixCount`、`likeCount`。
3. 大鱼公开广场走 `list_big_fish_works(published_only=true)`；由于部分已部署模块会在公开列表分支前仍校验 `owner_user_id` 非空，客户端与模块内部公共列表输入都使用 `public-big-fish-gallery` 占位 owner。该字段在 `published_only` 分支不参与筛选，只用于兼容旧校验。
4. 自定义世界公开广场走 `list_custom_world_gallery_entries`，当前主云数据为空时应返回成功空列表，而不是错误态。

### 2.4 作者头像读取策略

1. 首页“推荐”和“今日游戏”作品卡不把 `avatarUrl` 固化到作品读模型里，避免作者修改头像后旧作品卡继续展示过期头像。
2. 前端首页在聚合公开作品后，按作品摘要中的 `authorPublicUserCode` 优先读取公开用户摘要；没有公开用户码的玩法摘要，使用 `ownerUserId` 读取公开用户摘要。
3. 作者头像查询必须走匿名公开接口，并在首页组件内按作者维度缓存；单个作者在推荐与今日游戏中重复出现时不能重复请求。
4. 公开用户摘要返回 `avatarUrl` 时，作品卡展示真实头像；头像缺失、读取失败或作者身份字段缺失时，继续使用作者昵称首字占位。

## 3. 移动端布局

1. 移动端首页只在 `RpgEntryHomeView` 的 mobile content 内重排。
2. 第一屏顺序：
   - 搜索框
   - 频道横滑 Tab：推荐、今日游戏、游戏分类、PC游戏、即点即玩
   - 作品信息流
3. 作品信息流使用单列纵向列表，卡片宽度填满容器，卡片之间保留短间距。
4. 不新增功能说明类长文案；空态仍沿用现有短状态文案。
5. 移动端卡片视觉允许接近参考图的深色信息流，但仍走平台主题 token，避免写死不可维护的大面积色块。

## 4. 作品卡结构

每张公开作品卡固定为：

1. 封面区域：`aspect-ratio: 16 / 9`，图片 `object-cover`；无封面时使用轻量主题底。
2. 封面左上角不展示“推荐”标签，也不展示作者昵称标签，避免遮挡作品主视觉。
3. 封面右下角展示三项轻量指标：游玩、改造、点赞；统一为图标 + 紧凑数字，例如 `128`、`1.2万`，不写额外说明长文案。
4. 信息区域：
   - 第一行：作品名称，右侧展示玩法类型。拼图玩法展示“拼图”，大鱼玩法展示“大鱼”，RPG 作品展示题材短标签。
   - 第二行：原副标题位置展示作者头像和昵称。当前公开列表只返回作者昵称时，头像使用昵称首字生成的轻量头像；后续接入作者头像 URL 后复用同一位置。
   - 第三行：作品描述，两行截断。
   - 第四行：最多三个标签。
5. 点赞数仍必须来自作品读模型字段，只是展示位置从信息区右侧迁移到封面右下角。
6. 不展示作品号；作品号仍只在详情页或分享路径中使用。

## 5. 验收

1. 390px 移动端首页不横向溢出，能看到搜索、频道和纵向作品列表。
2. 桌面端首页布局区块顺序不变，只替换公开作品卡内部结构。
3. RPG、拼图、大鱼三类公开作品卡都有 `likeCount` 字段，前端聚合后能统一展示。
4. 运行编码检查、前端定向测试和必要的 Rust 检查。
5. HTTP 验收需覆盖：
   - `GET /api/runtime/custom-world-gallery` 成功返回 `entries`。
   - `GET /api/runtime/puzzle/gallery` 成功返回 `items` 且包含 `likeCount`。
   - `GET /api/runtime/big-fish/gallery` 成功返回 `items`，旧部署模块不再因 `big_fish.owner_user_id 不能为空` 阻断首页。