diff options
Diffstat (limited to 'app/login/page.tsx')
| -rw-r--r-- | app/login/page.tsx | 174 |
1 files changed, 174 insertions, 0 deletions
diff --git a/app/login/page.tsx b/app/login/page.tsx new file mode 100644 index 0000000..8df5b2c --- /dev/null +++ b/app/login/page.tsx @@ -0,0 +1,174 @@ +"use client"; +import { + Box, + Button, + FormControl, + FormLabel, + TextField, + Typography, +} from "@mui/material"; +import Header from "../lib/camera/component/hedear"; +import odooApi from "../lib/api/odooApi"; +import { getAuth, setAuth } from "../lib/api/auth"; +import { useRouter } from "next/navigation"; +import { useEffect, useState } from "react"; + +const Login = () => { + const router = useRouter(); + const [emailError, setEmailError] = useState(false); + const [emailErrorMessage, setEmailErrorMessage] = useState(""); + const [passwordError, setPasswordError] = useState(false); + const [passwordErrorMessage, setPasswordErrorMessage] = useState(""); + + useEffect(() => { + const token = getAuth(); + + if (token) { + router.push("/"); + } + }, [router]); + + const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => { + event.preventDefault(); + if (emailError || passwordError) { + return; + } + const data = new FormData(event.currentTarget); + const email = data.get("email"); + const password = data.get("password"); + + console.log('ini user', email, password) + try { + odooApi("POST", "/api/v1/user/login", { + email , + password + }).then((res) => { + const auth = res.result; + if (auth.is_auth) { + setAuth(auth.user); + router.push("/"); + return; + } + switch (auth.reason) { + case "NOT_FOUND": + alert("Email tidak ditemukan"); + break; + case "NOT_ACTIVE": + alert("Akun anda belum aktif"); + break; + } + console.log('ini akhir',res); + }); + } catch (error) { + console.log(error); + } + }; + + const validateInputs = () => { + const email = document.getElementById("email") as HTMLInputElement; + const password = document.getElementById("password") as HTMLInputElement; + + let isValid = true; + + if (!email.value || !/\S+@\S+\.\S+/.test(email.value)) { + setEmailError(true); + setEmailErrorMessage("Please enter a valid email address."); + isValid = false; + } else { + setEmailError(false); + setEmailErrorMessage(""); + } + + if (!password.value || password.value.length < 6) { + setPasswordError(true); + setPasswordErrorMessage("Password must be at least 6 characters long."); + isValid = false; + } else { + setPasswordError(false); + setPasswordErrorMessage(""); + } + + return isValid; + }; + return ( + <div className="bg-[#fafeff] h-screen overflow-auto"> + <Header /> + <div className="py-4 px-4 sm:px-96 pt-20"> + <div className="bg-white py-6 px-4 sm:px-96 shadow-md rounded-sm"> + <Typography + component="h1" + variant="h4" + sx={{ + width: "100%", + fontSize: "clamp(2rem, 10vw, 2.15rem)", + mb: 4, + }} + > + Sign in + </Typography> + <Box + component="form" + onSubmit={handleSubmit} + noValidate + sx={{ + display: "flex", + flexDirection: "column", + width: "100%", + gap: 2, + }} + > + <FormControl> + <FormLabel htmlFor="email">Email</FormLabel> + <TextField + error={emailError} + helperText={emailErrorMessage} + id="email" + type="email" + name="email" + placeholder="your@email.com" + autoComplete="email" + autoFocus + required + fullWidth + variant="outlined" + color={emailError ? "error" : "primary"} + sx={{ ariaLabel: "email" }} + size="small" + /> + </FormControl> + <FormControl> + <Box sx={{ display: "flex", justifyContent: "space-between" }}> + <FormLabel htmlFor="password">Password</FormLabel> + </Box> + <TextField + error={passwordError} + helperText={passwordErrorMessage} + name="password" + placeholder="••••••" + type="password" + id="password" + autoComplete="current-password" + autoFocus + required + fullWidth + variant="outlined" + color={passwordError ? "error" : "primary"} + size="small" + /> + </FormControl> + <Button + type="submit" + fullWidth + variant="contained" + onClick={validateInputs} + > + Sign in + </Button> + </Box> + </div> + </div> + </div> + ); +}; + +export default Login; |
