Baugruppenträgger

app/dashboard/page.jsx

@@ -33,14 +33,6 @@ function Dashboard() {
           console.error("Konnte last20Messages nicht finden.");
           setError("Konnte last20Messages nicht finden.");
         }
-
-        // Hier holen wir die kueVersion und konvertieren sie in ein Array
-        if (window.kueVersion) {
-          const versionArray = window.kueVersion.split(",").map(Number); // Wandelt die String-Array in ein Array um
-          setKueVersion(versionArray);
-        } else {
-          console.error("Konnte kueVersion nicht finden.");
-        }
         setLoading(false);
       })
       .catch((error) => {
@@ -49,6 +41,26 @@ function Dashboard() {
         setLoading(false);
       });
   }, [apiUrl]);
+
+  const parseMessages = (messages) => {
+    messages = messages
+      .replace(/<tr>/g, "\n")
+      .replace(/<\/?td>/g, "")
+      .replace(/<\/tr>/g, "")
+      .trim();
+
+    const rows = messages.split("\n");
+    return rows.map((row) => {
+      const columns = [
+        row.substring(0, 5), // ID
+        row.substring(5, 10), // Wert (z.B. Modulnummer)
+        row.substring(10, 29), // Zeitstempel, Millisekunden entfernt :000
+        row.substring(33, row.length - 1), // Meldung (ohne letztes Zeichen)
+        row.substring(row.length - 1), // Status (letztes Zeichen)
+      ];
+      return columns;
+    });
+  };
   useEffect(() => {
     loadWindowVariables(apiUrl)
       .then(() => {
@@ -99,26 +111,6 @@ function Dashboard() {
     return baugruppen;
   };
 
-  const parseMessages = (messages) => {
-    messages = messages
-      .replace(/<tr>/g, "\n")
-      .replace(/<\/?td>/g, "")
-      .replace(/<\/tr>/g, "")
-      .trim();
-
-    const rows = messages.split("\n");
-    return rows.map((row) => {
-      const columns = [
-        row.substring(0, 5), // ID
-        row.substring(5, 10), // Wert (z.B. Modulnummer)
-        row.substring(10, 29), // Zeitstempel, Millisekunden entfernt :000
-        row.substring(33, row.length - 1), // Meldung (ohne letztes Zeichen)
-        row.substring(row.length - 1), // Status (letztes Zeichen)
-      ];
-      return columns;
-    });
-  };
-
   return (
     <div className="bg-gray-100 flex flex-col min-h-screen ">
       {/* Letzte Meldungen - Titel und Icon Bereich */}
@@ -189,25 +181,43 @@ function Dashboard() {
         </div>
 
         {/* Sidebar mit Informationen */}
-        <div className="bg-gray-100 flex flex-col min-h-screen p-4">
+        <div className="bg-white shadow-md rounded-lg p-4 w-full lg:w-1/3 flex flex-col gap-4">
-          <div className="flex justify-between items-center pb-2 w-full lg:w-2/3 mt-8">
+          {/* Versionsinformationen */}
-            <Icon
+          <div className="bg-gray-50 p-4 rounded-lg shadow-sm border border-gray-200">
-              icon="ri:calendar-schedule-line"
+            <h2 className="text-lg font-semibold text-gray-700 mb-2">
-              className="text-blue-500 text-4xl"
+              Versionsinformationen
-            />
+            </h2>
-            <h1 className="text-xl font-bold text-gray-700">
+            <p className="text-sm text-gray-600">
-              Baugruppenträger Übersicht
+              <span className="font-bold">Applikationsversion: </span> 5.1.1.8
-            </h1>
+              C-24-KA
+            </p>
+            <p className="text-sm text-gray-600">
+              <span className="font-bold">Webserverversion: </span> 5.3.4.1
+            </p>
           </div>
 
-          <div className="flex flex-col gap-8 mt-4">
+          {/* Beispiel für Geräteanzeige */}
-            {loading ? (
+          <div className="bg-gray-50 p-4 rounded-lg shadow-sm border border-gray-200 justify-between space-y-1">
-              <p>Lädt...</p>
+            <div className="flex flex-row item-center justify-between ">
-            ) : error ? (
+              <CPLStatus />
-              <p className="text-red-500">{error}</p>
+              <Access1Status />
-            ) : (
+              <Access2Status />
-              renderBaugruppentraeger()
+            </div>
-            )}
+            <div className="flex flex-col item-center justify-between gap-1">
+              <div className="flex flex-row item-center justify-between space-y-0">
+                <div className="bg-gray-100 flex flex-col min-h-screen p-4">
+                  <div className="flex flex-col gap-8 mt-4">
+                    {loading ? (
+                      <p>Lädt...</p>
+                    ) : error ? (
+                      <p className="text-red-500">{error}</p>
+                    ) : (
+                      renderBaugruppentraeger()
+                    )}
+                  </div>
+                </div>
+              </div>
+            </div>
           </div>
         </div>
       </div>