2023-12-26 02:42:49 +03:00
|
|
|
import { useState } from "react";
|
|
|
|
|
2023-12-28 07:09:15 +03:00
|
|
|
import { apiRequest } from "@api/request";
|
|
|
|
|
|
|
|
export const useFormValidation = (
|
|
|
|
apiEndpoint,
|
|
|
|
fields,
|
|
|
|
showNotificationError,
|
|
|
|
showNotificationTrue
|
|
|
|
) => {
|
2023-12-26 02:42:49 +03:00
|
|
|
// Состояние формы, содержащее значения полей
|
2023-12-28 07:09:15 +03:00
|
|
|
const [formData, setFormData] = useState(fields);
|
2023-12-26 02:42:49 +03:00
|
|
|
|
|
|
|
// Состояние ошибок валидации
|
|
|
|
const [validationErrors, setValidationErrors] = useState({});
|
|
|
|
|
|
|
|
// Функция для обработки изменений в полях ввода
|
|
|
|
const handleChange = (e) => {
|
|
|
|
const { id, value } = e.target;
|
|
|
|
setFormData((prevData) => ({ ...prevData, [id]: value }));
|
|
|
|
};
|
|
|
|
|
|
|
|
// Функция для валидации формы
|
|
|
|
const validateForm = () => {
|
|
|
|
const errors = {};
|
2023-12-29 12:23:54 +03:00
|
|
|
if (formData.username != undefined) {
|
|
|
|
if (formData.username.trim() === "") {
|
|
|
|
errors.username = "Имя обязательно к заполнению";
|
2023-12-28 07:09:15 +03:00
|
|
|
}
|
2023-12-26 02:42:49 +03:00
|
|
|
}
|
|
|
|
|
2023-12-28 07:09:15 +03:00
|
|
|
if (formData.email != undefined) {
|
|
|
|
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
|
|
if (formData.email.trim() === "") {
|
|
|
|
errors.email = "E-mail обязателен к заполнению";
|
|
|
|
} else if (!emailRegex.test(formData.email)) {
|
|
|
|
errors.email = "Неверный адрес электронной почты";
|
|
|
|
}
|
2023-12-26 02:42:49 +03:00
|
|
|
}
|
|
|
|
|
2023-12-28 07:09:15 +03:00
|
|
|
if (formData.tg != undefined) {
|
|
|
|
if (formData.tg.trim() === "") {
|
|
|
|
errors.tg = "Telegram обязателен к заполнению";
|
|
|
|
}
|
2023-12-26 02:42:49 +03:00
|
|
|
}
|
|
|
|
|
2023-12-28 07:09:15 +03:00
|
|
|
if (formData.password != undefined) {
|
|
|
|
if (formData.password.trim() === "") {
|
|
|
|
errors.password = "Пароль обязателен к заполнению";
|
|
|
|
} else if (formData.password.length < 8) {
|
|
|
|
errors.password = "Пароль должен содержать более 8 символов";
|
|
|
|
}
|
2023-12-26 02:42:49 +03:00
|
|
|
}
|
|
|
|
|
2023-12-28 07:09:15 +03:00
|
|
|
if (formData.secondPassword != undefined) {
|
|
|
|
if (formData.secondPassword.trim() === "") {
|
|
|
|
errors.secondPassword = "Повторите пароль";
|
|
|
|
} else if (formData.secondPassword !== formData.password) {
|
|
|
|
errors.secondPassword = "Пароли должны совпадать";
|
|
|
|
}
|
2023-12-26 02:42:49 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
setValidationErrors(errors);
|
|
|
|
|
|
|
|
// Возвращаем true, если ошибок нет, иначе - false
|
|
|
|
return Object.keys(errors).length === 0;
|
|
|
|
};
|
|
|
|
|
2023-12-29 12:23:54 +03:00
|
|
|
// Функция отчистки формы
|
|
|
|
const handleClearForm = () => {
|
|
|
|
const clearedFormData = Object.fromEntries(
|
|
|
|
Object.keys(formData).map((key) => [key, ""])
|
|
|
|
);
|
|
|
|
setFormData(clearedFormData);
|
|
|
|
|
|
|
|
const clearedValidationErrors = Object.fromEntries(
|
|
|
|
Object.keys(validationErrors).map((key) => [key, ""])
|
|
|
|
);
|
|
|
|
setValidationErrors(clearedValidationErrors);
|
|
|
|
};
|
|
|
|
|
2023-12-26 02:42:49 +03:00
|
|
|
// Функция для обработки отправки формы
|
2023-12-28 07:09:15 +03:00
|
|
|
const handleSubmit = async (e) => {
|
2023-12-26 02:42:49 +03:00
|
|
|
e.preventDefault();
|
2023-12-28 07:09:15 +03:00
|
|
|
// Проверка валидации формы
|
2023-12-26 02:42:49 +03:00
|
|
|
if (validateForm()) {
|
2023-12-29 12:23:54 +03:00
|
|
|
let newformData = { ...formData };
|
|
|
|
delete newformData.secondPassword;
|
|
|
|
|
2023-12-28 07:09:15 +03:00
|
|
|
try {
|
2023-12-29 12:23:54 +03:00
|
|
|
apiRequest(apiEndpoint, {
|
2023-12-28 07:09:15 +03:00
|
|
|
method: "POST",
|
2023-12-29 12:23:54 +03:00
|
|
|
data: newformData
|
|
|
|
}).then((data) => {
|
|
|
|
if ("errors" in data) {
|
|
|
|
showNotificationError();
|
|
|
|
} else {
|
|
|
|
handleClearForm();
|
|
|
|
showNotificationTrue();
|
|
|
|
}
|
2023-12-28 07:09:15 +03:00
|
|
|
});
|
|
|
|
} catch (error) {
|
|
|
|
console.error("Error submitting form:", error);
|
|
|
|
}
|
2023-12-26 02:42:49 +03:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
return {
|
|
|
|
formData,
|
|
|
|
validationErrors,
|
|
|
|
handleChange,
|
2023-12-29 12:23:54 +03:00
|
|
|
handleSubmit,
|
|
|
|
handleClearForm
|
2023-12-26 02:42:49 +03:00
|
|
|
};
|
|
|
|
};
|