feat(analogInputs): automatisches Laden der Chart-Daten bei Tabellenklick via Redux

- analogInputsHistorySlice um `autoLoad` erweitert, um automatisches Laden zu triggern
- handleSelect in AnalogInputsTable dispatcht jetzt `setAutoLoad(true)`
- AnalogInputsChart lauscht auf `autoLoad` + `selectedId` und lädt Daten automatisch
- `autoLoad` wird nach dem Laden wieder auf false zurückgesetzt

.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.586
+NEXT_PUBLIC_APP_VERSION=1.6.602
 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.586
+NEXT_PUBLIC_APP_VERSION=1.6.602
 NEXT_PUBLIC_CPL_MODE=production

CHANGELOG.md

@@ -1,3 +1,144 @@
+## [1.6.602] – 2025-07-15
+
+- feat(analogInputs): automatisches Laden der Chart-Daten bei Tabellenklick via Redux
+
+- analogInputsHistorySlice um `autoLoad` erweitert, um automatisches Laden zu triggern
+- handleSelect in AnalogInputsTable dispatcht jetzt `setAutoLoad(true)`
+- AnalogInputsChart lauscht auf `autoLoad` + `selectedId` und lädt Daten automatisch
+- `autoLoad` wird nach dem Laden wieder auf false zurückgesetzt
+
+---
+## [1.6.601] – 2025-07-15
+
+- uninstall redux-persist, weil nimmt viel Performance weg
+
+---
+## [1.6.600] – 2025-07-15
+
+- uninstall redux-persist, weil nimmt viel Performance weg
+
+---
+## [1.6.599] – 2025-07-14
+
+- feat: AnalogInputsChart mit DateRangePicker und vollständiger Redux-Integration erweitert
+
+- analogInputsHistorySlice angepasst: zeitraum, vonDatum, bisDatum und data hinzugefügt
+- Typdefinitionen im Slice und Thunk korrigiert
+- getAnalogInputsHistoryThunk erweitert, um vonDatum und bisDatum zu akzeptieren
+- DateRangePicker korrekt in AnalogInputsChart.tsx integriert
+- Fehler bei Selector-Zugriffen und Dispatch behoben
+
+---
+## [1.6.598] – 2025-07-11
+
+- feat: AnalogInputsChart mit DateRangePicker und vollständiger Redux-Integration erweitert
+
+- analogInputsHistorySlice angepasst: zeitraum, vonDatum, bisDatum und data hinzugefügt
+- Typdefinitionen im Slice und Thunk korrigiert
+- getAnalogInputsHistoryThunk erweitert, um vonDatum und bisDatum zu akzeptieren
+- DateRangePicker korrekt in AnalogInputsChart.tsx integriert
+- Fehler bei Selector-Zugriffen und Dispatch behoben
+
+---
+## [1.6.597] – 2025-07-11
+
+- feat(api): Zeitraum und Eingang als Pflichtparameter für AnalogInputs-API eingeführt
+
+- API-Handler für /api/cpl/getAnalogInputsHistory überarbeitet
+- `zeitraum` (DIA0, DIA1, DIA2) und `eingang` (1–8) sind jetzt Pflichtfelder
+- Bei fehlenden oder ungültigen Parametern strukturierte Fehlerantwort mit Beispielen
+- Daten werden nun gezielt pro Eingang und Zeitraum geladen (z. B. AE3 + DIA1)
+- Bessere Fehlerbehandlung bei nicht vorhandenen Dateien
+
+---
+## [1.6.596] – 2025-07-11
+
+- feat(api): Zeitraum und Eingang als Pflichtparameter für AnalogInputs-API eingeführt
+
+- API-Handler für /api/cpl/getAnalogInputsHistory überarbeitet
+- `zeitraum` (DIA0, DIA1, DIA2) und `eingang` (1–8) sind jetzt Pflichtfelder
+- Bei fehlenden oder ungültigen Parametern strukturierte Fehlerantwort mit Beispielen
+- Daten werden nun gezielt pro Eingang und Zeitraum geladen (z. B. AE3 + DIA1)
+- Bessere Fehlerbehandlung bei nicht vorhandenen Dateien
+
+---
+## [1.6.595] – 2025-07-11
+
+- feat(api): Zeitraum und Eingang als Pflichtparameter für AnalogInputs-API eingeführt
+
+- API-Handler für /api/cpl/getAnalogInputsHistory überarbeitet
+- `zeitraum` (DIA0, DIA1, DIA2) und `eingang` (1–8) sind jetzt Pflichtfelder
+- Bei fehlenden oder ungültigen Parametern strukturierte Fehlerantwort mit Beispielen
+- Daten werden nun gezielt pro Eingang und Zeitraum geladen (z. B. AE3 + DIA1)
+- Bessere Fehlerbehandlung bei nicht vorhandenen Dateien
+
+---
+## [1.6.594] – 2025-07-11
+
+- feat(api): Zeitraum und Eingang als Pflichtparameter für AnalogInputs-API eingeführt
+
+- API-Handler für /api/cpl/getAnalogInputsHistory überarbeitet
+- `zeitraum` (DIA0, DIA1, DIA2) und `eingang` (1–8) sind jetzt Pflichtfelder
+- Bei fehlenden oder ungültigen Parametern strukturierte Fehlerantwort mit Beispielen
+- Daten werden nun gezielt pro Eingang und Zeitraum geladen (z. B. AE3 + DIA1)
+- Bessere Fehlerbehandlung bei nicht vorhandenen Dateien
+
+---
+## [1.6.593] – 2025-07-11
+
+- fix: Von/Bis-Datum beim Schließen des DetailModals zurücksetzen
+
+- Redux-State für vonDatum und bisDatum wird bei handleClose geleert
+- verhindert unerwünschtes Vorfiltern bei erneutem Öffnen des Modals
+
+---
+## [1.6.592] – 2025-07-11
+
+- fix: Von/Bis-Datum beim Schließen des DetailModals zurücksetzen
+
+- Redux-State für vonDatum und bisDatum wird bei handleClose geleert
+- verhindert unerwünschtes Vorfiltern bei erneutem Öffnen des Modals
+
+---
+## [1.6.591] – 2025-07-11
+
+- fix: Von/Bis-Datum beim Schließen des DetailModals zurücksetzen
+
+- Redux-State für vonDatum und bisDatum wird bei handleClose geleert
+- verhindert unerwünschtes Vorfiltern bei erneutem Öffnen des Modals
+
+---
+## [1.6.590] – 2025-07-11
+
+- fix: Von/Bis-Datum beim Schließen des DetailModals zurücksetzen
+
+- Redux-State für vonDatum und bisDatum wird bei handleClose geleert
+- verhindert unerwünschtes Vorfiltern bei erneutem Öffnen des Modals
+
+---
+## [1.6.589] – 2025-07-11
+
+- feat: Zeitspanne-Funktion mit Von/Bis und Button-Trigger im DetailModal eingebaut
+
+- Chart-Daten werden jetzt erst bei Klick auf „Daten laden“ geladen
+- Von/Bis-Zeitauswahl über Redux-State korrekt eingebunden
+- Styling der Eingabefelder und Dropdowns vereinheitlicht (eine Zeile)
+- Lokalen State für Zeitspanne entfernt und durch Redux ersetzt
+
+---
+## [1.6.588] – 2025-07-11
+
+- fix: Messwertlinie (m) im DIA0-Modus in DetailModal sichtbar gemacht
+
+---
+## [1.6.587] – 2025-07-11
+
+- fix: Anzeige der Messwertlinie (m) im DIA0-Modus in DetailModal korrigiert
+
+- Unterscheidung zwischen Durchschnitt (g) und Einzelwert (m) je nach Modus eingebaut
+- Fehler behoben, bei dem im DIA0-Modus keine blaue Linie angezeigt wurde
+
+---
 ## [1.6.586] – 2025-07-11
 
 - feat: DetailModal um Min/Max/Durchschnitt ergänzt

components/common/DateRangePicker.tsx

@@ -1,4 +1,4 @@
-// /components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/DateRangePicker.tsx
+// /components/common/DateRangePicker.tsx
 import React, { useEffect } from "react";
 import DatePicker from "react-datepicker";
 import { useSelector, useDispatch } from "react-redux";

components/main/analogInputs/AnalogInputsChart.tsx

@@ -1,12 +1,8 @@
 "use client";
-type AnalogInput = {
+import React, { useEffect, useRef } from "react";
-  id: number;
+import { useDispatch, useSelector } from "react-redux";
-  label: string;
+import { RootState, AppDispatch } from "@/redux/store";
-  unit: string;
-};
-import React, { useEffect } from "react";
 import { Line } from "react-chartjs-2";
