refactor: 迁移 UI 组件库从 Ant Design 至 TDesign

- 替换 antd 为 tdesign-react 作为主要 UI 组件库
- 引入 Recharts 替代 @ant-design/charts 实现图表功能
- 移除主题系统相关代码（ThemeContext、themes 目录）
- 更新所有组件以适配 TDesign 组件 API
- 更新测试用例以匹配新的组件实现
- 新增 TDesign 和 Recharts 集成规范文档

frontend/openspec/changes/archive/2026-04-17-migrate-to-tdesign/.openspec.yaml

@@ -0,0 +1,2 @@
+schema: spec-driven
+created: 2026-04-17

frontend/openspec/changes/archive/2026-04-17-migrate-to-tdesign/design.md

@@ -0,0 +1,346 @@
+## Context
+
+**当前状态**：
+- 前端使用Ant Design 6.3.5作为UI框架
+- 实现了6套自定义主题系统（default、dark、mui、shadcn、bootstrap、glass）
+- 使用@ant-design/charts进行数据可视化
+- 使用antd-style进行动态样式管理
+- 完整的供应商管理和统计功能
+
+**约束条件**：
+- 必须保持所有业务功能不变
+- 图表功能必须保留
+- Settings页面路由必须保留（即使暂时为空）
+- 使用bun作为唯一包管理器
+- 遵循项目现有代码规范（中文注释、测试覆盖）
+
+**利益相关者**：
+- 前端开发团队：维护成本降低
+- 产品用户：UI风格变化，功能保持不变
+
+## Goals / Non-Goals
+
+**Goals:**
+- 完全迁移到TDesign React组件库，统一设计系统
+- 移除复杂的多主题系统，简化代码架构
+- 使用Recharts替代@ant-design/charts实现数据可视化
+- 保持所有业务功能完整可用
+- 确保测试覆盖率不降低
+- 优化bundle体积（移除未使用的主题系统）
+
+**Non-Goals:**
+- 不实现新的业务功能
+- 不保留Ant Design相关代码或依赖
+- 不实现侧边栏折叠功能（接受简化）
+- 不实现主题切换功能（使用TDesign默认主题）
+- 不优化后端API或数据结构
+
+## Decisions
+
+### 1. 图表库选择：Recharts
+
+**决策**：使用Recharts替代@ant-design/charts
+
+**理由**：
+- React原生JSX语法，与TDesign风格一致
+- TypeScript支持优秀，类型定义完整
+- 文档清晰，社区活跃（1.8M周下载量）
+- Bundle体积适中（~370KB vs ECharts ~1MB）
+- shadcn/ui生态默认选择，现代化设计
+- 声明式组件，易于维护和测试
+
+**替代方案**：
+- **ECharts**：功能强大但体积大（1MB），需要wrapper，非React原生
+- **Chart.js**：最流行但非React原生，需要react-chartjs-2 wrapper
+- **Visx**：最灵活但学习曲线陡峭，适合高度定制场景
+
+**实现**：
+```tsx
+// UsageChart.tsx
+import { LineChart, Line, XAxis, YAxis, CartesianGrid, ResponsiveContainer, Tooltip } from 'recharts';
+
+<ResponsiveContainer width="100%" height={300}>
+  <LineChart data={chartData}>
+    <CartesianGrid strokeDasharray="3 3" />
+    <XAxis dataKey="date" />
+    <YAxis />
+    <Tooltip />
+    <Line type="monotone" dataKey="requestCount" stroke="#0052D9" strokeWidth={2} />
+  </LineChart>
+</ResponsiveContainer>
+```
+
+### 2. 主题系统：完全移除
+
+**决策**：删除所有主题相关代码，使用TDesign默认主题
+
+**理由**：
+- 多主题系统增加维护成本和代码复杂度
+- TDesign默认主题已满足企业级应用需求
+- 简化迁移过程，降低风险
+- 减少bundle体积（移除antd-style和主题配置）
+
+**实现**：
+- 删除`src/contexts/ThemeContext.tsx`
+- 删除`src/themes/`整个目录
+- App.tsx移除ThemeProvider，直接使用TDesign ConfigProvider
+- Settings页面简化为空页面
+
+### 3. 布局组件：简化侧边栏
+
+**决策**：移除侧边栏折叠功能，使用固定宽度侧边栏
+
+**理由**：
+- TDesign Menu组件没有内置折叠功能
+- 自定义实现增加复杂度和维护成本
+- 固定宽度侧边栏满足当前业务需求
+- 简化迁移过程，降低风险
+
+**实现**：
+```tsx
+// AppLayout.tsx
+<Layout.Aside width="232px">
+  <div style={{ height: 64 }}>AI Gateway</div>
+  <Menu value={location.pathname} items={menuItems} onChange={({ value }) => navigate(value)} />
+</Layout.Aside>
+```
+
+### 4. 图标系统：TDesign Icons
+
+**决策**：使用tdesign-icons-react图标库
+
+**理由**：
+- 与TDesign组件库配套，风格一致
+- 支持按需导入，优化bundle体积
+- 提供完整的图标集合
+
+**映射方案**：
+```tsx
+// Ant Design → TDesign
+CloudServerOutlined → CloudServerIcon (或ServerIcon)
+BarChartOutlined    → ChartLineIcon (或ChartIcon)
+SettingOutlined     → SettingIcon
+```
+
+**注意**：具体图标名称需要在安装tdesign-icons-react后确认，根据实际可用图标选择最接近的。
+
+### 5. 栅格系统：保持不变
+
+**决策**：继续使用Row/Col栅格系统
+
+**理由**：
+- TDesign提供完整的Row/Col组件
+- API与Ant Design完全兼容
+- 无需修改现有栅格代码
+- 保持响应式布局能力
+
+**实现**：直接替换import路径即可
+```tsx
+// import { Row, Col } from 'antd';
+import { Row, Col } from 'tdesign-react';
+```
+
+### 6. 表单组件：Dialog替代Modal
+
+**决策**：使用TDesign Dialog组件替代Ant Design Modal
+
+**理由**：
+- Dialog是TDesign的标准弹窗组件
+- API相似，迁移成本低
+- 支持所有必要功能（确认、取消、加载状态）
+
+**API映射**：
+```tsx
+// Ant Design Modal → TDesign Dialog
+title       → header
+open        → visible
+onOk        → onConfirm
+onCancel    → onClose (注意：语义略有不同)
+okText      → confirmBtn
+cancelText  → cancelBtn
+destroyOnHidden → destroyOnClose
+Form.Item   → Form.FormItem
+```
+
+### 7. 迁移策略：渐进式文件替换
+
+**决策**：按模块逐个替换，保持项目可运行
+
+**理由**：
+- 降低风险，便于调试
+- 可以逐步验证每个模块的功能
+- 出现问题容易定位和回滚
+
+**顺序**：
+1. 依赖安装与配置（基础）
+2. App.tsx主题移除（入口）
+3. AppLayout布局迁移（导航）
+4. 表单组件迁移（ProviderForm、ModelForm）
+5. 表格组件迁移（ProviderTable、ModelTable、StatsTable）
+6. 统计组件迁移（StatCards、UsageChart）
+7. Settings页面简化
+8. 测试文件更新
+
+## Risks / Trade-offs
+
+### 风险1：图标名称不匹配
+**风险**：TDesign可能没有与Ant Design完全对应的图标名称
+
+**缓解**：
+- 安装tdesign-icons-react后立即确认可用图标
+- 选择语义最接近的图标
+- 必要时使用通用图标（如CloudIcon、ChartIcon、SettingIcon）
+- 在design.md中记录最终选择的图标映射
+
+### 风险2：组件API差异导致功能缺失
+**风险**：TDesign组件API与Ant Design不完全一致，可能影响功能
+
+**缓解**：
+- 逐个组件对比API文档
+- 编写详细的迁移映射表
+- 每个模块迁移后立即测试验证
+- 保留原有业务逻辑，只替换UI组件
+
+### 风险3：样式差异影响用户体验
+**风险**：TDesign默认样式与Ant Design不同，用户可能不适应
+
+**缓解**：
+- 迁移后进行完整UI验收测试
+- 必要时通过ConfigProvider调整主题配置
+- 记录样式差异点，统一调整
+
+### 风险4：测试覆盖率下降
+**风险**：迁移过程中测试可能失败或被跳过
+
+**缓解**：
+- 迁移前确保所有测试通过
+- 每个模块迁移后立即更新对应测试
+- 删除主题相关测试，其他测试必须保留
+- 迁移后运行完整测试套件，确保覆盖率不降低
+
+### 风险5：DatePicker日期格式处理
+**风险**：TDesign DatePicker的日期格式处理可能与Ant Design不同
+
+**缓解**：
+- 对比两个组件的日期格式API
+- 测试日期范围选择功能
+- 确保与后端API的日期格式兼容
+
+## Migration Plan
+
+### 阶段1：依赖准备（0.5小时）
+1. 安装新依赖：
+   ```bash
+   cd frontend
+   bun add tdesign-react tdesign-icons-react recharts
+   ```
+2. 移除旧依赖：
+   ```bash
+   bun remove antd @ant-design/icons @ant-design/charts antd-style
+   ```
+3. 引入TDesign全局样式：
+   ```tsx
+   // src/main.tsx
+   import 'tdesign-react/es/style/index.css';
+   ```
+
+### 阶段2：主题系统移除（0.5小时）
+1. 删除`src/contexts/ThemeContext.tsx`
+2. 删除`src/themes/`整个目录
+3. 修改`src/App.tsx`：
+   - 移除ThemeProvider导入和使用
+   - 替换为TDesign ConfigProvider
+4. 删除主题相关测试文件
+
+### 阶段3：布局与导航迁移（1小时）
+1. 修改`src/components/AppLayout/index.tsx`：
+   - 替换Layout组件（Sider→Aside）
+   - 替换Menu组件
+   - 替换图标（@ant-design/icons→tdesign-icons-react）
+   - 移除折叠功能相关代码
+   - 移除主题相关逻辑
+2. 更新AppLayout测试
+
+### 阶段4：表单组件迁移（1.5小时）
+1. 修改`src/pages/Providers/ProviderForm.tsx`：
+   - Modal→Dialog
+   - Form.Item→Form.FormItem
+   - Input、Switch组件替换
+2. 修改`src/pages/Providers/ModelForm.tsx`：
+   - 同上处理
+3. 更新表单测试
+
+### 阶段5：表格组件迁移（1小时）
+1. 修改`src/pages/Providers/ProviderTable.tsx`：
+   - Table、Card、Button、Tag、Popconfirm、Space替换
+2. 修改`src/pages/Providers/ModelTable.tsx`：
+   - 同上处理
+3. 修改`src/pages/Stats/StatsTable.tsx`：
+   - Table、Card、Select、Input、DatePicker替换
+4. 更新表格测试
+
+### 阶段6：统计组件迁移（1小时）
+1. 修改`src/pages/Stats/StatCards.tsx`：
+   - Row、Col、Card、Statistic替换
+2. 修改`src/pages/Stats/UsageChart.tsx`：
+   - Card保持
+   - @ant-design/charts→recharts重写
+3. 更新统计测试
+
+### 阶段7：Settings页面简化（0.5小时）
+1. 修改`src/pages/Settings/index.tsx`：
+   - 移除主题设置相关代码
+   - 简化为空页面提示
+2. 更新Settings测试
+
+### 阶段8：测试与修复（2小时）
+1. 运行完整测试套件：`bun test`
+2. 修复失败的测试
+3. 运行E2E测试：`bun test:e2e`
+4. 手动验收测试：
+   - 供应商管理完整流程
+   - 统计数据展示
+   - 图表交互
+   - 响应式布局
+
+### 阶段9：样式微调（1小时）
+1. 检查UI一致性
+2. 调整间距、颜色等细节
+3. 确认图标显示正确
+4. 最终验收
+
+### 回滚策略
+如果迁移过程中出现严重问题：
+1. 恢复package.json到迁移前状态
+2. 恢复所有源代码文件
+3. 重新安装依赖：`bun install`
+4. 运行测试确认回滚成功
+
+**注意**：建议在迁移前创建Git分支，便于回滚。
+
+## Open Questions
+
+1. **TDesign图标名称确认**
+   - 需要安装tdesign-icons-react后确认具体图标名称
+   - 如果没有CloudServer/ChartLine/Setting图标，选择哪个替代？
+   - 是否需要自定义SVG图标？
+
+2. **DatePicker日期格式兼容性**
+   - TDesign DatePicker的日期格式是否与后端API兼容？
+   - RangePicker的API是否完全兼容？
+   - 是否需要额外的日期处理逻辑？
+
+3. **ConfigProvider全局配置**
+   - 是否需要配置TDesign的全局属性？
+   - 是否需要自定义主题token？
+   - 国际化配置是否需要调整？
+
+4. **性能影响评估**
+   - 新bundle体积是否可接受？
+   - Recharts渲染性能是否满足需求？
+   - 是否需要代码分割优化？
+
+5. **用户验收标准**
+   - UI风格变化的接受度如何？
+   - 是否需要用户参与验收测试？
+   - 是否需要提供UI变更说明文档？

