1
0

feat: 升级 Ant Design 6 并实现主题切换功能

- 升级 antd 从 5.24.9 到 6.3.5,@ant-design/icons 从 5.6.1 到 6.1.1
- 新增 ThemeContext 和 ThemeToggle 组件,支持明暗主题切换
- 移除自定义 SCSS 样式,采用 Ant Design 主题系统
- 测试环境从 jsdom 切换到 happy-dom,提升测试性能
- 更新 AppLayout、ModelForm、ProviderForm 以适配新主题系统
This commit is contained in:
2026-04-16 13:31:30 +08:00
parent 1580b5b838
commit 47ecbadc7c
15 changed files with 374 additions and 176 deletions

View File

@@ -0,0 +1,18 @@
import { Button, Tooltip } from 'antd';
import { SunOutlined, MoonOutlined } from '@ant-design/icons';
import { useTheme } from '@/contexts/ThemeContext';
export function ThemeToggle() {
const { mode, toggleTheme } = useTheme();
return (
<Tooltip title={mode === 'light' ? '切换到暗色模式' : '切换到亮色模式'}>
<Button
type="text"
icon={mode === 'light' ? <MoonOutlined /> : <SunOutlined />}
onClick={toggleTheme}
style={{ color: 'inherit' }}
/>
</Tooltip>
);
}