feat: clients page

2025-10-04 18:18:17 +04:00
parent f641e9ef8c
commit e9bfd39ab4
20 changed files with 1141 additions and 3 deletions
--- a/src/app/clients/modals/ClientFormModal/ClientFormModal.tsx
+++ b/src/app/clients/modals/ClientFormModal/ClientFormModal.tsx
@ -0,0 +1,105 @@
+"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;