feat: Projekt von JavaScript zu TypeScript migriert

pages/analogeEingaenge.tsx

@@ -0,0 +1,188 @@
+"use client"; // pages/analogeEingaenge.js
+import React, { useState } from "react";
+import AnalogeEingaengeComponent from "../components/modules/AnalogeEingaengeComponent";
+import XioPM from "../components/modules/XioPM";
+
+function AnalogeEingaenge() {
+  const [activeConfig, setActiveConfig] = useState<number | null>(null);
+
+  // Mock-Daten für XIO-PM 1
+  const xioPm1Inputs = [
+    {
+      id: 1,
+      value: 1.34,
+      name: "Test1",
+      uW: true,
+      uG: true,
+      oW: false,
+      oG: true,
+    },
+    {
+      id: 2,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 3,
+      value: 7.94,
+      name: "----",
+      uW: false,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 4,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 5,
+      value: 6.13,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 6,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 7,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 8,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+  ];
+
+  // Mock-Daten für XIO-PM 2
+  const xioPm2Inputs = [
+    {
+      id: 1,
+      value: 2.78,
+      name: "Test2",
+      uW: true,
+      uG: false,
+      oW: true,
+      oG: false,
+    },
+    {
+      id: 2,
+      value: 4.33,
+      name: "----",
+      uW: false,
+      uG: true,
+      oW: false,
+      oG: true,
+    },
+    {
+      id: 3,
+      value: 8.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: false,
+      oG: true,
+    },
+    {
+      id: 4,
+      value: 9.44,
+      name: "----",
+      uW: true,
+      uG: false,
+      oW: true,
+      oG: false,
+    },
+    {
+      id: 5,
+      value: 6.13,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 6,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 7,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+    {
+      id: 8,
+      value: 7.94,
+      name: "----",
+      uW: true,
+      uG: true,
+      oW: true,
+      oG: true,
+    },
+  ];
+
+  return (
+    <div className="flex flex-col h-[calc(100vh-13vh-8vh)] laptop:h-[calc(100vh-10vh-6vh)] xl:h-[calc(100vh-10vh-6vh)] bg-gray-100">
+      <div className="flex-grow grid grid-cols-2 gap-4 p-4">
+        <AnalogeEingaengeComponent />
+
+        {/* Zweite Box */}
+        <div className="border rounded-lg shadow-md p-2 bg-white">
+          <h3 className="text-sm font-semibold mb-1">Diagramm</h3>
+          <p>Diagramm wird hier eingefügt</p>
+        </div>
+
+        <XioPM
+          title="XIO-PM 1"
+          data={xioPm1Inputs}
+          onConfigClick={(id) => setActiveConfig(id)}
+        />
+
+        <XioPM
+          title="XIO-PM 2"
+          data={xioPm2Inputs}
+          onConfigClick={(id) => setActiveConfig(id)}
+        />
+      </div>
+    </div>
+  );
+}
+
+export default AnalogeEingaenge;