refactor: 完成技能数据结构重构 - 分离内部信息与发布信息

- 新增技能内部信息与商店发布信息分离的数据结构
- 重构技能详情页为四段式布局(概览+当前生效版本+版本历史+管理)
- 移除历史版本中的下载按钮
- 版本历史改为卡片布局,新增发布信息预览
- 分类与标签合并显示,分类作为第一个标签
- 更新按钮禁用逻辑:下架审核中/已下架状态禁用上传新版本
- 下架技能按钮添加二次确认弹窗
- 补充10个不同状态的技能示例数据
- 同步 delta specs 到主 specs
- 归档变更:refactor-skill-data-structure
This commit is contained in:
2026-03-21 18:09:43 +08:00
parent 8179ff2f95
commit 017a8af2a3
21 changed files with 1452 additions and 646 deletions

View File

@@ -1,42 +1,34 @@
## ADDED Requirements
## Purpose
开发者基本信息编辑功能用于管理技能的内部信息,这些信息仅供开发者自己使用,不影响技能商店展示。
### Requirement: 基本信息编辑表单
UpdateSkillInfoPage SHALL 提供技能基本信息的编辑表单预填当前数据。表单功能保持不变但技能详情页的UI布局已更新。
## Requirements
#### Scenario: 表单预填展示
- **WHEN** 用户从技能详情页点击"更新基本信息"进入 UpdateSkillInfoPage
- **THEN** 表单字段预填当前技能的名称、描述、分类、标签和图标数据
### Requirement: 内部信息编辑表单
UpdateSkillInfoPage SHALL 提供开发者内部信息的编辑表单,预填当前数据。
#### Scenario: 分类动态生成
- **WHEN** 用户在基本信息编辑表单中打开分类下拉框
- **THEN** 下拉选项从数据源动态生成,包含所有可用分类(信息查询、效率工具、开发工具、数据分析、文档处理、业务系统)
#### Scenario: 表单字段简化
- **WHEN** 用户从技能详情页点击"编辑内部信息"进入 UpdateSkillInfoPage
- **THEN** 表单仅包含两个字段:开发者内部技能名称、开发者内部技能描述
#### Scenario: 提交基本信息修改
- **WHEN** 用户填写完基本信息后点击"保存修改"按钮
- **THEN** 页面展示成功提示"保存成功"并返回技能详情页使用新的UI布局
#### Scenario: 移除字段
- **WHEN** 用户在内部信息编辑页面时
- **THEN** 不显示分类、标签、图标选择器(这些字段已移至版本发布信息
#### Scenario: 提交内部信息修改
- **WHEN** 用户填写完内部信息后点击"保存修改"按钮
- **THEN** 页面展示成功提示"保存成功",并返回技能详情页
#### Scenario: 取消编辑
- **WHEN** 用户在基本信息编辑页面点击"取消"按钮
- **THEN** 返回技能详情页使用新的UI布局,不保存任何修改
- **WHEN** 用户在内部信息编辑页面点击"取消"按钮
- **THEN** 返回技能详情页,不保存任何修改
### Requirement: 技能图标选择
UpdateSkillInfoPage 和 UploadSkillPage SHALL 提供技能图标的 emoji 选择器。
UploadSkillPage SHALL 提供技能图标的 emoji 选择器(仅用于创建技能时的图标选择)
#### Scenario: 图标选择展示
- **WHEN** 用户在技能创建或编辑页面看到图标选择区域
- **THEN** 页面展示 emoji 网格(🌤️📊📝🔧💻📋🔍📈🎯⚡🌐🤖),当前选中项高亮显示
- **WHEN** 用户在创建技能页面看到图标选择区域
- **THEN** 页面展示 emoji 网格,当前选中项高亮显示
#### Scenario: 切换图标
- **WHEN** 用户点击 emoji 网格中的某个图标
- **THEN** 该图标高亮选中,之前的选中项取消高亮
### Requirement: 技能图标显示
技能详情页 SHALL 在技能概览卡片中展示技能图标并采用新的UI布局设计。
#### Scenario: 图标展示
- **WHEN** 用户打开技能详情页
- **THEN** 技能概览卡片的图标位置显示该技能选择的 emoji 图标图标尺寸为80x80像素圆角16像素
#### Scenario: 图标背景样式
- **WHEN** 用户查看技能概览卡片中的图标
- **THEN** 图标具有渐变背景(从#8B5CF6到#EC4899),白色文字,与新的设计系统一致

View File

@@ -2,27 +2,27 @@
## 功能描述
展示开发者自己创建的技能列表,支持筛选和操作,提供清晰的表格布局
展示开发者自己创建的技能列表,展示开发者内部名称,支持筛选和操作。
## 表格列定义
## Requirements
### Requirement: 表格列定义
表格必须包含以下列:
| 列名 | 内容 | 显示要求 |
|------|------|----------|
| 技能名称 | `skill.name` | 普通字重,不加粗 |
| 技能描述 | `skill.desc` | 正常显示 |
| 分类 | `skill.category` | 正常显示 |
| 技能名称 | `skill.name`(开发者内部名称) | 普通字重,不加粗 |
| 技能描述 | `skill.desc`(开发者内部描述) | 正常显示 |
| 状态 | `skill.status` | 使用 `skillStatusMap` 映射显示中文状态和对应样式,**只显示技能整体状态** |
| 操作 | 编辑/下架/删除按钮 | 保持按钮组布局 |
**移除以下列:**
- 分类 (`category`)
- 版本 (`version`)
- 安装量 (`installs`)
- 评分 (`rating`)
## 状态显示规则
### Requirement: 状态显示规则
1. **只显示技能的整体状态**,使用 `skillStatusMap` 映射:
- `dev` → 开发中
- `published` → 已上架
@@ -31,32 +31,31 @@
2. **不再额外显示** `skill.hasPendingReview` 的"审核中"徽章。版本审核状态在技能详情页展示即可。
## 操作按钮规则
### Requirement: 操作按钮规则
### 下架按钮
#### 下架按钮
- 只在 `skill.status === 'published'` 时显示
-`skill.hasPendingReview === true` 时禁用,提示"存在审核中的版本,请先撤回后再下架"
- 点击触发出下架操作
### 删除按钮
-`skill.status === 'published'` 时禁用,提示"已上架的技能需要先下架才能删除"
#### 删除按钮
-`skill.status === 'published'` `skill.status === 'unlisting'``skill.hasPendingReview === true` 时禁用
- 提示信息根据状态变化
- 点击触发确认删除弹框
- 确认后执行删除操作
### 编辑按钮
#### 编辑按钮
- 始终显示
- 点击跳转到技能详情编辑页
以上规则必须与**技能详情页**的按钮逻辑保持完全一致。
## 交互行为
### Requirement: 交互行为
- 点击表格行任意位置跳转到技能详情编辑页(保持不变)
- 筛选功能保持不变,支持关键词、分类、状态筛选
- 筛选功能保持不变,支持关键词、状态筛选(移除分类筛选
- 分页保持不变
## 样式要求
### Requirement: 样式要求
- 保持现有表格样式体系
- 不引入新的样式类名
- 技能名称使用正常字重(移除 `fontWeight: 600`

View File

@@ -1,14 +1,14 @@
## Purpose
技能详情页面布局规范定义了技能开发台详情页的段式布局结构,确保信息层级清晰,用户能够快速定位基本信息和版本历史
技能详情页面布局规范定义了技能开发台详情页的段式布局结构,确保信息层级清晰,用户能够快速定位内部信息、当前生效版本、版本历史和管理操作
## ADDED Requirements
## Requirements
### Requirement: 段式页面布局
技能详情页面 SHALL 采用段式卡片布局结构,依次展示头部概览、版本历史、管理操作。
### Requirement: 段式页面布局
技能详情页面 SHALL 采用段式卡片布局结构,依次展示头部概览(内部信息)、当前生效版本、版本历史、管理操作。
#### Scenario: 页面结构展示
- **WHEN** 用户打开技能详情页面
- **THEN** 页面从上到下依次显示:头部概览卡片、版本历史卡片、管理操作卡片
- **THEN** 页面从上到下依次显示:头部概览卡片(内部信息)、当前生效版本卡片、版本历史卡片、管理操作卡片
### Requirement: 返回按钮
技能详情页面 SHALL 在页面顶部显示返回按钮,允许用户返回上一级页面。
@@ -17,56 +17,34 @@
- **WHEN** 用户查看技能详情页面
- **THEN** 页面顶部显示返回按钮,点击后返回"我的技能"页面
### Requirement: 头部概览卡片
技能详情页面 SHALL 在页面顶部显示头部概览卡片,整合展示技能的核心信息。
### Requirement: 头部概览卡片(内部信息)
技能详情页面 SHALL 在页面顶部显示头部概览卡片,展示开发者内部信息。
#### Scenario: 概览卡片信息展示
- **WHEN** 用户查看技能详情页面
- **THEN** 头部概览卡片包含技能图标80x80无背景、技能名称、状态标签、指标行、标签区、技能描述
- **THEN** 头部概览卡片展示开发者内部信息:内部技能名称、状态标签
#### Scenario: 概览卡片第一行布局
- **WHEN** 用户查看头部概览卡片
- **THEN** 第一行显示:技能名称、状态标签、右上角"编辑基本信息"按钮
- **THEN** 第一行显示:内部技能名称、状态标签、右上角"编辑内部信息"按钮
#### Scenario: 概览卡片图标样式
- **WHEN** 用户查看头部概览卡片
- **THEN** 技能图标为 80x80 像素,无渐变背景,直接显示图标或首字母
### Requirement: 当前生效版本卡片
技能详情页面 SHALL 在头部概览卡片下方显示当前生效版本卡片。
### Requirement: 指标行布局
头部概览卡片 SHALL 在名称下方显示指标行,展示关键数据。
#### Scenario: 当前生效版本展示
- **WHEN** 用户查看技能详情页面且技能已上架
- **THEN** 显示当前生效版本卡片,展示该版本在技能商店的展示效果:技能发布名称、技能发布描述、分类、标签、图标、安装数、评分、版本号
#### Scenario: 指标行内容
- **WHEN** 用户查看头部概览卡片
- **THEN** 指标行依次显示:订阅数(图标+数值)、评分(图标+数值)、当前版本号(图标+版本号)
#### Scenario: 指标行样式
- **WHEN** 用户查看头部概览卡片
- **THEN** 指标行与名称之间有分隔线,指标项之间用空格分隔
### Requirement: 标签区布局
头部概览卡片 SHALL 在指标行下方显示标签区。
#### Scenario: 标签区内容
- **WHEN** 用户查看头部概览卡片
- **THEN** 标签区第一个位置显示分类标签(蓝色背景),后面跟随技能的所有标签
#### Scenario: 分类标签样式
- **WHEN** 用户查看标签区
- **THEN** 分类标签使用蓝色背景(#EFF6FF)和蓝色文字(#3B82F6),圆角样式
### Requirement: 技能描述
头部概览卡片 SHALL 在标签区下方显示技能描述。
#### Scenario: 技能描述展示
- **WHEN** 用户查看头部概览卡片
- **THEN** 标签区下方显示技能描述文字
#### Scenario: 无生效版本时
- **WHEN** 用户查看技能详情页面且技能尚未上架
- **THEN** 不显示当前生效版本卡片,或显示空状态提示
### Requirement: 版本历史卡片
技能详情页面 SHALL 在头部概览卡片下方显示版本历史卡片。
技能详情页面 SHALL 在当前生效版本卡片下方显示版本历史卡片。
#### Scenario: 版本历史卡片展示
- **WHEN** 用户查看技能详情页面
- **THEN** 版本历史卡片包含标题"版本历史"和版本历史表格
- **THEN** 版本历史卡片包含标题"版本历史"和版本历史卡片列表(非表格
#### Scenario: 版本历史操作按钮
- **WHEN** 用户查看版本历史卡片

View File

@@ -1,50 +1,26 @@
## Purpose
技能概览卡片用于在技能编辑页面顶部集中展示技能核心信息,提供更好的信息组织和视觉体验
技能概览卡片用于在技能编辑页面顶部集中展示开发者内部信息,提供清晰的内部视图与商店发布视图的分离
## ADDED Requirements
## Requirements
### Requirement: 技能概览卡片
技能编辑页面 SHALL 在页面顶部显示技能概览卡片,集中展示技能核心信息。
技能编辑页面 SHALL 在页面顶部显示技能概览卡片,展示开发者内部信息。
#### Scenario: 卡片布局结构
- **WHEN** 用户打开技能编辑页面
- **THEN** 页面顶部显示技能概览卡片,包含技能图标、名称、状态标签、指标行、标签区(含分类)、技能描述和右上角操作按钮
- **THEN** 页面顶部显示技能概览卡片,包含内部名称、状态标签、右上角"编辑内部信息"按钮
#### Scenario: 技能图标显示
#### Scenario: 内部名称和状态显示
- **WHEN** 用户查看技能概览卡片
- **THEN** 卡片左侧显示技能图标图标尺寸为80x80像素无背景直接显示图标或首字母
#### Scenario: 技能名称和状态显示
- **WHEN** 用户查看技能概览卡片
- **THEN** 卡片右侧第一行显示技能名称、状态标签,名称右侧显示"编辑基本信息"按钮
- **THEN** 卡片右侧第一行显示开发者内部技能名称、状态标签,名称右侧显示"编辑内部信息"按钮
#### Scenario: 状态标签样式
- **WHEN** 用户查看技能概览卡片
- **THEN** 状态标签为纯文字样式,不使用图标,通过颜色区分状态类型
#### Scenario: 指标行显示
- **WHEN** 用户查看技能概览卡片
- **THEN** 名称下方显示指标行,包含订阅数(图标+数值)、评分(图标+数值)、当前版本号(图标+版本号)
#### Scenario: 指标行样式
- **WHEN** 用户查看技能概览卡片
- **THEN** 指标行与名称之间有分隔线,指标项不显示文字说明(如"订阅"、"评分"),图标本身已足够表达含义
#### Scenario: 标签区显示
- **WHEN** 用户查看技能概览卡片
- **THEN** 指标行下方显示标签区,第一个位置显示分类标签(蓝色背景),后面跟随技能的所有标签
#### Scenario: 分类标签样式
- **WHEN** 用户查看标签区
- **THEN** 分类标签使用蓝色背景(#EFF6FF)和蓝色文字(#3B82F6),圆角胶囊样式,与其他标签区分
#### Scenario: 技能描述显示
- **WHEN** 用户查看技能概览卡片
- **THEN** 标签区下方显示技能描述
#### Scenario: 操作按钮显示
- **WHEN** 用户查看技能概览卡片
- **THEN** 卡片右上角只显示"编辑基本信息"操作按钮
- **THEN** 卡片右上角只显示"编辑内部信息"操作按钮
#### Scenario: 卡片视觉样式
- **WHEN** 用户查看技能概览卡片

View File

@@ -0,0 +1,37 @@
## Purpose
技能发布信息版本化管理,确保所有在技能商店展示的信息(名称、描述、分类、标签、图标)都跟随版本,任何变更都必须经过版本审核流程。
## Requirements
### Requirement: 发布信息跟随版本
每个版本 SHALL 包含完整的技能发布信息,这些信息在版本审核通过后成为技能商店展示的内容。
#### Scenario: 版本发布信息字段
- **WHEN** 创建新版本时
- **THEN** 版本必须包含以下发布信息字段:技能发布名称、技能发布描述、分类、标签、图标
#### Scenario: 商店展示内容来源
- **WHEN** 用户在技能商店查看技能时
- **THEN** 展示内容来自当前生效版本的发布信息字段,而非 Skill 对象
### Requirement: 内部信息与发布信息分离
Skill 对象 SHALL 仅保留开发者内部使用的名称和描述,与商店发布信息完全分离。
#### Scenario: 内部信息字段
- **WHEN** 创建或编辑技能时
- **THEN** Skill 对象仅包含:开发者内部技能名称、开发者内部技能描述
#### Scenario: 内部信息编辑权限
- **WHEN** 开发者编辑技能内部信息时
- **THEN** 可在任何状态下编辑,无需审核,不影响技能商店展示
### Requirement: 发布信息修改必须发版
修改技能商店展示的发布信息 SHALL 必须通过发布新版本实现。
#### Scenario: 发布信息修改路径
- **WHEN** 开发者需要修改技能商店展示的名称、描述、分类、标签或图标时
- **THEN** 必须上传新版本,在新版本中填写新的发布信息,提交审核
#### Scenario: 版本继承发布信息
- **WHEN** 上传非首个版本时
- **THEN** 发布信息表单默认继承当前生效版本的发布信息值

View File

@@ -1,4 +1,4 @@
## ADDED Requirements
## Requirements
### Requirement: 管理台审核列表
AdminPage SHALL 提供版本审核和下架审核的列表展示。
@@ -13,30 +13,19 @@ AdminPage SHALL 提供版本审核和下架审核的列表展示。
#### Scenario: 版本审核列表展示
- **WHEN** 用户查看版本审核Tab
- **THEN** 页面显示待审核版本列表,每条包含技能名称、版本号、提交时间、开发者、操作按钮
- **THEN** 页面显示待审核版本列表,每条包含技能发布名称、版本号、提交时间、开发者、操作按钮
#### Scenario: 下架审核列表展示
- **WHEN** 用户切换到下架审核Tab
- **THEN** 页面显示待审核下架列表,每条包含技能名称、当前版本、申请时间、开发者、操作按钮
- **THEN** 页面显示待审核下架列表,每条包含技能发布名称、当前版本、申请时间、开发者、操作按钮
### Requirement: 管理台版本审核详情
AdminPage SHALL 提供版本审核的详情展示和操作。
AdminPage SHALL 提供版本审核的详情展示和操作,展示该版本的发布信息
#### Scenario: 版本信息展示
- **WHEN** 用户点击版本审核列表中的"审核"按钮
- **THEN** 页面显示技能基本信息(名称、开发者、分类、标签)、版本信息(版本号、提交时间、版本说明、文件列表
- **THEN** 页面展示该版本提交的完整发布信息:技能发布名称、技能发布描述、分类、标签、图标、版本号、提交时间、版本说明、文件列表
#### Scenario: 审核操作按钮
- **WHEN** 用户查看版本审核详情
- **THEN** 页面底部显示"拒绝"和"通过"两个按钮
### Requirement: 管理台下架审核详情
AdminPage SHALL 提供下架审核的详情展示和操作。
#### Scenario: 下架信息展示
- **WHEN** 用户点击下架审核列表中的"审核"按钮
- **THEN** 页面显示技能信息(名称、开发者、当前版本、订阅数、申请时间)
#### Scenario: 下架审核操作
- **WHEN** 用户查看下架审核详情
- **THEN** 页面底部显示"拒绝"和"通过"两个按钮

View File

@@ -1,45 +1,61 @@
## ADDED Requirements
## Requirements
### Requirement: 版本上传表单
UploadVersionPage SHALL 提供版本上传的表单界面。
UploadVersionPage SHALL 提供版本上传的表单界面,包含发布信息字段
#### Scenario: 版本信息输入
- **WHEN** 用户打开上传新版本页面
- **THEN** 页面显示版本说明输入框文件上传区域
- **THEN** 页面显示版本说明输入框、技能发布名称输入框、技能发布描述输入框、分类下拉框、标签输入、图标选择器、文件上传区域
#### Scenario: 发布信息字段展示
- **WHEN** 用户在上传新版本页面填写表单时
- **THEN** 页面清晰区分版本说明(供审核参考)和发布信息(商店展示内容)
#### Scenario: 非首版本默认继承
- **WHEN** 用户上传非首个版本时
- **THEN** 技能发布名称、技能发布描述、分类、标签、图标默认继承当前生效版本的值
#### Scenario: 首版本默认值
- **WHEN** 用户上传首个版本时
- **THEN** 技能发布名称、技能发布描述、分类、标签、图标默认值为空
#### Scenario: 文件上传展示
- **WHEN** 用户在上传页面看到文件上传区域
- **THEN** 页面展示拖拽上传区域,支持 .zip 格式,显示上传图标和提示文字
### Requirement: 版本历史展示
SkillEditorPage SHALL 展示技能的版本历史列表。
SkillEditorPage SHALL 展示技能的版本历史列表,包含每个版本的发布信息
#### Scenario: 版本列表展示
- **WHEN** 用户打开技能详情页
- **THEN** 页面显示版本历史表格,包含版本号、版本说明、状态、更新时间、操作列
- **THEN** 页面显示版本历史卡片,每个版本使用普通卡片布局(非表格、非折叠),包含版本号、版本说明、发布信息预览、状态、更新时间、操作列
#### Scenario: 发布信息预览
- **WHEN** 用户查看版本历史卡片时
- **THEN** 每个版本卡片显示该版本的发布信息预览:图标 + 技能发布名称 + 标签列表
#### Scenario: 版本状态展示
- **WHEN** 用户查看版本历史列表
- **WHEN** 用户查看版本历史卡片
- **THEN** 每个版本显示对应的状态标签审核中warning、审核通过running、审核拒绝error、已撤销stopped
#### Scenario: 审核拒绝理由展示
- **WHEN** 版本状态为审核拒绝
- **THEN** 版本说明下方显示拒绝理由文本
- **THEN** 版本卡片内显示拒绝理由文本
### Requirement: 版本操作按钮
版本历史表格 SHALL 根据版本状态展示不同的操作按钮。
版本历史卡片 SHALL 根据版本状态展示不同的操作按钮。
#### Scenario: 审核中版本操作
- **WHEN** 版本状态为审核中
- **THEN** 显示"撤回审核"、"下载"按钮
- **THEN** 显示"撤回审核"按钮
#### Scenario: 已完结版本操作
- **WHEN** 版本状态为审核通过/审核拒绝/已撤销
- **THEN** 显示"下载"按钮
- **THEN** 显示操作按钮
### Requirement: 技能市场版本展示
SkillDetailPage SHALL 展示技能的最新版本信息。
#### Scenario: 最新版本展示
- **WHEN** 用户打开技能市场详情页
- **THEN** 页面示当前版本号、更新说明、更新时间(仅展示最新版本,不展示完整历史)
- **THEN** 页面示当前生效版本的发布信息,包括技能发布名称、技能发布描述、分类、标签、图标