frontend/openspec/changes/archive/2026-04-17-migrate-to-tdesign/proposal.md

@@ -0,0 +1,75 @@
+## Why
+
+当前前端使用Ant Design作为UI框架，存在多套自定义主题系统导致维护复杂度高，且与项目长期技术规划不一致。迁移到TDesign可以统一设计系统，简化代码架构，降低维护成本，同时保持企业级UI组件库的完整功能。
+
+## What Changes
+
+**BREAKING** 完全移除Ant Design相关依赖，迁移到TDesign React组件库：
+
+- **移除依赖**：
+  - `antd`、`@ant-design/icons`、`@ant-design/charts`、`antd-style`
+  - 多主题系统（6套主题配置）
+  - ThemeContext及相关代码
+
+- **新增依赖**：
+  - `tdesign-react`：TDesign React组件库
+  - `tdesign-icons-react`：TDesign图标库
+  - `recharts`：图表可视化库（替代@ant-design/charts）
+
+- **组件迁移**：
+  - Layout（Sider→Aside）、Menu、Table、Form、Dialog（替代Modal）
+  - Button、Card、Statistic、Tag、Select、Input、Switch、Space
+  - Row/Col栅格系统（API兼容）
+  - DatePicker、Tooltip、Popconfirm
+
+- **功能简化**：
+  - 移除侧边栏折叠功能
+  - 移除多主题切换，使用TDesign默认主题
+  - Settings页面简化为空页面（保留路由，待后续扩展）
+
+- **图表重写**：
+  - UsageChart从@ant-design/charts迁移到Recharts
+  - 使用LineChart组件重新实现请求趋势图
+
+## Capabilities
+
+### New Capabilities
+- `tdesign-integration`: TDesign组件库集成与配置，包括ConfigProvider全局配置、样式引入、图标系统
+- `recharts-integration`: Recharts图表库集成，用于数据可视化展示
+
+### Modified Capabilities
+<!-- 无现有spec需要修改，这是全新的UI框架迁移 -->
+无
+
+## Impact
+
+**代码影响**：
+- `src/App.tsx`：移除ThemeProvider，使用TDesign ConfigProvider
+- `src/components/AppLayout/`：Layout和Menu组件重写
+- `src/pages/Providers/`：所有表单和表格组件更新
+- `src/pages/Stats/`：图表重写，统计组件更新
+- `src/pages/Settings/`：简化为空页面
+- `src/contexts/ThemeContext.tsx`：删除
+- `src/themes/`：整个目录删除
+- 所有测试文件：更新组件引用
+
+**依赖影响**：
+- 移除：antd、@ant-design/icons、@ant-design/charts、antd-style
+- 新增：tdesign-react、tdesign-icons-react、recharts
+- 保留：@tanstack/react-query、react-router、react、react-dom
+
+**API影响**：
+- 组件API变更：Modal→Dialog（属性名不同）
+- 图标API变更：从@ant-design/icons到tdesign-icons-react
+- 图表API变更：从@ant-design/charts到recharts（声明式组件）
+
+**用户体验影响**：
+- UI视觉风格变化（Ant Design → TDesign）
+- 移除主题切换功能
+- 移除侧边栏折叠功能
+- 保持所有业务功能不变
+
+**测试影响**：
+- 所有组件单元测试需要更新
+- 主题相关测试删除
+- E2E测试需要验证UI交互

