76 lines
2.2 KiB
JavaScript
Executable File
76 lines
2.2 KiB
JavaScript
Executable File
import React, { useState } from "react";
|
|
import Modal from "./Modal";
|
|
import "../../Style/LoginModal.css";
|
|
import Logo from '../../assets/images/logo.svg?react';
|
|
import TextField from '@mui/material/TextField';
|
|
|
|
const LoginModal = ({ onLogin, onClose }) => {
|
|
const [username, setUsername] = useState("");
|
|
const [password, setPassword] = useState("");
|
|
const [error, setError] = useState("");
|
|
const [showPassword, setShowPassword] = React.useState(false);
|
|
|
|
const handleClickShowPassword = () => setShowPassword((show) => !show);
|
|
|
|
const handleSubmit = async (e) => {
|
|
e.preventDefault();
|
|
|
|
try {
|
|
// Отправляем данные на бэкенд
|
|
const response = await fetch('http://192.168.2.39:3000/auth/login', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({ login: username, password }),
|
|
});
|
|
|
|
const data = await response.json();
|
|
|
|
if (data.success) {
|
|
onLogin(); // Успешная авторизация
|
|
onClose(); // Закрыть модальное окно
|
|
} else {
|
|
setError(data.message || "Неверный логин или пароль");
|
|
}
|
|
} catch (err) {
|
|
console.error('Ошибка при отправке запроса:', err);
|
|
setError("Ошибка при подключении к серверу");
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Modal onClose={onClose}>
|
|
<h2>Авторизация</h2>
|
|
<form onSubmit={handleSubmit}>
|
|
<TextField
|
|
fullWidth
|
|
id="user-login"
|
|
label="Логин"
|
|
variant="filled"
|
|
margin="normal"
|
|
required
|
|
onChange={(e) => setUsername(e.target.value)}
|
|
size="normal"
|
|
/>
|
|
|
|
<TextField
|
|
fullWidth
|
|
id="user-password"
|
|
label="Пароль"
|
|
variant="filled"
|
|
margin="normal"
|
|
required
|
|
type={showPassword ? 'text' : 'password'}
|
|
onChange={(e) => setPassword(e.target.value)}
|
|
size="normal"
|
|
/>
|
|
|
|
{error && <p className="error">{error}</p>}
|
|
<button type="submit">Войти</button>
|
|
</form>
|
|
</Modal>
|
|
);
|
|
};
|
|
|
|
export default LoginModal; |