crap

src/pages/LeadsPage/drawers/DealEditDrawer/DealEditDrawer.tsx

@@ -1,12 +1,15 @@
-import {Drawer, Text} from "@mantine/core";
+import {Box, Drawer, rem, Tabs, Text} from "@mantine/core";
 import {FC, useRef} from "react";
 import DealServicesTable from "../../components/DealServicesTable/DealServicesTable.tsx";
 import {useDealPageContext} from "../../contexts/DealPageContext.tsx";
-import {DealService, DealServiceSchema} from "../../../../client";
+import {DealProductSchema, DealService, DealServiceSchema} from "../../../../client";
 import {notifications} from "../../../../shared/lib/notifications.ts";
 import {modals} from "@mantine/modals";
 import {BaseTableRef} from "../../../../components/BaseTable/BaseTable.tsx";
 import DealProductsTable from "../../components/DealProductsTable/DealProductsTable.tsx";
+import {IconBarcode, IconBox, IconCalendarUser, IconSettings} from "@tabler/icons-react";
+import DealStatusChangeTable from "../../components/DealStatusChangeTable/DealStatusChangeTable.tsx";
+import DealEditDrawerGeneralTab from "./tabs/DealEditDrawerGeneralTab.tsx";
 
 const useDealServicesTableState = () => {
     const {selectedDeal, setSelectedDeal} = useDealPageContext();
@@ -30,7 +33,6 @@ const useDealServicesTableState = () => {
                 .then(setSelectedDeal)
         })
     }
-
     const onServiceDelete = (service: DealServiceSchema) => {
         if (!selectedDeal) return;
         modals.openConfirmModal({
@@ -68,7 +70,6 @@ const useDealServicesTableState = () => {
             }
         })
     }
-
     const onServiceCreate = (service: DealServiceSchema) => {
         console.log('-------Drawer')
         console.log(service);
@@ -88,7 +89,6 @@ const useDealServicesTableState = () => {
                 .then(setSelectedDeal)
         })
     }