frontend/openspec/changes/archive/2026-04-17-migrate-to-tdesign/specs/recharts-integration/spec.md

@@ -0,0 +1,112 @@
+# Recharts Integration
+
+集成Recharts图表库，实现数据可视化功能，替代@ant-design/charts。
+
+## ADDED Requirements
+
+### Requirement: Recharts依赖集成
+系统SHALL正确集成Recharts图表库，作为数据可视化的基础依赖。
+
+#### Scenario: 安装Recharts依赖
+- **WHEN** 依赖安装完成
+- **THEN** package.json中SHALL存在recharts依赖
+- **AND** recharts版本SHALL为2.x最新稳定版
+- **AND** Recharts组件SHALL可正常导入使用
+
+### Requirement: UsageChart图表重写
+系统SHALL使用Recharts重新实现UsageChart组件，保持原有功能。
+
+#### Scenario: 折线图渲染
+- **WHEN** UsageChart组件接收统计数据
+- **THEN** SHALL使用Recharts的LineChart组件渲染
+- **AND** X轴SHALL显示日期数据
+- **AND** Y轴SHALL显示请求数据
+- **AND** 图表SHALL支持鼠标悬停显示详情（Tooltip）
+- **AND** 图表SHALL包含网格线（CartesianGrid）
+
+#### Scenario: 响应式图表容器
+- **WHEN** 图表渲染
+- **THEN** SHALL使用ResponsiveContainer包裹
+- **AND** 图表宽度SHALL自适应容器宽度
+- **AND** 图表高度SHALL为固定300px
+
+#### Scenario: 空数据状态处理
+- **WHEN** 统计数据为空数组
+- **THEN** SHALL显示"暂无数据"提示
+- **AND** 不SHALL渲染图表组件
+
+#### Scenario: 数据格式转换
+- **WHEN** 接收UsageStats数组数据
+- **THEN** SHALL按日期聚合计数
+- **AND** 数据SHALL按日期升序排序
+- **AND** 数据格式SHALL适配Recharts要求
+
+### Requirement: 图表样式配置
+系统SHALL配置Recharts图表样式，确保视觉一致性。
+
+#### Scenario: 图表颜色配置
+- **WHEN** 图表渲染
+- **THEN** 折线颜色SHALL为TDesign主色（#0052D9）
+- **AND** 线条宽度SHALL为2px
+- **AND** 数据点样式SHALL正常显示
+
+#### Scenario: 网格线配置
+- **WHEN** 图表渲染
+- **THEN** 网格线SHALL使用虚线样式（strokeDasharray="3 3"）
+- **AND** 网格线SHALL不遮挡数据线
+
+### Requirement: 移除Ant Design Charts
+系统SHALL完全移除@ant-design/charts的使用。
+
+#### Scenario: 移除Line组件
+- **WHEN** 迁移完成
+- **THEN** UsageChart中SHALL不存在@ant-design/charts的Line组件
+- **AND** UsageChart中SHALL不存在任何@ant-design/charts导入
+
+#### Scenario: 移除配置对象模式
+- **WHEN** 图表实现
+- **THEN** SHALL使用Recharts声明式组件模式
+- **AND** 不SHALL使用Ant Design Charts的配置对象模式（xField、yField等）
+
+### Requirement: 图表交互功能
+系统SHALL保持图表的基本交互功能。
+
+#### Scenario: 鼠标悬停提示
+- **WHEN** 用户鼠标悬停在数据点上
+- **THEN** SHALL显示Tooltip提示框
+- **AND** 提示框SHALL显示日期和请求数
+- **AND** 提示框SHALL不遮挡图表内容
+
+#### Scenario: 平滑曲线效果
+- **WHEN** 折线渲染
+- **THEN** SHALL使用monotone类型平滑曲线
+- **AND** 曲线SHALL自然流畅
+- **AND** 数据点SHALL准确对应
+
+### Requirement: 图表性能
+系统SHALL确保图表渲染性能满足要求。
+
+#### Scenario: 大数据量渲染
+- **WHEN** 统计数据包含大量数据点（>100）
+- **THEN** 图表SHALL在1秒内完成渲染
+- **AND** 交互响应SHALL流畅无卡顿
+
+#### Scenario: 组件重渲染优化
+- **WHEN** 父组件重新渲染
+- **THEN** 图表组件SHALL避免不必要的重渲染
+- **AND** 数据未变化时SHALL保持稳定
+
+### Requirement: 图表测试覆盖
+系统SHALL为Recharts图表组件提供完整的测试覆盖。
+
+#### Scenario: 组件渲染测试
+- **WHEN** 运行单元测试
+- **THEN** UsageChart测试SHALL验证正常渲染
+- **AND** UsageChart测试SHALL验证空数据状态
+- **AND** UsageChart测试SHALL验证数据格式转换
+
+#### Scenario: 数据处理测试
+- **WHEN** 运行单元测试
+- **THEN** 测试SHALL覆盖日期聚合逻辑
+- **AND** 测试SHALL覆盖数据排序逻辑
+- **AND** 测试SHALL验证边界情况

