This commit is contained in:
Виталий Лавшонок
2025-10-23 16:34:13 +03:00
parent 8df53a4ed5
commit e3ce191b44
23 changed files with 236 additions and 170 deletions

View File

@@ -5,6 +5,8 @@ import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
import { useNavigate } from "react-router-dom";
import { loginUser } from "../../../redux/slices/auth";
import { cn } from "../../../lib/cn";
import { setMenuActivePage } from "../../../redux/slices/store";
import { Balloon } from "../../../assets/icons/auth";
const Login = () => {
const dispatch = useAppDispatch();
@@ -18,6 +20,7 @@ const Login = () => {
// После успешного логина
useEffect(() => {
dispatch(setMenuActivePage("account"))
if (jwt) {
navigate("/home/offices"); // или другая страница после входа
}
@@ -36,63 +39,69 @@ const Login = () => {
};
return (
<div className="h-full w-full bg-default-100 flex items-center justify-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 className="h-full w-full flex items-center justify-center">
<div className="bg-layout-background grid gap-[80px] grid-cols-[400px,400px] box-border relative ">
<div className="flex items-center justify-center">
<img src={Balloon} />
</div>
<div className="text-content-1 w-full text-[12px] text-center mt-[15px]">
Для начала работы войдите в аккаунт. Заполните поля ниже и нажмите "Войти".
</div>
<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 >
<div className="text-content-1 w-full text-[28px] font-bold text-center">
Вход в аккаунт
</div>
<Input
label="Логин"
radius="sm"
className="w-[22rem]"
required
onChange={(val) => setUsername(val)}
/>
<div className={cn(
"text-[14px] text-danger font-medium transition-all overflow-hidden",
submitClicked && !password && "h-[21px]"
)}>
Поле не может быть пустым
<div className="text-content-1 w-full text-[12px] text-center mt-[15px]">
Для начала работы войдите в аккаунт. Заполните поля ниже и нажмите "Войти".
</div>
<Input
label="Пароль"
type="password"
radius="sm"
className="w-[22rem]"
required
onChange={(val) => setPassword(val)}
/>
{status === "failed" && error && (
<div className="text-[14px] text-danger font-medium">{error}</div>
)}
<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
label="Логин"
radius="sm"
className="w-[22rem]"
required
onChange={(val) => setUsername(val)}
/>
<div className={cn(
"text-[14px] text-danger font-medium transition-all overflow-hidden",
submitClicked && !password && "h-[21px]"
)}>
Поле не может быть пустым
</div>
<Input
label="Пароль"
type="password"
radius="sm"
className="w-[22rem]"
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)]">
<PrimaryButton
className="w-full mb-[8px]"
onClick={handleLogin}
text={status === "loading" ? "Вход..." : "Войти"}
disabled={status === "loading"}
/>
<PrimaryButton
className="w-full mb-[25px]"
onClick={navigateToRegister}
text="Зарегистрироваться"
/>
</div>
</div>
<div className="w-[calc(100%-50px)]">
<PrimaryButton
className="w-full mb-[8px]"
onClick={handleLogin}
text={status === "loading" ? "Вход..." : "Войти"}
disabled={status === "loading"}
/>
<PrimaryButton
className="w-full mb-[25px]"
onClick={navigateToRegister}
text="Зарегистрироваться"
/>
</div>
</div>
</div>
);