123

pages/marketplaces/components/MarketplacesTable/MarketplacesTable.tsx

@@ -0,0 +1,41 @@
+import { IconCirclePlus } from '@tabler/icons-react';
+import { useQuery } from '@tanstack/react-query';
+import { ActionIcon, Affix, Tooltip } from '@mantine/core';
+
+import BaseTable from '@/components/BaseTable/BaseTable';
+import { MarketplaceSchema } from '@/lib/client';
+import { getMarketplacesOptions } from '@/lib/client/@tanstack/react-query.gen';
+import useMarketplacesTableColumns from '@/pages/marketplaces/components/MarketplacesTable/columns';
+import { CRUDTableProps } from '@/types/CrudTable/CrudTable';
+
+type Props = CRUDTableProps<MarketplaceSchema>;
+const MarketplacesTable = (props: Props) => {
+  const { data, isLoading } = useQuery({
+    ...getMarketplacesOptions({ path: { clientId: 5 } }),
+  });
+  const onCreateClick = ()=>{
+
+  }
+
+  const columns = useMarketplacesTableColumns();
+  return (
+    <>
+      <BaseTable
+        scrollAreaProps={{ type: 'auto' }}
+        style={{ width: '100%', height: '100%' }}
+        records={data?.items || []}
+        columns={columns}
+        fetching={isLoading}
+      />
+      <Affix position={{ bottom: 40, right: 40 }}>
+        <Tooltip label="Создать маркетплейс" withArrow>
+          <ActionIcon onClick={() => {}} size="xl" variant="gradient" radius="xl">
+            <IconCirclePlus />
+          </ActionIcon>
+        </Tooltip>
+      </Affix>
+    </>
+  );
+};
+
+export default MarketplacesTable;