frontend/openspec/changes/archive/2026-04-17-migrate-to-tdesign/specs/tdesign-integration/spec.md

@@ -0,0 +1,120 @@
+# TDesign Integration
+
+集成TDesign React组件库，提供统一的UI设计系统和组件支持。
+
+## ADDED Requirements
+
+### Requirement: TDesign全局配置
+系统SHALL正确配置TDesign ConfigProvider作为全局配置容器，确保所有TDesign组件使用统一的配置。
+
+#### Scenario: 应用启动时加载TDesign配置
+- **WHEN** 应用初始化启动
+- **THEN** ConfigProvider组件SHALL包裹整个应用
+- **AND** TDesign全局样式SHALL被正确引入
+- **AND** 所有TDesign组件SHALL使用统一配置
+
+#### Scenario: 移除Ant Design配置
+- **WHEN** 迁移完成
+- **THEN** 应用中SHALL不存在Ant Design的ConfigProvider
+- **AND** 应用中SHALL不存在ThemeProvider
+- **AND** 应用中SHALL不存在任何Ant Design全局配置
+
+### Requirement: TDesign组件替换
+系统SHALL将所有Ant Design组件替换为对应的TDesign组件，保持功能完整性。
+
+#### Scenario: 布局组件替换
+- **WHEN** 使用Layout组件
+- **THEN** SHALL使用TDesign的Layout组件
+- **AND** Layout.Sider SHALL替换为Layout.Aside
+- **AND** Layout.Header SHALL保持不变
+- **AND** Layout.Content SHALL保持不变
+
+#### Scenario: 表单组件替换
+- **WHEN** 使用表单相关组件
+- **THEN** Modal SHALL替换为Dialog
+- **AND** Form.Item SHALL替换为Form.FormItem
+- **AND** Input、Select、Switch SHALL使用TDesign版本
+- **AND** 表单验证功能SHALL保持完整
+
+#### Scenario: 数据展示组件替换
+- **WHEN** 使用数据展示组件
+- **THEN** Table、Card、Statistic、Tag SHALL使用TDesign版本
+- **AND** 组件功能SHALL保持不变
+- **AND** 组件API SHALL兼容原有使用方式
+
+#### Scenario: 导航组件替换
+- **WHEN** 使用导航组件
+- **THEN** Menu SHALL使用TDesign版本
+- **AND** 菜单项配置SHALL正确映射
+- **AND** 路由导航功能SHALL保持正常
+
+### Requirement: TDesign图标系统
+系统SHALL使用tdesign-icons-react作为图标库，替换@ant-design/icons。
+
+#### Scenario: 图标导入替换
+- **WHEN** 使用图标组件
+- **THEN** SHALL从tdesign-icons-react导入
+- **AND** SHALL不从@ant-design/icons导入任何图标
+- **AND** 图标显示SHALL正常
+
+#### Scenario: 图标语义匹配
+- **WHEN** 替换图标
+- **THEN** 新图标SHALL与原图标语义相近
+- **AND** CloudServerOutlined SHALL替换为语义相近的TDesign图标
+- **AND** BarChartOutlined SHALL替换为语义相近的TDesign图标
+- **AND** SettingOutlined SHALL替换为语义相近的TDesign图标
+
+### Requirement: 栅格系统兼容
+系统SHALL保持Row/Col栅格系统的使用，确保响应式布局功能正常。
+
+#### Scenario: 栅格组件替换
+- **WHEN** 使用Row和Col组件
+- **THEN** SHALL使用TDesign的Row和Col组件
+- **AND** 响应式配置（xs、sm、md、lg、xl）SHALL保持有效
+- **AND** gutter配置SHALL正常工作
+- **AND** 布局效果SHALL与迁移前一致
+
+### Requirement: 主题系统移除
+系统SHALL完全移除多主题系统，使用TDesign默认主题。
+
+#### Scenario: 删除主题相关代码
+- **WHEN** 迁移完成
+- **THEN** ThemeContext SHALL被删除
+- **AND** themes目录 SHALL被删除
+- **AND** 所有主题相关导入SHALL被移除
+
+#### Scenario: 使用TDesign默认主题
+- **WHEN** 应用运行
+- **THEN** SHALL使用TDesign默认视觉风格
+- **AND** 不SHALL提供主题切换功能
+- **AND** UI风格SHALL统一一致
+
+### Requirement: 依赖管理
+系统SHALL正确管理npm依赖，确保无冗余依赖。
+
+#### Scenario: 移除Ant Design依赖
+- **WHEN** 依赖安装完成
+- **THEN** package.json中SHALL不存在antd
+- **AND** package.json中SHALL不存在@ant-design/icons
+- **AND** package.json中SHALL不存在@ant-design/charts
+- **AND** package.json中SHALL不存在antd-style
+
+#### Scenario: 添加TDesign依赖
+- **WHEN** 依赖安装完成
+- **THEN** package.json中SHALL存在tdesign-react
+- **AND** package.json中SHALL存在tdesign-icons-react
+- **AND** 依赖版本SHALL为最新稳定版
+
+### Requirement: Settings页面简化
+系统SHALL保留Settings页面路由，但简化页面内容为空状态。
+
+#### Scenario: Settings页面访问
+- **WHEN** 用户访问/settings路由
+- **THEN** 页面SHALL正常加载
+- **AND** 页面SHALL显示空状态提示
+- **AND** 不SHALL显示主题设置相关内容
+
+#### Scenario: Settings路由保留
+- **WHEN** 应用路由配置
+- **THEN** /settings路由SHALL存在
+- **AND** Settings页面组件SHALL存在

