From ddd39bc1ef364d33b4bea363fd66e42797abeef4 Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 26 Apr 2024 08:50:15 +0200 Subject: [PATCH] Sonstige Popup per mouseove --- components/DataSheet.js | 14 +++---- components/MapComponent.js | 78 +++++++++++++++++++------------------- config/config.js | 8 ++-- pages/api/[...path].js | 4 +- 4 files changed, 51 insertions(+), 53 deletions(-) diff --git a/components/DataSheet.js b/components/DataSheet.js index 8c282129f..9de9c7eb3 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -18,11 +18,11 @@ function DataSheet() { const GisSystemStatic = useRecoilValue(gisSystemStaticState); useEffect(() => { - console.log( + /* console.log( "GisStationsStaticDistrict in DataSheet:", GisStationsStaticDistrict ); - console.log("GisSystemStatic in DataSheet:", GisSystemStatic); + console.log("GisSystemStatic in DataSheet:", GisSystemStatic); */ // Filtern der eindeutigen Gebiete (Areas) und alphabetisches Sortieren const seenNames = new Set(); @@ -63,7 +63,7 @@ function DataSheet() { name: area.Name, })); setSystemListing(newSystemListing); - console.log("System Listing:", systemListing); + //console.log("System Listing:", systemListing); }, [GisStationsStaticDistrict]); const [checkedStations, setCheckedStations] = useState({}); @@ -194,23 +194,23 @@ function DataSheet() { }; const handleStationChange = (event) => { - console.log("Station selected:", event.target.value); + //console.log("Station selected:", event.target.value); }; const resetView = () => { console.log("View has been reset"); }; useEffect(() => { - console.log("Checked Stations:", checkedStations); + //console.log("Checked Stations:", checkedStations); // Wenn systemListing.name == "TALAS" ist, gib in der Konsole aus const talasStation = systemListing.find( (station) => station.name === "TALAS" ); if (talasStation) { - console.log( + /* console.log( "TALAS Station ist gecheckt:", checkedStations[talasStation.id] - ); + ); */ } }, [checkedStations, systemListing]); const eciStation = systemListing.find((station) => station.name === "ECI"); diff --git a/components/MapComponent.js b/components/MapComponent.js index 8b18e3214..5fe7b3a05 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -176,7 +176,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { // Prüfen, ob die Antwort das erwartete Format hat und Daten enthält if (jsonResponse && jsonResponse.Systems) { setGisSystemStatic(jsonResponse.Systems); // Direkter Zugriff auf 'Systems' - console.log("GisSystemStatic:", jsonResponse.Systems); + // console.log("GisSystemStatic:", jsonResponse.Systems); } else { console.error( 'Erwartete Daten im "Systems"-Array nicht gefunden', @@ -212,7 +212,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { useEffect(() => { if (typeof window !== "undefined") { - console.log("Window height from config:", config.windowHeight); + //console.log("Window height from config:", config.windowHeight); } }, []); @@ -798,7 +798,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, talasMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("talasMarkers", talasMarkers); + //console.log("talasMarkers", talasMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -819,7 +819,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, eciMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("eciMarkers", eciMarkers); + //console.log("eciMarkers", eciMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -840,7 +840,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, gsmModemMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("gsmModemMarkers", gsmModemMarkers); + //console.log("gsmModemMarkers", gsmModemMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -861,7 +861,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, ciscoRouterMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("ciscoRouterMarkers", ciscoRouterMarkers); + //console.log("ciscoRouterMarkers", ciscoRouterMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -884,7 +884,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } // }, [map, wagoMarkers, mapLayersVisibility.WAGO]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken }, [map, wagoMarkers]); - console.log("wagoMarkers", wagoMarkers); + //console.log("wagoMarkers", wagoMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -905,7 +905,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, siemensMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("siemensMarkers", siemensMarkers); + //console.log("siemensMarkers", siemensMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -926,7 +926,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, otdrMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("otdrMarkers", otdrMarkers); + //console.log("otdrMarkers", otdrMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -947,7 +947,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, wdmMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("wdmMarkers", wdmMarkers); + //console.log("wdmMarkers", wdmMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -971,7 +971,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { let measurementGT = measurements["GT"]; let measurementRLF = measurements["RLF"]; - console.log( + /* console.log( "area_name", area_name, "------measurementLT", @@ -983,7 +983,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { "------measurementRLF", measurements.RLF ); - console.log("measurements", measurements); + console.log("measurements", measurements); */ gmaMarkers.forEach((marker) => { marker.addTo(map); oms.addMarker(marker); @@ -1002,7 +1002,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { FBT : ${measurements.FBT} °C
- GT : ${measurements.GT === 'nicht ermittelbar' ? measurements.GT : `${measurements.GT} °C`} + GT : ${measurements.GT === "nicht ermittelbar" ? measurements.GT : `${measurements.GT} °C`}
RLF : ${measurements.RLF} % @@ -1014,7 +1014,6 @@ const MapComponent = ({ locations, onLocationUpdate }) => { direction: "auto", // oder 'top', 'bottom', 'left', 'right' } ); - // Popup beim Überfahren mit der Maus öffnen und schließen marker.on("mouseover", function () { @@ -1028,7 +1027,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, gmaMarkers]); // Abhängigkeiten auf `map` und `gmaMarkers` beschränken - console.log("gmaMarkers", gmaMarkers); + //console.log("gmaMarkers", gmaMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- @@ -1050,7 +1049,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, messstellenMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("messstellenMarkers", messstellenMarkers); + //console.log("messstellenMarkers", messstellenMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -1071,7 +1070,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, talasiclMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("talasiclMarkers", talasiclMarkers); + //console.log("talasiclMarkers", talasiclMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -1090,7 +1089,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, dauzMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("dauzMarkers", dauzMarkers); + //console.log("dauzMarkers", dauzMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -1109,27 +1108,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, smsfunkmodemMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("smsfunkmodemMarkers", smsfunkmodemMarkers); - //------------------------------------------- - //-------------------------------------------------------------------------------- - /* useEffect(() => { - // Drucker ist hier und noch eine Marker "SNMP" - if (map && sonstigeMarkers.length) { - sonstigeMarkers.forEach((marker) => { - marker.addTo(map); - - // Popup beim Überfahren mit der Maus öffnen und schließen - marker.on("mouseover", function () { - this.openPopup(); - }); - marker.on("mouseout", function () { - this.closePopup(); - }); - }); - } - }, [map, sonstigeMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - - console.log("sonstigeMarkers", sonstigeMarkers); */ + //console.log("smsfunkmodemMarkers", smsfunkmodemMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- useEffect(() => { @@ -1148,7 +1127,26 @@ const MapComponent = ({ locations, onLocationUpdate }) => { } }, [map, ulafMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken - console.log("ulafMarkers", ulafMarkers); + //console.log("ulafMarkers", ulafMarkers); + //------------------------------------------- + //-------------------------------------------------------------------------------- + useEffect(() => { + if (map && sonstigeMarkers.length) { + sonstigeMarkers.forEach((marker) => { + marker.addTo(map); + + // Popup beim Überfahren mit der Maus öffnen und schließen + marker.on("mouseover", function () { + this.openPopup(); + }); + marker.on("mouseout", function () { + this.closePopup(); + }); + }); + } + }, [map, sonstigeMarkers]); // Abhängigkeiten auf `map` und `talasMarkers` beschränken + + //console.log("sonstige", sonstigeMarkers); //------------------------------------------- //-------------------------------------------------------------------------------- diff --git a/config/config.js b/config/config.js index 0319da2b9..6357eb528 100644 --- a/config/config.js +++ b/config/config.js @@ -31,17 +31,17 @@ if (typeof window !== "undefined") { user = url.searchParams.get("u") || "485"; // Ein weiterer Parameter aus der URL, Standardwert ist '487 oder 484 oder 485' // Konstruktion von URLs, die auf spezifische Ressourcen auf dem Server zeigen - /* mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${c}&idUser=${user}`; + mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${c}&idUser=${user}`; mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap=${c}&idUser=${user}`; mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap=${c}`; mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=${c}&idUser=${user}`; - mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`; */ + mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`; - mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict`; + /* mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict`; mapGisStationsStatusDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict`; mapGisStationsMeasurementsUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements`; mapGisSystemStaticUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic`; - mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`; + mapDataIconUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic`; */ // URLs zu Offline-Daten, falls benötigt } diff --git a/pages/api/[...path].js b/pages/api/[...path].js index 49efc5183..299b2253b 100644 --- a/pages/api/[...path].js +++ b/pages/api/[...path].js @@ -2,8 +2,8 @@ import { createProxyMiddleware } from "http-proxy-middleware"; export default createProxyMiddleware({ - //target: "http://10.10.0.13", // Ziel-URL des Proxys - target: "http://192.168.10.187:3000", // Ziel-URL des Proxys + target: "http://10.10.0.13", // Ziel-URL des Proxys + //target: "http://192.168.10.187:3000", // Ziel-URL des Proxys changeOrigin: true, pathRewrite: { "^/api": "/", // Optional: Entfernt /api aus dem Pfad, wenn das Backend dies nicht erfordert