Ismail/CPLv4.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: ensure dynamic reloading of kueData.js to update alarm status in real-time

Browse Source 
- Implemented conditional check before removing existing kueData.js script to avoid NotFoundError.
- Added dynamic script reloading to fetch the latest alarm status without browser refresh.
- Improved update mechanism for alarm status based on latest kueData.js values.
This commit is contained in:
ISA
2024-10-26 13:24:14 +02:00
parent 8b0f9fe446
commit 7fb289abf3
3 changed files with 265 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
pages/kabelueberwachung.js
View File

@@ -11,6 +11,7 @@ function Kabelueberwachung() {
const [kueID, setKueID] = useState([]); // State to store the KUE names
const [schleifenwiderstand, setSchleifenwiderstand] = useState([]); // State to store the resistance values
const [kueOnline, setKueOnline] = useState([]); // State to store the module status
const [alarmStatus, setAlarmStatus] = useState([]); // State to store the alarm status
// Verwende den useRouter Hook, um den Rack-Parameter zu extrahieren
useEffect(() => {
@@ -24,24 +25,45 @@ function Kabelueberwachung() {
// Load the external JavaScript file and fetch the isolation values
useEffect(() => {
loadWindowVariables()
.then(() => {
if (window.kueIso && Array.isArray(window.kueIso)) {
setKueIso(window.kueIso);
}
if (window.kueRes && Array.isArray(window.kueRes)) {
setSchleifenwiderstand(window.kueRes);
}
if (window.kueOnline && Array.isArray(window.kueOnline)) {
setKueOnline(window.kueOnline);
}
if (window.kueID && Array.isArray(window.kueID)) {
setKueID(window.kueID);
}
})
.catch((error) => {
//console.error("Fehler beim Laden der Variablen:", error);
const fetchData = () => {
loadWindowVariables()
.then(() => {
if (window.kueIso && Array.isArray(window.kueIso)) {
setKueIso(window.kueIso);
}
if (window.kueRes && Array.isArray(window.kueRes)) {
setSchleifenwiderstand(window.kueRes);
}
if (window.kueOnline && Array.isArray(window.kueOnline)) {
setKueOnline(window.kueOnline);
}
if (window.kueID && Array.isArray(window.kueID)) {
setKueID(window.kueID);
}
updateAlarmStatus(); // Alarmstatus sofort aktualisieren
})
.catch((error) => {
console.error("Fehler beim Laden der Variablen:", error);
});
};
const updateAlarmStatus = () => {
const updatedAlarmStatus = kueIso.map((_, index) => {
return (
(window.kueAlarm1 && window.kueAlarm1[index]) ||
(window.kueAlarm2 && window.kueAlarm2[index]) ||
(window.kueCableBreak && window.kueCableBreak[index]) ||
(window.kueGroundFault && window.kueGroundFault[index])
);
});
console.log("Aktualisierter alarmStatus:", updatedAlarmStatus);
setAlarmStatus(updatedAlarmStatus); // State für Alarmstatus aktualisieren
};
fetchData();
const interval = setInterval(fetchData, 5000); // alle 5 Sekunden
return () => clearInterval(interval);
}, []);
// Zuerst alle Werte der Arrays speichern
@@ -87,7 +109,68 @@ function Kabelueberwachung() {
document.body.removeChild(script);
};
}, []);
//----------------------------------------------
useEffect(() => {
const fetchData = () => {
const existingScript = document.querySelector(
"script[src*='kueData.js']"
);
// Stelle sicher, dass das Element existiert und ein Kind von `document.body` ist, bevor du es entfernst
if (existingScript && existingScript.parentNode === document.body) {
document.body.removeChild(existingScript);
}
// Füge das Skript erneut hinzu
const script = document.createElement("script");
script.src =
process.env.NODE_ENV === "production"
? "CPL?/CPL/SERVICE/kueData.js" // Produktionspfad
: "/CPLmockData/SERVICE/kueData.js"; // Entwicklungs-Pfad für Mock-Daten
script.async = true;
script.onload = () => {
// Aktualisiere die Variablen nach kurzer Verzögerung, um sicherzustellen, dass sie geladen sind
setTimeout(() => {
if (window.kueIso && Array.isArray(window.kueIso)) {
setKueIso(window.kueIso);
}
if (window.kueRes && Array.isArray(window.kueRes)) {
setSchleifenwiderstand(window.kueRes);
}
if (window.kueOnline && Array.isArray(window.kueOnline)) {
setKueOnline(window.kueOnline);
}
if (window.kueID && Array.isArray(window.kueID)) {
setKueID(window.kueID);
}
updateAlarmStatus(); // Aktualisiere den Alarmstatus
}, 500); // 500 ms Verzögerung, um sicherzustellen, dass die Daten geladen sind
};
document.body.appendChild(script);
};
const updateAlarmStatus = () => {
const updatedAlarmStatus = window.kueIso.map((_, index) => {
return (
(window.kueAlarm1 && window.kueAlarm1[index]) ||
(window.kueAlarm2 && window.kueAlarm2[index]) ||
(window.kueCableBreak && window.kueCableBreak[index]) ||
(window.kueGroundFault && window.kueGroundFault[index])
);
});
console.log("Aktualisierter alarmStatus:", updatedAlarmStatus);
setAlarmStatus(updatedAlarmStatus); // Setze den aktualisierten Alarmstatus
};
// Lade die Daten sofort und alle 5 Sekunden neu
fetchData();
const interval = setInterval(fetchData, 5000);
return () => clearInterval(interval); // Bereinige das Intervall beim Entladen der Komponente
}, []);
//----------------------------------------------
return (
<div className="bg-gray-100 flex-1 p-6 text-black">
<h1 className="text-2xl mb-4">Kabelüberwachung</h1>