diff --git a/components/DataSheet.js b/components/DataSheet.js index 0c41ffa51..b3181a7d5 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -1,4 +1,3 @@ -//components/DataSheet.js import React, { useEffect, useState } from "react"; import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil"; import { gisStationsStaticDistrictState } from "../store/atoms/gisStationState"; @@ -10,7 +9,6 @@ import { poiLayerVisibleState } from "../store/atoms/poiLayerVisible"; function DataSheet() { const [poiVisible, setPoiVisible] = useRecoilState(poiLayerVisibleState); - const setSelectedArea = useSetRecoilState(selectedAreaState); const [mapLayersVisibility, setMapLayersVisibility] = useRecoilState(mapLayersState); @@ -20,92 +18,71 @@ function DataSheet() { gisStationsStaticDistrictState ); const GisSystemStatic = useRecoilValue(gisSystemStaticState); - // In deiner Dropdown onChange Funktion + const setZoomTrigger = useSetRecoilState(zoomTriggerState); + const handleAreaChange = (event) => { const selectedIndex = event.target.options.selectedIndex; const areaName = event.target.options[selectedIndex].text; - //useState selectedStation setzen - setSelectedArea(areaName); - console.log("Area selected oder areaName in DataSheet.js:", areaName); // Nur zur Bestätigung in der Konsole - //console.log("event.target:", event.target); + console.log("Area selected oder areaName in DataSheet.js:", areaName); }; useEffect(() => { - // Identify allowed system IDs const allowedSystems = new Set( GisSystemStatic.filter((system) => system.Allow === 1).map( (system) => system.IdSystem ) ); - //console.log("allowedSystems:", allowedSystems); - - // Filter unique areas that belong to allowed systems const seenNames = new Set(); const filteredAreas = GisStationsStaticDistrict.filter((item) => { const isUnique = !seenNames.has(item.Area_Name) && allowedSystems.has(item.System); if (isUnique) { seenNames.add(item.Area_Name); - //console.log("Unique area:", item.Area_Name); //Dropdown menu } return isUnique; }); - //console.log("GisStationsStaticDistrict:", GisStationsStaticDistrict); - - // Set the station listings setStationListing( filteredAreas.map((area, index) => ({ id: index + 1, name: area.Area_Name, })) ); - - // Prepare system listings as before const seenSystemNames = new Set(); const filteredSystems = GisSystemStatic.filter((item) => { - // Entferne alle Leerzeichen und Bindestriche aus dem Namen const formattedName = item.Name.replace(/[\s\-]+/g, ""); - // Entferne alle Leerzeichen aus dem Namen, behalte Bindestriche - //const formattedName = item.Name.replace(/\s+/g, ""); const isUnique = !seenSystemNames.has(formattedName) && item.Allow === 1; if (isUnique) { - seenSystemNames.add(formattedName); // Füge den formatierten Namen hinzu - //console.log("Unique system in DataSheet:", formattedName); // Zeige den formatierten Namen in der Konsole + seenSystemNames.add(formattedName); } return isUnique; }); - //console.log("filteredSystems:", filteredSystems); // Logge die gefilterten Systeme - setSystemListing( filteredSystems.map((system, index) => ({ id: index + 1, - name: system.Name.replace(/[\s\-]+/g, ""), // Auch hier Leerzeichen und Bindestriche entfernen + name: system.Name.replace(/[\s\-]+/g, ""), })) ); }, [GisStationsStaticDistrict, GisSystemStatic]); - //--------------------------------------------------------- + const handleCheckboxChange = (name, event) => { const { checked } = event.target; - console.log(`Checkbox ${name} checked state:`, checked); // Log the checked state of the checkbox + console.log(`Checkbox ${name} checked state:`, checked); setMapLayersVisibility((prev) => { const newState = { ...prev, [name]: checked, }; - console.log(`New mapLayersVisibility state:`, newState); // Log the new state after update + console.log(`New mapLayersVisibility state:`, newState); return newState; }); }; - //--------------------------------------------------------- - const setZoomTrigger = useSetRecoilState(zoomTriggerState); const handleIconClick = () => { - setSelectedArea("Station wählen"); // Setzt die Dropdown-Auswahl zurück auf "Station wählen" - setZoomTrigger((current) => current + 1); // Trigger durch Inkrementierung + setSelectedArea("Station wählen"); + setZoomTrigger((current) => current + 1); }; - //--------------------------------------------------------- return (