feat:

Anzeige KÜ-Display: 1. Zeile Alarm: Isolationsfehler, Schleifenfehler, Aderbruch, Erdschluß, Messpannung: Immer in Rot; wenn kein Alarm, bleibt die Zeile leer 2. Zeile: Isowert: xx MOhm (großes M) in Rot, wenn Iso-Fehler ansteht Beispiel: ISO: 100 MOHm der beim Abliech: ISO: Abgleich 3. Zeile: Schleifenwert, xx kOhm (kleines k) in Rot, wenn Schleifenfehler ansteht Beispiel:: RSL: 1,7 kOhm oder wenn Schleifenmessung aktiv: RSL: Messung
2025-07-24 13:59:44 +02:00
parent c1f6c19fdf
commit e932bee120
10 changed files with 117 additions and 67 deletions
--- a/.env.development
+++ b/.env.development
@@ -6,6 +6,6 @@ NEXT_PUBLIC_USE_MOCK_BACKEND_LOOP_START=false
 NEXT_PUBLIC_EXPORT_STATIC=false
 NEXT_PUBLIC_USE_CGI=false
 # App-Versionsnummer
-NEXT_PUBLIC_APP_VERSION=1.6.644
+NEXT_PUBLIC_APP_VERSION=1.6.645
 NEXT_PUBLIC_CPL_MODE=json   # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)

--- a/.env.production
+++ b/.env.production
@@ -5,5 +5,5 @@ NEXT_PUBLIC_CPL_API_PATH=/CPL
 NEXT_PUBLIC_EXPORT_STATIC=true
 NEXT_PUBLIC_USE_CGI=true
 # App-Versionsnummer
-NEXT_PUBLIC_APP_VERSION=1.6.644
+NEXT_PUBLIC_APP_VERSION=1.6.645
 NEXT_PUBLIC_CPL_MODE=production
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## [1.6.645] – 2025-07-24
+
+- Feat: Fenster nicht schließen für Firmware Update
+
+---
 ## [1.6.644] – 2025-07-24

 - Firmware Update Bestätigung in Littwin blau
--- a/components/main/kabelueberwachung/kue705FO/Kue705FO.tsx
+++ b/components/main/kabelueberwachung/kue705FO/Kue705FO.tsx
@@ -220,67 +220,53 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
              </div>
            </div>

-            {/* Anzeige des Isolation und Schleifenwiderstand zusammen */}
-            <div className="relative mt-[3.125rem] mx-auto bg-black text-white w-[6.25rem] h-[3.1rem] flex flex-col items-center justify-center z-10 p-1">
-              <div className="text-center w-full">
+            {/* Schwarzes Display mit drei Zeilen: Alarm, ISO, Schleife */}
+            <div className="relative mt-[3.125rem] mx-auto bg-black text-white w-[6.8rem] h-[3.1rem] flex flex-col items-center justify-center z-10 p-1">
+              <div className="text-center w-full flex flex-col justify-center items-center h-full">
+                {/* 1. Zeile: Alarmtext in Rot, sonst leer */}
                <span
