diff --git a/components/DataSheet.js b/components/DataSheet.js index 2af8ce31f..9be4d1971 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -10,9 +10,12 @@ import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice"; import EditModeToggle from "./EditModeToggle"; import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; // Import für Polyline-Visibility import { useSelector, useDispatch } from "react-redux"; -import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; import { selectPolylineVisible, setPolylineVisible } from "../redux/slices/polylineLayerVisibleSlice"; import { selectGisSystemStatic } from "../redux/slices/webService/gisSystemStaticSlice"; +import { useInitGisStationsStatic } from "../components/mainComponent/hooks/useInitGisStationsStatic"; + +import { fetchGisStationsStatic, selectGisStationsStatic } from "../redux/slices/webService/gisStationsStaticSlice"; +import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; function DataSheet() { const [editMode, setEditMode] = useState(false); // Zustand für editMode @@ -23,6 +26,7 @@ function DataSheet() { const [systemListing, setSystemListing] = useState([]); const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict) || []; const GisSystemStatic = useSelector(selectGisSystemStatic) || []; + const GisStationsStatic = useSelector(selectGisStationsStatic) || []; //Area-Name/Bereiche dropdownmenu const setZoomTrigger = useSetRecoilState(zoomTriggerState); const dispatch = useDispatch(); @@ -156,8 +160,48 @@ function DataSheet() { }; //------------------------------ useEffect(() => { - console.log("GisSystemStatic aus Redux:", GisSystemStatic); // ✅ Debugging: Ist es ein Array? + // console.log("GisSystemStatic aus Redux:", GisSystemStatic); // ✅ Debugging: Ist es ein Array? }, [GisSystemStatic]); + //----------------------------- + useInitGisStationsStatic(); + //--------------------------- + useEffect(() => { + console.log("🔍 GisStationsStatic Inhalt:", GisStationsStatic); + + if (!GisStationsStatic) { + console.warn("⚠️ GisStationsStatic ist `null` oder nicht geladen."); + return; + } + + if (typeof GisStationsStatic !== "object") { + console.warn("⚠️ GisStationsStatic ist kein Objekt:", GisStationsStatic); + return; + } + + if (!GisStationsStatic.Points || !Array.isArray(GisStationsStatic.Points)) { + console.warn("⚠️ GisStationsStatic.Points ist nicht vorhanden oder kein Array.", GisStationsStatic); + return; + } + + const seenNames = new Set(); + const filteredAreas = GisStationsStatic.Points.filter((item) => { + if (!item.Area_Name) return false; // Sicherstellen, dass Area_Name existiert + const isUnique = !seenNames.has(item.Area_Name); + if (isUnique) { + seenNames.add(item.Area_Name); + } + return isUnique; + }); + + setStationListing( + filteredAreas.map((area, index) => ({ + id: area.IdArea || index + 1, + name: area.Area_Name || "Unbekannt", + })) + ); + + console.log("📌 stationListing aktualisiert:", filteredAreas); + }, [GisStationsStatic]); //--------------------------- return ( diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index a77348c05..a25ed7987 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -647,16 +647,30 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { } }, [map]); //-------------------------------------------- - + // Bereich in DataSheet ->dropdownmenu useEffect(() => { + console.log("🔍 GisStationsStaticDistrict Inhalt:", GisStationsStaticDistrict); + + // Sicherstellen, dass `Points` existiert und ein Array ist + const points = GisStationsStaticDistrict?.Points; + if (!Array.isArray(points)) { + console.warn("⚠️ GisStationsStaticDistrict.Points ist nicht vorhanden oder kein Array.", points); + return; + } + if (selectedArea && map) { - const station = GisStationsStaticDistrict.find((s) => s.Area_Name === selectedArea); + const station = points.find((s) => s.Area_Name === selectedArea); + if (station) { + console.log("📌 Gefundene Station:", station); map.flyTo([station.X, station.Y], 14); + } else { + console.warn("⚠️ Keine passende Station für die Area gefunden:", selectedArea); } } }, [selectedArea, map, GisStationsStaticDistrict]); + //------------------------------------- useEffect(() => { if (zoomTrigger && map) { map.flyTo([51.41321407879154, 7.739617925303934], 7); @@ -945,7 +959,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { // Ergebnis im Dispatch speichern oder State aktualisieren dispatch({ type: "SET_GIS_STATIONS", payload: data }); - console.log("Daten erfolgreich geladen:", data); + //console.log("Daten erfolgreich geladen:", data); return data; // Optional: Rückgabe der Daten } catch (error) { console.error("Fehler beim Laden der GIS-Daten:", error); diff --git a/components/mainComponent/hooks/useInitGisStationsStatic.js b/components/mainComponent/hooks/useInitGisStationsStatic.js new file mode 100644 index 000000000..72831eac1 --- /dev/null +++ b/components/mainComponent/hooks/useInitGisStationsStatic.js @@ -0,0 +1,21 @@ +// /components/mainComponent/hooks/useInitGisStationsStatic.js +//Bereiche/Area-Name Dropdownmenu für Datasheet wird hier initialisiert und in der Komponente verwendet +import { useEffect } from "react"; +import { useDispatch, useSelector } from "react-redux"; +import { fetchGisStationsStatic, selectGisStationsStatic } from "../../../redux/slices/webService/gisStationsStaticSlice"; + +export const useInitGisStationsStatic = () => { + const dispatch = useDispatch(); + const gisStationsStatic = useSelector(selectGisStationsStatic); + + useEffect(() => { + console.log("🔍 useInitGisStationsStatic - Aktueller Wert:", gisStationsStatic); + + if (!gisStationsStatic || gisStationsStatic === null) { + console.log("🚀 Starte fetchGisStationsStatic..."); + dispatch(fetchGisStationsStatic()); + } + }, [gisStationsStatic, dispatch]); + + return gisStationsStatic; +}; diff --git a/config/appVersion.js b/config/appVersion.js index b70952b0f..e9ca62e94 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.28"; +export const APP_VERSION = "1.1.29"; diff --git a/hooks/useMapComponentState.js b/hooks/useMapComponentState.js index 65e830d3b..3baf0df0b 100644 --- a/hooks/useMapComponentState.js +++ b/hooks/useMapComponentState.js @@ -49,19 +49,31 @@ export const useMapComponentState = () => { const fetchDeviceData = async () => { try { - const response = await fetch("/api/talas5/location_device"); + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; - // Sicherstellen, dass die Antwort JSON ist - const contentType = response.headers.get("content-type"); - if (!contentType || !contentType.includes("application/json")) { - throw new Error("❌ Ungültige Antwort: Kein JSON erhalten"); - } + // URL-Parameter aus der aktuellen Browser-URL holen + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || "12"; // Fallback auf "12" falls nicht gesetzt - const data = await response.json(); - setLocationDeviceData(data); + const url = `${apiBaseUrl}/GisStationsStatic?idMap=${idMap}`; - if (data.length > 0) { - setDeviceName(data[0].name); + //console.log("📡 API Request URL:", url); + + const response = await fetch(url); + + //console.log("📡 API Response Status:", response.status); + // console.log("📡 API Response Headers:", response.headers.get("content-type")); + + const text = await response.text(); + //console.log("📡 API Response Text:", text); + + // JSON manuell parsen, falls die API keinen JSON-Header sendet + const data = JSON.parse(text); + + setLocationDeviceData(data.Points || []); + + if (data.Points && data.Points.length > 0) { + setDeviceName(data.Points[0].LD_Name); } } catch (error) { console.error("❌ Fehler beim Abrufen der Gerätedaten:", error); diff --git a/redux/api/fromWebService/fetchGisStationsMeasurements.js b/redux/api/fromWebService/fetchGisStationsMeasurements.js index 1507fb883..8cae2a5cc 100644 --- a/redux/api/fromWebService/fetchGisStationsMeasurements.js +++ b/redux/api/fromWebService/fetchGisStationsMeasurements.js @@ -8,7 +8,7 @@ export const fetchGisStationsMeasurements = async () => { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisStationsMeasurements - URL:", `${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); + //console.log("🔍 fetchGisStationsMeasurements - URL:", `${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisStationsMeasurements?idMap=${idMap}&idUser=${idUser}`); @@ -17,6 +17,6 @@ export const fetchGisStationsMeasurements = async () => { } const data = await response.json(); - console.log("✅ fetchGisStationsMeasurements - Daten:", data); + //console.log("✅ fetchGisStationsMeasurements - Daten:", data); return data; }; diff --git a/redux/api/fromWebService/fetchGisStationsStatic.js b/redux/api/fromWebService/fetchGisStationsStatic.js new file mode 100644 index 000000000..09786a338 --- /dev/null +++ b/redux/api/fromWebService/fetchGisStationsStatic.js @@ -0,0 +1,25 @@ +// /redux/api/fromWebService/fetchGisStationsStatic.js +// z.B. http://192.168.10.33/talas5/ClientData/WebServiceMap.asmx/GisStationsStatic?idMap=12 +const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; + +export const fetchGisStationsStatic = async () => { + try { + const response = await fetch(`${apiBaseUrl}/GisStationsStatic?idMap=12`); + + //console.log("📡 API Response Status:", response.status); + //console.log("📡 API Response Headers:", response.headers.get("content-type")); + + const text = await response.text(); + console.log("📡 API Response Text von fetch:", text); + console.log("📡 API Response response von fetch:", response); + + if (!response.ok || !response.headers.get("content-type")?.includes("application/json")) { + throw new Error("❌ Fehler: Antwort ist kein gültiges JSON"); + } + + return JSON.parse(text); + } catch (error) { + console.error("❌ Fehler beim Abrufen der GIS Stations Static:", error); + return null; + } +}; diff --git a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js index fd2afb21a..3f8d79ed3 100644 --- a/redux/api/fromWebService/fetchGisStationsStaticDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStaticDistrict.js @@ -8,7 +8,7 @@ export const fetchGisStationsStaticDistrict = async () => { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisStationsStaticDistrict - URL:", `${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); + // console.log("🔍 fetchGisStationsStaticDistrict - URL:", `${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisStationsStaticDistrict?idMap=${idMap}&idUser=${idUser}`); @@ -17,6 +17,6 @@ export const fetchGisStationsStaticDistrict = async () => { } const data = await response.json(); - console.log("✅ fetchGisStationsStaticDistrict - Daten:", data); + // console.log("✅ fetchGisStationsStaticDistrict - Daten:", data); return data; }; diff --git a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js index 7ee86edf7..34faa1959 100644 --- a/redux/api/fromWebService/fetchGisStationsStatusDistrict.js +++ b/redux/api/fromWebService/fetchGisStationsStatusDistrict.js @@ -8,7 +8,7 @@ export const fetchGisStationsStatusDistrict = async () => { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisStationsStatusDistrict - URL:", `${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); + //console.log("🔍 fetchGisStationsStatusDistrict - URL:", `${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`); @@ -17,6 +17,6 @@ export const fetchGisStationsStatusDistrict = async () => { } const data = await response.json(); - console.log("✅ fetchGisStationsStatusDistrict - Daten:", data); + //console.log("✅ fetchGisStationsStatusDistrict - Daten:", data); return data; }; diff --git a/redux/api/fromWebService/fetchGisSystemStatic.js b/redux/api/fromWebService/fetchGisSystemStatic.js index f0447a66b..4e22f5c4f 100644 --- a/redux/api/fromWebService/fetchGisSystemStatic.js +++ b/redux/api/fromWebService/fetchGisSystemStatic.js @@ -8,11 +8,11 @@ export async function fetchGisSystemStatic() { const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; const idUser = params.get("idUser") || process.env.NEXT_PUBLIC_DEFAULT_ID_USER || "484"; - console.log("🔍 fetchGisSystemStatic - URL:", `${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); + //console.log("🔍 fetchGisSystemStatic - URL:", `${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); const response = await fetch(`${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`); const data = await response.json(); - console.log("✅ fetchGisSystemStatic - Daten:", data); + //console.log("✅ fetchGisSystemStatic - Daten:", data); return data; } diff --git a/redux/slices/webService/gisStationsStaticSlice.js b/redux/slices/webService/gisStationsStaticSlice.js new file mode 100644 index 000000000..918c22a4c --- /dev/null +++ b/redux/slices/webService/gisStationsStaticSlice.js @@ -0,0 +1,58 @@ +// /redux/api/fromDB/fetchLocationDevices.js +// das ist für Datasheet dropdownmenu Bereiche/Area-Name +import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; + +// API-Fetch-Funktion für GIS Stations Static mit dynamischem URL-Parameter +export const fetchGisStationsStatic = createAsyncThunk("gisStationsStatic/fetchGisStationsStatic", async (_, { rejectWithValue }) => { + try { + const apiBaseUrl = process.env.NEXT_PUBLIC_API_BASE_URL; + + // URL-Parameter aus der aktuellen Browser-URL holen + const params = new URLSearchParams(window.location.search); + const idMap = params.get("idMap") || "12"; // Standardwert "12", falls `idMap` nicht existiert + + const url = `${apiBaseUrl}/GisStationsStatic?idMap=${idMap}`; + console.log("📡 API Request URL:", url); + + const response = await fetch(url); + + if (!response.ok) { + throw new Error("GisStationsStatic konnte nicht geladen werden"); + } + + const data = await response.json(); + return data; + } catch (error) { + return rejectWithValue(error.message); + } +}); + +// Redux-Slice +const gisStationsStaticSlice = createSlice({ + name: "gisStationsStatic", + initialState: { + data: null, + status: "idle", + error: null, + }, + reducers: {}, + extraReducers: (builder) => { + builder + .addCase(fetchGisStationsStatic.pending, (state) => { + state.status = "loading"; + }) + .addCase(fetchGisStationsStatic.fulfilled, (state, action) => { + state.status = "succeeded"; + state.data = action.payload; + }) + .addCase(fetchGisStationsStatic.rejected, (state, action) => { + state.status = "failed"; + state.error = action.payload; + }); + }, +}); + +// Selector-Funktion +export const selectGisStationsStatic = (state) => state.gisStationsStatic.data; + +export default gisStationsStaticSlice.reducer; diff --git a/redux/store.js b/redux/store.js index 344a4eda4..322e1007d 100644 --- a/redux/store.js +++ b/redux/store.js @@ -1,3 +1,4 @@ +// /redux/store.js import { configureStore } from "@reduxjs/toolkit"; import lineVisibilityReducer from "./slices/lineVisibilitySlice"; import currentPoiReducer from "./slices/currentPoiSlice"; @@ -7,6 +8,7 @@ import gisStationsStaticDistrictReducer from "./slices/webService/gisStationsSta import gisStationsStatusDistrictReducer from "./slices/webService/gisStationsStatusDistrictSlice"; import gisStationsMeasurementsReducer from "./slices/webService/gisStationsMeasurementsSlice"; import gisSystemStaticReducer from "./slices/webService/gisSystemStaticSlice"; +import gisStationsStaticReducer from "./slices/webService/gisStationsStaticSlice"; export const store = configureStore({ reducer: { @@ -18,5 +20,6 @@ export const store = configureStore({ gisStationsStatusDistrict: gisStationsStatusDistrictReducer, gisStationsMeasurements: gisStationsMeasurementsReducer, gisSystemStatic: gisSystemStaticReducer, + gisStationsStatic: gisStationsStaticReducer, }, });