From 3fa7cdec6ce44f07a0dc7e1910511ead606990f3 Mon Sep 17 00:00:00 2001
From: zhang <zc857179121@qq.com>
Date: 星期四, 11 九月 2025 08:19:53 +0800
Subject: [PATCH] 1
---
zy-acs-flow/src/page/login/Login.jsx | 168 +++++++++++++++++++++++++++++++++++++++++++++++++++++--
1 files changed, 161 insertions(+), 7 deletions(-)
diff --git a/zy-acs-flow/src/page/login/Login.jsx b/zy-acs-flow/src/page/login/Login.jsx
index 29e615c..689d819 100644
--- a/zy-acs-flow/src/page/login/Login.jsx
+++ b/zy-acs-flow/src/page/login/Login.jsx
@@ -1,10 +1,164 @@
+import * as React from 'react';
+import { useState } from 'react';
+import { useLocation } from 'react-router-dom';
+import {
+ Avatar,
+ Box,
+ Button,
+ Card,
+ CardActions,
+ CircularProgress,
+} from '@mui/material';
+import LockIcon from '@mui/icons-material/Lock';
+import {
+ Form,
+ required,
+ TextInput,
+ useTranslate,
+ useLogin,
+ useNotify,
+} from 'react-admin';
+import { LOGIN_BACKGROUND } from '@/config/setting';
const Login = () => {
- return (
- <>
- <h1>Login</h1>
- </>
- )
-}
+ const [loading, setLoading] = useState(false);
+ const translate = useTranslate();
-export default Login;
\ No newline at end of file
+ const notify = useNotify();
+ const login = useLogin();
+ const location = useLocation();
+
+ const handleSubmit = (auth) => {
+ setLoading(true);
+ // js native confirm && root
+ login(
+ auth,
+ location.state ? (location.state).nextPathname : '/'
+ ).catch((error) => {
+ setLoading(false);
+ notify(
+ typeof error === 'string'
+ ? error
+ : typeof error === 'undefined' || !error.message
+ ? 'ra.auth.sign_in_error'
+ : error.message,
+ {
+ type: 'error',
+ messageArgs: {
+ _:
+ typeof error === 'string'
+ ? error
+ : error && error.message
+ ? error.message
+ : undefined,
+ },
+ }
+ );
+ });
+ };
+
+ return (
+ <Form onSubmit={handleSubmit} noValidate>
+ {/* https://unsplash.com/ */}
+ <Box
+ sx={{
+ display: 'flex',
+ flexDirection: 'column',
+ minHeight: '100vh',
+ alignItems: 'center',
+ justifyContent: 'flex-start',
+ // justifyContent: 'center',
+ background: `url(/login_bg2.jpg)`,
+ backgroundRepeat: 'no-repeat',
+ backgroundSize: 'cover',
+ }}
+ >
+ <video
+ autoPlay
+ loop
+ muted
+ style={{
+ position: 'fixed',
+ top: 0,
+ left: 0,
+ width: '100%',
+ height: '100%',
+ // objectFit: 'cover',
+ // objectFit: 'contain',
+ objectFit: 'fill',
+ // objectFit: 'scale-down',
+ zIndex: 0,
+ }}
+ >
+ {LOGIN_BACKGROUND === 'media' && (
+ <source src="/login_bg1.mp4" type="video/mp4" />
+ )}
+ </video>
+
+ <Card sx={{
+ minWidth: 300,
+ marginTop: '6em',
+ zIndex: 1
+ }}>
+ <Box
+ sx={{
+ margin: '1em',
+ display: 'flex',
+ justifyContent: 'center',
+ }}
+ >
+ <Avatar sx={{ bgcolor: 'secondary.main' }}>
+ <LockIcon />
+ </Avatar>
+ </Box>
+ <Box
+ sx={{
+ marginTop: '1em',
+ display: 'flex',
+ justifyContent: 'center',
+ color: theme => theme.palette.grey[500],
+ }}
+ >
+ Hint: root / 123456
+ </Box>
+ <Box sx={{ padding: '0 1em 1em 1em' }}>
+ <Box sx={{ marginTop: '1em' }}>
+ <TextInput
+ autoFocus
+ source="username"
+ label={translate('ra.auth.username')}
+ disabled={loading}
+ validate={required()}
+ />
+ </Box>
+ <Box sx={{ marginTop: '1em' }}>
+ <TextInput
+ source="password"
+ label={translate('ra.auth.password')}
+ type="password"
+ disabled={loading}
+ validate={required()}
+ />
+ </Box>
+ </Box>
+ <CardActions sx={{ padding: '0 1em 1em 1em' }}>
+ <Button
+ variant="contained"
+ type="submit"
+ color="primary"
+ disabled={loading}
+ fullWidth
+ >
+ {loading && (
+ <CircularProgress size={25} thickness={2} />
+ )}
+ {translate('ra.auth.sign_in')}
+ </Button>
+ </CardActions>
+ </Card>
+ </Box>
+ </Form>
+ );
+};
+
+export default Login;
--
Gitblit v1.9.1