feat: attributes in cards and projects

2025-02-27 18:34:15 +04:00
parent 8083bdf3d0
commit d37dce7980
75 changed files with 1674 additions and 281 deletions
--- a/src/pages/CardsPage/drawers/ProjectsEditorDrawer/tabs/AttributesTab/AttributesTab.tsx
+++ b/src/pages/CardsPage/drawers/ProjectsEditorDrawer/tabs/AttributesTab/AttributesTab.tsx
@@ -0,0 +1,112 @@
+import { BaseTable } from "../../../../../../components/BaseTable/BaseTable.tsx";
+import useAttributesTableColumns from "./hooks/attributesTableColumns.tsx";
+import useAttributesList from "../../../../../../hooks/useAttributesList.tsx";
+import { ActionIcon, Flex, Group, Stack, Text, Tooltip } from "@mantine/core";
+import InlineButton from "../../../../../../components/InlineButton/InlineButton.tsx";
+import { IconEdit, IconPlus, IconTrash } from "@tabler/icons-react";
+import { modals } from "@mantine/modals";
+import { AttributeSchema, AttributeService } from "../../../../../../client";
+import { notifications } from "../../../../../../shared/lib/notifications.ts";
+import { MRT_TableOptions } from "mantine-react-table";
+
+const AttributesTab = () => {
+    const columns = useAttributesTableColumns();
+    const { objects: attributes, refetch: refetchAttributes } = useAttributesList();
+
+    const onCreateAttributeClick = () => {
+        modals.openContextModal({
+            modal: "attributeModal",
+            title: "Создание атрибута",
+            withCloseButton: false,
+            innerProps: {
+                refetchAttributes,
+            },
+        });
+    };
+
+    const onEditAttributeClick = (attribute: AttributeSchema) => {
+        modals.openContextModal({
+            modal: "attributeModal",
+            title: "Редактирование атрибута",
+            withCloseButton: false,
+            innerProps: {
+                refetchAttributes,
+                attribute,
+            },
+        });
+    };
+
+    const deleteAttribute = (attribute: AttributeSchema) => {
+        AttributeService.delete({
+            attributeId: attribute.id,
+        })
+            .then(({ ok, message }) => {
+                if (!ok) {
+                    notifications.error({ message });
+                }
+                refetchAttributes();
+            })
+            .catch(err => console.log(err));
+    };
+
+    const onDeleteAttributeClick = (attribute: AttributeSchema) => {
+        modals.openConfirmModal({
+            title: "Удаление атрибута",
+            children: (
+                <Text>
+                    Вы уверены, что хотите удалить атрибут "{attribute.label}"?
+                </Text>
+            ),
+            labels: { confirm: "Да", cancel: "Нет" },
+            confirmProps: { color: "red" },
+            onConfirm: () => deleteAttribute(attribute),
+        });
+    };
+
+    return (
+        <Stack>
+            <Group>
+                <InlineButton onClick={onCreateAttributeClick}>
+                    <IconPlus />
+                    Добавить атрибут
+                </InlineButton>
+            </Group>
+            <BaseTable
+                data={attributes}
+                columns={columns}
+
+                restProps={
+                    {
+                        enableSorting: false,
+                        enableColumnActions: false,
+                        enableBottomToolbar: false,
+                        enableRowActions: true,
+                        enableRowVirtualization: true,
+                        mantineTableContainerProps: { style: { maxHeight: "86vh" } },
+
+                        renderRowActions: ({ row }) => (
+                            <Flex gap="md">
+                                <Tooltip label="Редактировать">
+                                    <ActionIcon
+                                        onClick={() => onEditAttributeClick(row.original)}
+                                        variant={"default"}>
+                                        <IconEdit />
+                                    </ActionIcon>
+                                </Tooltip>
+                                <Tooltip label="Удалить">
+                                    <ActionIcon
+                                        onClick={() => onDeleteAttributeClick(row.original)}
+                                        variant={"default"}>
+                                        <IconTrash />
+                                    </ActionIcon>
+                                </Tooltip>
+                            </Flex>
+                        ),
+                    } as MRT_TableOptions<AttributeSchema>
+                }
+            />
+        </Stack>
+    );
+};
+
+export default AttributesTab;