feat: generation of modules from the server, moved modules fields from the general tab

2025-03-05 16:56:39 +04:00
parent 5d19d254da
commit 56135ae10c
85 changed files with 924 additions and 367 deletions
--- a/src/modules/cardModules/cardEditorTabs/ClientTab/ClientTab.tsx
+++ b/src/modules/cardModules/cardEditorTabs/ClientTab/ClientTab.tsx
@@ -0,0 +1,147 @@
+import { Button, Fieldset, Group, rem, Stack, Textarea, TextInput } from "@mantine/core";
+import { useCardPageContext } from "../../../../pages/CardsPage/contexts/CardPageContext.tsx";
+import { useForm } from "@mantine/form";
+import { CardService, ClientSchema, ClientService } from "../../../../client";
+import { notifications } from "../../../../shared/lib/notifications.ts";
+import ClientSelect from "../../../../components/Selects/ClientSelect/ClientSelect.tsx";
+import { useEffect, useState } from "react";
+import InlineButton from "../../../../components/InlineButton/InlineButton.tsx";
+import { isEqual } from "lodash";
+
+const ClientTab = () => {
+    const { selectedCard: card, refetchCard } = useCardPageContext();
+    const [initialValues, setInitialValues] = useState<Partial<ClientSchema>>(card?.client ?? {});
+
+    const [client, setClient] = useState<ClientSchema | undefined>(card?.client ?? undefined);
+
+    const form = useForm<Partial<ClientSchema>>(
+        {
+            initialValues,
+        },
+    );
+
+    useEffect(() => {
+        const data = card?.client ?? {};
+        setInitialValues(data);
+        form.setValues(data);
+    }, [card]);
+
+    const isEditorDisabled = () => client?.id !== card?.client?.id;
+
+    const handleSubmitClientInfo = (values: ClientSchema) => {
+        ClientService.updateClient({
+            requestBody: {
+                data: values,
+            },
+        })
+            .then(({ ok, message }) => {
+                if (!ok) {
+                    notifications.error({ message });
+                    return;
+                }
+                refetchCard();
+            })
+            .catch(err => console.log(err));
+    };
+
+    const handleSelectClient = () => {
+        if (!(card && client)) return;
+
+        CardService.updateCardClient({
+            requestBody: {
+                cardId: card?.id,
+                clientId: client?.id,
+            },
+        })
+            .then(({ ok, message }) => {
+                if (!ok) {
+                    notifications.error({ message });
+                    return;
+                }
+                refetchCard();
+            })
+            .catch(err => console.log(err));
+    };
+
+    const clientDataEditor = (
+        <Fieldset legend={"Данные клиента"} flex={1}>
+            <form
+                onSubmit={
+                    form.onSubmit(values => handleSubmitClientInfo(values as ClientSchema))
+                }>
+                <Stack gap={rem(10)}>
+                    <TextInput
+                        disabled
+                        placeholder={"Название"}
+                        label={"Название"}
+                        value={card?.client?.name}
+                    />
+                    <TextInput
+                        disabled={isEditorDisabled()}
+                        placeholder={"Введите телефон"}
+                        label={"Телефон клиента"}
+                        {...form.getInputProps("details.phoneNumber")}
+                    />
+                    <TextInput
+                        disabled={isEditorDisabled()}
+                        placeholder={"Введите email"}
+                        label={"Email"}
+                        {...form.getInputProps("details.email")}
+                    />
+                    <TextInput
+                        disabled={isEditorDisabled()}
+                        placeholder={"Введите телеграм"}
+                        label={"Телеграм"}
+                        {...form.getInputProps("details.telegram")}
+                    />
+                    <TextInput
+                        disabled={isEditorDisabled()}
+                        placeholder={"Введите ИНН"}
+                        label={"ИНН"}
+                        {...form.getInputProps("details.inn")}
+                    />
+                    <Textarea
+                        disabled={isEditorDisabled()}
+                        placeholder={"Введите комментарий"}
+                        label={"Комментарий"}
+                        {...form.getInputProps("comment")}
+                    />
+                    <Group>
+                        <Button
+                            variant={"default"}
+                            disabled={isEditorDisabled() || isEqual(initialValues, form.values)}
+                            type="submit"
+                        >
+                            Сохранить
+                        </Button>
+                    </Group>
+                </Stack>
+            </form>
+        </Fieldset>
+    );
+
+    return (
+        <Stack flex={1}>
+            <Fieldset legend={"Выбор клиента"} flex={1}>
+                <Stack gap={rem(10)}>
+                    <ClientSelect
+                        value={client}
+                        onChange={setClient}
+                        withLabel
+                        disabled={!isEqual(initialValues, form.values)}
+                    />
+                    <Group>
+                        <InlineButton
+                            onClick={handleSelectClient}
+                            disabled={!isEditorDisabled()}
+                        >
+                            Сохранить
+                        </InlineButton>
+                    </Group>
+                </Stack>
+            </Fieldset>
+            {clientDataEditor}
+        </Stack>
+    );
+};
+export default ClientTab;