## 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 无 ## 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交互