Merge branch 'v1.0.8.1' into fix/ohne-externe-babel

hooks/layers/useGmaMarkersLayer - Kopie.js

@@ -0,0 +1,79 @@
+import { useEffect } from "react";
+import { addContextMenuToMarker } from "../../utils/addContextMenuToMarker";
+
+const useMarkersLayer = (map, markers, GisStationsMeasurements, GMA, oms) => {
+  useEffect(() => {
+    if (!map) return;
+
+    // Entferne alte Marker
+    GMA.clearLayers();
+
+    // Hinzufügen neuer Marker
+    markers.forEach((marker) => {
+      // Finde die Messungen, die zu diesem Marker gehören
+      const relevantMeasurements = GisStationsMeasurements.filter((m) => m.Area_Name === marker.options.areaName);
+
+      let measurements = {};
+      let area_name = marker.options.areaName;
+
+      relevantMeasurements.forEach((m) => {
+        measurements[m.Na] = m.Val;
+      });
+
+      // Überprüfe, ob die Messwerte vorhanden sind, und setze Standardwerte
+      const lt = measurements["LT"] || "---";
+      const fbt = measurements["FBT"] || "---";
+      const gt = measurements["GT"] || "---";
+      const rlf = measurements["RLF"] || "---";
+
+      console.log(`Station oder Bereich ${area_name} - LT: ${lt}, FBT: ${fbt}, GT: ${gt}, RLF: ${rlf}`);
+
+      // Tooltip für den Marker binden
+      marker.bindTooltip(
+        `
+          <div class="p-0 rounded-lg bg-white bg-opacity-90">
+            <div class="font-bold text-sm text-black">
+              <span>${area_name}</span> 
+            </div>
+            <div class="font-bold text-xxs text-blue-700">
+              <span>LT : ${lt} °C</span> 
+            </div>
+            <div class="font-bold text-xxs text-red-700">
+              <span>FBT : ${fbt} °C</span> 
+            </div>
+            <div class="font-bold text-xxs text-yellow-500">
+              <span>GT : ${gt}</span> 
+            </div>
+            <div class="font-bold text-xxs text-green-700">
+              <span>RLF : ${rlf} %</span> 
+            </div>
+          </div>
+        `,
+        {
+          permanent: true,
+          direction: "auto",
+          offset: [60, 0],
+        }
+      );
+
+      // Ereignisse für das Öffnen und Schließen des Tooltips
+      marker.on("mouseover", function () {
+        this.openPopup();
+      });
+      marker.on("mouseout", function () {
+        this.closePopup();
+      });
+
+      // Kontextmenü hinzufügen
+      addContextMenuToMarker(marker);
+
+      // Füge den Marker zur Layer-Gruppe hinzu
+      GMA.addLayer(marker);
+      oms.addMarker(marker);
+    });
+
+    map.addLayer(GMA);
+  }, [map, markers, GisStationsMeasurements, GMA, oms]);
+};
+
+export default useMarkersLayer;

hooks/layers/useSmsfunkmodemMarkersLayer.js

