Files
Fulfillment-Frontend/src/pages/ServicesPage/components/ServicesTable/ServicesTable.tsx
2024-09-27 04:47:04 +03:00

67 lines
2.4 KiB
TypeScript

import { ServiceSchema } from "../../../../client";
import { FC } from "react";
import { useServicesTableColumns } from "./columns.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";
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
data={items}
columns={columns}
restProps={
{
enableGrouping: true,
initialState: { grouping: ["category"] },
enableColumnActions: false,
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>
}
/>
);
};
export default ServicesTable;