收口平台报告弹窗

新增 PlatformReportDialog 公共可复制报告弹窗组件
将 PlatformErrorDialog 与 PlatformTaskCompletionDialog 改为薄包装
同步更新 PlatformUiKit 收口文档与团队决策记录
This commit is contained in:
2026-06-10 15:50:11 +08:00
parent ebf181d53b
commit 7411b9a435
6 changed files with 189 additions and 113 deletions

View File

@@ -29,6 +29,7 @@
- 新增 `src/components/common/PlatformPillBadge.tsx` 作为平台胶囊状态标签 Module统一承载结果页、作品卡和配置摘要里的单个状态 / 标签 chip。
- 新增 `src/components/common/PlatformProgressBar.tsx` 作为平台进度条 Module统一承载 `progressbar` 语义、`platform-progress-track` 壳、填充宽度、最小可见宽度、未知进度语义、条内覆盖层和局部主题色。
- 新增 `src/components/common/PlatformInfoBlock.tsx` 作为平台只读信息块 Module统一承载弹窗和详情页中的短标签、白底内容壳、单行 / 多行正文排版。
- 新增 `src/components/common/PlatformReportDialog.tsx` 作为平台可复制报告弹窗 Module统一承载来源 / 状态 / 错误这类字段块展示、报告拼装、复制反馈按钮和标准 footer。
- 新增 `src/components/common/PlatformSubpanel.tsx` 作为平台白底子面板 Module统一承载结果页、创作工作台和普通白底面板内的小型列表卡片里的 `platform-subpanel` / flat 外壳、标题行、右侧动作区、圆角、响应式内边距和交互态。
- 新增 `src/components/common/PlatformMediaFrame.tsx` 作为平台媒体预览框 Module统一承载图片源、fallback 图、fallback 文案、固定比例、surface 和可选 overlay。
- 新增 `src/components/common/PlatformMediaTileGrid.tsx` 作为平台媒体缩略格网格 Module统一承载结果页里同尺寸素材 tile 的列数、间距、白底容器、圆角、边框、图片和 fallback 格。
@@ -184,6 +185,7 @@
18.4. 平台白底分段 Tab / 二选一 / 四选一配置项迁移到 `PlatformSegmentedTabs`;拼图结果页、抓大鹅结果页、抓大鹅素材配置、抓大鹅创作 / 结果页难度选择、视觉小说结果页和 creative-agent 模板确认弹窗已先迁移。后续同类控件只传选项、当前 id、变更回调、列数、尺寸、调性和外壳形态不再在业务 JSX 中重复容器边框、`bg-white/62`、选中态和 `aria-pressed`
18.4.1. `PlatformSegmentedTabs` 支持 `semantics="tabs"``tone="underline"``size="tab"``columns="one"`,用于承接认证入口短信 / 密码登录切换这类真实 Tab 语义;业务页不再维护本地 `LoginTabButton``role="tab"``aria-selected` 和下划线选中态。
18.5. 平台只读信息块迁移到 `PlatformInfoBlock`;错误弹窗和生成完成弹窗的来源、错误和状态展示、分享弹窗正文,以及汪汪声浪预览卡场景 / 形象 / 难度 / 声浪信息行已先迁移。后续弹窗、详情页或预览卡里只是展示短标签 + 只读正文,或无标签纯只读正文时,优先使用该 Module横向信息行通过 `labelClassName` / `valueClassName` 保留标签和值排版,不在业务 JSX 中重复白底信息块 chrome。
18.5.1. 平台来源 / 状态 / 错误这类可复制报告弹窗迁移到 `PlatformReportDialog``PlatformErrorDialog``PlatformTaskCompletionDialog` 已先迁移,业务弹窗只保留标题、字段语义和黑名单过滤,不再重复维护 `UnifiedModal``CopyFeedbackButton``useCopyFeedback`、报告拼装和 `PlatformInfoBlock` footer 组合。后续同类“字段展示 + 复制整段报告”弹窗优先复用该 Module。
18.6. 平台统计小卡和轻量状态 chip 迁移到 `PlatformStatGrid`;拼消消结果页素材摘要、方洞结果页封面状态 chip、抓大鹅结果页难度摘要、creative-agent 模板确认摘要和自定义世界实体目录世界页档案规模已先迁移。后续结果页里只表达数值 / 标签摘要时,优先传 `items`、列数、密度、surface 和 label/value 顺序,不再在业务 JSX 中重复手写统计卡 chrome。
18.6.1. 平台普通进度条迁移到 `PlatformProgressBar`creation-agent 主进度 / operation banner、RPG 结果页生成提示、RPG 实体目录生成中提示、开场 CG 生成占位、拼图关卡画面生成进度、生成页当前步骤线性进度、抓大鹅批量物品素材生成进度和自定义世界生成选择弹窗进度提示已先迁移。creation-agent operation banner 的状态外壳也迁移到 `PlatformStatusMessage surface="platform" remapSurface`,避免业务 JSX 继续组合 `platform-remap-surface platform-banner``platform-banner--*`。后续生成进度、素材进度或实体目录进度只保留进度值、显示文案、主题色、必要覆盖层和业务状态,不再重复写 `role="progressbar"``platform-progress-track`、fill 宽度和最小可见宽度计算;未知进度用 `indeterminate`。生成页环形总进度继续保留 `GenerationProgressHero` 专用 SVG。
18.6.2. 平台单个胶囊状态 / 标签 chip 迁移到 `PlatformPillBadge`;宝贝识物结果页发布状态、主题标签与占位资源 overlay宝贝识物 / 拼图 / 抓大鹅 / 视觉小说工作台 BETA chip、汪汪声浪轻配置 chip、汪汪声浪结果页草稿 chip、汪汪声浪预览 VS chip、敲木鱼结果页飘字 chip、creative-agent 顶部阶段 / 过程计数 / 条目 meta chip、通用音频输入面板限制标签、自定义世界实体目录批量选择 / 生成中 / 开局 CG / 可扮演角色元信息 badge、RPG 首页公开作品卡 / 搜索结果 / 充值商品 / 移动端创建入口 / 桌面发现区 chip、RPG 世界详情静态元信息 chip、平台作品详情主题标签、RPG 角色身份 / 等级 / 技能出手方式 / 技能详情与状态标签 / 背景故事解锁状态 / 好感等级 / 角色资产工作室动作状态 / 角色编辑技能动作状态 / 角色资源应用状态 / 场景角色选择状态 / 地标当前连接状态 / 地图节点当前状态 / 地图节点方向标签 / 地图场景切换方向标签 / 作品封面来源状态 / 开局物品标签、NPC 交易数量 / 赠礼好感和背包工坊材料需求等暗色展示 chip、抓大鹅批量新增 / 批量重生成物品名称预览 chip、抓大鹅 / RPG / 拼图 / 方洞结果页自动保存状态、抓大鹅结果页当前难度 badge、拼图结果页关卡生成中 overlay / 列表 badge、大鱼吃小鱼结果页终局 / 关卡元信息 / 发布校验成功 badge、RPG 开发资产诊断数量 / 加载状态 badge、RPG 发布弹窗封面来源 badge、账号弹窗主题状态 / 会话数量 / 设备状态 badge、汪汪声浪生成页和通用生成页右上状态 badge、创作类型弹层锁定 badge、通用创作图片面板提交按钮内泥点消耗标签以及个人中心泥点账单余额、玩过总时长和玩过作品类型 chip 已先迁移。后续只表达一个状态、标签、分类 chip 或按钮内消耗小胶囊时使用该 Module不在业务 JSX 中重复拼 `rounded-full border bg-* text-* px-* py-*`;个人中心玫瑰色 chip 使用 `tone="profile"` / `tone="profileAccent"`RPG 暗色展示 chip 使用 `dark*` tone密集目录元信息用 `size="xxs"`,平台白底柔和状态使用 `tone="muted"`,实心中性详情标签使用 `tone="neutralSolid"`,按钮内浅色叠层使用 `tone="lightOverlay"`,多项统计摘要继续使用 `PlatformStatGrid`。可点击复制 / 分享胶囊 chip 继续由 `CopyCodeButton` / `CopyFeedbackButton` 管复制状态,并通过 `actionAppearance="pill"` 复用 `PlatformPillBadge` chrome。
@@ -219,6 +221,8 @@
## 验证
- `npm run test -- src/components/common/PlatformReportDialog.test.tsx src/components/platform-entry/PlatformErrorDialog.test.tsx`
- `npm run test -- src/components/common/PlatformReportDialog.test.tsx src/components/platform-entry/PlatformTaskCompletionDialog.test.tsx`
- `npm run test -- src/components/common/UnifiedConfirmDialog.test.tsx`
- `npm run test -- src/components/common/useCopyFeedback.test.tsx`
- `npm run test -- src/components/common/CopyFeedbackButton.test.tsx`