1st Version

2024-03-19 17:06:47 +01:00
commit d79d2aefee
1948 changed files with 361921 additions and 0 deletions
--- a/vrpmdvfrontend/src/pages/monitorings/list.tsx
+++ b/vrpmdvfrontend/src/pages/monitorings/list.tsx
@@ -0,0 +1,147 @@
+import { DataGrid, GridColDef } from "@mui/x-data-grid";
+import {
+  DateField,
+  DeleteButton,
+  EditButton,
+  List,
+  MarkdownField,
+  NumberField,
+  ShowButton,
+  useDataGrid,
+} from "@refinedev/mui";
+import React from "react";
+import { IMonitoring } from "./monitorings.types";
+
+
+export const MonitoringList = () => {
+  const { dataGridProps } = useDataGrid<IMonitoring>({
+    syncWithLocation: true,
+    dataProviderName: "monitorings",
+    pagination: {
+      mode: "client",
+      pageSize: 10,
+    }, 
+  });
+
+  // const { data: categoryData, isLoading: categoryIsLoading } = useMany({
+  //   resource: "categories",
+  //   ids:
+  //     dataGridProps?.rows
+  //       ?.map((item: any) => item?.category?.id)
+  //       .filter(Boolean) ?? [],
+  //   queryOptions: {
+  //     enabled: !!dataGridProps?.rows,
+  //   },
+  // });
+
+  const columns = React.useMemo<GridColDef<IMonitoring>[]>(
+    () => [
+      {
+        field: "name",
+        flex: 1,
+        headerName: "Name",
+        type:"string",
+        minWidth: 250,
+      },
+      {
+        field: "id",
+        headerName: "ID",
+        type: "string",
+        minWidth: 300,
+      },
+      {
+        field: "created_at",
+        flex: 1,
+        headerName: "Created at",
+        minWidth: 30,
+        renderCell: function render({ value }) {
+          return <DateField value={value} />;
+        },
+      },
+      {
+        field: "samplerate",
+        flex: 0.3,
+        headerName: "Samplerate in Hz",
+        renderCell: function render({ row }) {
+          return (
+            <NumberField
+              value={row.samplerate}
+              options={{
+                minimumIntegerDigits: 1,
+                minimumFractionDigits:0,
+                maximumFractionDigits: 0,
+              }}
+            />
+          );
+        },
+        minWidth: 120,
+      },
+      {
+        field: "sampleperiod",
+        flex: 0.3,
+        headerName: "Period in s",
+        renderCell: function render({ row }) {
+          return (
+            <NumberField
+              value={row.sampleperiod}
+              options={{
+                minimumIntegerDigits: 1,
+                minimumFractionDigits:1,
+                maximumFractionDigits: 3,
+              }}
+            />
+          );
+        },
+        minWidth: 120,
+      },
+      {
+        field: "downtime",
+        flex: 0.3,
+        headerName: "Downtime in s",
+        renderCell: function render({ row }) {
+          return (
+            <NumberField
+              value={row.sampleperiod}
+              options={{
+                minimumIntegerDigits: 1,
+                minimumFractionDigits:1,
+                maximumFractionDigits: 3,
+              }}
+            />
+          );
+        },
+        minWidth: 120,
+      },
+      {
+        field: "owner",
+        flex: 1,
+        headerName: "Owner",
+        type:"string",
+        minWidth: 80,
+      },
+      {
+        field: "actions",
+        headerName: "Actions",
+        sortable: false,
+        renderCell: function render({ row }) {
+          return (
+            <>
+              <EditButton hideText recordItemId={row.id} />
+              <DeleteButton hideText recordItemId={row.id} />
+            </>
+          );
+        },
+        align: "center",
+        headerAlign: "center",
+        minWidth: 80,
+      },
+    ],
+    []
+  );
+
+  return (
+    <List>
+      <DataGrid {...dataGridProps} columns={columns} autoHeight />
+    </List>
+  );
+};