sync from local backup

2026-08-05 23:59:22 +08:00
commit a59f46b894
409 changed files with 166027 additions and 0 deletions
@@ -0,0 +1,45 @@
+# 二维码生成API详情页 Checklist
+
+## 功能验证
+
+- [x] API详情页可以通过 `/api/qrcode-generator` 访问
+- [x] 文档标签页正确显示接口基本信息
+- [x] 参数表格包含所有二维码生成参数
+- [x] 响应示例显示正确的JSON格式
+- [x] 错误码表格包含常见错误码说明
+- [x] 测试标签页可以输入参数并发送请求
+- [x] 测试结果正确显示状态码、响应时间和响应体
+
+## 参数文档完整性
+
+- [x] text参数：string类型，必填，描述为"要编码的文本内容"
+- [x] errorLevel参数：string类型，可选，默认"M"，描述为"容错率：L(7%)/M(15%)/Q(25%)/H(30%)"
+- [x] version参数：integer类型，可选，默认0，描述为"二维码版本1-40，0表示自动"
+- [x] margin参数：integer类型，可选，默认2，描述为"边距大小（色块数量），范围1-4"
+- [x] size参数：integer类型，可选，默认400，描述为"输出尺寸（像素），范围100-3000"
+- [x] fgColor参数：string类型，可选，默认"#000000"，描述为"前景色（十六进制颜色值）"
+- [x] bgColor参数：string类型，可选，默认"#ffffff"，描述为"背景色（十六进制颜色值）"
+- [x] dotStyle参数：string类型，可选，默认"square"，描述为"点阵样式"
+- [x] finderStyle参数：string类型，可选，默认"square"，描述为"定位图案样式"
+- [x] logo参数：object类型，可选，描述为"Logo配置，包含image和size"
+
+## 视觉验证
+
+- [x] Hero区域显示正确的渐变背景
+- [x] 标签页切换功能正常
+- [x] 代码块显示正确的语法高亮
+- [x] 表格样式与其他API详情页一致
+- [x] 深色模式下所有元素显示正确
+
+## 响应式验证
+
+- [x] 桌面端显示正常
+- [x] 移动端显示正常
+- [x] 表格在小屏幕上可以横向滚动
+- [x] 测试表单在小屏幕上布局合理
+
+## 一致性验证
+
+- [x] 页面结构与天气查询API详情页一致
+- [x] 参数表格格式与现有API详情页一致
+- [x] 响应示例格式与现有API详情页一致
@@ -0,0 +1,57 @@
+# 二维码生成API详情页 Spec
+
+## Why
+需要为二维码生成工具创建一个API详情页，参考现有的天气查询API详情页模式，使前后端保持一致，方便开发者理解和使用二维码生成接口。
+
+## What Changes
+- **新增API详情页**：为二维码生成工具创建独立的API详情页面
+- **参数文档化**：将所有二维码生成参数整理成表格形式，包含参数名、类型、必填、描述
+- **响应示例**：提供二维码生成的响应示例数据
+- **接口测试**：提供在线测试界面，支持输入参数并查看响应
+
+## Impact
+- Affected specs: 无
+- Affected code: 
+  - `src/pages/QRCodeGenerator/QRCodeGeneratorApiDetail.tsx` - 新增API详情页组件
+  - `src/pages/QRCodeGenerator/QRCodeGeneratorApiDetail.css` - 新增样式文件
+  - `src/App.tsx` - 添加路由配置
+
+## ADDED Requirements
+### Requirement: 二维码生成API详情页
+系统应提供二维码生成API的文档页面，包含接口说明、参数文档、响应示例和在线测试功能。
+
+#### Scenario: API详情页展示
+- **WHEN** 用户访问 `/api/qrcode-generator`
+- **THEN** 页面显示API文档标签页和接口测试标签页
+- **AND** 文档标签页包含接口名称、请求地址、请求方法
+- **AND** 参数表格列出所有支持的参数及其说明
+
+#### Scenario: 参数文档完整性
+- **WHEN** 用户查看API参数文档
+- **THEN** 参数表格包含以下字段：参数名、类型、必填、描述
+- **AND** 参数包括：text、errorLevel、version、margin、size、fgColor、bgColor、dotStyle、finderStyle、logo
+- **AND** 每个参数都有清晰的默认值说明
+
+#### Scenario: 响应示例
+- **WHEN** 用户查看响应示例
+- **THEN** 页面显示标准的JSON响应格式
+- **AND** 包含成功响应（200）的示例数据
+- **AND** 包含错误码说明表格
+
+### Requirement: 在线测试功能
+API详情页应提供在线测试界面，支持用户输入参数并查看响应结果。
+
+#### Scenario: API测试
+- **WHEN** 用户在测试标签页输入参数并点击发送
+- **THEN** 系统显示请求状态（成功/失败）
+- **AND** 显示响应时间
+- **AND** 显示响应体内容
+
+## MODIFIED Requirements
+### Requirement: 路由配置
+需要在现有路由配置中添加二维码生成API详情页的路由。
+
+#### Scenario: 路由访问
+- **WHEN** 用户访问 `/api/qrcode-generator`
+- **THEN** 系统正确渲染二维码生成API详情页
+- **AND** 页面样式与其他API详情页保持一致
@@ -0,0 +1,28 @@
+# 二维码生成API详情页 Tasks
+
+- [x] 任务1：创建API详情页组件结构
+  - [x] 任务1.1：创建 `QRCodeGeneratorApiDetail.tsx` 组件文件
+  - [x] 任务1.2：创建 `QRCodeGeneratorApiDetail.css` 样式文件
+  - [x] 任务1.3：在 `App.tsx` 中添加路由配置 `/api/qrcode-generator`
+
+- [x] 任务2：实现API文档标签页
+  - [x] 任务2.1：实现接口基本信息展示（接口名称、请求地址、请求方法）
+  - [x] 任务2.2：实现请求参数表格，包含text、errorLevel、version、margin、size、fgColor、bgColor、dotStyle、finderStyle、logo
+  - [x] 任务2.3：实现响应示例展示，包含成功响应JSON格式
+  - [x] 任务2.4：实现错误码说明表格
+
+- [x] 任务3：实现接口测试标签页
+  - [x] 任务3.1：实现请求配置区域（方法选择、URL输入、发送按钮）
+  - [x] 任务3.2：实现请求参数输入表单
+  - [x] 任务3.3：实现响应展示区域（状态码、响应时间、响应体）
+  - [x] 任务3.4：实现加载状态和空状态展示
+
+- [x] 任务4：样式和响应式适配
+  - [x] 任务4.1：应用与现有API详情页一致的样式
+  - [x] 任务4.2：实现深色模式适配
+  - [x] 任务4.3：实现移动端响应式布局
+
+# Task Dependencies
+- 任务2 依赖于 任务1（组件结构完成后才能实现文档内容）
+- 任务3 依赖于 任务1（组件结构完成后才能实现测试功能）
+- 任务4 依赖于 任务2和任务3（样式适配需要在内容实现完成后进行）