49 lines
1.5 KiB
Markdown
49 lines
1.5 KiB
Markdown
# Tools页面动态数据加载 Spec
|
|
|
|
## Why
|
|
当前Tools页面使用静态硬编码数据，无法动态管理工具列表。需要改为从数据库通过API获取，实现后台管理动态配置。
|
|
|
|
## What Changes
|
|
- 修改 `Tools.tsx` 从API动态获取分类和工具数据
|
|
- 添加加载状态和错误处理
|
|
- 保持现有UI结构和样式风格
|
|
- 添加工具详情跳转逻辑
|
|
|
|
## Impact
|
|
- Affected code:
|
|
- `chunyu_project_react/src/pages/Tools/Tools.tsx`
|
|
|
|
## ADDED Requirements
|
|
|
|
### Requirement: 动态加载工具列表
|
|
系统SHALL从后端API `/tool/list/` 动态获取工具列表数据。
|
|
|
|
#### Scenario: 页面加载时获取数据
|
|
- **WHEN** 用户访问Tools页面
|
|
- **THEN** 页面从API获取工具列表并展示加载状态
|
|
|
|
#### Scenario: 分类筛选
|
|
- **WHEN** 用户点击分类Tab
|
|
- **THEN** 页面根据所选分类过滤工具列表
|
|
|
|
### Requirement: 动态加载分类列表
|
|
系统SHALL从后端API `/tool/categories/` 动态获取分类数据。
|
|
|
|
#### Scenario: 分类Tab动态渲染
|
|
- **WHEN** 页面加载完成
|
|
- **THEN** 分类Tab从API获取并渲染
|
|
|
|
### Requirement: 错误处理
|
|
系统SHALL在API请求失败时显示友好的错误信息。
|
|
|
|
#### Scenario: 网络错误
|
|
- **WHEN** API请求失败
|
|
- **THEN** 显示错误提示和重试按钮
|
|
|
|
### Requirement: 工具详情跳转
|
|
系统SHALL根据工具类型跳转到对应详情页面。
|
|
|
|
#### Scenario: 点击工具卡片
|
|
- **WHEN** 用户点击工具卡片
|
|
- **THEN** 跳转到工具详情页或外部URL
|