feat: API-Route für gefilterte Mock-Daten implementiert

- Neue Route /api/cpl/slotData erstellt
- Lädt Daten aus /public/CPLmockData/kuesChartData/... basierend auf slot, messart und dia
- Optionales Filtern über vonDatum und bisDatum hinzugefügt
- 404-Fehler bei fehlender Datei wird abgefangen

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

@@ -1,4 +1,5 @@
 "use client";
+// /components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx
 import React from "react";
 import DateRangePicker from "./DateRangePicker";
 import { useDispatch, useSelector } from "react-redux";
@@ -33,6 +34,11 @@ export const useLoopChartLoader = () => {
   ) => {
     const typeFolder =
       type === 3 ? "isolationswiderstand" : "schleifenwiderstand";
+
+    if (process.env.NODE_ENV === "development") {
+      return `/api/cpl/slotData?slot=${slotNumber}&messart=${typeFolder}&dia=${mode}&vonDatum=${vonDatum}&bisDatum=${bisDatum}`;
+    }
+
     return `${window.location.origin}/CPL?seite.ACP&${mode}=${formatDate(
       vonDatum
     )};${formatDate(bisDatum)};${slotNumber};${type};`;
@@ -105,10 +111,12 @@ const LoopChartActionBar: React.FC = () => {
 
     const baseUrl =
       process.env.NODE_ENV === "development"
-        ? `/CPLmockData/kuesChartData/slot${slotNumber}/${typeFolder}/${mode}.json`
+        ? // ? `/CPLmockData/kuesChartData/slot${slotNumber}/${typeFolder}/${mode}.json`
+          `/api/cpl/slotData?slot=${slotNumber}&messart=${typeFolder}&dia=${mode}&vonDatum=${vonDatum}&bisDatum=${bisDatum}`
         : `${window.location.origin}/CPL?seite.ACP&${mode}=${formatDate(
             vonDatum
           )};${formatDate(bisDatum)};${slotNumber};${type};`;
+    console.log("baseUrl", baseUrl);
 
     return baseUrl;
   };

next.config.mjs

@@ -1,7 +1,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true, // Aktiviert Strict Mode zur Identifizierung potenzieller Probleme in der Anwendung
-  output: "export", // Stellt sicher, dass Next.js eine statische Version der Website generiert (SSG)
+  // output: "export", // Stellt sicher, dass Next.js eine statische Version der Website generiert (SSG)
   trailingSlash: false, // Fügt einen Schrägstrich am Ende der URLs hinzu (nützlich für statische Verzeichnisse)
   images: {
     unoptimized: true, // Verzichtet auf Next.js' Bildoptimierung (nützlich für statische Exporte)

pages/api/cpl/slotData.ts

@@ -0,0 +1,50 @@
+import { NextApiRequest, NextApiResponse } from "next";
+import path from "path";
+import fs from "fs/promises";
+
+// Hilfsfunktion: JSON-Datei laden
+async function loadJsonData(filePath: string) {
+  const data = await fs.readFile(filePath, "utf8");
+  return JSON.parse(data);
+}
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  const { slot, messart, dia, vonDatum, bisDatum } = req.query;
+
+  if (!slot || !messart || !dia) {
+    return res.status(400).json({ error: "Missing required parameters" });
+  }
+
+  const jsonFilePath = path.join(
+    process.cwd(),
+    "public",
+    "CPLmockData",
+    "kuesChartData",
+    `slot${slot}`,
+    `${messart}`,
+    `${dia}.json`
+  );
+
+  try {
+    const jsonData = await loadJsonData(jsonFilePath);
+
+    // Filtern nach Datum, wenn angegeben
+    let filteredData = jsonData;
+    if (vonDatum && bisDatum) {
+      const von = new Date(`${vonDatum}T00:00:00`);
+      const bis = new Date(`${bisDatum}T23:59:59`);
+
+      filteredData = jsonData.filter((item: any) => {
+        const timestamp = new Date(item.t);
+        return timestamp >= von && timestamp <= bis;
+      });
+    }
+
+    return res.status(200).json(filteredData);
+  } catch (error) {
+    return res.status(404).json({ error: "File not found or read error" });
+  }
+}

pages/api/test.ts

@@ -0,0 +1,11 @@
+// pages/api/test.ts
+
+import { NextApiRequest, NextApiResponse } from "next";
+
+export default function handler(req: NextApiRequest, res: NextApiResponse) {
+  res.status(200).json({
+    message: "✅ Die API ist erreichbar!",
+    method: req.method,
+    timestamp: new Date().toISOString(),
+  });
+}

services/fetchLoopChartData.ts

@@ -23,7 +23,8 @@ const getApiUrl = (
       : "unbekannterTyp";
 
   return process.env.NEXT_PUBLIC_NODE_ENV === "development"
-    ? `/CPLmockData/kuesChartData/slot${slotNumber}/${typeFolder}/${mode}.json`
+    ? // ? `/CPLmockData/kuesChartData/slot${slotNumber}/${typeFolder}/${mode}.json`
+      `/api/cpl/slotData?slot=${slotNumber}&messart=${typeFolder}&dia=${mode}&vonDatum=${vonDatum}&bisDatum=${bisDatum}`
     : `${window.location.origin}/CPL?seite.ACP&${mode}=${formatDate(
         vonDatum
       )};${formatDate(bisDatum)};${slotNumber};${type};`;