docs: Kabelüberwachung Overlay für Events (Abgleich, TDR und RSL) Messung

.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.712
+NEXT_PUBLIC_APP_VERSION=1.6.713
 NEXT_PUBLIC_CPL_MODE=json   # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)
 

.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.712
+NEXT_PUBLIC_APP_VERSION=1.6.713
 NEXT_PUBLIC_CPL_MODE=production

CHANGELOG.md

@@ -1,3 +1,8 @@
+## [1.6.713] – 2025-08-13
+
+- feat: Overlay nicht über die Seite sondern nur über den KÜ Slot wenn ein Event kommt
+
+---
 ## [1.6.712] – 2025-08-13
 
 - doc in TODO

docs/kabelueberwachung.md

@@ -80,6 +80,25 @@ Jeder Slot zeigt über zwei LEDs den Betriebs- und Alarmstatus an:
 
 ---
 
+## ⏳ Messung läuft: Per-Slot Overlay (Schleife, ISO-Abgleich, TDR)
+
+Während aktive Messungen laufen, wird der betroffene Slot gezielt blockiert, ohne die gesamte Seite zu sperren. So können andere Module weiterhin bedient werden.
+
+- Per-Slot Overlay erscheint nur auf dem betroffenen Modul auf der Seite „Kabelüberwachung“.
+- Das Overlay zeigt für jede aktive Messart eine Fortschrittsleiste mit Prozentanzeige (ohne Restzeit):
+  - Schleifenmessung (RSL, KSX) ≈ 2 Minuten
+  - TDR-Messung (KSY) ≈ 30 Sekunden
+  - ISO-Abgleich (KSZ) ≈ 10 Minuten
+- Die Anzeige aktualisiert sich ca. jede Sekunde.
+- Bei mehreren gleichzeitig aktiven Messarten werden mehrere Balken untereinander gezeigt.
+
+Hinweise:
+
+- Auf anderen Seiten (z. B. System) erscheint statt des per-Slot Overlays ein globales Overlay über die gesamte Anwendung. Auf der Seite „Kabelüberwachung“ ist dieses globale Overlay deaktiviert, damit die Bedienung der übrigen Slots möglich bleibt.
+- Die Aktivitätsinformationen stammen vom Gerät (KSX/KSY/KSZ Ereignis-Arrays je 32 Slots) und werden zyklisch eingelesen.
+
+---
+
 ## 🔄 Messungssteuerung (manuell)
 
 Im unteren Bereich jedes Slots befindet sich ein **Kreispfeil-Icon** 🔄 (Reload-Symbol):

mocks/device-cgi-simulator/SERVICE/kabelueberwachungMockData.js

@@ -260,16 +260,16 @@ var win_fallSensors = [
 
 // Event Schleifenmessung KSX
 var loopMeasurementEvent = [
-  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, 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,
 ];
 //Event TDR-Messung
 var tdrMeasurementEvent = [
-  1, 0, 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, 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,
 ];
 //Event Abgleich
 var 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,
 ];

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.712",
+  "version": "1.6.713",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "cpl-v4",
-      "version": "1.6.712",
+      "version": "1.6.713",
       "dependencies": {
         "@fontsource/roboto": "^5.1.0",
         "@headlessui/react": "^2.2.4",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.712",
+  "version": "1.6.713",
   "private": true,
   "scripts": {
     "dev": "next dev",

tests/kabelueberwachung-overlays.spec.ts

@@ -0,0 +1,94 @@
+import { test, expect, Page, Locator } from "@playwright/test";
+
+// Helpers
+function cardByCableName(page: Page, name: string): Locator {
+  // Find a module card that contains the visible cable name text
+  return page.locator("div.relative.bg-gray-300", { hasText: name }).first();
+}
+
+function slotOverlayIn(card: Locator): Locator {
+  // Slot overlay is the only element with absolute inset-0 inside the card
+  return card.locator("div.absolute.inset-0");
+}
+
+async function setDeviceEvents(
+  page: Page,
+  { ksx, ksy, ksz }: { ksx?: number[]; ksy?: number[]; ksz?: number[] }
+) {
+  await page.evaluate(
+    ({ ksx, ksy, ksz }) => {
+      interface W {
+        loopMeasurementEvent?: number[];
+        tdrMeasurementEvent?: number[];
+        alignmentEvent?: number[];
+      }
+      const w = window as unknown as W;
+      if (ksx) w.loopMeasurementEvent = ksx;
+      if (ksy) w.tdrMeasurementEvent = ksy;
+      if (ksz) w.alignmentEvent = ksz;
+    },
+    { ksx, ksy, ksz }
+  );
+}
+
+// Notes:
+// - On /kabelueberwachung, the global overlay is hidden and each module shows its own overlay when active.
+// - DeviceEventsBridge polls the window arrays every 2 seconds.
+// - Dev mode serves /api/cpl/kabelueberwachungAPIHandler which initializes those arrays from mocks.
+
+test.describe("Kabelüberwachung per-slot overlays", () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto("http://localhost:3000/kabelueberwachung");
+    // Ensure page has rendered modules
+    await expect(page.getByText("Rack 1")).toBeVisible();
+    // Wait a moment for initial device arrays and first poll
+    await page.waitForTimeout(2500);
+  });
+
+  test("only active slot is blocked; others remain usable", async ({
+    page,
+  }) => {
+    const card1 = cardByCableName(page, "Kabel 1"); // slot 1 (index 0) has events in mock
+    const card2 = cardByCableName(page, "Kabel 2"); // slot 2 (index 1) is inactive in mock
+
+    // 1) Initial: overlay visible on Kabel 1, not on Kabel 2
+    await expect(slotOverlayIn(card1)).toBeVisible();
+    await expect(slotOverlayIn(card2)).toHaveCount(0);
+
+    // 2) Interact with Kabel 2 while Kabel 1 is blocked
+    await expect(card2.getByRole("button", { name: "ISO" })).toBeVisible();
+    await card2.getByRole("button", { name: "ISO" }).click();
+
+    // ISO modal should open
+    await expect(page.getByText("Isolationswiderstand")).toBeVisible();
+
+    // Close modal with Escape
+    await page.keyboard.press("Escape");
+    await expect(page.getByText("Isolationswiderstand")).toHaveCount(0);
+
+    // 3) Dynamically switch overlay from Kabel 1 to Kabel 2
+    const zero = new Array(32).fill(0);
+    const ksx = zero.slice();
+    ksx[1] = 1; // activate Schleife for slot 2
+    await setDeviceEvents(page, { ksx });
+
+    // Wait for bridge poll and UI update
+    await page.waitForTimeout(2500);
+
+    await expect(slotOverlayIn(card1)).toHaveCount(0);
+    await expect(slotOverlayIn(card2)).toBeVisible();
+
+    // Percentage text should show in the overlay (e.g., "12%")
+    await expect(slotOverlayIn(card2).getByText(/%$/)).toBeVisible();
+  });
+
+  test("global overlay is not shown on kabelueberwachung page", async ({
+    page,
+  }) => {
+    // A full-screen overlay would be fixed inset-0 at document level; ensure none
+    const globalOverlay = page.locator(
+      'div.fixed.inset-0:has-text("Bitte warten…")'
+    );
+    await expect(globalOverlay).toHaveCount(0);
+  });
+});