Marker aktualisieren alle 60 Sekunden, später in Redux lösen

.env.local

@@ -7,7 +7,7 @@ DB_NAME=talas_v5
 DB_PORT=3306
 
 # Public Settings (Client braucht IP/Domain)
-NEXT_PUBLIC_SERVER_URL="http://192.168.10.33"   # oder evtl. später https://nodemap.firma.de
+NEXT_PUBLIC_SERVER_URL="http://10.10.0.70"   # oder evtl. später https://nodemap.firma.de
 NEXT_PUBLIC_ENABLE_GEOCODER=true
-NEXT_PUBLIC_USE_MOCK_API=true
+NEXT_PUBLIC_USE_MOCK_API=false
 

components/MapComponent.js

@@ -253,9 +253,18 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     mapLayersVisibility.SMSFunkmodem // Sichtbarkeitsstatus aus dem State
   ); */
 
+  const useMock = process.env.NEXT_PUBLIC_USE_MOCK_API === "true";
   useEffect(() => {
     const fetchWebServiceMap = async () => {
       try {
+        let stationsStaticUrl = useMock ? "/mockData/gisStationsStaticDistrictMock.json" : mapGisStationsStaticDistrictUrl;
+
+        let stationsStatusUrl = useMock ? "/mockData/gisStationsStatusDistrictMock.json" : mapGisStationsStatusDistrictUrl;
+
+        let stationsMeasurementsUrl = useMock ? "/mockData/gisStationsMeasurementsMock.json" : mapGisStationsMeasurementsUrl;
+
+        let systemStaticUrl = useMock ? "/mockData/gisSystemStaticMock.json" : mapGisSystemStaticUrl;
+
         // Zähler für externe API-Aufrufe in localStorage speichern
         let requestCount = localStorage.getItem("fetchWebServiceMap") || 0;
         requestCount = parseInt(requestCount, 10);
@@ -823,9 +832,9 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     updateAllMarkers();
 
     // Setze ein Intervall für regelmäßige Updates
-    /*     const intervalId = setInterval(() => {
+    const intervalId = setInterval(() => {
       updateAllMarkers();
-    }, 60000); // 20 Sekunden
+    }, 60000); // 60 Sekunden dann werden die Marker aktualisiert, später mit Redux Store lösen, damit nicht flackert
 
     // Aufräumen bei Komponentenentladung
     return () => {
@@ -837,7 +846,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
           ref.current.clearLayers();
         }
       });
-    }; */
+    };
   }, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
 
   //---------------------------------------
@@ -914,6 +923,13 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   //--------------------------------------------
   const fetchGisStationsStaticDistrict = async (idMap, idUser, dispatch) => {
     try {
+      let stationsStaticUrl = useMock ? "/mockData/gisStationsStaticDistrictMock.json" : mapGisStationsStaticDistrictUrl;
+
+      let stationsStatusUrl = useMock ? "/mockData/gisStationsStatusDistrictMock.json" : mapGisStationsStatusDistrictUrl;
+
+      let stationsMeasurementsUrl = useMock ? "/mockData/gisStationsMeasurementsMock.json" : mapGisStationsMeasurementsUrl;
+
+      let systemStaticUrl = useMock ? "/mockData/gisSystemStaticMock.json" : mapGisSystemStaticUrl;
       // API-Endpunkt mit Query-Parametern aufrufen
       const response = await fetch(`/api/gisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`);
 
@@ -977,6 +993,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   }, [map, menuItemAdded]);
   //--------------------------------------------
 
+  //----------------------------------------------
+
   return (
     <>
       <ToastContainer />

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.8";
+export const APP_VERSION = "1.1.9";

public/mockData/gisStationsStatusDistrictMock.json

@@ -8,7 +8,7 @@
       "Na": "system",
       "Le": 4,
       "Co": "#FF00FF",
-      "Me": "Eingang DE 01 test",
+      "Me": "Eingang DE 01 test3",
       "Feld": 4,
       "Icon": 0
     },

utils/createAndSetDevices.js

@@ -84,7 +84,7 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste
 
       marker.bindPopup(`
                 <div class="bg-white rounded-lg">
-                    <span class="text-lg font-semibold text-gray-900">${station.LD_Name}</span>
+                    <span class="text-lg font-semibold text-gray-900"> ${station.LD_Name}</span>
                     <span class="text-md font-bold text-gray-800">${station.Device}</span><br>
                     <span class="text-gray-800"><strong>${station.Area_Short}</strong> (${station.Area_Name})</span><br>
                     <span class="text-gray-800"><strong>${station.Location_Short}</strong> (${station.Location_Name})</span>

utils/utils.js

@@ -68,7 +68,7 @@ export const createAndSetMarkers = async (systemId, setMarkersFunction) => {
 
         marker.bindPopup(`
               <div class=" bg-white rounded-lg ">
-                <span class="text-lg font-semibold text-gray-900">${station.LD_Name}</span>
+                <span class="text-lg font-semibold text-gray-900">test zum löschen ${station.LD_Name}</span>
                 <span class="text-md font-bold text-gray-800"> ${station.Device}</span><br>
                 <span class="text-gray-800"><strong> ${station.Area_Short} </strong>(${station.Area_Name})</span><br>
                 <span class="text-gray-800"><strong>${station.Location_Short} </strong> (${station.Location_Name})</span>