loop DatePicke

.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.695
+NEXT_PUBLIC_APP_VERSION=1.6.696
 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.695
+NEXT_PUBLIC_APP_VERSION=1.6.696
 NEXT_PUBLIC_CPL_MODE=production

CHANGELOG.md

@@ -1,3 +1,8 @@
+## [1.6.696] – 2025-08-12
+
+- feat(iso): DateRangePicker-Zeitraum bei "Daten laden" anwenden und fix debug für build
+
+---
 ## [1.6.695] – 2025-08-12
 
 - feat(iso): DateRangePicker-Zeitraum bei "Daten laden" anwenden

components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx

@@ -1,9 +1,11 @@
 "use client";
 // /components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx
 import React, { useEffect, useState } from "react";
+import { useAppDispatch } from "@/redux/store";
+import { getMessagesThunk } from "@/redux/thunks/getMessagesThunk";
 import { RSL_DURATION_SECONDS, NODE_ENV } from "@/utils/env";
 import DateRangePicker from "@/components/common/DateRangePicker";
-import { useDispatch, useSelector } from "react-redux";
+import { useSelector } from "react-redux";
 import { RootState } from "@/redux/store";
 import {
   setLoopMeasurementCurveChartData,
@@ -16,7 +18,7 @@ import { Listbox } from "@headlessui/react";
 
 //-----------------------------------------------------------------------------------useLoopChartLoader
 export const useLoopChartLoader = () => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { vonDatum, bisDatum, selectedMode, selectedSlotType, slotNumber } =
     useSelector((state: RootState) => state.kabelueberwachungChartSlice);
   const hasShownNoDataAlert = React.useRef(false);
@@ -93,7 +95,7 @@ export const useLoopChartLoader = () => {
 
 //-----------------------------------------------------------------------------------LoopChartActionBar
 const LoopChartActionBar: React.FC = () => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   // RSL Progress State – Dauer konfigurierbar über NEXT_PUBLIC_RSL_DURATION_SECONDS
   const TOTAL_DURATION = RSL_DURATION_SECONDS;
   const [rslRunning, setRslRunning] = useState(false);
@@ -133,20 +135,26 @@ const LoopChartActionBar: React.FC = () => {
   } = useSelector((state: RootState) => state.kabelueberwachungChartSlice);
 
   const { chartTitle } = useSelector((state: RootState) => state.loopChartType);
+  // Vom DateRangePicker-Slice (vom UI gewählte Werte)
+  const { vonDatum: pickerVonDatum, bisDatum: pickerBisDatum } = useSelector(
+    (state: RootState) => state.dateRangePicker
+  );
 
   const getApiUrl = (
     mode: "DIA0" | "DIA1" | "DIA2",
     type: number,
-    slotNumber: number
+    slotNumber: number,
+    fromDate: string,
+    toDate: string
   ) => {
     const typeFolder = "schleifenwiderstand";
 
     const baseUrl =
       process.env.NODE_ENV === "development"
-        ? `/api/cpl/slotDataAPIHandler?slot=${slotNumber}&messart=${typeFolder}&dia=${mode}&vonDatum=${vonDatum}&bisDatum=${bisDatum}`
+        ? `/api/cpl/slotDataAPIHandler?slot=${slotNumber}&messart=${typeFolder}&dia=${mode}&vonDatum=${fromDate}&bisDatum=${toDate}`
         : `${window.location.origin}/CPL?seite.ACP&${mode}=${formatDate(
-            vonDatum
+            fromDate
-          )};${formatDate(bisDatum)};${slotNumber};${type};`;
+          )};${formatDate(toDate)};${slotNumber};${type};`;
     console.log("baseUrl", baseUrl);
 
     return baseUrl;
@@ -195,7 +203,26 @@ const LoopChartActionBar: React.FC = () => {
       return;
     }
 
-    const apiUrl = getApiUrl(selectedMode, type, slotNumber);
+    // Meldungen laden, wenn Meldungen-Ansicht aktiv ist
+    if (chartTitle === "Meldungen") {
+      try {
+        dispatch(setLoading(true));
+        const fromDate = pickerVonDatum ?? vonDatum;
+        const toDate = pickerBisDatum ?? bisDatum;
+        await dispatch(getMessagesThunk({ fromDate, toDate })).unwrap();
+      } catch (err) {
+        const message = err instanceof Error ? err.message : String(err);
+        console.error("❌ Fehler beim Laden der Meldungen:", message);
+        alert("❌ Fehler beim Laden der Meldungen.");
+      } finally {
+        dispatch(setLoading(false));
+      }
+      return;
+    }
+
+    const fromDate = pickerVonDatum ?? vonDatum;
+    const toDate = pickerBisDatum ?? bisDatum;
+    const apiUrl = getApiUrl(selectedMode, type, slotNumber, fromDate, toDate);
     if (!apiUrl) return;
 
     dispatch(setLoading(true));
@@ -222,8 +249,8 @@ const LoopChartActionBar: React.FC = () => {
       console.log("  Slot:", slotNumber);
       console.log("  Typ:", selectedSlotType, "→", type);
       console.log("  Modus:", selectedMode);
-      console.log("  Von:", vonDatum);
+      console.log("  Von:", fromDate);
-      console.log("  Bis:", bisDatum);
+      console.log("  Bis:", toDate);
       console.log("  URL:", apiUrl);
       console.log("  Daten:", jsonData);
 
@@ -254,12 +281,8 @@ const LoopChartActionBar: React.FC = () => {
       </div>
 
       <div className="flex items-center space-x-2">
-        {/* DateRangePicker – wie bei ISO nur sichtbar bei Messkurve */}
+        {/* DateRangePicker – für beide Ansichten sichtbar */}
-        <div
+        <div>
-          style={{
-            visibility: chartTitle === "Messkurve" ? "visible" : "hidden",
-          }}
-        >
           <DateRangePicker compact />
         </div>
 

components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartView.tsx

@@ -238,7 +238,7 @@ const LoopChartView: React.FC<LoopChartViewProps> = ({
           {chartTitle === "Messkurve" ? (
             <LoopMeasurementChart />
           ) : (
-            <Report moduleType="RSL" />
+            <Report moduleType="RSL" autoLoad={false} />
           )}
         </div>
       </div>

mocks/scripts/fetchSystemData.mjs

@@ -66,6 +66,7 @@ function getSystemUrl(dia, input) {
   const { vonJahr, vonMonat, vonTag, bisJahr, bisMonat, bisTag } =
     getDateParts();
   return `${CPL_HOST}/CPL?seite.ACP&${dia}=${vonJahr};${vonMonat};${vonTag};${bisJahr};${bisMonat};${bisTag};${input};1;`;
+  // https://10.10.0.118/CPL?seite.ACP&DIA1=2025;07;13;2025;08;12;0;3;
 }
 
 // URL für analoge Eingänge generieren

package-lock.json

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

package.json

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