diff --git a/components/DataSheet.js b/components/DataSheet.js index 9de9c7eb3..41aba4398 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -1,15 +1,12 @@ -// components/DataSheet.js import React, { useEffect, useState } from "react"; import { useRecoilState, useRecoilValue } from "recoil"; import { gisStationsStaticDistrictState } from "../store/gisStationState"; import { gisSystemStaticState } from "../store/gisSystemState"; import { mapLayersState } from "../store/mapLayersState"; + function DataSheet() { const [mapLayersVisibility, setMapLayersVisibility] = useRecoilState(mapLayersState); - // useState für uniqueAreas und stationListing - const [uniqueAreas, setUniqueAreas] = useState([]); - const [uniqueSystems, setUniqueSystems] = useState([]); const [stationListing, setStationListing] = useState([]); const [systemListing, setSystemListing] = useState([]); const GisStationsStaticDistrict = useRecoilValue( @@ -18,13 +15,7 @@ function DataSheet() { const GisSystemStatic = useRecoilValue(gisSystemStaticState); useEffect(() => { - /* console.log( - "GisStationsStaticDistrict in DataSheet:", - GisStationsStaticDistrict - ); - console.log("GisSystemStatic in DataSheet:", GisSystemStatic); */ - - // Filtern der eindeutigen Gebiete (Areas) und alphabetisches Sortieren + // Filter unique areas const seenNames = new Set(); const filteredAreas = GisStationsStaticDistrict.filter((item) => { const isUnique = !seenNames.has(item.Area_Name); @@ -34,213 +25,38 @@ function DataSheet() { return isUnique; }); - setUniqueAreas(filteredAreas); - + // Filter unique systems where Allow is 1 const seenSystemNames = new Set(); const filteredSystems = GisSystemStatic.filter((item) => { - const isUnique = !seenSystemNames.has(item.Name); + const isUnique = !seenSystemNames.has(item.Name) && item.Allow === 1; if (isUnique) { seenSystemNames.add(item.Name); } return isUnique; }); - setUniqueSystems(filteredSystems); - - // Erzeugen von stationListing aus uniqueAreas und alphabetisches Sortieren - const newStationListing = filteredAreas - .map((area, index) => ({ - id: index + 1, // Zuweisung einer eindeutigen ID + setStationListing( + filteredAreas.map((area, index) => ({ + id: index + 1, name: area.Area_Name, })) - .sort((a, b) => a.name.localeCompare(b.name)); // Alphabetisches Sortieren der Namen - - setStationListing(newStationListing); - - //---------- - const newSystemListing = filteredSystems.map((area, index) => ({ - id: index + 1, // Zuweisung einer eindeutigen ID - name: area.Name, - })); - setSystemListing(newSystemListing); - //console.log("System Listing:", systemListing); - }, [GisStationsStaticDistrict]); - - const [checkedStations, setCheckedStations] = useState({}); - /* const TALAS = new L.layerGroup(); - const ECI = new L.layerGroup(); - const ULAF = new L.layerGroup(); - const GSMModem = new L.layerGroup(); - const CiscoRouter = new L.layerGroup(); - const WAGO = new L.layerGroup(); - const Siemens = new L.layerGroup(); - const OTDR = new L.layerGroup(); - const WDM = new L.layerGroup(); - const GMA = new L.layerGroup(); - const Sonstige = new L.layerGroup(); - const TALASICL = new L.layerGroup(); */ - const handleCheckboxChangeTALAS = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - TALAS: checked, - })); - }; - const handleCheckboxChangeECI = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - ECI: checked, - })); - }; - const handleCheckboxChangeULAF = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - ULAF: checked, - })); - }; - const handleCheckboxChangeGSMModem = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - GSMModem: checked, - })); - }; - const handleCheckboxChangeCiscoRouter = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - CiscoRouter: checked, - })); - }; - const handleCheckboxChangeWAGO = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - WAGO: checked, - })); - }; - const handleCheckboxChangeSiemens = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - Siemens: checked, - })); - }; - const handleCheckboxChangeOTDR = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - OTDR: checked, - })); - }; - const handleCheckboxChangeWDM = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - WDM: checked, - })); - }; - const handleCheckboxChangeGMA = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - GMA: checked, - })); - }; - const handleCheckboxChangeSonstige = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - Sonstige: checked, - })); - }; - const handleCheckboxChangeTALASICL = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - TALASICL: checked, - })); - }; - const handleCheckboxChangeDAUZ = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - DAUZ: checked, - })); - }; - const handleCheckboxChangeSMSFunkmodem = (event) => { - const { checked } = event.target; - - setMapLayersVisibility((prev) => ({ - ...prev, - SMSFunkmodem: checked, - })); - }; - const handleCheckboxChangeMessstellen = (event) => { - const { checked } = event.target; - setMapLayersVisibility((prev) => ({ - ...prev, - Messstellen: checked, - })); - }; - const handleCheckboxChange = (event) => { - const { checked, value } = event.target; - setCheckedStations((prev) => ({ - ...prev, - [value]: checked, - })); - }; - - const handleStationChange = (event) => { - //console.log("Station selected:", event.target.value); - }; - - const resetView = () => { - console.log("View has been reset"); - }; - useEffect(() => { - //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( - "TALAS Station ist gecheckt:", - checkedStations[talasStation.id] - ); */ - } - }, [checkedStations, systemListing]); - const eciStation = systemListing.find((station) => station.name === "ECI"); - const ulafStation = systemListing.find((station) => station.name === "ULAF"); - const gsmModemStation = systemListing.find( - (station) => station.name === "GSMModem" - ); - const ciscoRouterStation = systemListing.find( - (station) => station.name === "CiscoRouter" - ); - const wagoStation = systemListing.find((station) => station.name === "WAGO"); - const siemensStation = systemListing.find( - (station) => station.name === "Siemens" - ); - const otdrStation = systemListing.find((station) => station.name === "OTDR"); - const wdmStation = systemListing.find((station) => station.name === "WDM"); - const gmaStation = systemListing.find((station) => station.name === "GMA"); - const sonstigeStation = systemListing.find( - (station) => station.name === "Sonstige" - ); - const talasiclStation = systemListing.find( - (station) => station.name === "TALASICL" - ); - const dauzStation = systemListing.find((station) => station.name === "DAUZ"); - const smsFunkmodemStation = systemListing.find( - (station) => station.name === "SMSFunkmodem" - ); - const messstellenStation = systemListing.find( - (station) => station.name === "Messstellen" - ); + + setSystemListing( + filteredSystems.map((system, index) => ({ + id: index + 1, + name: system.Name, + })) + ); + }, [GisStationsStaticDistrict, GisSystemStatic]); + + const handleCheckboxChange = (name, event) => { + const { checked } = event.target; + setMapLayersVisibility((prev) => ({ + ...prev, + [name]: checked, + })); + }; return (