106 lines
3.6 KiB
TypeScript
106 lines
3.6 KiB
TypeScript
"use client";
|
|
|
|
import { Fieldset, Stack, Textarea, TextInput } from "@mantine/core";
|
|
import { useForm } from "@mantine/form";
|
|
import { ContextModalProps } from "@mantine/modals";
|
|
import isValidInn from "@/app/clients/utils/isValidInn";
|
|
import {
|
|
ClientSchema,
|
|
CreateClientSchema,
|
|
UpdateClientSchema,
|
|
} from "@/lib/client";
|
|
import BaseFormModal, {
|
|
CreateEditFormProps,
|
|
} from "@/modals/base/BaseFormModal/BaseFormModal";
|
|
|
|
type Props = CreateEditFormProps<
|
|
ClientSchema,
|
|
CreateClientSchema,
|
|
UpdateClientSchema
|
|
>;
|
|
|
|
const ClientEditorModal = ({
|
|
context,
|
|
id,
|
|
innerProps,
|
|
}: ContextModalProps<Props>) => {
|
|
const initialValues = innerProps.isEditing
|
|
? innerProps.entity
|
|
: ({
|
|
name: "",
|
|
companyName: "",
|
|
details: {
|
|
telegram: "",
|
|
phoneNumber: "",
|
|
email: "",
|
|
inn: "",
|
|
},
|
|
comment: "",
|
|
} as CreateClientSchema);
|
|
|
|
const form = useForm({
|
|
initialValues,
|
|
validate: {
|
|
name: name =>
|
|
(!name || name.trim() === "") &&
|
|
"Необходимо ввести название клиента",
|
|
details: {
|
|
inn: inn => inn.length > 0 && !isValidInn(inn) && "Некорректный ИНН",
|
|
},
|
|
},
|
|
});
|
|
|
|
return (
|
|
<BaseFormModal
|
|
{...innerProps}
|
|
closeOnSubmit
|
|
form={form}
|
|
onClose={() => context.closeContextModal(id)}>
|
|
<Fieldset legend={"Основная информация"}>
|
|
<TextInput
|
|
required
|
|
label={"Название клиента"}
|
|
placeholder={"Введите название клиента"}
|
|
{...form.getInputProps("name")}
|
|
/>
|
|
</Fieldset>
|
|
<Fieldset legend={"Дополнительная информация"}>
|
|
<Stack gap={"xs"}>
|
|
<TextInput
|
|
label={"Телеграм"}
|
|
placeholder={"Введите телеграм"}
|
|
{...form.getInputProps("details.telegram")}
|
|
/>
|
|
<TextInput
|
|
label={"Номер телефона"}
|
|
placeholder={"Введите номер телефона"}
|
|
{...form.getInputProps("details.phoneNumber")}
|
|
/>
|
|
<TextInput
|
|
label={"Почта"}
|
|
placeholder={"Введите почту"}
|
|
{...form.getInputProps("details.email")}
|
|
/>
|
|
<TextInput
|
|
label={"ИНН"}
|
|
placeholder={"Введите ИНН"}
|
|
{...form.getInputProps("details.inn")}
|
|
/>
|
|
<TextInput
|
|
label={"Название компании"}
|
|
placeholder={"Введите название компании"}
|
|
{...form.getInputProps("companyName")}
|
|
/>
|
|
<Textarea
|
|
label={"Комментарий"}
|
|
placeholder={"Введите комментарий"}
|
|
{...form.getInputProps("comment")}
|
|
/>
|
|
</Stack>
|
|
</Fieldset>
|
|
</BaseFormModal>
|
|
);
|
|
};
|
|
|
|
export default ClientEditorModal;
|