fix: Beim Aufruf der TDR-Detailseite erscheint im Hintergrund auf der KÜ ein Schleifenwiderstand von 0 KOhm. In der Daten Javascriptdatei steht jedoch der richtige Wert.

fix: Beim Ausführen einer TDR-Messung (Klick auf blauen Button in der TDR-Detailseite) erscheint keine Rückmeldung. Dort müsste ein Hinweis erscheinen “TDR-Messung wird ausgeführt und kann bis zu zwei Minuten dauern”
2025-09-08 12:09:30 +02:00 · 2025-09-08 11:48:23 +02:00
10 changed files with 195 additions and 146 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.867
+NEXT_PUBLIC_APP_VERSION=1.6.869
 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.867
+NEXT_PUBLIC_APP_VERSION=1.6.869
 NEXT_PUBLIC_CPL_MODE=production
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,13 @@
+## [1.6.869] – 2025-09-08
+
+- fix: Beim Ausführen einer TDR-Messung (Klick auf blauen Button in der TDR-Detailseite) erscheint keine Rückmeldung. Dort müsste ein Hinweis erscheinen “TDR-Messung wird ausgeführt und kann bis zu zwei Minuten dauern”
+
+---
+## [1.6.868] – 2025-09-08
+
+- fix: Timer für jeder KÜ separate und nicht eine für alle, aktuell wird prozentzahl bei allen das gleiche angezeigt
+
+---
 ## [1.6.867] – 2025-09-08

 - WIP: Timer für jeder KÜ separate und nicht eine für alle, aktuell wird prozentzahl bei allen das gleiche angezeigt