@@ -11,7 +11,7 @@ const useSmsfunkmodemMarkersLayer = (map, oms, GisSystemStatic, priorityConfig,
     if (!map || !GisSystemStatic) return;
 
     // Debugging: Logge die Sichtbarkeit und die übergebenen Daten
-    //console.log("isVisible für SMS Modem:", isVisible);
+    console.log("isVisible für SMS Modem:", isVisible);
     console.log("Alle Stationen in GisSystemStatic:", GisSystemStatic);
 
     // Hilfsfunktion: Normalisiert Strings

hooks/useLineData-back.js

@@ -1,124 +0,0 @@
-import { useEffect, useState } from "react";
-import { SERVER_URL } from "../config/urls";
-import { useDispatch, useSelector } from "react-redux";
-
-const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
-  const dispatch = useDispatch();
-  const messages = useSelector((state) => state.messages);
-  const [lineColors, setLineColors] = useState({});
-  const [tooltipContents, setTooltipContents] = useState({});
-
-  useEffect(() => {
-    let isCancelled = false;
-
-    const fetchData = async () => {
-      try {
-        const response1 = await fetch(webserviceGisLinesStatusUrl);
-        const data1 = await response1.json();
-
-        const response2 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/readGisLines`);
-        const data2 = await response2.json();
-
-        const response3 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/device/getAllStationsNames`);
-        const namesData = await response3.json();
-
-        if (!isCancelled) {
-          const colorsByModule = {};
-          const newTooltipContents = {};
-          const valueMap = {};
-
-          const sortedStatis = [...data1.Statis].sort((a, b) => a.Level - b.Level);
-
-          sortedStatis.forEach((statis) => {
-            const key = `${statis.IdLD}-${statis.Modul}`;
-
-            if (!valueMap[key]) {
-              valueMap[key] = {
-                messages: [],
-                messwert: undefined,
-                schleifenwert: undefined,
-              };
-            }
-
-            if (statis.DpName.endsWith("_Messwert") && statis.Value !== "True" && !valueMap[key].messwert) {
-              valueMap[key].messwert = statis.Value;
-            }
-            if (statis.DpName.endsWith("_Schleifenwert") && !valueMap[key].schleifenwert) {
-              valueMap[key].schleifenwert = statis.Value;
-            }
-
-            if (statis.Message && statis.Message !== "?") {
-              valueMap[key].messages.push({
-                message: statis.Message,
-                prioColor: statis.PrioColor && statis.PrioColor !== "#ffffff" ? statis.PrioColor : "green",
-              });
-            }
-          });
-
-          sortedStatis.forEach((statis) => {
-            const key = `${statis.IdLD}-${statis.Modul}`;
-            const matchingLine = data2.find((item) => item.idLD === statis.IdLD && item.idModul === statis.Modul);
-
-            if (matchingLine) {
-              const values = valueMap[key];
-
-              const messageDisplay = values.messages.map((msg) => `<span class="inline-block text-gray-800"><span class="inline-block w-2 h-2 rounded-full mr-2" style="background-color: ${msg.prioColor};"></span>${msg.message}</span><br>`).join("");
-
-              const prioNameDisplay = statis.PrioName && statis.PrioName !== "?" ? `(${statis.PrioName})` : "";
-
-              colorsByModule[key] = values.messages.length > 0 ? values.messages[0].prioColor : "green";
-
-              newTooltipContents[key] = `
-                <div class="bg-white rounded-lg m-0 p-2 w-[210px]">
-                  <span class="text-lg font-semibold text-gray-900">${statis.ModulName || "Unknown"}</span>
-                  <br>
-                  <span class="text-md font-bold text-gray-800">${statis.ModulTyp || "N/A"}</span>
-                  <br>
-                  <span class="text-md font-bold text-gray-800">Slot: ${statis.Modul || "N/A"}</span>
-                  <br>
-                  <span class="text-md font-bold text-gray-800">Station: ${namesData[matchingLine.idLD] || "N/A"}</span>
-                  <br>
-                  <div style="max-width: 100%; overflow-wrap: break-word; word-break: break-word; white-space: normal;">
-                    ${messageDisplay}
-                  </div>
-                  <br>
-                  ${values.messwert ? `<span class="inline-block text-gray-800">Messwert: ${values.messwert}</span><br>` : ""}
-                  ${values.schleifenwert ? `<span class="inline-block text-gray-800">Schleifenwert: ${values.schleifenwert}</span>` : ""}
-                </div>
-              `;
-            }
-          });
-
-          setLineColors(colorsByModule);
-          setTooltipContents(newTooltipContents);
-          setLineStatusData(data1.Statis);
-        }
-      } catch (error) {
-        console.error("Fehler beim Abrufen der Daten:", error);
-        try {
-          window.location.reload();
-        } catch (reloadError) {
-          console.error("Fehler beim Neuladen der Seite:", reloadError);
-        }
-      }
-    };
-
-    const scheduleNextFetch = () => {
-      if (!isCancelled) {
-        fetchData();
-        setTimeout(scheduleNextFetch, 30000);
-      }
-    };
-
-    fetchData();
-    scheduleNextFetch();
-
-    return () => {
-      isCancelled = true;
-    };
-  }, [webserviceGisLinesStatusUrl, setLineStatusData]);
-
-  return { lineColors, tooltipContents };
-};
-
-export default useLineData;