login
This commit is contained in:
Виталий Лавшонок
@@ -1,108 +1,98 @@
|
||||
// import React from "react";
|
||||
// import { Button } from "../../components/button/Button";
|
||||
// import { Input } from "../../components/input/Input";
|
||||
// import { useDispatch, useSelector } from "react-redux";
|
||||
// import { useNavigate } from "react-router-dom";
|
||||
// import { loginUser } from "../../redux/slices/user";
|
||||
// import { setUsername, setPassword } from "../../redux/slices/user";
|
||||
// import { cn } from "../../lib/cn";
|
||||
import { useState, useEffect } from "react";
|
||||
import { PrimaryButton } from "../../../components/button/PrimaryButton";
|
||||
import { Input } from "../../../components/input/Input";
|
||||
import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { loginUser } from "../../../redux/slices/auth";
|
||||
import { cn } from "../../../lib/cn";
|
||||
|
||||
const Login = () => {
|
||||
// const dispatch = useDispatch();
|
||||
// const navigate = useNavigate();
|
||||
const dispatch = useAppDispatch();
|
||||
const navigate = useNavigate();
|
||||
|
||||
// const [inputUsername, setInputUsername] = React.useState<string>("");
|
||||
// const [inputPassword, setInputPassword] = React.useState<string>("");
|
||||
// const [inputClickLogin, setInputClickLogin] = React.useState<boolean>(false);
|
||||
const [username, setUsername] = useState<string>("");
|
||||
const [password, setPassword] = useState<string>("");
|
||||
const [submitClicked, setSubmitClicked] = useState<boolean>(false);
|
||||
|
||||
// const changeUsername = (s: string) => {
|
||||
// dispatch(setUsername(s));
|
||||
// setInputUsername(s);
|
||||
// };
|
||||
// const changePassword = (s: string) => {
|
||||
// dispatch(setPassword(s));
|
||||
// setInputPassword(s);
|
||||
// };
|
||||
const { status, error, jwt } = useAppSelector((state) => state.auth);
|
||||
|
||||
// const isAuthorised = useSelector((state: any) => state.user.isAuthorized);
|
||||
// После успешного логина
|
||||
useEffect(() => {
|
||||
if (jwt) {
|
||||
navigate("/home/offices"); // или другая страница после входа
|
||||
}
|
||||
}, [jwt]);
|
||||
|
||||
// React.useEffect(() => {
|
||||
// if (isAuthorised) navigate("/home/offices");
|
||||
// }, [isAuthorised]);
|
||||
const handleLogin = () => {
|
||||
setSubmitClicked(true);
|
||||
|
||||
// const clickLogin = () => {
|
||||
// setInputClickLogin(true);
|
||||
// if (inputUsername == "" || inputPassword == "") return;
|
||||
// setInputClickLogin(false);
|
||||
// dispatch(loginUser());
|
||||
if (!username || !password) return;
|
||||
|
||||
dispatch(loginUser({ username, password }));
|
||||
};
|
||||
|
||||
const navigateToRegister = () => {
|
||||
navigate("/auth/register");
|
||||
};
|
||||
|
||||
// if (isAuthorised) navigate("/home/offices");
|
||||
// };
|
||||
// const clickNavigateRegister = () => {
|
||||
// navigate("/auth/register");
|
||||
// };
|
||||
return (
|
||||
<div className="h-full w-full bg-default-100 flex items-center justify-center">
|
||||
<div className=" bg-layout-background w-[25rem] h-[34.375rem] rounded-[15px] box-border p-[25px] relative">
|
||||
<div className="text-content-1 w-full h-[3.125rem] text-[28px] font-bold text-center">
|
||||
<div className="bg-layout-background w-[25rem] rounded-[15px] box-border p-[25px] relative">
|
||||
<div className="text-content-1 w-full text-[28px] font-bold text-center">
|
||||
Вход в аккаунт
|
||||
</div>
|
||||
<div className="text-content-1 w-full h-[3.4375rem] text-[12px] text-center mt-[15px]">
|
||||
Для начала работы вам необходимо войти в аккаунт. Заполните поля ниже
|
||||
и нажмите кнопку войти
|
||||
<div className="text-content-1 w-full text-[12px] text-center mt-[15px]">
|
||||
Для начала работы войдите в аккаунт. Заполните поля ниже и нажмите "Войти".
|
||||
</div>
|
||||
|
||||
{/* <div className="mt-[15px]">
|
||||
<div
|
||||
className={cn(
|
||||
"text-[14px] text-danger font-medium h-0 transition-all mt-[20px] overflow-hidden",
|
||||
inputClickLogin && inputUsername == "" && "h-[21px]"
|
||||
)}
|
||||
>
|
||||
<div className="mt-[15px] flex flex-col gap-4">
|
||||
<div className={cn(
|
||||
"text-[14px] text-danger font-medium transition-all overflow-hidden",
|
||||
submitClicked && !username && "h-[21px]"
|
||||
)}>
|
||||
Поле не может быть пустым
|
||||
</div>
|
||||
<Input
|
||||
color="danger"
|
||||
required
|
||||
label="Логин"
|
||||
radius="sm"
|
||||
className="w-[22rem]"
|
||||
onChange={changeUsername}
|
||||
required
|
||||
onChange={(val) => setUsername(val)}
|
||||
/>
|
||||
<div
|
||||
className={cn(
|
||||
"text-[14px] text-danger font-medium h-0 transition-all mt-[15px] overflow-hidden",
|
||||
inputClickLogin && inputPassword == "" && "h-[21px]"
|
||||
)}
|
||||
>
|
||||
|
||||
<div className={cn(
|
||||
"text-[14px] text-danger font-medium transition-all overflow-hidden",
|
||||
submitClicked && !password && "h-[21px]"
|
||||
)}>
|
||||
Поле не может быть пустым
|
||||
</div>
|
||||
<Input
|
||||
required
|
||||
label="Пароль"
|
||||
type="password"
|
||||
radius="sm"
|
||||
className="w-[22rem]"
|
||||
onChange={changePassword}
|
||||
required
|
||||
onChange={(val) => setPassword(val)}
|
||||
/>
|
||||
|
||||
{status === "failed" && error && (
|
||||
<div className="text-[14px] text-danger font-medium">{error}</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="w-[calc(100%-50px)] absolute bottom-0">
|
||||
<Button
|
||||
<div className="w-[calc(100%-50px)]">
|
||||
<PrimaryButton
|
||||
className="w-full mb-[8px]"
|
||||
size="lg"
|
||||
onClick={clickLogin}
|
||||
text="Войти"
|
||||
onClick={handleLogin}
|
||||
text={status === "loading" ? "Вход..." : "Войти"}
|
||||
disabled={status === "loading"}
|
||||
/>
|
||||
<Button
|
||||
variant="bordered"
|
||||
color="default"
|
||||
className="w-full mb-[25px]"
|
||||
size="lg"
|
||||
onClick={clickNavigateRegister}
|
||||
<PrimaryButton
|
||||
className="w-full mb-[25px]"
|
||||
onClick={navigateToRegister}
|
||||
text="Зарегистрироваться"
|
||||
/>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user