--- a/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx
+++ b/components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx
@@ -389,7 +389,8 @@ const LoopChartActionBar = forwardRef((_props, ref) => {
          <div className="mb-4 text-center space-y-1">
            <p className="text-lg font-semibold">RSL Messung läuft</p>
            <p className="text-sm text-gray-700">
-              Bitte warten… (noch {TOTAL_DURATION - rslProgress}s)
+              Bitte warten…{" "}
+              {Math.min(100, Math.round((rslProgress / TOTAL_DURATION) * 100))}%
            </p>
          </div>
          <div className="w-2/3 max-w-xl h-4 bg-gray-200 rounded overflow-hidden shadow-inner">
--- a/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx
+++ b/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx
@@ -30,6 +30,36 @@ const TDRChartActionBar: React.FC = () => {
  const [selectedId, setSelectedId] = useState<number | null>(null);
  const currentChartData = selectedId !== null ? tdrDataById[selectedId] : [];

+  // ▶ Fortschrittsanzeige für laufende TDR-Messung (max. 120s bzw. konfigurierbar)
+  const TDR_TOTAL_DURATION = parseInt(
+    process.env.NEXT_PUBLIC_TDR_DURATION_SECONDS || "120",
+    10
+  );
+  const [tdrRunning, setTdrRunning] = useState(false);
+  const [tdrProgress, setTdrProgress] = useState(0); // Sekunden
+
+  useEffect(() => {
+    if (!tdrRunning) return;
+    setTdrProgress(0);
+    const startedAt = Date.now();
+    const interval = setInterval(() => {
+      const elapsed = Math.floor((Date.now() - startedAt) / 1000);
+      if (elapsed >= TDR_TOTAL_DURATION) {
+        setTdrProgress(TDR_TOTAL_DURATION);
+        setTdrRunning(false);
+        clearInterval(interval);
+      } else {
+        setTdrProgress(elapsed);
+      }
+    }, 1000);
+    return () => clearInterval(interval);
+  }, [tdrRunning, TDR_TOTAL_DURATION]);
+
+  const startTdrProgress = () => {
+    setTdrRunning(true);
+    setTdrProgress(0);
+  };
+
  // 📌 Referenz setzen (nutzt Slotnummer + 1 für die API)
  const handleSetReference = async () => {
    if (
@@ -94,15 +124,19 @@ const TDRChartActionBar: React.FC = () => {
    try {
      console.log("🚀 Starte TDR Messung für Slot:", selectedSlot);
      console.log("📡 CGI URL:", cgiUrl);
-
-      const response = await fetch(cgiUrl);
-
-      if (!response.ok) {
-        throw new Error(`CGI-Fehler: ${response.status}`);
+      const isDev = process.env.NEXT_PUBLIC_NODE_ENV === "development";
+      if (isDev) {
+        // Dev / Simulator: sofort starten & Progress anzeigen
+        await new Promise((r) => setTimeout(r, 150));
+        console.log("✅ [DEV] TDR Mock-Start ok für Slot", selectedSlot);
+        startTdrProgress();
+        return;
      }

+      const response = await fetch(cgiUrl);
+      if (!response.ok) throw new Error(`CGI-Fehler: ${response.status}`);
      console.log("✅ TDR Messung gestartet für Slot", selectedSlot);
-      //alert(`✅ TDR Messung für Slot ${selectedSlot + 1} gestartet`);
+      startTdrProgress();
    } catch (err) {
      console.error("❌ Fehler beim Starten der TDR Messung:", err);
      //alert("❌ Fehler beim Starten der TDR Messung.");
@@ -130,109 +164,139 @@ const TDRChartActionBar: React.FC = () => {
  }, [selectedSlot, dispatch]);

  return (
-    <div className="flex justify-between items-center p-2 bg-gray-100 rounded-lg space-x-4">
-      {/* 🧩 Slot-Anzeige (1-basiert für Benutzer) */}
-      <div className="text-sm font-semibold">
-        {selectedSlot !== null ? `KÜ ${selectedSlot + 1}` : "Kein KÜ gewählt"}
-      </div>
+    <>
+      <div className="flex justify-between items-center p-2 bg-gray-100 rounded-lg space-x-4">
+        {/* 🧩 Slot-Anzeige (1-basiert für Benutzer) */}
+        <div className="text-sm font-semibold">
+          {selectedSlot !== null ? `KÜ ${selectedSlot + 1}` : "Kein KÜ gewählt"}
+        </div>

-      {/* ✅ Referenz setzen */}
-      {selectedId !== null && (
+        {/* ✅ Referenz setzen */}
+        {selectedId !== null && (
+          <button
+            onClick={handleSetReference}
+            className="border border-littwin-blue text-littwin-blue bg-white rounded px-3 py-1 text-sm hover:bg-gray-200"
+          >
+            TDR-Kurve als Referenz speichern
+          </button>
+        )}
+
+        {/* 🚀 TDR starten */}
        <button
-          onClick={handleSetReference}
-          className="border border-littwin-blue text-littwin-blue bg-white rounded px-3 py-1 text-sm hover:bg-gray-200"
+          onClick={handleStartTDR}
+          className="px-4 py-1 bg-littwin-blue text-white rounded text-sm whitespace-nowrap "
+          disabled={selectedSlot === null || tdrRunning}
        >
-          TDR-Kurve als Referenz speichern
+          {tdrRunning
+            ? `TDR läuft... (${Math.min(
+                100,
+                Math.round((tdrProgress / TDR_TOTAL_DURATION) * 100)
+              )}%)`
+            : "TDR-Messung starten"}
        </button>
-      )}

-      {/* 🚀 TDR starten */}
-      <button
-        onClick={handleStartTDR}
-        className="px-4 py-1 bg-littwin-blue text-white rounded text-sm whitespace-nowrap "
-        disabled={selectedSlot === null}
-      >
-        TDR-Messung starten
-      </button>
-
-      {/* 🔽 Dropdown für Messungen */}
-      <div className="flex items-center space-x-2">
-        <Listbox
-          value={selectedId}
-          onChange={(id) => {
-            setSelectedId(id);
-            if (id !== null) {
-              dispatch(getTDRChartDataByIdThunk(id));
-            }
-          }}
-          disabled={idsForSlot.length === 0}
-        >
-          <div className="relative w-96">
-            <Listbox.Button className="w-full border px-2 py-1 rounded text-left bg-white flex justify-between items-center text-sm">
-              <span className="whitespace-nowrap overflow-hidden text-ellipsis">
-                {selectedId
-                  ? (() => {
-                      const selected = idsForSlot.find(
-                        (e) => e.id === selectedId
-                      );
-                      return selected
-                        ? `${new Date(selected.t).toLocaleString("de-DE", {
-                            day: "2-digit",
-                            month: "2-digit",
-                            year: "numeric",
-                            hour: "2-digit",
-                            minute: "2-digit",
-                            second: "2-digit",
-                          })} – Fehlerstelle: ${selected.d} m`
-                        : "Wähle Messung";
-                    })()
-                  : "Wähle Messung"}
-              </span>
-              <svg
-                className="w-5 h-5 text-gray-400"
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 20 20"
-                fill="currentColor"
-                aria-hidden="true"
-              >
-                <path
-                  fillRule="evenodd"
-                  d="M5.23 7.21a.75.75 0 011.06.02L10 10.585l3.71-3.355a.75.75 0 111.02 1.1l-4.25 3.85a.75.75 0 01-1.02 0l-4.25-3.85a.75.75 0 01.02-1.06z"
-                  clipRule="evenodd"
-                />
-              </svg>
-            </Listbox.Button>
-            <Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm">
-              {idsForSlot.map((entry) => (
-                <Listbox.Option
-                  key={entry.id}
-                  value={entry.id}
-                  className={({ selected, active }) =>
-                    `px-4 py-1 cursor-pointer whitespace-nowrap overflow-hidden text-ellipsis ${
-                      selected
-                        ? "bg-littwin-blue text-white"
-                        : active
-                        ? "bg-gray-200"
-                        : ""
-                    }`
-                  }
+        {/* 🔽 Dropdown für Messungen */}
+        <div className="flex items-center space-x-2">
+          <Listbox
+            value={selectedId}
+            onChange={(id) => {
+              setSelectedId(id);
+              if (id !== null) {
+                dispatch(getTDRChartDataByIdThunk(id));
+              }
+            }}
+            disabled={idsForSlot.length === 0}
+          >
+            <div className="relative w-96">
+              <Listbox.Button className="w-full border px-2 py-1 rounded text-left bg-white flex justify-between items-center text-sm">
+                <span className="whitespace-nowrap overflow-hidden text-ellipsis">
+                  {selectedId
+                    ? (() => {
+                        const selected = idsForSlot.find(
+                          (e) => e.id === selectedId
+                        );
+                        return selected
+                          ? `${new Date(selected.t).toLocaleString("de-DE", {
+                              day: "2-digit",
+                              month: "2-digit",
+                              year: "numeric",
+                              hour: "2-digit",
+                              minute: "2-digit",
+                              second: "2-digit",
+                            })} – Fehlerstelle: ${selected.d} m`
+                          : "Wähle Messung";
+                      })()
+                    : "Wähle Messung"}
+                </span>
+                <svg
+                  className="w-5 h-5 text-gray-400"
+                  xmlns="http://www.w3.org/2000/svg"
+                  viewBox="0 0 20 20"
+                  fill="currentColor"
+                  aria-hidden="true"
                >
-                  {new Date(entry.t).toLocaleString("de-DE", {
-                    day: "2-digit",
-                    month: "2-digit",
-                    year: "numeric",
-                    hour: "2-digit",
-                    minute: "2-digit",
-                    second: "2-digit",
-                  })}{" "}
-                  – Fehlerstelle: {entry.d} m
-                </Listbox.Option>
-              ))}
-            </Listbox.Options>
-          </div>
-        </Listbox>
+                  <path
+                    fillRule="evenodd"
+                    d="M5.23 7.21a.75.75 0 011.06.02L10 10.585l3.71-3.355a.75.75 0 111.02 1.1l-4.25 3.85a.75.75 0 01-1.02 0l-4.25-3.85a.75.75 0 01.02-1.06z"
+                    clipRule="evenodd"
+                  />
+                </svg>
+              </Listbox.Button>
+              <Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm">
+                {idsForSlot.map((entry) => (
+                  <Listbox.Option
+                    key={entry.id}
+                    value={entry.id}
+                    className={({ selected, active }) =>
+                      `px-4 py-1 cursor-pointer whitespace-nowrap overflow-hidden text-ellipsis ${
+                        selected
+                          ? "bg-littwin-blue text-white"
+                          : active
+                          ? "bg-gray-200"
+                          : ""
+                      }`
+                    }
+                  >
+                    {new Date(entry.t).toLocaleString("de-DE", {
+                      day: "2-digit",
+                      month: "2-digit",
+                      year: "numeric",
+                      hour: "2-digit",
+                      minute: "2-digit",
+                      second: "2-digit",
+                    })}{" "}
+                    – Fehlerstelle: {entry.d} m
+                  </Listbox.Option>
+                ))}
+              </Listbox.Options>
+            </div>
+          </Listbox>
+        </div>
      </div>
-    </div>
+      {tdrRunning && (
+        <div className="fixed inset-0 z-[1000] flex flex-col items-center justify-center bg-white/80 backdrop-blur-sm">
+          <div className="mb-4 text-center space-y-1">
+            <p className="text-lg font-semibold">TDR Messung läuft</p>
+            <p className="text-sm text-gray-700">
+              Bitte warten…{" "}
+              {Math.min(
+                100,
+                Math.round((tdrProgress / TDR_TOTAL_DURATION) * 100)
+              )}
+              %
+            </p>
+          </div>
+          <div className="w-2/3 max-w-xl h-4 bg-gray-200 rounded overflow-hidden shadow-inner">
+            <div
+              className="h-full bg-littwin-blue transition-all ease-linear"
+              style={{
+                width: `${(tdrProgress / TDR_TOTAL_DURATION) * 100}%`,
+              }}
+            />
+          </div>
+        </div>
+      )}
+    </>
  );
 };

--- a/components/main/kabelueberwachung/kue705FO/Kue705FO.tsx
+++ b/components/main/kabelueberwachung/kue705FO/Kue705FO.tsx
@@ -174,18 +174,6 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
  const openTdrModal = () => {
    setActiveButton("TDR");
    setloopTitleText("Entfernung [km]");
-
-    const latestTdrDistanceMeters =
-      Array.isArray(tdmChartData?.[slotIndex]) &&
-      tdmChartData[slotIndex].length > 0 &&
-      typeof tdmChartData[slotIndex][0].d === "number"
-        ? tdmChartData[slotIndex][0].d
-        : 0;
-
-    const latestTdrDistance = Number(
-      (latestTdrDistanceMeters / 1000).toFixed(3)
-    );
-    setLoopDisplayValue(latestTdrDistance);
    setShowTdrModal(true);
  };

@@ -272,30 +260,16 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
    return () => window.removeEventListener("resize", measure);
  }, [moduleName48, scrollFeatureEnabled]);
  //---------------------------------
-  const tdmChartData = useSelector(
-    (state: RootState) => state.tdmChartSlice.data
-  );
-  const latestTdrDistanceMeters =
-    Array.isArray(tdmChartData?.[slotIndex]) &&
-    tdmChartData[slotIndex].length > 0 &&
-    typeof tdmChartData[slotIndex][0].d === "number"
-      ? tdmChartData[slotIndex][0].d
-      : 0;
-
-  const latestTdrDistance = Number((latestTdrDistanceMeters / 1000).toFixed(3));
-  //setLoopDisplayValue(latestTdrDistance);
+  // TDR Distanz wird im Display nicht angezeigt – Daten für Modal werden separat geladen

  //---------------------------------

-  const loopValue =
-    activeButton === "TDR"
-      ? latestTdrDistance
-      : typeof schleifenwiderstand === "number"
+  const rslValue =
+    typeof schleifenwiderstand === "number"
      ? schleifenwiderstand
      : Number(schleifenwiderstand);
-
  const { loopDisplayValue, setLoopDisplayValue } = useLoopDisplay(
-    loopValue,
+    rslValue,
    activeButton
  );

@@ -409,7 +383,7 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
                        .toFixed(2)
                        .replace(".", ",")} MOhm`}
                </span>
-                {/* 3. Zeile: Schleifenwert, in Rot bei Schleifenfehler, sonst normal */}
+                {/* 3. Zeile: Schleifenwert (RSL) immer anzeigen, unabhängig von aktivem Button */}
                <span
                  className={`whitespace-nowrap block text-[0.65rem] font-semibold ${
                    Number(kueAlarm2?.[slotIndex]) === 1 ? "text-red-500" : ""
--- a/components/main/kabelueberwachung/kue705FO/hooks/useLoopDisplay.ts
+++ b/components/main/kabelueberwachung/kue705FO/hooks/useLoopDisplay.ts
@@ -1,19 +1,19 @@
 // components/main/kabelueberwachung/kue705FO/hooks/useLoopDisplay.ts
 import { useEffect, useState } from "react";

+// Keeps and updates the loop (RSL) display value only when "Schleife" active.
+// For ISO or TDR views we do not overwrite the displayed RSL value.
 const useLoopDisplay = (
-  schleifenwiderstand: number,
+  rslValue: number,
  activeButton: "Schleife" | "TDR" | "ISO"
 ) => {
-  const [loopDisplayValue, setLoopDisplayValue] =
-    useState<number>(schleifenwiderstand);
+  const [loopDisplayValue, setLoopDisplayValue] = useState<number>(rslValue);

  useEffect(() => {
    if (activeButton === "Schleife") {
-      setLoopDisplayValue(schleifenwiderstand);
+      setLoopDisplayValue(rslValue);
    }
-    // For ISO and TDR, the value is set manually via setLoopDisplayValue
-  }, [schleifenwiderstand, activeButton]);
+  }, [rslValue, activeButton]);

  return { loopDisplayValue, setLoopDisplayValue };
 };
--- a/mocks/device-cgi-simulator/SERVICE/kabelueberwachungMockData.js
+++ b/mocks/device-cgi-simulator/SERVICE/kabelueberwachungMockData.js
@@ -271,7 +271,7 @@ var tdrMeasurementEvent = [
 //Event Abgleich
 var comparisonEvent = [
  // renamed from alignmentEvent
-  1, 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, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  0, 0, 0, 0, 0, 0,
 ];
 // expose for browser simulation
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "cpl-v4",
-  "version": "1.6.867",
+  "version": "1.6.869",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "cpl-v4",
-      "version": "1.6.867",
+      "version": "1.6.869",
      "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.867",
+  "version": "1.6.869",
  "private": true,
  "scripts": {
    "dev": "next dev -p 3000",
Author	SHA1	Message	Date
ISA	a596422056	fix: Beim Aufruf der TDR-Detailseite erscheint im Hintergrund auf der KÜ ein Schleifenwiderstand von 0 KOhm. In der Daten Javascriptdatei steht jedoch der richtige Wert.	2025-09-08 12:09:30 +02:00
ISA	531fa93b70	fix: Beim Ausführen einer TDR-Messung (Klick auf blauen Button in der TDR-Detailseite) erscheint keine Rückmeldung. Dort müsste ein Hinweis erscheinen “TDR-Messung wird ausgeführt und kann bis zu zwei Minuten dauern”	2025-09-08 11:48:23 +02:00