93 lines
3.1 KiB
TypeScript
93 lines
3.1 KiB
TypeScript
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
|
|
import { App as ContainerApp } from './pages/container';
|
|
import { App as MapApp } from './pages/map';
|
|
import { App as UserApp } from './pages/user';
|
|
import { App as UserAppApp } from './pages/app';
|
|
import { App as FileApp } from './pages/file';
|
|
import { App as OrgApp } from './pages/org';
|
|
import { App as ConfigApp } from './pages/config';
|
|
import { basename } from './modules/basename';
|
|
import { Redirect } from './modules/Redirect';
|
|
import { CustomThemeProvider } from '@kevisual/center-components/theme/index.tsx';
|
|
import { useTheme } from '@mui/material/styles';
|
|
import { ToastContainer } from 'react-toastify';
|
|
import 'dayjs/locale/zh-cn';
|
|
import 'dayjs/locale/en';
|
|
import zhCN from 'antd/locale/zh_CN';
|
|
import enUS from 'antd/locale/en_US';
|
|
import ConfigProvider from 'antd/es/config-provider';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { useEffect, useState } from 'react';
|
|
|
|
const AntProvider = ({ children }: { children: React.ReactNode }) => {
|
|
const theme = useTheme();
|
|
const primaryColor = theme.palette.primary.main;
|
|
const secondaryColor = theme.palette.secondary.main;
|
|
const { i18n } = useTranslation();
|
|
const [locale, setLocale] = useState(zhCN);
|
|
useEffect(() => {
|
|
if (i18n.language === 'en') {
|
|
setLocale(enUS);
|
|
} else {
|
|
setLocale(zhCN);
|
|
}
|
|
}, [i18n.language]);
|
|
return (
|
|
<ConfigProvider
|
|
locale={locale}
|
|
theme={{
|
|
token: {
|
|
colorPrimary: primaryColor,
|
|
colorPrimaryHover: secondaryColor,
|
|
colorPrimaryActive: primaryColor,
|
|
borderRadius: 4,
|
|
colorBorder: primaryColor,
|
|
colorIcon: primaryColor,
|
|
colorIconHover: secondaryColor,
|
|
colorInfoHover: secondaryColor,
|
|
zIndexPopupBase: 2000,
|
|
},
|
|
components: {
|
|
DatePicker: {
|
|
colorPrimary: primaryColor,
|
|
colorPrimaryHover: secondaryColor,
|
|
colorPrimaryActive: primaryColor,
|
|
},
|
|
Tooltip: {
|
|
zIndexPopupBase: 2000,
|
|
},
|
|
},
|
|
}}>
|
|
{children}
|
|
</ConfigProvider>
|
|
);
|
|
};
|
|
export const App = () => {
|
|
return (
|
|
<CustomThemeProvider>
|
|
<AntProvider>
|
|
<div className='w-full h-full'>
|
|
<Router basename={basename}>
|
|
<Routes>
|
|
<Route path='/' element={<Redirect to='/container/' />} />
|
|
<Route path='/container/*' element={<ContainerApp />} />
|
|
<Route path='/map/*' element={<MapApp />} />
|
|
<Route path='/user/*' element={<UserApp />} />
|
|
<Route path='/user1/*' element={<UserApp />} />
|
|
<Route path='/org/*' element={<OrgApp />} />
|
|
<Route path='/config/*' element={<ConfigApp />} />
|
|
<Route path='/app/*' element={<UserAppApp />} />
|
|
<Route path='/file/*' element={<FileApp />} />
|
|
|
|
<Route path='/404' element={<div>404</div>} />
|
|
<Route path='*' element={<div>404</div>} />
|
|
</Routes>
|
|
</Router>
|
|
</div>
|
|
</AntProvider>
|
|
<div id='for-modal'></div>
|
|
<ToastContainer />
|
|
</CustomThemeProvider>
|
|
);
|
|
};
|