frontend/openspec/changes/archive/2026-04-17-migrate-to-tdesign/tasks.md

@@ -0,0 +1,129 @@
+# Implementation Tasks
+
+## 1. 依赖管理
+
+- [x] 1.1 安装TDesign相关依赖（tdesign-react、tdesign-icons-react、recharts）
+- [x] 1.2 移除Ant Design相关依赖（antd、@ant-design/icons、@ant-design/charts、antd-style）
+- [x] 1.3 验证依赖安装正确，无冲突
+
+## 2. 全局配置
+
+- [x] 2.1 在main.tsx引入TDesign全局样式（tdesign-react/es/style/index.css）
+- [x] 2.2 修改App.tsx，移除ThemeProvider包裹
+- [x] 2.3 在App.tsx添加TDesign ConfigProvider包裹
+- [x] 2.4 删除src/contexts/ThemeContext.tsx文件
+- [x] 2.5 删除src/themes整个目录
+
+## 3. 布局与导航迁移
+
+- [x] 3.1 修改AppLayout组件，替换Layout相关导入（antd→tdesign-react）
+- [x] 3.2 将Layout.Sider替换为Layout.Aside
+- [x] 3.3 移除侧边栏折叠功能相关代码（collapsed状态、onCollapse回调）
+- [x] 3.4 设置固定侧边栏宽度（232px）
+- [x] 3.5 替换图标导入（@ant-design/icons→tdesign-icons-react）
+- [x] 3.6 确认并选择合适的TDesign图标（CloudServer、ChartLine、Setting）
+- [x] 3.7 修改Menu组件属性（value、items、onChange）
+- [x] 3.8 移除主题相关逻辑（isDark、effectiveThemeId）
+- [x] 3.9 移除theme.useToken()相关代码
+- [x] 3.10 更新AppLayout测试文件
+
+## 4. 表单组件迁移
+
+- [x] 4.1 修改ProviderForm组件导入（antd→tdesign-react）
+- [x] 4.2 将Modal替换为Dialog（title→header、open→visible、onOk→onConfirm）
+- [x] 4.3 调整Dialog按钮属性（okText→confirmBtn、cancelBtn）
+- [x] 4.4 将Form.Item替换为Form.FormItem
+- [x] 4.5 将Form onFinish替换为onSubmit
+- [x] 4.6 替换Input、Input.Password、Switch组件
+- [x] 4.7 验证表单验证规则正常工作
+- [x] 4.8 修改ModelForm组件，执行相同迁移步骤
+- [x] 4.9 更新ProviderForm测试文件
+- [x] 4.10 更新ModelForm测试文件
+
+## 5. 表格组件迁移
+
+- [x] 5.1 修改ProviderTable组件导入（antd→tdesign-react）
+- [x] 5.2 替换Table、Card、Button、Tag、Popconfirm、Space、Tooltip组件
+- [x] 5.3 调整Button属性（variant、color→theme）
+- [x] 5.4 验证Table expandable配置正常工作
+- [x] 5.5 修改ModelTable组件，执行相同迁移步骤
+- [x] 5.6 修改StatsTable组件导入
+- [x] 5.7 替换DatePicker.RangePicker组件
+- [x] 5.8 验证日期范围选择功能正常
+- [x] 5.9 更新ProviderTable测试文件
+- [x] 5.10 更新ModelTable测试文件
+- [x] 5.11 更新StatsTable测试文件
+
+## 6. 统计组件迁移
+
+- [x] 6.1 修改StatCards组件导入（antd→tdesign-react）
+- [x] 6.2 替换Row、Col、Card、Statistic组件
+- [x] 6.3 验证栅格响应式配置正常工作
+- [x] 6.4 修改UsageChart组件导入
+- [x] 6.5 移除@ant-design/charts的Line组件导入
+- [x] 6.6 添加Recharts相关导入（LineChart、Line、XAxis、YAxis、CartesianGrid、ResponsiveContainer、Tooltip）
+- [x] 6.7 重写图表渲染逻辑，使用Recharts声明式组件
+- [x] 6.8 配置图表样式（stroke="#0052D9"、strokeWidth={2}）
+- [x] 6.9 配置网格线（strokeDasharray="3 3"）
+- [x] 6.10 验证图表响应式容器正常工作
+- [x] 6.11 验证空数据状态显示正确
+- [x] 6.12 更新StatCards测试文件
+- [x] 6.13 更新UsageChart测试文件
+
+## 7. Settings页面简化
+
+- [x] 7.1 修改Settings页面导入（antd→tdesign-react）
+- [x] 7.2 移除主题设置相关代码（useTheme、themeOptions、Select、Switch）
+- [x] 7.3 简化为空页面，显示"设置功能开发中..."提示
+- [x] 7.4 使用Card组件包裹提示内容
+- [x] 7.5 更新Settings测试文件
+
+## 8. 其他页面调整
+
+- [x] 8.1 修改Providers/index.tsx，移除Typography导入（如有）
+- [x] 8.2 修改Stats/index.tsx，移除主题相关逻辑
+- [x] 8.3 检查并更新所有页面的组件导入
+
+## 9. 测试文件更新
+
+- [x] 9.1 删除src/__tests__/contexts/ThemeContext.test.tsx
+- [x] 9.2 删除src/__tests__/themes整个目录
+- [x] 9.3 更新src/__tests__/components/AppLayout.test.tsx
+- [x] 9.4 更新src/__tests__/components/ProviderForm.test.tsx
+- [x] 9.5 更新src/__tests__/components/ModelForm.test.tsx
+- [x] 9.6 更新src/__tests__/components/ProviderTable.test.tsx
+- [x] 9.7 更新src/__tests__/components/ModelTable.test.tsx
+- [x] 9.8 更新src/__tests__/components/StatCards.test.tsx
+- [x] 9.9 更新src/__tests__/components/UsageChart.test.tsx
+- [x] 9.10 更新src/__tests__/components/StatsTable.test.tsx
+- [x] 9.11 更新src/__tests__/pages/Settings.test.tsx
+- [x] 9.12 运行完整测试套件，确保所有测试通过
+
+## 10. 验收测试
+
+- [x] 10.1 运行单元测试：bun test
+- [x] 10.2 运行测试覆盖率：bun test:coverage
+- [x] 10.3 运行E2E测试：bun test:e2e
+- [x] 10.4 手动测试供应商管理完整流程（添加、编辑、删除）
+- [x] 10.5 手动测试模型管理完整流程
+- [x] 10.6 手动测试统计数据展示
+- [x] 10.7 手动测试图表交互（悬停、响应式）
+- [x] 10.8 手动测试响应式布局（不同屏幕尺寸）
+- [x] 10.9 手动测试Settings页面访问
+- [x] 10.10 验证所有路由导航正常
+
+## 11. 样式微调
+
+- [x] 11.1 检查UI整体一致性
+- [x] 11.2 调整组件间距（如有必要）
+- [x] 11.3 调整颜色配置（如有必要）
+- [x] 11.4 确认图标显示正确且风格统一
+- [x] 11.5 确认表单布局美观
+- [x] 11.6 确认表格样式清晰
+
+## 12. 文档更新
+
+- [x] 12.1 更新README.md中的技术栈说明
+- [x] 12.2 记录图标映射关系
+- [x] 12.3 记录组件API差异点
+- [x] 12.4 更新开发文档（如有）