63 lines
3.5 KiB
Markdown
63 lines
3.5 KiB
Markdown
# 作品发布完成分享面板 2026-05-02
|
||
|
||
## 背景
|
||
|
||
当前 RPG、拼图、大鱼吃小鱼、抓大鹅 Match3D 的发布链路已经能把作品同步到公开广场，但发布成功后的用户反馈主要是跳转到作品详情或按钮状态变化。用户完成发布后缺少一个明确的“分享给朋友”收口动作，导致公开作品号与链接不够显眼。
|
||
|
||
## 目标
|
||
|
||
发布动作确认成功后弹出独立平台风面板：
|
||
|
||
1. 面板标题固定为“分享给朋友”。
|
||
2. 标题下显示可复制的分享文本。
|
||
3. 分享文本下方显示主按钮“分享”，点击后复制完整分享文本。
|
||
4. 页面底部显示三个分享渠道 icon：微信、QQ、抖音。
|
||
5. 移动端与桌面端都使用居中独立面板，复用 `UnifiedModal` 的平台弹窗外壳。
|
||
|
||
## 分享文本
|
||
|
||
分享文本统一使用：
|
||
|
||
```text
|
||
邀请你来玩《作品名》
|
||
作品号：公开作品码
|
||
公开链接
|
||
```
|
||
|
||
公开作品码来源：
|
||
|
||
- RPG：优先使用发布后作品库 / 公开详情返回的 `publicWorkCode`。
|
||
- 拼图：使用 `buildPuzzlePublicWorkCode(profileId)`。
|
||
- 大鱼吃小鱼：使用 `buildBigFishPublicWorkCode(sourceSessionId)`。
|
||
- 抓大鹅 Match3D：使用 `buildMatch3DPublicWorkCode(profileId)`。
|
||
|
||
公开链接统一使用 `buildPublicWorkStagePath(stage, publicWorkCode)` 转换为当前站点绝对链接。
|
||
|
||
## 渠道 icon 规则
|
||
|
||
本次只做前端分享引导，不接入微信、QQ、抖音的原生 SDK。点击渠道 icon 与主“分享”按钮保持一致，复制同一份分享文本。
|
||
|
||
仓库现有 `media/social-media-group/wechat.png` 与 `qq.png` 是社群二维码，不作为本面板渠道 icon 使用。渠道 icon 必须使用微信、QQ、抖音的品牌 SVG 轮廓，外层保持圆形触控底座；不能用通用聊天气泡、音乐符号或纯文字替代 logo。
|
||
|
||
## 面板样式约束
|
||
|
||
分享面板通过 `UnifiedModal` portal 挂载到页面根部时，需要在遮罩层补齐当前平台主题类，避免主题变量脱离页面容器后丢失。面板外壳继续使用 `platform-modal-shell` 的 `--platform-modal-fill` 背景，并在移动端覆盖平台弹窗默认底部抽屉布局，保持居中显示。
|
||
|
||
同类平台弹窗，包括删除作品等确认面板，也必须遵守同一条约束：portal 挂载时遮罩层必须带 `platform-theme platform-theme--light/dark`，面板必须保留 `platform-modal-shell` 的实体背景，不能把主面板做成透明或只依赖 backdrop blur。移动端高风险确认弹窗必须显式居中显示，避免被底部导航、安全区或底部抽屉布局遮住。
|
||
|
||
## 接入范围
|
||
|
||
- `RpgCreationResultActionBar`：RPG 发布成功后由父层回传分享数据并打开面板。
|
||
- `PuzzleResultView`：拼图发布 action 完成后由平台父层打开面板。
|
||
- `BigFishResultView`：大鱼发布 action 完成后由平台父层打开面板。
|
||
- `Match3DResultView`：本地 `publishMatch3DWork` 成功后直接触发面板数据，分享链接对齐现有作品详情入口。
|
||
- `PlatformEntryFlowShellImpl`：集中维护发布完成分享状态，避免各玩法重复实现弹窗。
|
||
|
||
## 验收标准
|
||
|
||
1. 用户完成作品发布后能看到“分享给朋友”面板。
|
||
2. 面板内展示完整分享文本，主按钮点击后复制成功并短暂显示成功态。
|
||
3. 底部固定展示微信、QQ、抖音三个渠道 icon。
|
||
4. 关闭面板不影响已发布作品进入详情、刷新广场或继续游玩。
|
||
5. 不新增后端接口，不改动 SpacetimeDB 表结构。
|