feat: Fix Redux-Datenstruktur für GisStationsStaticDistrict und Bereichs-Dropdown

- `GisStationsStaticDistrict` wird jetzt korrekt aus Redux gelesen und verwendet `Points` als Array.
- Fehler `find is not a function` behoben durch Zugriff auf `GisStationsStaticDistrict.Points`.
- Sicherstellung, dass `Points` existiert, bevor darauf zugegriffen wird.
- Konsole-Logs für Debugging hinzugefügt, um leere oder ungültige Daten zu erkennen.
- Bereichsauswahl im Dropdown funktioniert jetzt korrekt und fliegt zur gewählten Station auf der Karte.

 Tested: Dropdown zeigt jetzt die `Area_Name`-Werte und `map.flyTo()` funktioniert korrekt.
This commit is contained in:
Ismail Ali
2025-03-08 12:10:21 +01:00
parent 8399a957b5
commit 806347f0dd
12 changed files with 201 additions and 24 deletions

View File

@@ -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;
};

View File

@@ -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;
}
};

View File

@@ -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;
};

View File

@@ -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;
};

View File

@@ -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;
}

View File

@@ -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;

View File

@@ -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,
},
});