65 lines
2.4 KiB
TypeScript
65 lines
2.4 KiB
TypeScript
import toast, { Toaster } from 'react-hot-toast';
|
||
import React from 'react';
|
||
import '../css/Register.css';
|
||
|
||
function Register() {
|
||
async function sendData(event) {
|
||
event.preventDefault();
|
||
const username = event.target![0].value;
|
||
const password = event.target![1].value;
|
||
const passwordConfirm = event.target![2].value;
|
||
if (!username) {
|
||
toast("Необходимо указать имя пользователя!", {icon: '⚠️'});
|
||
return;
|
||
}
|
||
if (!password) {
|
||
toast("Необходимо придумать пароль!", {icon: '⚠️'});
|
||
return;
|
||
}
|
||
if (password != passwordConfirm) {
|
||
toast("Пароли не совпадают!", { icon: '⚠️' });
|
||
return;
|
||
}
|
||
const response = await fetch('/api/v1/user/register', {
|
||
method: 'POST',
|
||
body: JSON.stringify({
|
||
username,
|
||
password
|
||
}),
|
||
headers: {
|
||
"Content-Type": "application/json"
|
||
}
|
||
});
|
||
switch (response.status) {
|
||
case 409:
|
||
toast("Такой пользователь уже существует!", {icon: '❌️'});
|
||
break;
|
||
case 200:
|
||
document.location.href = "/";
|
||
break;
|
||
}
|
||
}
|
||
|
||
function goToRegisterPage() {
|
||
window.location.href = "/login"
|
||
}
|
||
|
||
return (
|
||
<div className='container'>
|
||
<h1>
|
||
Регистрация
|
||
</h1>
|
||
<iframe style={{ display: "none" }}></iframe>
|
||
<form onSubmit={sendData}>
|
||
<input className="beautiful_input" id='login' name='login' type='text' placeholder='Имя пользователя'></input>
|
||
<input className="beautiful_input" id='password' name='password' type='password' placeholder='Пароль'></input>
|
||
<input className="beautiful_input" id='passwordConfirm' name='passwordConfirm' type='password' placeholder='Повтор пароля'></input>
|
||
<button type="submit" >Зарегистрироваться</button>
|
||
</form>
|
||
<button style={{marginTop: "25px"}} onClick={goToRegisterPage}>Уже есть аккаунт</button>
|
||
<Toaster />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export default Register; |