-                  className={
+                  className={`whitespace-nowrap block text-[0.65rem] font-semibold ${
                    Number(kuePSTmMinus96V?.[slotIndex]) === 1 ||
                    Number(kueCableBreak?.[slotIndex]) === 1 ||
                    Number(kueGroundFault?.[slotIndex]) === 1 ||
                    Number(kueAlarm1?.[slotIndex]) === 1 ||
                    Number(kueAlarm2?.[slotIndex]) === 1
-                      ? "text-red-500 text-[0.65rem]"
-                      : Number(kueOverflow?.[slotIndex]) === 1
-                      ? "text-white text-[0.65rem]"
+                      ? "text-red-500"
                      : ""
-                  }
+                  }`}
                >
-                  {Number(kuePSTmMinus96V?.[slotIndex]) === 1 ? (
-                    "PST Fehler"
-                  ) : Number(kueCableBreak?.[slotIndex]) === 1 ? (
-                    "Aderbruch"
-                  ) : Number(kueGroundFault?.[slotIndex]) === 1 ? (
-                    "Erdschluss"
-                  ) : Number(kueAlarm1?.[slotIndex]) === 1 ? (
-                    <div>
-                      <span className="text-[0.55rem] block">
-                        Isolationsfehler
-                      </span>
-                      <span className="text-[0.55rem] block">
-                        {isoDisplayValue} MOhm
-                      </span>
-                    </div>
-                  ) : Number(kueAlarm2?.[slotIndex]) === 1 ? (
-                    "Schleifenfehler"
-                  ) : (
-                    <>
-                      <span className="block text-[0.7rem] font-semibold">
-                        <span className="block text-[0.6rem] text-gray-300">
-                          ISO: {"   "}
-                          {isoDisplayValue} MOhm
-                        </span>
-                      </span>
-                    </>
-                  )}
+                  {Number(kuePSTmMinus96V?.[slotIndex]) === 1
+                    ? "Messpannung"
+                    : Number(kueCableBreak?.[slotIndex]) === 1
+                    ? "Aderbruch"
+                    : Number(kueGroundFault?.[slotIndex]) === 1
+                    ? "Erdschluss"
+                    : Number(kueAlarm1?.[slotIndex]) === 1
+                    ? "Isolationsfehler"
+                    : Number(kueAlarm2?.[slotIndex]) === 1
+                    ? "Schleifenfehler"
+                    : ""}
+                </span>
+                {/* 2. Zeile: ISO-Wert, immer anzeigen */}
+                <span
+                  className={`whitespace-nowrap block text-[0.65rem] font-semibold ${
+                    Number(kueAlarm1?.[slotIndex]) === 1 ? "text-red-500" : ""
+                  }`}
+                >
+                  {isoDisplayValue === "Abgleich"
+                    ? "ISO: Abgleich"
+                    : `ISO: ${Number(isolationswert)} MOhm`}
+                </span>
+                {/* 3. Zeile: Schleifenwert, in Rot bei Schleifenfehler, sonst normal */}
+                <span
+                  className={`whitespace-nowrap block text-[0.65rem] font-semibold ${
+                    Number(kueAlarm2?.[slotIndex]) === 1 ? "text-red-500" : ""
+                  }`}
+                >
+                  {activeButton === "Schleife" && loading
+                    ? "RSL: Messung"
+                    : `RSL: ${loopDisplayValue} kOhm`}
                </span>
-                {/* Schleifenwiderstand immer anzeigen, außer bei Fehlern */}
-                {![
-                  Number(kuePSTmMinus96V?.[slotIndex]),
-                  Number(kueCableBreak?.[slotIndex]),
-                  Number(kueGroundFault?.[slotIndex]),
-                  Number(kueAlarm1?.[slotIndex]),
-                  Number(kueAlarm2?.[slotIndex]),
-                ].includes(1) && (
-                  <>
-                    <span className="block text-[0.7rem] mt-1 font-semibold">
-                      <span className="block text-[0.6rem] text-gray-300">
-                        Sch.: {"   "}
-                        {loopDisplayValue} kOhm
-                      </span>
-                    </span>
-                  </>
-                )}
              </div>
            </div>

--- a/components/main/system/DetailModal.tsx
+++ b/components/main/system/DetailModal.tsx
@@ -126,6 +126,7 @@ export const DetailModal = ({
  const [chartData, setChartData] = useState<any>({
    datasets: [],
  });
+  const [isLoading, setIsLoading] = useState(false);
  const vonDatum = useSelector(
    (state: RootState) => state.kabelueberwachungChartSlice.vonDatum
  );
@@ -186,6 +187,7 @@ export const DetailModal = ({
  }, []);

  const handleFetchData = () => {
+    setIsLoading(true);
    let sortedData = [...reduxData].reverse();

    if (vonDatum && bisDatum) {
@@ -254,10 +256,31 @@ export const DetailModal = ({
    }
  }, [isOpen, selectedKey]);

+  // Chart.js animation complete callback to set isLoading false
+  useEffect(() => {
+    if (chartRef.current && isLoading) {
+      const chartInstance = chartRef.current;
+      // Save previous callback to restore later
+      const prevCallback = chartInstance.options.animation?.onComplete;
+      chartInstance.options.animation = {
+        ...chartInstance.options.animation,
+        onComplete: () => {
+          setIsLoading(false);
+          if (typeof prevCallback === "function") prevCallback();
+        },
+      };
+      chartInstance.update();
+    }
+  }, [chartData, isLoading]);
+
  if (!isOpen || !selectedKey) return null;

  return (
-    <div className="fixed inset-0 bg-black bg-opacity-40 flex items-center justify-center z-50">
+    <div
+      className={`fixed inset-0 bg-black bg-opacity-40 flex items-center justify-center z-50 ${
+        isLoading ? "cursor-wait" : ""
+      }`}
+    >
      <div
        className={`bg-white p-6 rounded-xl overflow-auto shadow-2xl transition-all duration-300 ${
          isFullScreen ? "w-[95vw] h-[90vh]" : "w-[50%] h-[60%]"
@@ -347,9 +370,12 @@ export const DetailModal = ({
          </Listbox>
          <button
            onClick={handleFetchData}
-            className="px-4 py-1 bg-littwin-blue text-white rounded text-sm"
+            className={`px-4 py-1 bg-littwin-blue text-white rounded text-sm ${
+              isLoading ? "cursor-wait" : ""
+            }`}
+            disabled={isLoading}
          >
-            Daten laden
+            {isLoading ? "Laden..." : "Daten laden"}
          </button>
        </div>

--- a/components/main/system/SystemCharts.tsx
+++ b/components/main/system/SystemCharts.tsx
@@ -38,6 +38,7 @@ type Props = {
  zeitraum: "DIA0" | "DIA1" | "DIA2";
 };
 export const SystemCharts = ({ history }: Props) => {
+  const [isLoading, setIsLoading] = React.useState(true);
  const reversedHistory = [...history].reverse();
  const labels = reversedHistory.map((h) =>
    new Date(h.time).toLocaleTimeString()
@@ -45,9 +46,21 @@ export const SystemCharts = ({ history }: Props) => {

  const formatValue = (v: number) => v.toFixed(2);

+  // Chart.js animation callback
+  const animation = {
+    onComplete: () => {
+      setIsLoading(false);
+    },
+  };
+
+  React.useEffect(() => {
+    setIsLoading(true);
+  }, [history]);
+
  const baseOptions = {
    responsive: true,
    maintainAspectRatio: false,
+    animation,
    scales: {
      y: {
        beginAtZero: false,
@@ -65,7 +78,11 @@ export const SystemCharts = ({ history }: Props) => {
  };

  return (
-    <div className="grid grid-cols-1 xl:grid-cols-2 gap-8">
+    <div
+      className={`grid grid-cols-1 xl:grid-cols-2 gap-8 ${
+        isLoading ? "cursor-wait" : ""
+      }`}
+    >
      <div className="h-[300px]">
        <Line
          data={{
--- a/docs/TODO.md
+++ b/docs/TODO.md
@@ -41,3 +41,19 @@
 - [x] TODO: KÜ Firmware in progress Bitte Fenster nicht schließen
 - [ ] TODO: KÜ Kurve und letzte historische Meldungen anzeigen -> später
 - [ ] TODO: KVz später
+
+Anzeige KÜ-Display:
+
+1. Zeile Alarm: Isolationsfehler, Schleifenfehler, Aderbruch, Erdschluß, Messpannung: Immer in Rot; wenn kein Alarm, bleibt die Zeile leer
+
+2. Zeile: Isowert: xx MOhm (großes M)
+
+in Rot, wenn Iso-Fehler ansteht
+
+Beispiel: ISO: 100 MOHm der beim Abliech: ISO: Abgleich
+
+3. Zeile: Schleifenwert, xx kOhm (kleines k)
+
+in Rot, wenn Schleifenfehler ansteht
+
+Beispiel:: RSL: 1,7 kOhm oder wenn Schleifenmessung aktiv: RSL: Messung
--- a/mocks/device-cgi-simulator/SERVICE/kabelueberwachungMockData.js
+++ b/mocks/device-cgi-simulator/SERVICE/kabelueberwachungMockData.js
@@ -15,8 +15,8 @@ var win_kuePSTmMinus96V = [
 ];
 //Aderbruch 1 = Fehler, 0 = kein Fehler
 var win_kueCableBreak = [
-  1, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
-  0, 0, 1, 1, 1, 1,
+  0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
+  0, 0, 1, 1, 1, 0,
 ];
 //Erdschluss 1 = Fehler, 0 = kein Fehler
 var win_kueGroundFault = [
@@ -25,12 +25,12 @@ var win_kueGroundFault = [
 ];
 //Isolationsfehler 1 = Fehler, 0 = kein Fehler, Alarm kommt wenn kueIso  < kueLimit1
 var win_kueAlarm1 = [
-  1, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1, 0, 1,
+  0, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1, 0, 1,
  0, 0, 0, 0, 0, 0,
 ];
 //Schleifenfehler 1 = Fehler, 0 = kein Fehler
 var win_kueAlarm2 = [
-  1, 0, 0, 0, 0, 0, 1, 1, 0, 1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0,
+  0, 0, 0, 0, 0, 0, 1, 1, 0, 1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0,
  0, 0, 0, 0, 0, 0,
 ];
 //Überlauf 1 = Fehler, 0 = kein Fehler , hier wird in Display ">200 MOhm" angezeigt
@@ -62,9 +62,9 @@ die Filterzeit startet beim nächsten Unterschreiten des Grenzwerts neu. Die Fil
 kurzfristige Schwankungen oder Störungen fälschlicherweise als Fehler gemeldet werden.
 */
 var win_kueDelay1 = [
-  3, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420,
  420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420,
-  420,
+  420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420, 420,
+  420, 420,
 ];
 //---------------------------------------------------
 //Schleifenwiderstand in Display (resDisplay) Einheit: KOhm
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "cpl-v4",
-  "version": "1.6.644",
+  "version": "1.6.645",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "cpl-v4",
-      "version": "1.6.644",
+      "version": "1.6.645",
      "dependencies": {
        "@fontsource/roboto": "^5.1.0",
        "@headlessui/react": "^2.2.4",
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "cpl-v4",
-  "version": "1.6.644",
+  "version": "1.6.645",
  "private": true,
  "scripts": {
    "dev": "next dev",