diff --git a/pages/dashboard.js b/pages/dashboard.js index e1d9e4b..a27dd5a 100644 --- a/pages/dashboard.js +++ b/pages/dashboard.js @@ -14,8 +14,6 @@ import XioPM2Status from "../components/modulesStatus/XioPM2Status"; import { Icon } from "@iconify/react"; function Dashboard() { - const [isClient, setIsClient] = useState(false); - const router = useRouter(); // Router instanzieren const [last20Messages, setLast20Messages] = useState([]); const [kueOnline, setkueOnline] = useState([]); const [ip, setIp] = useState(""); @@ -25,58 +23,7 @@ function Dashboard() { const [error, setError] = useState(null); const [kueCableBreak, setKueCableBreak] = useState([]); const [appVersion, setAppVersion] = useState(""); - - /* useEffect(() => { - if (typeof window !== "undefined") { - loadWindowVariables() - .then(() => { - if (window.last20Messages) { - const parsedMessages = parseMessages(window.last20Messages); - setLast20Messages(parsedMessages); - setIp(window.ip); - setSubnet(window.subnet); - setGateway(window.gateway); - setAppVersion(window.appVersion); - } else { - console.error("Konnte last20Messages nicht finden."); - setError("Konnte last20Messages nicht finden."); - } - setLoading(false); - }) - .catch((error) => { - console.error("Fehler beim Laden des Skripts:", error); - setError(error); - setLoading(false); - }); - } - }, []); */ - /* useEffect(() => { - loadWindowVariables() - .then(() => { - if (window.kueCableBreak && Array.isArray(window.kueCableBreak)) { - // Prüfe, ob window.kueCableBreak ein Array ist - const cableBreakArray = window.kueCableBreak.map(Number); - setKueCableBreak(cableBreakArray); // Array für kueCableBreak - } else if (typeof window.kueCableBreak === "string") { - // Falls es ein String ist, splitte den String und mappe ihn in ein Array - const cableBreakArray = window.kueCableBreak.split(",").map(Number); - setKueCableBreak(cableBreakArray); - } else { - console.error( - "Konnte kueCableBreak nicht finden oder es ist kein gültiges Array/String." - ); - setError( - "Konnte kueCableBreak nicht finden oder es ist kein gültiges Array/String." - ); - } - setLoading(false); - }) - .catch((error) => { - console.error("Fehler beim Laden des Skripts:", error); - setError(error); - setLoading(false); - }); - }, []); */ + const router = useRouter(); const parseMessages = (messages) => { messages = messages @@ -84,140 +31,64 @@ function Dashboard() { .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 rows.map((row) => [ + row.substring(0, 5), + row.substring(5, 10), + row.substring(10, 29), + row.substring(33, row.length - 1), + row.substring(row.length - 1), + ]); }; - /* useEffect(() => { - loadWindowVariables() - .then(() => { - // console.log("kueOnline Data: ", window.kueOnline); // Debug: Ausgabe von kueOnline - if (window.kueOnline) { - if (Array.isArray(window.kueOnline)) { - const versionArray = window.kueOnline.map(Number); - setkueOnline(versionArray); - } else { - console.error("kueOnline ist kein Array:", window.kueOnline); - setError("Konnte kueOnline nicht als Array verarbeiten."); - } - } else { - console.error("Konnte kueOnline nicht finden."); - setError("Konnte kueOnline nicht finden."); - } + useEffect(() => { + const loadDataOnce = async () => { + try { + await loadWindowVariables(); + + // Werte direkt aus `window` zuweisen + setLast20Messages(parseMessages(window.last20Messages || "")); + setIp(window.ip || ""); + setSubnet(window.subnet || ""); + setGateway(window.gateway || ""); + setAppVersion(window.appVersion || ""); + + // Verarbeite `kueCableBreak` und `kueOnline` + const cableBreakArray = Array.isArray(window.kueCableBreak) + ? window.kueCableBreak.map((value, index) => + window.kueOnline[index] === 1 ? Number(value) : 0 + ) + : (window.kueCableBreak || "") + .split(",") + .map((value, index) => + window.kueOnline[index] === 1 ? Number(value) : 0 + ); + setKueCableBreak(cableBreakArray); + + const onlineArray = Array.isArray(window.kueOnline) + ? window.kueOnline.map(Number) + : []; + setkueOnline(onlineArray); setLoading(false); - }) - .catch((error) => { - console.error("Fehler beim Laden des Skripts:", error); + } catch (error) { + console.error("Fehler beim Laden der Daten:", error); setError(error); setLoading(false); - }); - }, []); */ - useEffect(() => { - // Funktion zur Wiederholten Überprüfung der Variablen - const checkVariablesLoaded = () => { - return new Promise((resolve, reject) => { - const intervalId = setInterval(() => { - if ( - window.kueAlarm1 && - Array.isArray(window.kueAlarm1) && - window.kueAlarm2 && - Array.isArray(window.kueAlarm2) - ) { - clearInterval(intervalId); - resolve(); - } else { - console.log("Warten auf die Variablen kueAlarm1 und kueAlarm2..."); - } - }, 500); // Überprüfung alle 500ms - - // Timeout, falls die Variablen nach einer bestimmten Zeit nicht geladen sind - setTimeout(() => { - clearInterval(intervalId); - reject( - new Error( - "Die Variablen kueAlarm1 und kueAlarm2 wurden nicht innerhalb der erwarteten Zeit geladen." - ) - ); - }, 10000); // Timeout nach 10 Sekunden - }); + } }; - loadWindowVariables() - .then(() => checkVariablesLoaded()) - .then(() => { - // Variablen sind jetzt verfügbar - /* console.log("kueAlarm1 und kueAlarm2 sind geladen:", { - kueAlarm1: window.kueAlarm1, - kueAlarm2: window.kueAlarm2, - }); */ - }) - .catch((error) => { - console.error("Fehler beim Laden der Variablen oder Timeout:", error); - setError("Konnte die Variablen nicht laden: " + error.message); - }); - }, []); - //--------------------------------------------------- - useEffect(() => { - if (typeof window !== "undefined") { - const updateData = () => { - loadWindowVariables() - .then(() => { - setLast20Messages(parseMessages(window.last20Messages || "")); - setIp(window.ip || ""); - setSubnet(window.subnet || ""); - setGateway(window.gateway || ""); - setAppVersion(window.appVersion || ""); + // Sofortiges Laden der Daten einmalig + loadDataOnce(); - // Prüfen, ob der Slot in kueOnline aktiv ist, bevor kueCableBreak gesetzt wird - const cableBreakArray = Array.isArray(window.kueCableBreak) - ? window.kueCableBreak.map((value, index) => - window.kueOnline[index] === 1 ? Number(value) : 0 - ) - : (window.kueCableBreak || "") - .split(",") - .map((value, index) => - window.kueOnline[index] === 1 ? Number(value) : 0 - ); - setKueCableBreak(cableBreakArray); - - const onlineArray = Array.isArray(window.kueOnline) - ? window.kueOnline.map(Number) - : []; - setkueOnline(onlineArray); - setLoading(false); - }) - .catch((error) => { - console.error("Error loading script:", error); - setError(error); - setLoading(false); - }); - }; - - updateData(); - const intervalId = setInterval(updateData, 5000); - - return () => clearInterval(intervalId); - } + // Starten des Intervalls für regelmäßige Updates + const intervalId = setInterval(loadDataOnce, 5000); + return () => clearInterval(intervalId); // Bereinigung des Intervalls bei Komponente unmount }, []); - //--------------------------------------------------- const handleModuleClick = (rackNumber) => { - // Navigiere zu /kabelueberwachung und übermittle den rackNumber als Parameter router.push(`/kabelueberwachung?rack=${rackNumber}`); }; - // app/dashboard/page.jsx - // app/dashboard/page.jsx const renderBaugruppentraeger = () => { const baugruppen = []; const numBaugruppen = Math.ceil(kueOnline.length / 8); @@ -230,8 +101,7 @@ function Dashboard() {
{slots.map((version, index) => { const slotNumber = i * 8 + index + 1; - const isSlotOnline = kueOnline[slotNumber - 1] === 1; // Prüfe, ob der Slot online ist - + const isSlotOnline = kueOnline[slotNumber - 1] === 1; const moduleVersion = window.kueVersion ? window.kueVersion[slotNumber - 1] : version; @@ -244,7 +114,7 @@ function Dashboard() { > @@ -261,7 +131,6 @@ function Dashboard() { return (
- {/* Letzte Meldungen - Titel und Icon Bereich */}
- {/* - - */}
- {/* Meldungen Liste */}
@@ -333,9 +195,7 @@ function Dashboard() {
- {/* Sidebar mit Informationen */}
- {/* Versionsinformationen */}

Versionsinformationen @@ -354,15 +214,9 @@ function Dashboard() {

- - {/* Beispiel für Geräteanzeige */} -
-
+
+
- {/* - - - */}
@@ -377,21 +231,10 @@ function Dashboard() {
- {/* Die Box für XIOPM1 und XIOPM2, jeweils unter CPL und Access 1 */} - -
-
- {/* */} {/* Unter CPL */} -
-
- {/* */} {/* Unter Access 1 */} -
-
- {/* IP, Subnet und Gateway Informationen */}
IP Address diff --git a/utils/loadWindowVariables.js b/utils/loadWindowVariables.js index 662355c..fd2c88f 100644 --- a/utils/loadWindowVariables.js +++ b/utils/loadWindowVariables.js @@ -2,8 +2,6 @@ export async function loadWindowVariables() { return new Promise((resolve, reject) => { - //console.log("Running loadWindowVariables..."); // Log each run - const requiredVars = [ "last20Messages", "deviceName", @@ -62,28 +60,42 @@ export async function loadWindowVariables() { const scripts = ["de.js", "kueData.js", "Start.js", "System.js"]; - // Load all required scripts + // Erster Aufruf zum Laden aller Skripte Promise.all(scripts.map(loadScript)) .then(() => { - // console.log("Scripts loaded. Checking for variables..."); + // Einmaliger direkter Check, ob alle Variablen vorhanden sind + const missingVarsInitial = requiredVars.filter( + (variable) => window[variable] === undefined + ); - // Interval to check if all required variables are loaded - const checkInterval = setInterval(() => { - const missingVars = requiredVars.filter( - (variable) => window[variable] === undefined + if (missingVarsInitial.length === 0) { + // Alle Variablen sind geladen, keine weiteren Checks notwendig + console.log("Alle Systemvariablen beim ersten Aufruf geladen."); + resolve(); + } else { + console.log( + "Noch fehlende Variablen beim ersten Aufruf:", + missingVarsInitial ); - if (missingVars.length === 0) { - //console.log("All system variables are now loaded."); - clearInterval(checkInterval); - resolve(); - } else { - console.log("Waiting for missing variables:", missingVars); - } - }, 5000); // Check every 5 seconds + // Falls Variablen fehlen, starte das Intervall + const checkInterval = setInterval(() => { + const missingVars = requiredVars.filter( + (variable) => window[variable] === undefined + ); + + if (missingVars.length === 0) { + clearInterval(checkInterval); + console.log("Alle fehlenden Systemvariablen sind jetzt geladen."); + resolve(); + } else { + console.log("Noch fehlende Variablen:", missingVars); + } + }, 5000); // Überprüfung alle 5 Sekunden + } }) .catch((error) => { - console.error("Error loading a script:", error); + console.error("Fehler beim Laden eines Skripts:", error); reject(error); }); });