-
     const onsServiceMultipleDelete = (items: DealServiceSchema[]) => {
         if (!selectedDeal) return;
         modals.openConfirmModal({
@@ -152,27 +152,158 @@ const DealEditDrawerServicesTable = () => {
 }
 
 const useDealProductTableState = () => {
-    const {selectedDeal} = useDealPageContext();
+    const {selectedDeal, setSelectedDeal} = useDealPageContext();
 
+    const onProductUpdate = (product: DealProductSchema) => {
+        if (!selectedDeal) return;
+        DealService.updateDealProductQuantity({
+            requestBody: {
+                dealId: selectedDeal.id,
+                productId: product.product.id,
+                quantity: product.quantity
+            }
+        }).then(async ({ok, message}) => {
+            if (!ok) {
+                notifications.guess(ok, {message});
+                return;
+            }
+            await DealService.getDealById({dealId: selectedDeal.id})
+                .then(setSelectedDeal)
+        })
+    }
+    const onProductDelete = (product: DealProductSchema) => {
+        if (!selectedDeal) return;
+        modals.openConfirmModal({
+            title: "Удаление товара",
+            children: (
+                <>
+                    <Text>
+                        Вы уверены, что хотите удалить товар:
+                    </Text>
+                    <Text>
+                        {product.product.name}?
+                    </Text>
+
+                </>
+
+            ),
+            onConfirm: () => {
+                DealService.deleteDealProduct({
+                    requestBody: {
+                        dealId: selectedDeal.id,
+                        productId: product.product.id
+                    }
+                }).then(async ({ok, message}) => {
+                    if (!ok) {
+                        notifications.guess(ok, {message});
+                        return;
+                    }
+                    await DealService.getDealById({dealId: selectedDeal.id})
+                        .then(setSelectedDeal)
+                })
+            },
+            labels: {
+                cancel: "Отмена",
+                confirm: "Удалить"
+            }
+        })
+    }
+    const onProductCreate = (product: DealProductSchema) => {
+        if (!selectedDeal) return;
+        DealService.addDealProduct({
+            requestBody: {
+                dealId: selectedDeal.id,
+                productId: product.product.id,
+                quantity: product.quantity
+            }
+        }).then(async ({ok, message}) => {
+            if (!ok) {
+                notifications.guess(ok, {message});
+                return;
+            }
+            await DealService.getDealById({dealId: selectedDeal.id})
+                .then(setSelectedDeal)
+        })
+    }
+    const onProductMultipleDelete = (items: DealProductSchema[]) => {
+        if (!selectedDeal) return;
+        modals.openConfirmModal({
+            title: "Удаление товаров",
+            children: (
+                <>
+                    <Text>
+                        Вы уверены, что хотите удалить выбранные товары?
+                    </Text>
+                </>
+            ),
+            onConfirm: () => {
+                DealService.deleteMultipleDealProducts({
+                    requestBody: {
+                        dealId: selectedDeal.id,
+                        productIds: items.map(item => item.product.id)
+                    }
+                }).then(async ({ok, message}) => {
+                    if (!ok) {
+                        notifications.guess(ok, {message});
+                        return;
+                    }
+                    await DealService.getDealById({dealId: selectedDeal.id})
+                        .then(setSelectedDeal)
+                })
+            },
+            labels: {
+                cancel: "Отмена",
+                confirm: "Удалить"
+            }
+        })
+    }
     return {
         clientId: selectedDeal?.clientId || -1,
-        products: selectedDeal?.products || []
+        products: selectedDeal?.products || [],
+        onProductUpdate,
+        onProductDelete,
+        onProductCreate,
+        onProductMultipleDelete
     }
 }
-
 const DealEditDrawerProductsTable = () => {
     const {
         products,
-        clientId
+        clientId,
+        onProductUpdate,
+        onProductDelete,
+        onProductCreate,
+        onProductMultipleDelete,
     } = useDealProductTableState();
     return (
         <DealProductsTable
             clientId={clientId}
             items={products}
+            onChange={onProductUpdate}
+            onMultipleDelete={onProductMultipleDelete}
+            onDelete={onProductDelete}
+            onCreate={onProductCreate}
+
         />
     )
 }
 
+const useDealStatusChangeState = () => {
+    const {selectedDeal} = useDealPageContext();
+
+    return {
+        statusHistory: selectedDeal?.statusHistory || []
+    }
+}
+const DealEditDrawerStatusChangeTable = () => {
+    const {statusHistory} = useDealStatusChangeState();
+
+    return (
+        <DealStatusChangeTable
+            items={statusHistory}
+        />)
+}
+
 const useDealEditDrawerState = () => {
     const {selectedDeal, setSelectedDeal} = useDealPageContext();
     return {
@@ -189,9 +320,55 @@ const DealEditDrawer: FC = () => {
             size={"95%"}
             position={"right"}
             onClose={onClose}
-            opened={isVisible}>
-            <DealEditDrawerServicesTable/>
-            <DealEditDrawerProductsTable/>
+            removeScrollProps={{allowPinchZoom: true}}
+            withCloseButton={false}
+            opened={isVisible}
+            styles={{body: {height: '100%'}}}
+        >
+            <Tabs
+                defaultValue={"general"}
+                h={'100%'}
+                variant={"outline"}
+                orientation={"vertical"}>
+                <Tabs.List
+                >
+                    <Tabs.Tab value={"general"} leftSection={<IconSettings/>}>
+                        Общее
+                    </Tabs.Tab>
+                    <Tabs.Tab value={"history"} leftSection={<IconCalendarUser/>}>
+                        История
+                    </Tabs.Tab>
+                    <Tabs.Tab value={"services"} leftSection={<IconBox/>}>
+                        Услуги
+                    </Tabs.Tab>
+                    <Tabs.Tab value={"products"} leftSection={<IconBarcode/>}>
+                        Товары
+                    </Tabs.Tab>
+                </Tabs.List>
+                <Tabs.Panel value={"general"}>
+                    <Box h={"100%"} w={"100%"} p={rem(10)}>
+                        <DealEditDrawerGeneralTab/>
+                    </Box>
+                </Tabs.Panel>
+                <Tabs.Panel value={"history"}>
+                    <Box p={rem(10)}>
+                        <DealEditDrawerStatusChangeTable/>
+                    </Box>
+                </Tabs.Panel>
+                <Tabs.Panel value={"services"}>
+                    <Box p={rem(10)}>
+
+                        <DealEditDrawerServicesTable/>
+                    </Box>
+                </Tabs.Panel>
+                <Tabs.Panel value={"products"}>
+                    <Box p={rem(10)}>
+
+                        <DealEditDrawerProductsTable/>
+                    </Box>
+
+                </Tabs.Panel>
+            </Tabs>
         </Drawer>
     );
 }