diff --git a/components/DataSheet.js b/components/DataSheet.js index a0af8ef57..e0043a40f 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -5,6 +5,7 @@ import { gisStationsStaticDistrictState } from "../store/gisStationState"; import { gisSystemStaticState } from "../store/gisSystemState"; import { mapLayersState } from "../store/mapLayersState"; import { selectedAreaState } from "../store/selectedAreaState"; +import { zoomTriggerState } from "../store/zoomTriggerState"; function DataSheet() { const setSelectedArea = useSetRecoilState(selectedAreaState); @@ -72,20 +73,26 @@ function DataSheet() { ); }, [GisStationsStaticDistrict, GisSystemStatic]); -const handleCheckboxChange = (name, event) => { - const { checked } = event.target; - //console.log(`Checkbox ${name} checked state:`, checked); // Log the checked state of the checkbox + const handleCheckboxChange = (name, event) => { + const { checked } = event.target; + //console.log(`Checkbox ${name} checked state:`, checked); // Log the checked state of the checkbox - setMapLayersVisibility((prev) => { - const newState = { - ...prev, - [name]: checked, - }; - //console.log(`New mapLayersVisibility state:`, newState); // Log the new state after update - return newState; - }); -}; + setMapLayersVisibility((prev) => { + const newState = { + ...prev, + [name]: checked, + }; + //console.log(`New mapLayersVisibility state:`, newState); // Log the new state after update + return newState; + }); + }; + //--------------------------------------------------------- + const setZoomTrigger = useSetRecoilState(zoomTriggerState); + const handleIconClick = () => { + setZoomTrigger((current) => current + 1); // Trigger durch Inkrementierung + }; + //--------------------------------------------------------- return (
{ Expand
diff --git a/components/MapComponent.js b/components/MapComponent.js index 874e23064..9ce11744c 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -14,6 +14,7 @@ import { gisStationsStaticDistrictState } from "../store/gisStationState"; import { gisSystemStaticState } from "../store/gisSystemState"; import { mapLayersState } from "../store/mapLayersState"; import { selectedAreaState } from "../store/selectedAreaState"; +import { zoomTriggerState } from "../store/zoomTriggerState"; const MapComponent = ({ locations, onLocationUpdate }) => { const poiLayerRef = useRef(null); // Referenz auf die Layer-Gruppe für Datenbank-Marker @@ -1459,48 +1460,64 @@ const MapComponent = ({ locations, onLocationUpdate }) => { //------------------------------------------ */ const selectedArea = useRecoilValue(selectedAreaState); -// Combine all markers into a single array -const allMarkers = [ - ...talasMarkers, - ...eciMarkers, - ...gsmModemMarkers, - ...ciscoRouterMarkers, - ...wagoMarkers, - ...siemensMarkers, - ...otdrMarkers, - ...wdmMarkers, - ...gmaMarkers, - ...messstellenMarkers, - ...talasiclMarkers, - ...dauzMarkers, - ...smsfunkmodemMarkers, - ...sonstigeMarkers, - ...ulafMarkers, -]; + // Combine all markers into a single array + const allMarkers = [ + ...talasMarkers, + ...eciMarkers, + ...gsmModemMarkers, + ...ciscoRouterMarkers, + ...wagoMarkers, + ...siemensMarkers, + ...otdrMarkers, + ...wdmMarkers, + ...gmaMarkers, + ...messstellenMarkers, + ...talasiclMarkers, + ...dauzMarkers, + ...smsfunkmodemMarkers, + ...sonstigeMarkers, + ...ulafMarkers, + ]; -// Function to find a marker by areaName across all groups -const findMyMarker = (areaName) => { - return allMarkers.find((marker) => marker.options.areaName === areaName); -}; + // Function to find a marker by areaName across all groups + const findMyMarker = (areaName) => { + return allMarkers.find((marker) => marker.options.areaName === areaName); + }; -// Effect to handle navigation to selected area -useEffect(() => { - if (selectedArea && map) { - const marker = findMyMarker(selectedArea); - if (marker) { - map.flyTo(marker.getLatLng(), 14); // Adjust zoom level as needed + // Effect to handle navigation to selected area + useEffect(() => { + if (selectedArea && map) { + const marker = findMyMarker(selectedArea); + if (marker) { + map.flyTo(marker.getLatLng(), 14); // Adjust zoom level as needed + } } - } -}, [selectedArea, map, allMarkers]); // Include allMarkers in the dependencies + }, [selectedArea, map, allMarkers]); // Include allMarkers in the dependencies - -/* const findMyMarker = (areaName) => { + /* const findMyMarker = (areaName) => { // Angenommen, jeder Marker hat eine option `areaName`, die beim Erstellen gesetzt wurde. return talasMarkers.find((marker) => marker.options.areaName === areaName); }; */ //------------------------------------------ + const zoomTrigger = useRecoilValue(zoomTriggerState); + + useEffect(() => { + if (map) { + var x = 51.41321407879154; + var y = 7.739617925303934; + var zoom = 7; + + if (map && map.flyTo) { + map.flyTo([x, y], zoom); + } else { + console.error("Map object is not ready or does not have flyTo method"); + } // Ihre bereits existierende Funktion, die Zoom-Out ausführt + } + }, [map, zoomTrigger]); + //------------------------------------------ + return ( <> diff --git a/config/config.js b/config/config.js index ac25b497f..147cefac6 100644 --- a/config/config.js +++ b/config/config.js @@ -31,17 +31,17 @@ if (typeof window !== "undefined") { user = url.searchParams.get("u") || "484"; // Ein weiterer Parameter aus der URL, Standardwert ist '484 admin zu testen von Stationen ausblenden und einblenden in der Card' // Konstruktion von URLs, die auf spezifische Ressourcen auf dem Server zeigen -/* mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${c}&idUser=${user}`; //idMap: 10, idUser: 484 + mapGisStationsStaticDistrictUrl = `${serverURL}/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=${c}&idUser=${user}`; //idMap: 10, idUser: 484 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 diff --git a/store/zoomOutState.js b/store/zoomOutState.js new file mode 100644 index 000000000..4d9893b4d --- /dev/null +++ b/store/zoomOutState.js @@ -0,0 +1,7 @@ +// store/zoomOutState.js +import { atom } from "recoil"; + +export const zoomOutState = atom({ + key: "zoomOutState", // eindeutiger Key + default: 7, // Start-Zoomlevel +}); diff --git a/store/zoomTriggerState.js b/store/zoomTriggerState.js new file mode 100644 index 000000000..3a526b43a --- /dev/null +++ b/store/zoomTriggerState.js @@ -0,0 +1,7 @@ +// store/zoomTriggerState.js +import { atom } from "recoil"; + +export const zoomTriggerState = atom({ + key: "zoomTriggerState", + default: 0, // Dies kann eine einfache Zählvariable sein, die inkrementiert wird. +});