Update

client/src/pages/Boilers.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react'
 import { useBoilers } from '../hooks/swrHooks'
-import { Badge, ScrollAreaAutosize, Table, Text } from '@mantine/core'
-import { IBoiler } from '../interfaces/fuel'
+import { Stack, Text } from '@mantine/core'
+import CustomTable from '../components/CustomTable'
 
 function Boilers() {
     const [boilersPage, setBoilersPage] = useState(1)
@@ -24,21 +24,43 @@ function Boilers() {
         setBoilerSearch("")
     }, [])
 
-    const boilersColumns = [
-        { field: 'id_object', headerName: 'ID', type: "number" },
-        { field: 'boiler_name', headerName: 'Название', type: "string", flex: 1 },
-        { field: 'boiler_code', headerName: 'Код', type: "string", flex: 1 },
-        { field: 'id_city', headerName: 'Город', type: "string", flex: 1 },
-        { field: 'activity', headerName: 'Активен', type: "boolean", flex: 1 },
-    ]
-
     return (
-        <ScrollAreaAutosize w={'100%'} h={'100%'} p='sm'>
+        <Stack w={'100%'} h={'100%'} p='sm'>
             <Text size="xl" fw={600}>
                 Котельные
             </Text>
 
             {boilers &&
+                <CustomTable data={boilers} columns={[
+                    {
+                        accessorKey: 'id_object',
+                        header: 'ID',
+                        cell: (info) => info.getValue(),
+                    },
+                    {
+                        accessorKey: 'boiler_name',
+                        header: 'Название',
+                        cell: (info) => info.getValue(),
+                    },
+                    {
+                        accessorKey: 'boiler_code',
+                        header: 'Код',
+                        cell: (info) => info.getValue(),
+                    },
+                    {
+                        accessorKey: 'id_city',
+                        header: 'Город',
+                        cell: (info) => info.getValue(),
+                    },
+                    {
+                        accessorKey: 'activity',
+                        header: 'Активен',
+                        cell: (info) => info.getValue(),
+                    },
+                ]} />
+            }
+
+            {/* {boilers &&
                 <Table highlightOnHover>
                     <Table.Thead>
                         <Table.Tr>
@@ -77,8 +99,8 @@ function Boilers() {
                         ))}
                     </Table.Tbody>
                 </Table>
-            }
-        </ScrollAreaAutosize>
+            } */}
+        </Stack>
     )
 }