99 lines
2.3 KiB
TypeScript
99 lines
2.3 KiB
TypeScript
/**
|
|
* 更新主入口,引入全局样式
|
|
* V21 设计系统配置
|
|
*/
|
|
import React from 'react';
|
|
import ReactDOM from 'react-dom/client';
|
|
import { RouterProvider } from 'react-router-dom';
|
|
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
|
import { ConfigProvider } from 'antd';
|
|
import zhCN from 'antd/locale/zh_CN';
|
|
import router from './router';
|
|
import './index.css';
|
|
import './styles/global.css';
|
|
|
|
// 创建 React Query 客户端
|
|
const queryClient = new QueryClient({
|
|
defaultOptions: {
|
|
queries: {
|
|
retry: 1,
|
|
refetchOnWindowFocus: false,
|
|
staleTime: 5 * 60 * 1000, // 5 分钟
|
|
gcTime: 10 * 60 * 1000, // 10 分钟
|
|
},
|
|
},
|
|
});
|
|
|
|
// V21 Ant Design 主题配置 - Indigo 主色 / 大圆角
|
|
const theme = {
|
|
token: {
|
|
// 主色调 - Indigo
|
|
colorPrimary: '#4f46e5',
|
|
colorSuccess: '#10b981',
|
|
colorWarning: '#f59e0b',
|
|
colorError: '#ef4444',
|
|
colorInfo: '#4f46e5',
|
|
|
|
// 圆角 - V21 大圆角
|
|
borderRadius: 14,
|
|
borderRadiusLG: 22,
|
|
borderRadiusSM: 10,
|
|
|
|
// 文字色
|
|
colorText: '#0f172a',
|
|
colorTextSecondary: '#64748b',
|
|
colorTextTertiary: '#94a3b8',
|
|
|
|
// 背景色
|
|
colorBgContainer: '#ffffff',
|
|
colorBgLayout: '#f8fafc',
|
|
|
|
// 边框色
|
|
colorBorder: '#e2e8f0',
|
|
colorBorderSecondary: '#f1f5f9',
|
|
|
|
// 阴影
|
|
boxShadow: '0 10px 30px rgba(15, 23, 42, 0.06)',
|
|
boxShadowSecondary: '0 24px 70px rgba(15, 23, 42, 0.09)',
|
|
},
|
|
components: {
|
|
Button: {
|
|
// 按钮圆角
|
|
borderRadius: 14,
|
|
// 主按钮渐变通过 CSS 实现
|
|
colorPrimary: '#4f46e5',
|
|
colorPrimaryHover: '#6366f1',
|
|
primaryShadow: '0 14px 26px rgba(79, 70, 229, 0.22)',
|
|
},
|
|
Card: {
|
|
borderRadiusLG: 28,
|
|
paddingLG: 28,
|
|
},
|
|
Input: {
|
|
borderRadius: 14,
|
|
},
|
|
Select: {
|
|
borderRadius: 14,
|
|
},
|
|
Modal: {
|
|
borderRadiusLG: 28,
|
|
},
|
|
InputNumber: {
|
|
borderRadius: 14,
|
|
},
|
|
DatePicker: {
|
|
borderRadius: 14,
|
|
},
|
|
},
|
|
};
|
|
|
|
ReactDOM.createRoot(document.getElementById('root')!).render(
|
|
<React.StrictMode>
|
|
<QueryClientProvider client={queryClient}>
|
|
<ConfigProvider locale={zhCN} theme={theme}>
|
|
<RouterProvider router={router} />
|
|
</ConfigProvider>
|
|
</QueryClientProvider>
|
|
</React.StrictMode>
|
|
);
|