update jamespong14205,

2025-02-01 02:02:25 +08:00
parent 8bf2589af5
commit c3a16177eb
90 changed files with 9071 additions and 6 deletions
--- a/task1/project/003_src/client/pages/AdminLogin/index.js
+++ b/task1/project/003_src/client/pages/AdminLogin/index.js
@@ -0,0 +1,168 @@
+import { Box, Button, TextField } from '@mui/material';
+import Head from 'next/head';
+
+import { ChevronLeftOutlined } from '@mui/icons-material';
+import LoginIcon from '@mui/icons-material/Login';
+import { useFormik } from 'formik';
+import { useRouter } from 'next/dist/client/router';
+import React from 'react';
+import is_development_plant from 'utils/is_development_plant';
+import * as yup from 'yup';
+
+let default_init_values = {
+  username: '',
+  passwod: '',
+};
+
+if (is_development_plant) {
+  console.log('development plant');
+
+  default_init_values = {
+    username: 'admi',
+    password: 'nimda',
+  };
+}
+
+const validationSchema = yup.object({
+  username: yup
+    .string('Enter your username')
+    .min(5, 'Username should be of minimum 5 characters length')
+    .required('Username is required'),
+  password: yup
+    .string('Enter your password')
+    .min(5, 'Password should be of minimum 5 characters length')
+    .required('Password is required'),
+});
+
+export default function Home() {
+  const router = useRouter();
+  const [changing_page, setChangingPage] = React.useState(false);
+
+  const formik = useFormik({
+    initialValues: default_init_values,
+    validationSchema,
+    onSubmit: values => {
+      fetch('/api/auth/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(values),
+      })
+        .then(res => res.json())
+        .then(data => {
+          if (data.success) {
+            router.push('/AdminHome');
+          } else {
+            alert(data.message);
+            formik.resetForm();
+          }
+        })
+        .catch(err => {
+          console.error(err);
+          alert('server error');
+        });
+    },
+  });
+
+  return (
+    <>
+      <Head>
+        <title>admin login page</title>
+        <meta name='description' content='Generated by create next app' />
+        <link rel='icon' href='/favicon.ico' />
+      </Head>
+
+      <Box
+        sx={{
+          height: '90vh',
+          //
+          display: 'flex',
+          flexDirection: 'column',
+          justifyContent: 'center',
+          alignItems: 'center',
+          gap: '1rem',
+        }}
+      >
+        <Box
+          sx={{
+            display: 'flex',
+            flexDirection: 'column',
+            justifyContent: 'center',
+            alignItems: 'center',
+            //
+            width: '100%',
+            padding: '0 2rem',
+          }}
+        >
+          <form onSubmit={formik.handleSubmit}>
+            <Box
+              sx={{
+                textAlign: 'center',
+                fontWeight: 'bold',
+                fontSize: '1.2rem',
+                marginTop: '2rem',
+                marginBottom: '2rem',
+              }}
+            >
+              Admin Login Page
+            </Box>
+            <TextField
+              fullWidth
+              variant='standard'
+              id='username'
+              name='username'
+              value={formik.values.username}
+              onChange={formik.handleChange}
+              onBlur={formik.handleBlur}
+              error={formik.touched.username && Boolean(formik.errors.username)}
+              helperText={formik.touched.username && formik.errors.username}
+              label='Username'
+              inputProps={{ sx: { textAlign: 'center' } }}
+            />
+            <TextField
+              fullWidth
+              variant='standard'
+              id='password'
+              name='password'
+              value={formik.values.password}
+              onChange={formik.handleChange}
+              onBlur={formik.handleBlur}
+              error={formik.touched.password && Boolean(formik.errors.password)}
+              helperText={formik.touched.password && formik.errors.password}
+              type='password'
+              label='Password'
+              inputProps={{ sx: { textAlign: 'center' } }}
+            />
+
+            <Box
+              style={{
+                paddingTop: '3rem',
+                display: 'flex',
+                justifyContent: 'space-around',
+              }}
+            >
+              <Button
+                disabled={changing_page || formik.isSubmitting}
+                variant='outlined'
+                startIcon={<ChevronLeftOutlined />}
+                onClick={() => {
+                  setChangingPage(true);
+                  router.push('/');
+                }}
+              >
+                Back
+              </Button>
+              <Button
+                variant='contained'
+                type='submit'
+                startIcon={<LoginIcon />}
+                disabled={!(formik.isValid && formik.dirty && !formik.isSubmitting) || changing_page}
+              >
+                Login
+              </Button>
+            </Box>
+          </form>
+        </Box>
+      </Box>
+    </>
+  );
+}