feat: ud service, create product in deal details

src/pages/ServicesPage/components/ServicesTable/ServicesTable.tsx

@@ -1,27 +1,55 @@
 import {ServiceSchema} from "../../../../client";
-import {FC, RefObject} from "react";
+import {FC} from "react";
 import {useServicesTableColumns} from "./columns.tsx";
-import {BaseTable, BaseTableRef} from "../../../../components/BaseTable/BaseTable.tsx";
+import {BaseTable} from "../../../../components/BaseTable/BaseTable.tsx";
 import {MRT_TableOptions} from "mantine-react-table";
+import {CRUDTableProps} from "../../../../types/CRUDTable.tsx";
+import {ActionIcon, Flex, Tooltip} from "@mantine/core";
+import {IconEdit, IconTrash} from "@tabler/icons-react";
+import {modals} from "@mantine/modals";
 
-type Props = {
-    services: ServiceSchema[];
-    tableRef?: RefObject<BaseTableRef<ServiceSchema>>
-}
-const ServicesTable: FC<Props> = ({services, tableRef}) => {
+const ServicesTable: FC<CRUDTableProps<ServiceSchema>> = ({items, onDelete, onChange}) => {
     const columns = useServicesTableColumns();
+
+    const onEditClick = (service: ServiceSchema) => {
+        if (!onChange) return;
+        modals.openContextModal({
+            modal: "createService",
+            title: 'Создание услуги',
+            withCloseButton: false,
+            innerProps: {
+                onChange: (newService) => onChange(newService),
+                element: service,
+            }
+        })
+    }
     return (
         <BaseTable
-            ref={tableRef}
-            data={services}
+            data={items}
             columns={columns}
             restProps={{
                 enableGrouping: true,
                 initialState: {grouping: ["category"]},
                 enableColumnActions: false,
-                mantineCreateRowModalProps: {
-                    transitionProps: {transition: 'rotate-left', duration: 300}
-                },
+                enableRowActions: true,
+                renderRowActions: ({row}) => (
+                    <Flex gap="md">
+                        <Tooltip label="Редактировать">
+                            <ActionIcon
+                                onClick={() => onEditClick(row.original)}
+                                variant={"default"}>
+                                <IconEdit/>
+                            </ActionIcon>
+                        </Tooltip>
+                        <Tooltip label="Удалить">
+                            <ActionIcon onClick={() => {
+                                if (onDelete) onDelete(row.original);
+                            }} variant={"default"}>
+                                <IconTrash/>
+                            </ActionIcon>
+                        </Tooltip>
+                    </Flex>
+                )
             } as MRT_TableOptions<ServiceSchema>}
         />
     )