This commit is contained in:
Андрей Дувакин 2024-10-07 18:54:03 +05:00
parent 3979f02c7e
commit 8cacef14de
3 changed files with 52 additions and 28 deletions

View File

@ -9,6 +9,11 @@
border-radius: 0.5rem !important;
}
.navbar-nav .nav-item {
display: flex;
align-items: center;
}
.nav-link.active {
color: #ffffff !important;
background-color: #007bff !important;

View File

@ -39,10 +39,10 @@ const Header = () => {
<ul className="navbar-nav mx-auto">
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/"
activeClassName="active"
>
Заказы
</NavLink>
@ -51,70 +51,70 @@ const Header = () => {
<>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/accessories"
activeClassName="active"
>
Компоненты
</NavLink>
</li>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/users"
activeClassName="active"
>
Пользователи
</NavLink>
</li>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/cities"
activeClassName="active"
>
Города
</NavLink>
</li>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/trucks"
activeClassName="active"
>
Грузовики
</NavLink>
</li>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/statuses"
activeClassName="active"
>
Статусы
</NavLink>
</li>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/federal_districts"
activeClassName="active"
>
Федеральные округа
</NavLink>
</li>
<li className="nav-item">
<NavLink
exact={"false"}
className="nav-link"
className={({ isActive }) =>
isActive ? "nav-link active" : "nav-link"
}
to="/roles"
activeClassName="active"
>
Роли
</NavLink>

View File

@ -7,11 +7,13 @@ const Login = () => {
const [login, setLogin] = useState("");
const [password, setPassword] = useState("");
const [error, setError] = useState("");
const [loading, setLoading] = useState(false);
const navigate = useNavigate();
const { login: loginContext } = useAuth();
const handleSubmit = async (e) => {
e.preventDefault();
setLoading(true);
try {
const userData = await loginUser({ login, password });
@ -19,6 +21,8 @@ const Login = () => {
navigate("/");
} catch (error) {
setError(error.detail ? error.detail : "Ошибка авторизации");
} finally {
setLoading(false);
}
};
@ -27,7 +31,7 @@ const Login = () => {
<h2 className="text-center">Вход</h2>
{error && <p className="text-danger text-center">{error}</p>}
<form onSubmit={handleSubmit} className="border p-4 rounded shadow">
<div className="form-group">
<div className="form-group mb-3">
<label htmlFor="login">Логин</label>
<input
type="text"
@ -38,7 +42,7 @@ const Login = () => {
required
/>
</div>
<div className="form-group">
<div className="form-group mb-3">
<label htmlFor="password">Пароль</label>
<input
type="password"
@ -49,8 +53,23 @@ const Login = () => {
required
/>
</div>
<button type="submit" className="btn btn-primary btn-block">
Войти
<button
type="submit"
className="btn btn-primary btn-block"
disabled={loading}
>
{loading ? (
<>
<span
className="spinner-border spinner-border-sm"
role="status"
aria-hidden="true"
></span>
Загрузка...
</>
) : (
"Войти"
)}
</button>
</form>
</div>