wms-master.git - Gitblit

			@@ -8,6 +8,8 @@
			Typography,
			Tabs,
			Tab,
			useTheme,
			useMediaQuery,
			} from '@mui/material';
			import {
			useTranslate,
			@@ -15,21 +17,30 @@
			useNotify,
			} from 'react-admin';
			import { LOGIN_BACKGROUND } from '@/config/setting';
			import { tenants } from '@/api/auth';
			import { getSystemInfo, tenants } from '@/api/auth';
			import Login from "./Login";
			import Register from "./Register";

			const Index = () => {
			const translate = useTranslate();
			const theme = useTheme();
			const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'));

			const [tab, setTab] = useState(0)
			const [systemInfo, setSystemInfo] = useState({});
			const [tenantList, setTenantList] = useState([]);

			const formPosition = isSmallScreen ? 'middle' : 'right'

			useEffect(() => {
			getSystemInfo().then(data => {
			setSystemInfo(data);
			})
			tenants().then(data => {
			setTenantList(data);
			})
			}, []);


			return (
			<Box
			@@ -37,16 +48,15 @@
			display: 'flex',
			flexDirection: 'column',
			minHeight: '100vh',
			alignItems: 'center',
			justifyContent: 'flex-start',
			// justifyContent: 'center',
			alignItems: formPosition === 'middle' ? 'center' : 'flex-end',
			paddingRight: formPosition === 'middle' ? 0 : '6em',
			justifyContent: formPosition === 'middle' ? 'flex-start' : 'center',
			background: `url(/login_bg.jpg)`, // https://unsplash.com/
			backgroundRepeat: 'no-repeat',
			backgroundSize: 'cover',
			}
			}
			}}
			>
			<video
			{/* <video
			autoPlay
			loop
			muted
			@@ -66,40 +76,46 @@
			{LOGIN_BACKGROUND === 'media' && (
			<source src="/login_bg.mp4" type="video/mp4" />
			)}
			</video>
			</video> */}

			<Card sx={{
			width: 400,
			marginTop: '6em',
			marginTop: formPosition === 'middle' ? '6em' : 0,
			zIndex: 1
			}}>
			<div>
			<AppBar position="static" sx={{ backgroundColor: '#3D4BA7' }}>
			<Toolbar>
			<Typography variant="h6" color="inherit">Welcome</Typography>
			<Typography variant="h6" color="inherit">{translate("page.login.title")}</Typography>
			</Toolbar>
			</AppBar>
			</div>

			<Tabs
			value={tab}
			onChange={(event, value) => {
			setTab(value);
			}}
			indicatorColor="primary"
			textColor="primary"
			variant="fullWidth"
			>
			<Tab label="Login" sx={{ fontSize: '.8em' }} />
			<Tab label="Register" sx={{ fontSize: '.8em' }} />
			</Tabs>
			{systemInfo.mode === 'ONLINE' ? (
			<>
			<Tabs
			value={tab}
			onChange={(event, value) => {
			setTab(value);
			}}
			indicatorColor="primary"
			textColor="primary"
			variant="fullWidth"
			>
			<Tab label={translate('page.login.tab.login')} sx={{ fontSize: '.8em' }} />
			<Tab label={translate('page.login.tab.register')} sx={{ fontSize: '.8em' }} />
			</Tabs>

			{tab === 0 && <Login tenantList={tenantList} />}
			{tab === 1 && <Register tenantList={tenantList} />}
			{tab === 0 && <Login systemInfo={systemInfo} tenantList={tenantList} />}
			{tab === 1 && <Register systemInfo={systemInfo} tenantList={tenantList} />}
			</>
			) : (
			<Login systemInfo={systemInfo} tenantList={tenantList} />
			)}

			<Box mt={1} mb={1} sx={{ textAlign: 'center' }}>
			<Typography variant="caption" align="center">rsf - sever</Typography>
			</Box>
			{/* <Box mb={1} sx={{ textAlign: 'center' }}>
			<Typography variant="caption" align="center">{translate("page.login.footer")}</Typography>
			</Box> */}
			</Card>
			</Box >
			);