104 lines
2.3 KiB
TypeScript
104 lines
2.3 KiB
TypeScript
import './style/global.less';
|
|
import React, {useEffect} from 'react';
|
|
import ReactDOM from 'react-dom';
|
|
import {ConfigProvider} from '@arco-design/web-react';
|
|
import zhCN from '@arco-design/web-react/es/locale/zh-CN';
|
|
import enUS from '@arco-design/web-react/es/locale/en-US';
|
|
import {BrowserRouter, Switch, Route} from 'react-router-dom';
|
|
|
|
import PageLayout from './layout';
|
|
import {GlobalContext} from './context';
|
|
import Login from './pages/login';
|
|
import checkLogin from './utils/checkLogin';
|
|
import changeTheme from './utils/changeTheme';
|
|
import useStorage from './utils/useStorage';
|
|
import {QueryClientProvider, QueryClient} from 'react-query';
|
|
import {useStore} from '@/store';
|
|
|
|
const queryClient = new QueryClient({
|
|
defaultOptions: {
|
|
queries: {
|
|
retry: 0,
|
|
refetchOnWindowFocus: false,
|
|
keepPreviousData: true
|
|
},
|
|
}
|
|
});
|
|
|
|
function Index() {
|
|
const [lang, setLang] = useStorage('arco-lang', 'zh-CN');
|
|
const [theme, setTheme] = useStorage('arco-theme', 'light');
|
|
const {fetchUserInfo, init} = useStore();
|
|
|
|
function getArcoLocale() {
|
|
switch (lang) {
|
|
case 'zh-CN':
|
|
return zhCN;
|
|
case 'en-US':
|
|
return enUS;
|
|
default:
|
|
return zhCN;
|
|
}
|
|
}
|
|
|
|
useEffect(() => {
|
|
init();
|
|
if (checkLogin()) {
|
|
fetchUserInfo();
|
|
} else if (window.location.pathname.replace(/\//g, '') !== 'login') {
|
|
window.location.pathname = '/login';
|
|
}
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
changeTheme(theme);
|
|
}, [theme]);
|
|
|
|
const contextValue = {
|
|
lang,
|
|
setLang,
|
|
theme,
|
|
setTheme
|
|
};
|
|
|
|
return (
|
|
<BrowserRouter>
|
|
<ConfigProvider
|
|
locale={getArcoLocale()}
|
|
componentConfig={{
|
|
Card: {
|
|
bordered: false
|
|
},
|
|
List: {
|
|
bordered: false
|
|
},
|
|
Table: {
|
|
border: {wrapper: true}
|
|
},
|
|
Form: {
|
|
labelCol: {span: 5},
|
|
wrapperCol: {span: 18},
|
|
},
|
|
Modal: {
|
|
style: {width: '550px'},
|
|
autoFocus: false,
|
|
focusLock: false,
|
|
escToExit: false
|
|
}
|
|
}}
|
|
>
|
|
<GlobalContext.Provider value={contextValue}>
|
|
<Switch>
|
|
<Route path="/login" component={Login}/>
|
|
<QueryClientProvider client={queryClient}>
|
|
<Route path="/" component={PageLayout}/>
|
|
</QueryClientProvider>
|
|
</Switch>
|
|
</GlobalContext.Provider>
|
|
</ConfigProvider>
|
|
</BrowserRouter>
|
|
);
|
|
}
|
|
|
|
ReactDOM.render(<Index/>, document.getElementById('root'));
|