-import { getColor } from "@/utils/colors";
 import {
   Chart as ChartJS,
   LineElement,
@@ -18,13 +14,20 @@ import {
   Filler,
   TimeScale,
 } from "chart.js";
+import type { ChartOptions } from "chart.js";
 import "chartjs-adapter-date-fns";
 import { de } from "date-fns/locale";
-import { useSelector, useDispatch } from "react-redux";
-import type { RootState, AppDispatch } from "../../../redux/store";
 import { getAnalogInputsHistoryThunk } from "@/redux/thunks/getAnalogInputsHistoryThunk";
+import {
+  setVonDatum,
+  setBisDatum,
+  setZeitraum,
+  setAutoLoad,
+} from "@/redux/slices/analogInputs/analogInputsHistorySlice";
+import DateRangePicker from "@/components/common/DateRangePicker";
+import { Listbox } from "@headlessui/react";
+import { getColor } from "@/utils/colors";
 
-// Basis-Registrierung (ohne Zoom-Plugin)
 ChartJS.register(
   LineElement,
   PointElement,
@@ -36,149 +39,150 @@ ChartJS.register(
   TimeScale
 );
 
-export default function AnalogInputsChart({
+type AnalogInputHistoryPoint = {
-  selectedId,
+  t: string;
-}: {
+  m: number;
-  selectedId: number | null;
+};
-}) {
-  const selectedInput = useSelector(
-    (state: RootState) => state.selectedAnalogInput
-  ) as unknown as AnalogInput | null;
 
+export default function AnalogInputsChart() {
   const dispatch = useDispatch<AppDispatch>();
-  type AnalogInputHistoryPoint = { t: string | number | Date; m: number };
+  const chartRef = useRef<any>(null);
 
-  const { data } = useSelector(
+  const { zeitraum, vonDatum, bisDatum, data, autoLoad, selectedId } =
-    (state: RootState) => state.analogInputsHistory
+    useSelector((state: RootState) => state.analogInputsHistory);
-  ) as {
+
-    data: { [key: string]: AnalogInputHistoryPoint[] };
+  useEffect(() => {
+    const today = new Date();
+    const vor30Tagen = new Date(today);
+    vor30Tagen.setDate(today.getDate() - 30);
+
+    if (!vonDatum) dispatch(setVonDatum(vor30Tagen.toISOString().slice(0, 10)));
+    if (!bisDatum) dispatch(setBisDatum(today.toISOString().slice(0, 10)));
+  }, [dispatch, vonDatum, bisDatum]);
+
+  const handleFetchChartData = () => {
+    if (!selectedId) return;
+    dispatch(
+      getAnalogInputsHistoryThunk({
+        eingang: selectedId,
+        zeitraum,
+        vonDatum,
+        bisDatum,
+      })
+    );
   };
 
-  useEffect(() => {
+  const dataKey = selectedId ? String(selectedId + 99) : null;
-    dispatch(getAnalogInputsHistoryThunk());
-  }, [dispatch]);
-
-  // ✅ Zoom-Plugin dynamisch importieren und registrieren
-  useEffect(() => {
-    const loadZoomPlugin = async () => {
-      if (typeof window !== "undefined") {
-        const zoomPlugin = (await import("chartjs-plugin-zoom")).default;
-        if (!ChartJS.registry.plugins.get("zoom")) {
-          ChartJS.register(zoomPlugin);
-        }
-      }
-    };
-    loadZoomPlugin();
-  }, []);
-
-  if (!selectedId) {
-    return (
-      <div className="text-gray-500">Bitte einen Messwerteingang auswählen</div>
-    );
-  }
-
-  const key = String(selectedId + 99);
-  const inputData = data[key];
-
-  if (!inputData) {
-    return (
-      <div className="text-red-500">
-        Keine Verlaufsdaten für Messwerteingang {selectedId} gefunden.
-      </div>
-    );
-  }
-
   const chartData = {
-    datasets: [
+    datasets:
-      {
+      dataKey && data[dataKey]
-        label: `Messkurve ${selectedInput?.label ?? "Eingang"} [${
+        ? [
-          selectedInput?.unit ?? ""
+            {
-        }]`,
+              label: `Messwerteingang ${selectedId}`,
-        data: inputData.map((point: AnalogInputHistoryPoint) => ({
+              data: data[dataKey].map((p: AnalogInputHistoryPoint) => ({
-          x: point.t,
+                x: new Date(p.t),
-          y: point.m,
+                y: p.m,
-        })),
+              })),
-        fill: false,
+              fill: false,
-        borderColor: getColor("littwin-blue"),
+              borderColor: getColor("littwin-blue"),
-        backgroundColor: "rgba(59,130,246,0.5)",
+              backgroundColor: "rgba(59,130,246,0.3)",
-        borderWidth: 2,
+              borderWidth: 2,
-        pointRadius: 0,
+              pointRadius: 0,
-        pointHoverRadius: 10,
+              tension: 0.1,
-        tension: 0.1,
+            },
-      },
+          ]
-    ],
+        : [],
   };
 
-  const chartOptions = {
+  const chartOptions: ChartOptions<"line"> = {
     responsive: true,
     plugins: {
-      legend: { position: "top" as const },
+      legend: { position: "top" },
+      title: { display: true, text: "Verlauf" },
       tooltip: {
-        mode: "index" as const,
+        mode: "index",
         intersect: false,
         callbacks: {
-          label: function (context: import("chart.js").TooltipItem<"line">) {
+          label: (ctx) => `Messwert: ${ctx.parsed.y}`,
-            const y = context.parsed.y;
+          title: (items) =>
-            return `Messwert: ${y}`;
+            `Zeitpunkt: ${new Date(items[0].parsed.x).toLocaleString("de-DE")}`,
-          },
-          title: function (
-            tooltipItems: import("chart.js").TooltipItem<"line">[]
-          ) {
-            const date = tooltipItems[0].parsed.x;
-            return `Zeitpunkt: ${new Date(date).toLocaleString("de-DE")}`;
-          },
-        },
-      },
-
-      title: {
-        display: true,
-        text: `Verlauf der letzten 30 Tage`,
-      },
-      zoom: {
-        pan: {
-          enabled: true,
-          mode: "x" as const,
-        },
-        zoom: {
-          wheel: { enabled: true },
-          pinch: { enabled: true },
-          mode: "x" as const,
         },
       },
     },
     scales: {
       x: {
-        type: "time" as const,
+        type: "time",
         time: {
-          unit: "day" as const, // nur Datum in Achse
+          unit: "day",
-          tooltipFormat: "dd.MM.yyyy HH:mm", // aber Uhrzeit im Tooltip sichtbar
+          tooltipFormat: "dd.MM.yyyy HH:mm",
-          displayFormats: {
+          displayFormats: { day: "dd.MM.yyyy" },
-            day: "dd.MM.yyyy",
-          },
-        },
-
-        adapters: {
-          date: {
-            locale: de,
-          },
-        },
-        title: {
-          display: true,
-          text: "Zeit",
-        },
-      },
-      y: {
-        title: {
-          display: true,
-          text: `Messwert [${selectedInput?.unit ?? ""}]`,
         },
+        adapters: { date: { locale: de } },
+        title: { display: true, text: "Zeit" },
       },
+      y: { title: { display: true, text: "Messwert" } },
     },
   };
 
+  useEffect(() => {
+    if (autoLoad && selectedId) {
+      dispatch(
+        getAnalogInputsHistoryThunk({
+          eingang: selectedId,
+          zeitraum,
+          vonDatum,
+          bisDatum,
+        })
+      );
+      dispatch(setAutoLoad(false)); // ✅ zurücksetzen, sonst endlose Schleife
+    }
+  }, [autoLoad, selectedId, dispatch, zeitraum, vonDatum, bisDatum]);
   return (
-    <div className="w-full h-full">
+    <div className="flex flex-col gap-3">
-      <Line data={chartData} options={chartOptions} />
+      <div className="flex flex-wrap items-center gap-4 mb-2">
+        <DateRangePicker />
+
+        <Listbox value={zeitraum} onChange={(v) => dispatch(setZeitraum(v))}>
+          <div className="relative w-48">
+            <Listbox.Button className="w-full border px-3 py-1 rounded bg-white flex justify-between items-center text-sm">
+              <span>
+                {zeitraum === "DIA0"
+                  ? "Alle Messwerte"
+                  : zeitraum === "DIA1"
+                  ? "Stündlich"
+                  : "Täglich"}
+              </span>
+              <i className="bi bi-chevron-down text-gray-400" />
+            </Listbox.Button>
+            <Listbox.Options className="absolute z-10 mt-1 w-full border bg-white shadow rounded text-sm">
+              {["DIA0", "DIA1", "DIA2"].map((option) => (
+                <Listbox.Option
+                  key={option}
+                  value={option}
+                  className="px-4 py-1 cursor-pointer hover:bg-gray-200"
+                >
+                  {option === "DIA0"
+                    ? "Alle Messwerte"
+                    : option === "DIA1"
+                    ? "Stündlich"
+                    : "Täglich"}
+                </Listbox.Option>
+              ))}
+            </Listbox.Options>
+          </div>
+        </Listbox>
+
+        <button
+          onClick={handleFetchChartData}
+          className="px-4 py-1 bg-littwin-blue text-white rounded text-sm"
+        >
+          Daten laden
+        </button>
+      </div>
+
+      <div className="h-[50vh] w-full">
+        <Line ref={chartRef} data={chartData} options={chartOptions} />
+      </div>
     </div>
   );
 }

components/main/analogInputs/AnalogInputsSettingsModal.tsx

@@ -1,32 +1,31 @@
-"use client"; // /components/main/analogeEingaenge/AnalogInputsSettingsModal.tsx
+"use client";
+
 import React, { useEffect, useState } from "react";
 import { Listbox } from "@headlessui/react";
-interface AnalogInput {
+import { useDispatch, useSelector } from "react-redux";
-  id: number;
+import { RootState } from "@/redux/store";
-  label?: string;
+import { setIsSettingsModalOpen } from "@/redux/slices/analogInputs/analogInputsUiSlice";
-  offset?: number | string;
-  factor?: number | string;
-  loggerInterval: string;
-  unit?: string;
-}
 
-interface Props {
+import type { AnalogInput } from "@/types/analogInput"; // 👈 Importiere den Typ (jetzt definiert und exportiert)
-  selectedInput: AnalogInput;
+
-  isOpen: boolean;
+export default function AnalogInputsSettingsModal() {
-  onClose: () => void;
+  const dispatch = useDispatch();
-}
+
+  const isOpen = useSelector(
+    (state: RootState) => state.analogInputsUi.isSettingsModalOpen
+  );
+
+  const selectedInput = useSelector<RootState, AnalogInput | null>(
+    (state) => state.selectedAnalogInput
+  );
 
-export default function AnalogInputSettingsModal({
-  selectedInput,
-  isOpen,
-  onClose,
-}: Props) {
   const [label, setLabel] = useState("");
   const [offset, setOffset] = useState("0.000");
   const [factor, setFactor] = useState("1.000");
   const [loggerInterval, setLoggerInterval] = useState("9");
   const [unit, setUnit] = useState("V");
   const [isSaving, setIsSaving] = useState(false);
+
   const unitOptions = ["V", "mA", "°C", "bar", "%"];
 
   useEffect(() => {
@@ -42,12 +41,8 @@ export default function AnalogInputSettingsModal({
           ? selectedInput.factor.toFixed(3)
           : selectedInput.factor || "1.000"
       );
-      setLoggerInterval(selectedInput.loggerInterval);
+      setLoggerInterval(selectedInput.loggerInterval || "9");
       setUnit(selectedInput.unit || "V");
-      console.log(
-        "selectedInput in analoge Eingänge:",
-        selectedInput.loggerInterval
-      );
     }
   }, [selectedInput, isOpen]);
 
@@ -55,6 +50,7 @@ export default function AnalogInputSettingsModal({
 
   const handleSave = async () => {
     setIsSaving(true);
+
     const slot = selectedInput.id;
     const isDev = window.location.hostname === "localhost";
 
@@ -100,7 +96,7 @@ export default function AnalogInputSettingsModal({
         alert("Einstellungen gespeichert (Produktion).");
       }
 
-      onClose();
+      dispatch(setIsSettingsModalOpen(false));
       location.reload();
     } catch (err) {
       alert("Fehler beim Speichern.");
@@ -118,7 +114,7 @@ export default function AnalogInputSettingsModal({
             Einstellungen Messwerteingang {selectedInput.id}
           </h2>
           <button
-            onClick={onClose}
+            onClick={() => dispatch(setIsSettingsModalOpen(false))}
             className="text-2xl hover:text-gray-400"
             aria-label="Modal schließen"
           >
@@ -128,97 +124,85 @@ export default function AnalogInputSettingsModal({
 
         {/* Bezeichnung */}
         <div className="grid grid-cols-2 gap-x-4 gap-y-3">
-          <div>
+          <span className="font-normal">Bezeichnung:</span>
-            <span className="font-normal">Bezeichnung:</span>
+          <input
-          </div>
+            type="text"
-          <div>
+            className="w-full border rounded px-3 py-1 mb-4"
-            <input
+            value={label}
-              type="text"
+            onChange={(e) => setLabel(e.target.value)}
-              className="w-full border rounded px-3 py-1 mb-4"
+          />
-              value={label}
-              onChange={(e) => setLabel(e.target.value)}
-            />
-          </div>
         </div>
+
         {/* Offset */}
         <div className="grid grid-cols-2 gap-x-4 gap-y-3 mb-4">
-          <div>
+          <span className="font-normal">Offset:</span>
-            <span className="font-normal">Offset:</span>
+          <input
-          </div>
+            type="number"
-          <div>
+            step="0.001"
-            <input
+            className="border border-gray-300 rounded px-2 py-1 w-full text-right"
-              type="number"
+            value={offset}
-              step="0.001"
+            onChange={(e) => setOffset(e.target.value)}
-              className="border border-gray-300 rounded px-2 py-1 w-full text-right "
+          />
-              value={offset}
-              onChange={(e) => setOffset(e.target.value)}
-            />
-          </div>
         </div>
+
         {/* Faktor */}
         <div className="grid grid-cols-2 gap-x-4 gap-y-3 mb-4">
-          <div>
+          <span className="font-normal">Faktor:</span>
-            <span className="font-normal">Faktor:</span>
+          <input
-          </div>
+            type="number"
-          <div>
+            step="0.001"
-            <input
+            className="border border-gray-300 rounded px-2 py-1 w-full text-right"
-              type="number"
+            value={factor}
-              step="0.001"
+            onChange={(e) => setFactor(e.target.value)}
-              className="border border-gray-300 rounded px-2 py-1 w-full text-right"
+          />
-              value={factor}
-              onChange={(e) => setFactor(e.target.value)}
-            />{" "}
-          </div>
         </div>
-        {/* Einheit  */}
+
-        <div className="grid grid-cols-2 gap-x-4 gap-y-3">
+        {/* Einheit */}
-          <div>
+        <div className="grid grid-cols-2 gap-x-4 gap-y-3 mb-4">
-            <span className="font-normal">Einheit:</span>
+          <span className="font-normal">Einheit:</span>
-          </div>
+          <Listbox value={unit} onChange={setUnit}>
-          <div>
+            <div className="relative w-full">
-            <Listbox value={unit} onChange={setUnit}>
+              <Listbox.Button className="w-full border px-3 py-1 rounded text-left bg-white flex justify-between items-center text-sm text-gray-900 font-sans">
-              <div className="relative w-full">
+                <span>{unit}</span>
-                <Listbox.Button className="w-full border px-3 py-1 rounded text-left bg-white flex justify-between items-center text-sm text-gray-900 font-sans">
+                <svg
-                  <span>{unit}</span>
+                  className="w-5 h-5 text-gray-400"
-                  <svg
+                  xmlns="http://www.w3.org/2000/svg"
-                    className="w-5 h-5 text-gray-400"
+                  viewBox="0 0 20 20"
-                    xmlns="http://www.w3.org/2000/svg"
+                  fill="currentColor"
-                    viewBox="0 0 20 20"
+                  aria-hidden="true"
-                    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 text-gray-900 font-sans">
+                {unitOptions.map((opt) => (
+                  <Listbox.Option
+                    key={opt}
+                    value={opt}
+                    className={({ selected, active }) =>
+                      `px-4 py-1 cursor-pointer ${
+                        selected
+                          ? "bg-littwin-blue text-white font-medium"
+                          : active
+                          ? "bg-gray-200"
+                          : "text-gray-900"
+                      }`
+                    }
                   >
-                    <path
+                    {opt}
-                      fillRule="evenodd"
+                  </Listbox.Option>
-                      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"
+              </Listbox.Options>
-                    />
+            </div>
-                  </svg>
+          </Listbox>
-                </Listbox.Button>
-                <Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm text-gray-900 font-sans">
-                  {unitOptions.map((opt) => (
-                    <Listbox.Option
-                      key={opt}
-                      value={opt}
-                      className={({ selected, active }) =>
-                        `px-4 py-1 cursor-pointer ${
-                          selected
-                            ? "bg-littwin-blue text-white font-medium"
-                            : active
-                            ? "bg-gray-200"
-                            : "text-gray-900"
-                        }`
-                      }
-                    >
-                      {opt}
-                    </Listbox.Option>
-                  ))}
-                </Listbox.Options>
-              </div>
-            </Listbox>
-          </div>
         </div>
-        {/* Loggerintervall/Speicherintervall */}
+
-        <div className="grid grid-cols-2 gap-x-4 gap-y-3 ">
+        {/* Speicherintervall */}
+        <div className="grid grid-cols-2 gap-x-4 gap-y-3">
           <span className="font-normal">Speicherintervall:</span>
           <div className="relative w-full">
             <input
@@ -233,6 +217,7 @@ export default function AnalogInputSettingsModal({
           </div>
         </div>
 
+        {/* Speichern-Button */}
         <div className="flex justify-end gap-2 mt-6">
           <button
             onClick={handleSave}

components/main/analogInputs/AnalogInputsTable.tsx

@@ -7,18 +7,16 @@ import { getAnalogInputsThunk } from "@/redux/thunks/getAnalogInputsThunk";
 import { Icon } from "@iconify/react";
 import settingsIcon from "@iconify/icons-mdi/settings";
 import waveformIcon from "@iconify/icons-mdi/waveform";
-import { setSelectedAnalogInput } from "@/redux/slices/selectedAnalogInputSlice";
+import { setSelectedAnalogInput } from "@/redux/slices/analogInputs/selectedAnalogInputSlice";
-
+import { setIsSettingsModalOpen } from "@/redux/slices/analogInputs/analogInputsUiSlice";
-export default function AnalogInputsTable({
+import {
   setSelectedId,
-  setSelectedInput,
+  setAutoLoad,
-  setIsSettingsModalOpen,
+} from "@/redux/slices/analogInputs/analogInputsHistorySlice";
-}: {
+
-  setSelectedId: (id: number) => void;
+export default function AnalogInputsTable() {
-  setSelectedInput: (input: AnalogInput) => void;
-  setIsSettingsModalOpen: (open: boolean) => void;
-}) {
   const dispatch = useDispatch<AppDispatch>();
+
   const [activeId, setActiveId] = React.useState<number | null>(null);
 
   useEffect(() => {
@@ -30,9 +28,10 @@ export default function AnalogInputsTable({
   );
 
   const handleSelect = (id: number, input: AnalogInput) => {
-    setSelectedId(id);
+    dispatch(setSelectedId(id));
     setActiveId(id);
-    dispatch(setSelectedAnalogInput(input)); // 🧠 hier kommt die Bezeichnung in Redux
+    dispatch(setSelectedAnalogInput(input));
+    dispatch(setAutoLoad(true));
   };
 
   return (
@@ -58,50 +57,60 @@ export default function AnalogInputsTable({
           <tbody>
             {Object.values(analogInputs)
               .filter(
-                (e) =>
+                (analogInput) =>
-                  e && typeof e.id === "number" && typeof e.label === "string"
+                  analogInput &&
+                  typeof analogInput.id === "number" &&
+                  typeof analogInput.label === "string"
               )
               .slice(0, 8)
-              .map((e, index) => (
+              .map((analogInput, index) => (
                 <tr
                   key={index}
                   className={`transition cursor-pointer ${
-                    e.id === activeId ? "bg-blue-100" : "hover:bg-gray-100"
+                    analogInput.id === activeId
+                      ? "bg-blue-100"
+                      : "hover:bg-gray-100"
                   }`}
                 >
                   <td
                     className="border p-2"
-                    onClick={() => handleSelect(e.id!, e)}
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
                   >
                     <div className="flex items-center gap-1 ">
                       <Icon
                         icon={waveformIcon}
                         className="text-gray-600 text-base laptop:text-sm xl:text-sm 2xl:text-lg"
                       />
-                      {e.id ?? "-"}
+                      {analogInput.id ?? "-"}
                     </div>
                   </td>
                   <td
                     className="border p-2 text-right"
-                    onClick={() => handleSelect(e.id!, e)}
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
                   >
-                    {typeof e.value === "number" ? e.value.toFixed(2) : "-"}
+                    {typeof analogInput.value === "number"
+                      ? analogInput.value.toFixed(2)
+                      : "-"}
                   </td>
 
-                  <td className="border p-2">{e.unit || "-"}</td>
                   <td
                     className="border p-2"
-                    onClick={() => handleSelect(e.id!, e)}
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
                   >
-                    {e.label || "----"}
+                    {analogInput.unit || "-"}
+                  </td>
+                  <td
+                    className="border p-2"
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
+                  >
+                    {analogInput.label || "----"}
                   </td>
 
                   <td className="border p-2 text-center">
                     <button
                       onClick={() => {
-                        handleSelect(e.id!, e);
+                        handleSelect(analogInput.id!, analogInput);
-                        setSelectedInput(e);
+                        dispatch(setIsSettingsModalOpen(true));
-                        setIsSettingsModalOpen(true);
                       }}
                       className="text-gray-400 hover:text-gray-500"
                     >

components/main/analogInputs/AnalogInputsView.tsx

@@ -6,20 +6,20 @@ import AnalogInputsChart from "@/components/main/analogInputs/AnalogInputsChart"
 import AnalogInputsSettingsModal from "@/components/main/analogInputs/AnalogInputsSettingsModal";
 import { getAnalogInputsThunk } from "@/redux/thunks/getAnalogInputsThunk";
 import { useAppDispatch } from "@/redux/store";
-
+import { useSelector } from "react-redux";
-export interface AnalogInput2 {
+import { RootState } from "@/redux/store";
-  id: number;
-  label?: string;
-  offset?: number | string;
-  factor?: number | string;
-  loggerInterval: string;
-  unit?: string;
-}
 
 function AnalogInputsView() {
-  const [selectedId, setSelectedId] = useState<number | null>(null);
+  const selectedInput = useSelector(
-  const [selectedInput, setSelectedInput] = useState<AnalogInput2 | null>(null);
+    (state: RootState) => state.selectedAnalogInput
-  const [isSettingsModalOpen, setIsSettingsModalOpen] = useState(false);
+  );
+  const selectedId = useSelector(
+    (state: RootState) => state.analogInputsHistory.selectedId
+  );
+  const isSettingsModalOpen = useSelector(
+    (state: RootState) => state.analogInputsUi.isSettingsModalOpen
+  );
+
   const dispatch = useAppDispatch();
 
   useEffect(() => {
@@ -40,31 +40,19 @@ function AnalogInputsView() {
             <h2 className="text-xl font-semibold mb-4 text-gray-700">
               Messwerteingänge
             </h2>
-            <AnalogInputsTable
+            <AnalogInputsTable />
-              setSelectedId={setSelectedId}
-              setSelectedInput={(input) =>
-                setSelectedInput(input as unknown as AnalogInput2)
-              }
-              setIsSettingsModalOpen={setIsSettingsModalOpen}
-            />
           </div>
 
           <div className="bg-white shadow-lg rounded-lg p-4 border border-gray-200">
             <h2 className="text-xl font-semibold mb-4 text-gray-700">
               Messkurve Messwerteingang {selectedId ?? "–"}
             </h2>
-            <AnalogInputsChart selectedId={selectedId} />
+            <AnalogInputsChart />
           </div>
         </div>
       </div>
 
-      {selectedInput !== null && (
+      {selectedInput !== null && <AnalogInputsSettingsModal />}
-        <AnalogInputsSettingsModal
-          selectedInput={selectedInput}
-          isOpen={isSettingsModalOpen}
-          onClose={() => setIsSettingsModalOpen(false)}
-        />
-      )}
     </div>
   );
 }

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

@@ -1,7 +1,7 @@
 "use client";
 // /components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx
 import React from "react";
-import DateRangePicker from "./DateRangePicker";
+import DateRangePicker from "@/components/common/DateRangePicker";
 import { useDispatch, useSelector } from "react-redux";
 import { RootState } from "@/redux/store";
 import {

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

@@ -31,7 +31,7 @@ ChartJS.register(
   Legend,
   Filler
 );
-import { getColor } from "../../../../../../utils/colors";
+import { getColor } from "@/utils/colors";
 import { PulseLoader } from "react-spinners";
 
 type LoopMeasurementEntry = {

components/main/system/DetailModal.tsx

@@ -6,6 +6,11 @@ import { useSelector, useDispatch } from "react-redux";
 import { RootState } from "@/redux/store";
 import { Listbox } from "@headlessui/react";
 import { setFullScreen } from "@/redux/slices/kabelueberwachungChartSlice";
+import DateRangePicker from "@/components/common/DateRangePicker";
+import {
+  setVonDatum,
+  setBisDatum,
+} from "@/redux/slices/kabelueberwachungChartSlice";
 
 import {
   Chart as ChartJS,
@@ -36,10 +41,12 @@ ChartJS.register(
 );
 
 type ReduxDataEntry = {
-  t: string;
+  //Alle DIA0 t,m,i,a , DIA1 und DIA2 t,i,a,g
-  i: number;
+  t: string; // Zeitstempel
-  a?: number;
+  i: number; // Minimum
-  g?: number;
+  a: number; // Maximum
+  g?: number; // Durchschnitt (optional, falls vorhanden)
+  m?: number; // aktueller Messwert (optional, falls vorhanden)
 };
 
 const chartOptions = {
@@ -119,8 +126,16 @@ export const DetailModal = ({
   const [chartData, setChartData] = useState<any>({
     datasets: [],
   });
+  const vonDatum = useSelector(
+    (state: RootState) => state.kabelueberwachungChartSlice.vonDatum
+  );
+  const bisDatum = useSelector(
+    (state: RootState) => state.kabelueberwachungChartSlice.bisDatum
+  );
 
-  const reduxData: ReduxDataEntry[] = useSelector((state: RootState) => {
+  const [filteredData, setFilteredData] = useState<ReduxDataEntry[]>([]);
+
+  const reduxData = useSelector((state: RootState) => {
     switch (selectedKey) {
       case "+5V":
         return state.systemspannung5Vplus[zeitraum];
@@ -137,7 +152,7 @@ export const DetailModal = ({
       default:
         return [];
     }
-  });
+  }) as ReduxDataEntry[];
 
   const isFullScreen = useSelector(
     (state: RootState) => state.kabelueberwachungChartSlice.isFullScreen
@@ -153,6 +168,8 @@ export const DetailModal = ({
 
   const handleClose = () => {
     dispatch(setFullScreen(false));
+    dispatch(setVonDatum(""));
+    dispatch(setBisDatum(""));
     onClose();
   };
 
@@ -168,8 +185,19 @@ export const DetailModal = ({
     loadZoomPlugin();
   }, []);
 
-  useEffect(() => {
+  const handleFetchData = () => {
-    const sortedData = [...reduxData].reverse();
+    let sortedData = [...reduxData].reverse();
+
+    if (vonDatum && bisDatum) {
+      const vonDate = new Date(vonDatum);
+      const bisDate = new Date(bisDatum);
+      sortedData = sortedData.filter((entry) => {
+        const entryDate = new Date(entry.t);
+        return entryDate >= vonDate && entryDate <= bisDate;
+      });
+    }
+
+    setFilteredData(sortedData);
 
     setChartData({
       datasets: [
@@ -192,8 +220,11 @@ export const DetailModal = ({
           tension: 0.1,
         },
         {
-          label: "Durchschnitt",
+          label: zeitraum === "DIA0" ? "Messwert" : "Durchschnitt",
-          data: sortedData.map((p) => ({ x: new Date(p.t), y: p.g })),
+          data: sortedData.map((p) => ({
+            x: new Date(p.t),
+            y: zeitraum === "DIA0" ? p.m : p.g,
+          })),
           borderColor: "rgba(59,130,246,1)",
           backgroundColor: "rgba(59,130,246,0.3)",
           borderWidth: 2,
@@ -202,7 +233,7 @@ export const DetailModal = ({
         },
       ],
     });
-  }, [reduxData]);
+  };
 
   useEffect(() => {
     if (chartRef.current && selectedKey) {
@@ -216,6 +247,12 @@ export const DetailModal = ({
       chartRef.current.resetZoom();
     }
   }, [zeitraum]);
+  // beim start soll der Chart einmal aufgerufen wird, also einmal der Button "Daten laden" geklickt werden
+  useEffect(() => {
+    if (isOpen && selectedKey) {
+      handleFetchData();
+    }
+  }, [isOpen, selectedKey]);
 
   if (!isOpen || !selectedKey) return null;
 
@@ -254,7 +291,8 @@ export const DetailModal = ({
           </div>
         </div>
 
-        <div className="flex items-center space-x-2 mb-4">
+        <div className="flex items-center justify-start gap-4 mb-4 flex-wrap">
+          <DateRangePicker />
           <label className="font-medium">Zeitraum:</label>
           <Listbox value={zeitraum} onChange={setZeitraum}>
             <div className="relative w-48">
@@ -307,6 +345,12 @@ export const DetailModal = ({
               </Listbox.Options>
             </div>
           </Listbox>
+          <button
+            onClick={handleFetchData}
+            className="px-4 py-1 bg-littwin-blue text-white rounded text-sm"
+          >
+            Daten laden
+          </button>
         </div>
 
         <div className="h-[85%]">

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.586",
+  "version": "1.6.602",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "cpl-v4",
-      "version": "1.6.586",
+      "version": "1.6.602",
       "dependencies": {
         "@fontsource/roboto": "^5.1.0",
         "@headlessui/react": "^2.2.4",
@@ -43,8 +43,7 @@
         "react-spinners": "^0.14.1",
         "react-toastify": "^10.0.6",
         "recharts": "^2.15.1",
-        "redux": "^5.0.1",
+        "redux": "^5.0.1"
-        "redux-persist": "^6.0.0"
       },
       "devDependencies": {
         "@testing-library/jest-dom": "^6.6.3",
@@ -10258,14 +10257,6 @@
         "redux": "*"
       }
     },
-    "node_modules/redux-persist": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/redux-persist/-/redux-persist-6.0.0.tgz",
-      "integrity": "sha512-71LLMbUq2r02ng2We9S215LtPu3fY0KgaGE0k8WRgl6RkqxtGfl7HUozz1Dftwsb0D/5mZ8dwAaPbtnzfvbEwQ==",
-      "peerDependencies": {
-        "redux": ">4.0.0"
-      }
-    },
     "node_modules/redux-thunk": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-3.1.0.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.586",
+  "version": "1.6.602",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -51,8 +51,7 @@
     "react-spinners": "^0.14.1",
     "react-toastify": "^10.0.6",
     "recharts": "^2.15.1",
-    "redux": "^5.0.1",
+    "redux": "^5.0.1"
-    "redux-persist": "^6.0.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",

pages/_app.tsx

@@ -3,14 +3,14 @@
 
 import { useEffect, useState } from "react";
 import { Provider } from "react-redux";
-import { PersistGate } from "redux-persist/integration/react";
+
-import { persistor } from "@/redux/store";
+import { useAppDispatch } from "@/redux/store";
-import store, { useAppDispatch } from "@/redux/store";
 import { AppProps } from "next/app";
 
 import Header from "@/components/header/Header";
 import Navigation from "@/components/navigation/Navigation";
 import Footer from "@/components/footer/Footer";
+import { store } from "@/redux/store";
 
 // Thunks importieren
 import { getKueDataThunk } from "@/redux/thunks/getKueDataThunk";
@@ -38,11 +38,9 @@ import "@/styles/globals.css";
 
 function MyApp({ Component, pageProps }: AppProps) {
   return (
-    <PersistGate loading={null} persistor={persistor}>
+    <Provider store={store}>
-      <Provider store={store}>
+      <AppContent Component={Component} pageProps={pageProps} />
-        <AppContent Component={Component} pageProps={pageProps} />
+    </Provider>
-      </Provider>
-    </PersistGate>
   );
 }
 
@@ -87,7 +85,14 @@ function AppContent({
       } else if (pathname.includes("digitalOutputs")) {
         dispatch(getDigitalOutputsThunk());
       } else if (pathname.includes("analogHistory")) {
-        dispatch(getAnalogInputsHistoryThunk());
+        dispatch(
+          getAnalogInputsHistoryThunk({
+            eingang: 1, // Beispielwert, ggf. dynamisch setzen
+            zeitraum: "tag", // Beispielwert, ggf. dynamisch setzen
+            vonDatum: new Date().toISOString().split("T")[0], // heutiges Datum
+            bisDatum: new Date().toISOString().split("T")[0], // heutiges Datum
+          })
+        );
       } else if (pathname.includes("dashboard")) {
         dispatch(getLast20MessagesThunk());
       } else if (pathname.includes("einstellungen")) {

pages/api/cpl/getAnalogInputsHandler.ts

@@ -5,8 +5,6 @@ import fs from "fs";
 import path from "path";
 
 export default function handler(req: NextApiRequest, res: NextApiResponse) {
-  const mode = process.env.NEXT_PUBLIC_CPL_MODE;
-
   try {
     const filePath = path.join(
       process.cwd(),

pages/api/cpl/getAnalogInputsHistory.ts

@@ -1,43 +1,77 @@
 // /pages/api/cpl/getAnalogInputsHistory.ts
-
 import path from "path";
 import fs from "fs/promises";
 import type { NextApiRequest, NextApiResponse } from "next";
 
+const erlaubteZeitraeume = ["DIA0", "DIA1", "DIA2"];
+const erlaubteEingaenge = [1, 2, 3, 4, 5, 6, 7, 8];
+
 export default async function handler(
   req: NextApiRequest,
-  res: NextApiResponse
+  res: NextApiResponse<unknown>
 ) {
+  const { zeitraum, eingang } = req.query;
+
+  const zeitraumKey =
+    typeof zeitraum === "string" && erlaubteZeitraeume.includes(zeitraum)
+      ? zeitraum
+      : null;
+
+  const eingangId =
+    typeof eingang === "string" && !isNaN(Number(eingang))
+      ? Number(eingang)
+      : null;
+
+  // ❌ Fehlerhafte Anfrage
+  if (!zeitraumKey || !eingangId || !erlaubteEingaenge.includes(eingangId)) {
+    return res.status(400).json({
+      error: "❌ Ungültige oder unvollständige Anfrage.",
+      erwartet: {
+        zeitraum: "Pflichtfeld. Erlaubt: DIA0 | DIA1 | DIA2",
+        eingang: "Pflichtfeld. Erlaubt: 1 bis 8 (entspricht AE1 bis AE8)",
+      },
+      beispiele: [
+        "/api/cpl/getAnalogInputsHistory?zeitraum=DIA1&eingang=3",
+        "/api/cpl/getAnalogInputsHistory?zeitraum=DIA2&eingang=7",
+        "http://localhost:3000/api/cpl/getAnalogInputsHistory?eingang=1&zeitraum=DIA0",
+      ],
+      hinweis:
+        "Die Antwort enthält ein Array mit Messwertobjekten für den gewählten Eingang und Zeitraum.",
+    });
+  }
+
   try {
-    const result: Record<number, unknown[]> = {};
+    const filePath = path.join(
+      process.cwd(),
+      "mocks",
+      "device-cgi-simulator",
+      "chartsData",
+      "analogInputs",
+      `${eingangId}`,
+      `${zeitraumKey}.json`
+    );
 
-    for (let i = 1; i <= 8; i++) {
+    const fileContent = await fs.readFile(filePath, "utf-8");
-      const filePath = path.join(
+    const daten = JSON.parse(fileContent);
-        process.cwd(),
-        "mocks",
-        "device-cgi-simulator",
-        "chartsData",
-        "analogInputs",
-        `${i}`,
-        `DIA0.json`
-      );
-      console.log(`Lade Mock-Daten für analogInput${i} von: ${filePath}`);
 
-      try {
+    res.status(200).json({
-        const fileContent = await fs.readFile(filePath, "utf-8");
+      eingang: eingangId,
-        result[99 + i] = JSON.parse(fileContent); // z. B. 100 für AE1, 101 für AE2
+      zeitraum: zeitraumKey,
-      } catch (error) {
+      beschreibung:
-        console.warn(
+        zeitraumKey === "DIA0"
-          `Mock-Datei für analogInput${i} nicht gefunden oder fehlerhaft.`,
+          ? "Alle Messwerte"
-          error
+          : zeitraumKey === "DIA1"
-        );
+          ? "Stündlich aggregierte Messwerte"
-        result[99 + i] = [];
+          : "Täglich aggregierte Messwerte",
-      }
+      daten,
-    }
+    });
-
-    res.status(200).json(result);
   } catch (error) {
-    console.error("Fehler beim Laden der analogen Eingänge (Mock):", error);
+    console.error(
-    res.status(500).json({ error: "Fehler beim Laden der Mock-Daten." });
+      `❌ Datei nicht gefunden für Eingang ${eingangId} und Zeitraum ${zeitraumKey}:`,
+      error
+    );
+    res.status(404).json({
+      error: `Keine Daten gefunden für Eingang ${eingangId} mit Zeitraum ${zeitraumKey}.`,
+    });
   }
 }

pages/api/cpl/getDigitalOutputsHandler.ts

@@ -8,8 +8,6 @@ export default async function handler(
   req: NextApiRequest,
   res: NextApiResponse
 ) {
-  const mode = process.env.NEXT_PUBLIC_CPL_MODE ?? "json";
-
   // Lese JSON-Datei z.B. digitalOutputsMockData.json
   const filePath = path.join(
     process.cwd(),

pages/api/cpl/updateAnalogInputsSettingsHandler.ts

@@ -8,7 +8,6 @@ export default function handler(req: NextApiRequest, res: NextApiResponse) {
     return res.status(405).json({ error: "Method not allowed" });
   }
 
-  const mode = process.env.NEXT_PUBLIC_CPL_MODE;
   const updates = req.body.updates;
 
   if (!Array.isArray(updates)) {

redux/slices/analogInputs/analogInputsHistorySlice.ts

@@ -0,0 +1,78 @@
+// /redux/slices/analogInputs/analogInputsHistory.ts
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import { getAnalogInputsHistoryThunk } from "../../thunks/getAnalogInputsHistoryThunk";
+
+export type AnalogInputsHistoryEntry = {
+  t: string;
+  m: number;
+};
+
+export interface InputHistoryState {
+  selectedId: number | null;
+  zeitraum: string;
+  vonDatum: string;
+  bisDatum: string;
+  isLoading: boolean;
+  error: string | null;
+  data: Record<string, AnalogInputsHistoryEntry[]>;
+  autoLoad: boolean;
+}
+
+const initialState: InputHistoryState = {
+  selectedId: null,
+  zeitraum: "DIA0",
+  vonDatum: "",
+  bisDatum: "",
+  isLoading: false,
+  error: null,
+  data: {},
+  autoLoad: false,
+};
+
+export const analogInputsHistorySlice = createSlice({
+  name: "analogInputsHistory",
+  initialState,
+  reducers: {
+    setSelectedId: (state, action: PayloadAction<number | null>) => {
+      state.selectedId = action.payload;
+    },
+    setAutoLoad: (state, action: PayloadAction<boolean>) => {
+      state.autoLoad = action.payload; // ✅ AutoLoad steuern
+    },
+    setZeitraum: (state, action: PayloadAction<string>) => {
+      state.zeitraum = action.payload;
+    },
+    setVonDatum: (state, action: PayloadAction<string>) => {
+      state.vonDatum = action.payload;
+    },
+    setBisDatum: (state, action: PayloadAction<string>) => {
+      state.bisDatum = action.payload;
+    },
+  },
+  extraReducers: (builder) => {
+    builder
+      .addCase(getAnalogInputsHistoryThunk.pending, (state) => {
+        state.isLoading = true;
+        state.error = null;
+      })
+      .addCase(getAnalogInputsHistoryThunk.fulfilled, (state, action) => {
+        const key = String(action.payload.eingang + 99);
+        state.data[key] = action.payload.daten;
+        state.isLoading = false;
+      })
+      .addCase(getAnalogInputsHistoryThunk.rejected, (state, action) => {
+        state.isLoading = false;
+        state.error = action.payload as string;
+      });
+  },
+});
+
+export const {
+  setSelectedId,
+  setAutoLoad,
+  setZeitraum,
+  setVonDatum,
+  setBisDatum,
+} = analogInputsHistorySlice.actions;
+
+export default analogInputsHistorySlice.reducer;

redux/slices/analogInputs/analogInputsSlice.ts

@@ -1,4 +1,4 @@
-// Redux Slice: redux/slices/analogInputsSlice.ts
+// Redux Slice: redux/slices/analogInputs/analogInputsSlice.ts
 import { createSlice, PayloadAction, createAsyncThunk } from "@reduxjs/toolkit";
 import type { AnalogInput } from "@/types/analogInput";
 

redux/slices/analogInputs/analogInputsUiSlice.ts

@@ -0,0 +1,23 @@
+// /redux/slices/analogInputs/analogInputsUiSlice.ts
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+
+interface AnalogInputsUiState {
+  isSettingsModalOpen: boolean;
+}
+
+const initialState: AnalogInputsUiState = {
+  isSettingsModalOpen: false,
+};
+
+const analogInputsUiSlice = createSlice({
+  name: "analogInputsUi",
+  initialState,
+  reducers: {
+    setIsSettingsModalOpen: (state, action: PayloadAction<boolean>) => {
+      state.isSettingsModalOpen = action.payload;
+    },
+  },
+});
+
+export const { setIsSettingsModalOpen } = analogInputsUiSlice.actions;
+export default analogInputsUiSlice.reducer;

redux/slices/analogInputs/selectedAnalogInputSlice.ts

@@ -0,0 +1,34 @@
+// redux/slices/analogInputs/selectedAnalogInputSlice.ts
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import type { AnalogInput } from "@/types/analogInput";
+
+// Anfangszustand: noch kein Eingang ausgewählt
+const initialState: AnalogInput = {
+  id: 0,
+  label: "",
+  value: 0,
+  name: "",
+};
+
+const selectedAnalogInputSlice = createSlice({
+  name: "selectedAnalogInput",
+  initialState,
+  reducers: {
+    setSelectedAnalogInput(state, action: PayloadAction<AnalogInput>) {
+      if (state) {
+        // Mutiert vorhandene Struktur (optional, wenn initialState nicht null sein darf)
+        Object.assign(state, action.payload);
+      } else {
+        return action.payload;
+      }
+    },
+    clearSelectedAnalogInput() {
+      return initialState;
+    },
+  },
+});
+
+export const { setSelectedAnalogInput, clearSelectedAnalogInput } =
+  selectedAnalogInputSlice.actions;
+
+export default selectedAnalogInputSlice.reducer;

redux/slices/analogInputsHistorySlice.ts

@@ -1,41 +0,0 @@
-// /redux/slices/analogInputsHistorySlice.ts
-import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-import { getAnalogInputsHistoryThunk } from "../thunks/getAnalogInputsHistoryThunk";
-
-type InputHistoryState = {
-  data: Record<number, any[]>;
-  isLoading: boolean;
-  error: string | null;
-};
-
-const initialState: InputHistoryState = {
-  data: {},
-  isLoading: false,
-  error: null,
-};
-
-const analogInputsHistorySlice = createSlice({
-  name: "analogInputsHistory",
-  initialState,
-  reducers: {},
-  extraReducers: (builder) => {
-    builder
-      .addCase(getAnalogInputsHistoryThunk.pending, (state) => {
-        state.isLoading = true;
-        state.error = null;
-      })
-      .addCase(
-        getAnalogInputsHistoryThunk.fulfilled,
-        (state, action: PayloadAction<Record<number, any[]>>) => {
-          state.data = action.payload;
-          state.isLoading = false;
-        }
-      )
-      .addCase(getAnalogInputsHistoryThunk.rejected, (state, action) => {
-        state.isLoading = false;
-        state.error = action.payload as string;
-      });
-  },
-});
-
-export default analogInputsHistorySlice.reducer;

redux/slices/selectedAnalogInputSlice.ts

@@ -1,29 +0,0 @@
-// /redux/slices/selectedAnalogInputSlice.ts
-import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-
-type SelectedAnalogInput = {
-  id: number;
-  label: string;
-  status: boolean;
-  loggerInterval: number;
-};
-
-const initialState: SelectedAnalogInput | null = null;
-// @ts-expect-error 123
-const selectedAnalogInputSlice = createSlice<SelectedAnalogInput | null>({
-  name: "selectedAnalogInput",
-  initialState,
-  reducers: {
-    setSelectedAnalogInput: (
-      _state,
-      action: PayloadAction<SelectedAnalogInput>
-    ) => action.payload,
-
-    resetSelectedAnalogInput: () => null,
-  },
-});
-
-export const { setSelectedAnalogInput, resetSelectedAnalogInput } =
-  selectedAnalogInputSlice.actions;
-
-export default selectedAnalogInputSlice.reducer;

redux/slices/systemChartSlice.ts

@@ -0,0 +1,48 @@
+// /redux/slices/systemChartSlice.ts
+import { createSlice } from "@reduxjs/toolkit";
+import { getSystemChartDataThunk } from "@/redux/thunks/getSystemChartDataThunk";
+
+interface ChartData {
+  [mode: string]: {
+    [type: number]: any;
+  };
+}
+
+interface SystemChartState {
+  data: ChartData;
+  loading: boolean;
+  error: string | null;
+}
+
+const initialState: SystemChartState = {
+  data: {},
+  loading: false,
+  error: null,
+};
+
+const systemChartSlice = createSlice({
+  name: "systemChartSlice",
+  initialState,
+  reducers: {},
+  extraReducers: (builder) => {
+    builder
+      .addCase(getSystemChartDataThunk.pending, (state) => {
+        state.loading = true;
+        state.error = null;
+      })
+      .addCase(getSystemChartDataThunk.fulfilled, (state, action) => {
+        state.loading = false;
+        const { mode, type } = action.meta.arg;
+        if (!state.data[mode]) {
+          state.data[mode] = {};
+        }
+        state.data[mode][type] = action.payload;
+      })
+      .addCase(getSystemChartDataThunk.rejected, (state, action) => {
+        state.loading = false;
+        state.error = action.payload as string;
+      });
+  },
+});
+
+export default systemChartSlice.reducer;

redux/store.ts

@@ -1,7 +1,5 @@
 // /redux/store.ts
 import { configureStore } from "@reduxjs/toolkit";
-import { persistReducer, persistStore } from "redux-persist";
-import storage from "redux-persist/lib/storage"; // = localStorage
 import authReducer from "./slices/authSlice";
 import kueChartModeReducer from "./slices/kueChartModeSlice";
 import webVersionReducer from "./slices/webVersionSlice";
@@ -12,7 +10,7 @@ import opcuaSettingsReducer from "./slices/opcuaSettingsSlice";
 import digitalOutputsReducer from "./slices/digitalOutputsSlice";
 import brushReducer from "./slices/brushSlice";
 import tdrChartReducer from "./slices/tdrChartSlice";
-import analogInputsSlice from "./slices/analogInputsSlice";
+import analogInputsSlice from "./slices/analogInputs/analogInputsSlice";
 import digitalInputsReducer from "./slices/digitalInputsSlice";
 import tdrReferenceChartReducer from "./slices/tdrReferenceChartSlice";
 import loopChartReducer from "./slices/loopChartSlice";
@@ -24,8 +22,8 @@ import tdmSingleChartReducer from "./slices/tdmSingleChartSlice";
 import tdrReferenceChartDataBySlotReducer from "./slices/tdrReferenceChartDataBySlotSlice";
 import loopChartTypeSlice from "./slices/loopChartTypeSlice";
 import systemVoltTempReducer from "./slices/systemVoltTempSlice";
-import analogInputsHistoryReducer from "./slices/analogInputsHistorySlice";
+import analogInputsHistoryReducer from "./slices/analogInputs/analogInputsHistorySlice";
-import selectedAnalogInputReducer from "./slices/selectedAnalogInputSlice";
+import selectedAnalogInputReducer from "./slices/analogInputs/selectedAnalogInputSlice";
 import messagesReducer from "./slices/messagesSlice";
 import firmwareUpdateReducer from "@/redux/slices/firmwareUpdateSlice";
 import confirmModalReducer from "./slices/confirmModalSlice";
@@ -38,21 +36,8 @@ import temperaturAdWandlerReducer from "./slices/temperaturAdWandlerSlice";
 import temperaturProzessorReducer from "./slices/temperaturProzessorSlice";
 import { combineReducers } from "@reduxjs/toolkit";
 import { useDispatch, useSelector, TypedUseSelectorHook } from "react-redux";
-
+import systemChartReducer from "./slices/systemChartSlice";
-//---------------------------------------
+import analogInputsUiReducer from "./slices/analogInputs/analogInputsUiSlice";
-// 🧠 Nur diese Slices werden persistiert
-const persistConfig = {
-  key: "root",
-  storage,
-  whitelist: [
-    "systemspannung5Vplus",
-    "systemspannung15Vplus",
-    "systemspannung15Vminus",
-    "systemspannung98Vminus",
-    "temperaturAdWandler",
-    "temperaturProzessor",
-  ],
-};
 
 const rootReducer = combineReducers({
   systemspannung5Vplus: systemspannung5VplusReducer,
@@ -61,8 +46,6 @@ const rootReducer = combineReducers({
   systemspannung98Vminus: systemspannung98VminusReducer,
   temperaturAdWandler: temperaturAdWandlerReducer,
   temperaturProzessor: temperaturProzessorReducer,
-  // Die restlichen Slices werden nicht persistiert, aber können hier auch aufgenommen werden,
-  // falls sie Teil des globalen States sein sollen:
   authSlice: authReducer,
   kueChartModeSlice: kueChartModeReducer,
   webVersionSlice: webVersionReducer,
@@ -72,7 +55,6 @@ const rootReducer = combineReducers({
   systemSettingsSlice: systemSettingsReducer,
   opcuaSettingsSlice: opcuaSettingsReducer,
   digitalOutputsSlice: digitalOutputsReducer,
-  analogInputs: analogInputsSlice,
   brushSlice: brushReducer,
   tdrChartSlice: tdrChartReducer,
   tdrReferenceChartSlice: tdrReferenceChartReducer,
@@ -85,29 +67,32 @@ const rootReducer = combineReducers({
   tdrReferenceChartDataBySlotSlice: tdrReferenceChartDataBySlotReducer,
   loopChartType: loopChartTypeSlice,
   systemVoltTemp: systemVoltTempReducer,
-  analogInputsHistory: analogInputsHistoryReducer,
-  selectedAnalogInput: selectedAnalogInputReducer,
   messages: messagesReducer,
   firmwareUpdate: firmwareUpdateReducer,
   confirmModal: confirmModalReducer,
   firmwareProgress: firmwareProgressReducer,
+  systemChartSlice: systemChartReducer,
+  analogInputs: analogInputsSlice,
+  analogInputsHistory: analogInputsHistoryReducer,
+  selectedAnalogInput: selectedAnalogInputReducer,
+  analogInputsUi: analogInputsUiReducer,
 });
+// ⬆️ Alle deine Imports und combineReducers bleiben so wie du sie geschrieben hast ...
 
-const persistedReducer = persistReducer(persistConfig, rootReducer);
+// ✅ Store erstellen
-
-//-------------------------------------------
-
 export const store = configureStore({
-  reducer: persistedReducer,
+  reducer: rootReducer,
+  // (optional) middleware anpassen, z. B. um Warnungen zu ignorieren:
+  middleware: (getDefaultMiddleware) =>
+    getDefaultMiddleware({
+      serializableCheck: false, // z. B. falls du redux-persist nutzt oder dispatch mit non-serializable Payloads hast
+    }),
 });
 
-export const persistor = persistStore(store);
+// ✅ Typen für AppDispatch & RootState
-
-// Typisierte Hooks
 export type RootState = ReturnType<typeof store.getState>;
 export type AppDispatch = typeof store.dispatch;
 
-export const useAppDispatch = () => useDispatch<AppDispatch>();
+// ✅ Hooks für Typsicherheit
+export const useAppDispatch: () => AppDispatch = useDispatch;
 export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;
-
-export default store;

redux/thunks/getAnalogInputsChartDataThunk.ts

@@ -0,0 +1,19 @@
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import { RootState } from "@/redux/store";
+
+export const getAnalogInputsChartDataThunk = createAsyncThunk(
+  "analogInputsChart/fetchChartData",
+  async (_, { getState }) => {
+    const state = getState() as RootState;
+    //const { zeitraum, vonDatum, bisDatum } = state.analogInputsChart;
+    const selectedInput = state.selectedAnalogInput;
+
+    if (!selectedInput) return [];
+
+    /*   const res = await fetch(
+      `/api/cpl/getAnalogInputsHistory?inputId=${selectedInput.id}&zeitraum=${zeitraum}&von=${vonDatum}&bis=${bisDatum}`
+    );
+    const data = await res.json();
+    return data; */
+  }
+);

redux/thunks/getAnalogInputsHistoryThunk.ts

@@ -1,15 +1,35 @@
-// /redux/thunks/getAnalogInputsHistoryThunk.ts
+// redux/thunks/getAnalogInputsHistoryThunk.ts
+
 import { createAsyncThunk } from "@reduxjs/toolkit";
-import { fetchAnalogInputsHistoryService } from "@/services/fetchAnalogInputsHistoryService";
+import { fetchAnalogInputsHistory } from "@/services/fetchAnalogInputsHistoryService";
+import { AnalogInputsHistoryEntry } from "@/redux/slices/analogInputs/analogInputsHistorySlice";
 
 export const getAnalogInputsHistoryThunk = createAsyncThunk(
   "analogInputsHistory/fetch",
-  async (_, { rejectWithValue }) => {
+  async (
+    {
+      eingang,
+      zeitraum,
+      vonDatum,
+      bisDatum,
+    }: {
+      eingang: number;
+      zeitraum: string;
+      vonDatum: string;
+      bisDatum: string;
+    },
+    thunkAPI
+  ) => {
     try {
-      const data = await fetchAnalogInputsHistoryService();
+      const response = await fetchAnalogInputsHistory(eingang, zeitraum);
-      return data;
+
+      return {
+        eingang,
+        zeitraum,
+        daten: response.daten as AnalogInputsHistoryEntry[],
+      };
     } catch (error: any) {
-      return rejectWithValue(error.message || "Unbekannter Fehler");
+      return thunkAPI.rejectWithValue(error.message ?? "Fehler beim Laden");
     }
   }
 );

redux/thunks/getAnalogInputsThunk.ts

@@ -1,7 +1,7 @@
 // /redux/thunks/getAnalogInputsThunk.ts
 import { createAsyncThunk } from "@reduxjs/toolkit";
 import { fetchAnalogInputsService } from "@/services/fetchAnalogInputsService";
-import { setAnalogInputs } from "@/redux/slices/analogInputsSlice";
+import { setAnalogInputs } from "@/redux/slices/analogInputs/analogInputsSlice";
 
 /**
  * Holt die analogen Eingänge von der API und speichert sie in Redux.

redux/thunks/getLoopChartDataThunk.ts

@@ -1,6 +1,6 @@
 // /redux/thunks/getLoopChartDataThunk.ts
 import { createAsyncThunk } from "@reduxjs/toolkit";
-import { fetchLoopChartData } from "../../services/fetchLoopChartDataService";
+import { fetchLoopChartData } from "@/services/fetchLoopChartDataService";
 
 interface FetchLoopChartDataParams {
   mode: "DIA0" | "DIA1" | "DIA2";

redux/thunks/getSystemChartDataThunk.ts

@@ -0,0 +1,35 @@
+// /redux/thunks/getSystemChartDataThunk.ts
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import { fetchSystemChartData } from "@/services/fetchSystemChartDataService";
+
+interface FetchSystemChartDataParams {
+  mode: "DIA0" | "DIA1" | "DIA2";
+  type: number;
+  slotNumber: number;
+  vonDatum: string;
+  bisDatum: string;
+}
+
+export const getSystemChartDataThunk = createAsyncThunk(
+  "systemChart/fetchSystemChartData",
+  async (params: FetchSystemChartDataParams, { rejectWithValue }) => {
+    try {
+      const data = await fetchSystemChartData(
+        params.mode,
+        params.type,
+        params.slotNumber,
+        params.vonDatum,
+        params.bisDatum
+      );
+
+      if (!data) {
+        return rejectWithValue("Keine Daten erhalten");
+      }
+
+      return data;
+    } catch (error: any) {
+      console.error("❌ Fehler in getSystemChartDataThunk:", error);
+      return rejectWithValue(error.message || "Unbekannter Fehler");
+    }
+  }
+);

services/fetchAnalogInputsHistoryService.ts

@@ -1,56 +1,24 @@
-// services/fetchAnalogInputsHistoryService.ts
+// services/fetchAnalogInputsHistory.ts
 
-export async function fetchAnalogInputsHistoryService(): Promise<
+import { AnalogInputsHistoryEntry } from "@/redux/slices/analogInputs/analogInputsHistorySlice";
-  Record<number, unknown[]>
-> {
-  const today = new Date();
-  const yesterday = new Date(today);
-  yesterday.setDate(today.getDate() - 1);
 
-  const formatDate = (date: Date) =>
+export async function fetchAnalogInputsHistory(
-    `${date.getFullYear()};${String(date.getMonth() + 1).padStart(
+  eingang: number,
-      2,
+  zeitraum: string
-      "0"
+): Promise<{ daten: AnalogInputsHistoryEntry[] }> {
-    )};${String(date.getDate()).padStart(2, "0")}`;
+  const res = await fetch(
+    `/api/cpl/getAnalogInputsHistory?eingang=${eingang}&zeitraum=${zeitraum}`
+  );
 
-  const fromDate = formatDate(yesterday);
+  if (!res.ok) {
-  const toDate = formatDate(today);
+    throw new Error("Serverantwort war nicht erfolgreich");
-
-  const result: Record<number, unknown[]> = {};
-
-  const isDev = process.env.NODE_ENV === "development";
-
-  if (isDev) {
-    try {
-      // ⬇️ ENTWICKLUNG: über API-Handler
-      const response = await fetch("/api/cpl/getAnalogInputsHistory");
-
-      // 🔍 Log: Rohantwort prüfen
-      console.log("📡 [DEV] Raw response:", response);
-
-      if (!response.ok) {
-        throw new Error(
-          `❌ Fehler beim Laden der Mock-Daten: ${response.statusText}`
-        );
-      }
-
-      // ✅ Versuch, JSON zu parsen
-      const data = await response.json();
-
-      // 🔍 Log: JSON anzeigen
-      //console.log("✅ [DEV] Parsed JSON:", data);
-
-      // 🔍 Validitätsprüfung (optional)
-      JSON.stringify(data); // Wenn das fehlschlägt, wird catch ausgelöst
-
-      return data;
-    } catch (error) {
-      console.error("❗ [DEV] Fehler beim Verarbeiten der JSON-Daten:", error);
-      return {};
-    }
   }
 
-  // ⬇️ PRODUKTION: direkt vom CPL-Webserver holen
+  const json = await res.json();
+  return { daten: json.daten }; // Nur das Feld "daten" extrahieren
+}
+
+/*   // ⬇️ PRODUKTION: direkt vom CPL-Webserver holen
   for (let i = 0; i < 8; i++) {
     const inputNumber = i + 1;
     const sourceId = 99 + inputNumber;
@@ -70,3 +38,4 @@ export async function fetchAnalogInputsHistoryService(): Promise<
 
   return result;
 }
+ */

services/fetchSystemChartDataService.ts

@@ -0,0 +1,81 @@
+// /services/fetchSystemChartDataService.ts
+/**
+ * hier ist nur noch ein Test, wenn nicht gebraucht, kann die Datei gelöscht werden.
+ */
+const getApiUrl = (
+  mode: "DIA0" | "DIA1" | "DIA2",
+  type: number,
+  slotNumber: number,
+  vonDatum: string,
+  bisDatum: string
+) => {
+  if (!slotNumber) {
+    console.error("⚠️ Slot-Nummer nicht gesetzt!");
+    return "";
+  }
+  // type: 3 → Isolationswiderstand
+  // type: 4 → Schleifenwiderstand
+  const typeFolder =
+    type === 3
+      ? "isolationswiderstand"
+      : type === 4
+      ? "schleifenwiderstand"
+      : "unbekannterTyp";
+
+  return process.env.NEXT_PUBLIC_NODE_ENV === "development"
+    ? `/api/cpl/slotDataAPIHandler?slot=${slotNumber}&messart=${typeFolder}&dia=${mode}&vonDatum=${vonDatum}&bisDatum=${bisDatum}`
+    : `${window.location.origin}/CPL?seite.ACP&${mode}=${formatDate(
+        vonDatum
+      )};${formatDate(bisDatum)};${slotNumber};${type};`;
+};
+
+/**
+ * Wandelt ein Datum von "YYYY-MM-DD" zu "YYYY;MM;DD" um (für die API-URL).
+ */
+const formatDate = (dateString: string) => {
+  const dateParts = dateString.split("-");
+  return `${dateParts[0]};${dateParts[1]};${dateParts[2]}`;
+};
+
+/**
+ * Holt die Messwerte vom Embedded-System oder einer JSON-Datei.
+ */
+export const fetchSystemChartData = async (
+  mode: "DIA0" | "DIA1" | "DIA2",
+  type: number,
+  slotNumber: number,
+  vonDatum: string,
+  bisDatum: string
+) => {
+  try {
+    const apiUrl = getApiUrl(mode, type, slotNumber, vonDatum, bisDatum);
+    if (!apiUrl) {
+      throw new Error(
+        "❌ Keine gültige API-URL! in /services/fetchSystemChartData.ts"
+      );
+    }
+
+    console.log(
+      `📡 Fetching data from in /services/fetchSystemChartData.ts: ${apiUrl}`
+    );
+    const response = await fetch(apiUrl);
+
+    if (!response.ok) {
+      throw new Error(`❌ Fehler: ${response.status} ${response.statusText}`);
+    }
+
+    const data = await response.json();
+    console.log(
+      "✅ Daten erfolgreich geladen in /services/fetchSystemChartData.ts:",
+      data
+    );
+
+    return data;
+  } catch (error) {
+    console.error(
+      "❌ Fehler beim Laden der Schleifenmesskurvendaten in /services/fetchSystemChartData.ts:",
+      error
+    );
+    return null;
+  }
+};

types/analogInput.ts

@@ -5,6 +5,7 @@ export interface AnalogInput {
   unit?: string;
   value: number;
   name: string;
+  loggerInterval?: string;
 
   // Statusflags
   isUnderWarning?: boolean;
@@ -13,8 +14,8 @@ export interface AnalogInput {
   isOverLimit?: boolean;
 
   // Weitere optionale Felder
-  offset?: number;
+  offset?: number | string;
-  factor?: number;
+  factor?: number | string;
   weighting?: number;
 
   // Zusätzliche Felder im Slice