refactor: alle Services strukturiert und vereinheitlicht (v1.1.120) – Webservice/Database getrennt, Postfix 'Service' eingeführt

2025-05-20 15:03:05 +02:00
parent 6f9a50ef5c
commit 4c94ba82ae
7 changed files with 72 additions and 95 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,36 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie

 ---

+## [1.1.120] – 2025-05-20
+
+### Refactor
+
+- 🔁 Alle Webservice- und Datenbank-Fetches vollständig auf strukturierte Service-Dateien umgestellt
+- Einheitliches Schema für Servicenamen: `fetchXyzService.js`
+- Webservice-Dateien erwarten keine Importe mehr, sondern holen `?m` und `?u` direkt aus der URL
+
+### Struktur
+
+- `/services/webservice/` → für TALAS WebServices (Port 80)
+  - z. B. `fetchGisSystemStaticService.js`, `fetchGisStationsMeasurementsService.js`
+- `/services/database/` → für API-Fetches von Next.js (Port 3000)
+  - z. B. `fetchDeviceNameByIdService.js`, `updateLocationInDatabaseService.js`
+- `/services/utils/` → z. B. `fetchWithTimeout.js`
+
+### Cleanup
+
+- ❌ Veraltete Hooks entfernt: `useFetchWebServiceMap`, `setGisSystemStaticLoaded`, etc.
+- 🧼 Nicht verwendete Service-Imports aus `MapComponent.js` bereinigt
+- ❌ Datei `PoiUtils.js` gelöscht (nicht verwendet)
+
+### Motivation
+
+- ✅ Klare Trennung zwischen Webservice- und DB-Logik
+- 🧠 Bessere Lesbarkeit im Code durch Postfix `Service`
+- 👨‍💻 Einfache Navigation & Wartbarkeit der Anwendung
+
+---
+
 ## [1.1.117] – 2025-05-20

 ### Changed
--- a/components/mainComponent/MapComponent.js
+++ b/components/mainComponent/MapComponent.js
@@ -37,7 +37,6 @@ import CoordinateModal from "../CoordinateModal.js";
 import CoordinatePopup from "../CoordinatePopup.js";
 //------------------------Daten aus API--------------------
 import { fetchPoiDataService } from "../../services/database/fetchPoiDataService.js";
-import { fetchGisStationsMeasurementsService } from "../../services/webservice/fetchGisStationsMeasurementsService.js";
 import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js";
 import { fetchLocationDevicesFromDB } from "../../redux/slices/db/locationDevicesFromDBSlice";
 import { fetchGisStationsStaticDistrictFromWebService } from "../../redux/slices/webService/gisStationsStaticDistrictSlice";
@@ -54,7 +53,6 @@ import { updateCountdown, closePolylineContextMenu } from "../../redux/slices/po
 //-------------------MapComponent.js hooks--------------------
 import useInitializeMap from "./hooks/useInitializeMap";
 import useLoadUserRights from "./hooks/useLoadUserRights";
-import useFetchWebServiceMap from "./hooks/useFetchWebServiceMap";
 import useFetchPoiData from "./hooks/useFetchPoiData.js";
 import useRestoreMapSettings from "./hooks/useRestoreMapSettings";
 import { setSelectedPoi } from "../../redux/slices/selectedPoiSlice";
@@ -95,7 +93,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  const [currentPoiData, setCurrentPoiData] = useState(null);
  const [showVersionInfoModal, setShowVersionInfoModal] = useState(false);
  const zoomTrigger = useSelector((state) => state.zoomTrigger.trigger);
-  const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false);
+
  const [poiTypMap, setPoiTypMap] = useState(new Map());
  const [showPopup, setShowPopup] = useState(false);
  const poiReadTrigger = useSelector((state) => state.poiReadFromDbTrigger.trigger);
@@ -104,13 +102,11 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  const [map, setMap] = useState(null); // Zustand der Karteninstanz
  const [oms, setOms] = useState(null); // State für OMS-Instanz
  const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict);
-  const [GisStationsStatusDistrict, setGisStationsStatusDistrict] = useState([]); // Zustand für Statusdaten
  const [GisStationsMeasurements, setGisStationsMeasurements] = useState([]); // Zustand für Messdaten
  const GisSystemStatic = useSelector(selectGisSystemStatic);
+  const gisSystemStaticStatus = useSelector((state) => state.gisSystemStatic.status);
  // Konstanten für die URLs
-  const mapGisStationsStatusDistrictUrl = config.mapGisStationsStatusDistrictUrl;
  const mapGisStationsMeasurementsUrl = config.mapGisStationsMeasurementsUrl;
-  const mapGisSystemStaticUrl = config.mapGisSystemStaticUrl;
  const webserviceGisLinesStatusUrl = config.webserviceGisLinesStatusUrl;
  //console.log("priorityConfig in MapComponent1: ", priorityConfig);
  //-----------------------------------------
@@ -146,10 +142,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  const [showCoordinatesModal, setShowCoordinatesModal] = useState(false);
  const [popupCoordinates, setPopupCoordinates] = useState(null);
  const [popupVisible, setPopupVisible] = useState(false);
-  const handleAddStation = (stationData) => {
-    setAddPoiModalWindowState(false);
-    closePopup(); // Schließt das Popup nach dem Hinzufügen
-  };
+
  const openVersionInfoModal = () => {
    setShowVersionInfoModal(true);
  };
@@ -188,7 +181,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
    ...tkComponentsMarkers,
    ...ulafMarkers,
  ];
-  const useMock = process.env.NEXT_PUBLIC_USE_MOCK_API === "true";
  //--------------------------------------------
  const gmaLayerRef = useRef(null);
  const talasLayerRef = useRef(null);
@@ -214,7 +206,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
    dispatch(setUserId(params.get("u")));
  }, [dispatch]);
  //---------------------------------------------------------------
-  useFetchWebServiceMap(mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl, setGisStationsStatusDistrict, setGisStationsMeasurements, setGisSystemStatic, setGisSystemStaticLoaded);
+
  //--------------------------------------------------------
  useEffect(() => {
    const endpoint = "/api/talas_v5_DB/gisLines/readGisLines";
@@ -296,9 +288,9 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  //---------------------------------------------
  //console.log("priorityConfig in MapComponent2: ", priorityConfig);
  useEffect(() => {
-    if (gisSystemStaticLoaded && map) {
+    if (map) {
    }
-  }, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
+  }, [map, GisSystemStatic, priorityConfig]);
  //--------------------------------------------
  useEffect(() => {
    if (map) {
@@ -655,7 +647,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  useLayerVisibility(map, ulafMarkers, mapLayersVisibility, "ULAF", oms);
  //--------------------------------------------
  useEffect(() => {
-    if (!gisSystemStaticLoaded || !map) return; // Sicherstellen, dass die Karte und Daten geladen sind
+    if (gisSystemStaticStatus !== "succeeded" || !map) return;

    const layerGroups = [
      { ref: gmaLayerRef, id: 11, setState: setGmaMarkers },
@@ -740,7 +732,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
        }
      });
    };
-  }, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
+  }, [map, GisSystemStatic, priorityConfig]);

  //---------------------------------------
  // Initialisiere Leaflet-Karte
--- a/components/mainComponent/hooks/useFetchWebServiceMap.js
+++ b/components/mainComponent/hooks/useFetchWebServiceMap.js
@@ -1,52 +0,0 @@
-// /components/mainComponent/hooks/useFetchWebServiceMap.js
-import { useEffect } from "react";
-import { fetchGisStationsStatusDistrictService } from "../../../services/webservice/fetchGisStationsStatusDistrictService";
-import { fetchGisStationsMeasurementsService } from "../../../services/webservice/fetchGisStationsMeasurementsService";
-import { fetchGisSystemStaticService } from "../../../services/webservice/fetchGisSystemStaticService";
-
-const useFetchWebServiceMap = (mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl, setGisStationsStatusDistrict, setGisStationsMeasurements, setGisSystemStatic, setGisSystemStaticLoaded) => {
-  useEffect(() => {
-    //console.log("✅ useFetchWebServiceMap wurde ausgeführt!");
-
-    const fetchWebServiceMap = async () => {
-      try {
-        let requestCount = localStorage.getItem("fetchWebServiceMap") || 0;
-        requestCount = parseInt(requestCount, 10);
-
-        console.log("📡 Starte API-Anfragen...");
-
-        const fetchOptions = {
-          method: "GET",
-          headers: { Connection: "close" },
-        };
-
-        // GIS Stations Status District abrufen
-        //console.log("⏳ Abrufen von GIS Stations Status District...");
-        await fetchGisStationsStatusDistrictService(mapGisStationsStatusDistrictUrl, setGisStationsStatusDistrict, fetchOptions);
-        // console.log("✅ fetchGisStationsStatusDistrictService erfolgreich!");
-        requestCount++;
-        localStorage.setItem("fetchWebServiceMap", requestCount);
-
-        // GIS Stations Measurements abrufen
-        //console.log("⏳ Abrufen von GIS Stations Measurements...");
-        await fetchGisStationsMeasurementsService(mapGisStationsMeasurementsUrl, setGisStationsMeasurements, fetchOptions);
-        // console.log("✅ fetchGisStationsMeasurementsService erfolgreich!");
-        requestCount++;
-        localStorage.setItem("fetchWebServiceMap", requestCount);
-
-        // GIS System Static abrufen
-        //console.log("⏳ Abrufen von GIS System Static...");
-        await fetchGisSystemStaticService(mapGisSystemStaticUrl, setGisSystemStatic, setGisSystemStaticLoaded, fetchOptions);
-        //console.log("✅ fetchGisSystemStaticService erfolgreich!");
-        requestCount++;
-        localStorage.setItem("fetchWebServiceMap", requestCount);
-      } catch (error) {
-        console.error("❌ Fehler beim Abrufen der WebService-Daten:", error);
-      }
-    };
-
-    fetchWebServiceMap();
-  }, [mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl]);
-};
-
-export default useFetchWebServiceMap;
--- a/components/pois/PoiUpdateModal.js
+++ b/components/pois/PoiUpdateModal.js
@@ -1,28 +1,17 @@
 // /components/pois/PoiUpdateModal.js
 import React, { useState, useEffect } from "react";
 import Select from "react-select"; // Importiere react-select
-import { selectedPoiState } from "../../redux/slices/selectedPoiSlice";
-import { currentPoiState } from "../../redux/slices/currentPoiSlice";
-import { mapLayersState } from "../../redux/slices/mapLayersSlice";
-
 import { fetchLocationDevicesFromDB } from "../../redux/slices/db/locationDevicesFromDBSlice";
 import { useSelector, useDispatch } from "react-redux";
-
-import { selectCurrentPoi } from "../../redux/slices/currentPoiSlice";
 import { selectMapLayersState } from "../../redux/slices/mapLayersSlice";

 const PoiUpdateModal = ({ onClose, poiData, onSubmit }) => {
  const dispatch = useDispatch();
-
-  const currentPoi = useSelector(selectCurrentPoi);
-  const selectedPoi = useSelector(selectCurrentPoi);
  const mapLayersVisibility = useSelector(selectMapLayersState);
-
  const [poiId, setPoiId] = useState(poiData ? poiData.idPoi : "");
  const [name, setName] = useState(poiData ? poiData.name : "");
  const [poiTypData, setPoiTypData] = useState([]);
  const [poiTypeId, setPoiTypeId] = useState(null); // Verwende null für react-select
-  const [locationDeviceData, setLocationDeviceData] = useState([]);
  const [filteredDevices, setFilteredDevices] = useState([]);
  const [deviceName, setDeviceName] = useState(poiData ? poiData.deviceName : null); // Verwende null für react-select
  const [idLD, setIdLD] = useState(poiData ? poiData.idLD : "");
--- a/config/appVersion.js
+++ b/config/appVersion.js
@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.120";
+export const APP_VERSION = "1.1.121";
--- a/services/utils/fetchWithTimeout.js
+++ b/services/utils/fetchWithTimeout.js
@@ -1,4 +1,4 @@
-// services/utils/fetchWithTimeout.js
+// /services/utils/fetchWithTimeout.js

 const fetchWithTimeout = (url, options, timeout = 5000) => {
  const controller = new AbortController();
--- a/services/webservice/fetchGisSystemStaticService.js
+++ b/services/webservice/fetchGisSystemStaticService.js
@@ -1,18 +1,36 @@
 // /services/webservice/fetchGisSystemStaticService.js

-export const fetchGisSystemStaticService = async (url, setGisSystemStatic, setGisSystemStaticLoaded) => {
-  try {
-    const response = await fetch(url);
-    const jsonResponse = await response.json();
-    if (jsonResponse && jsonResponse.Systems) {
-      setGisSystemStatic(jsonResponse.Systems);
-      setGisSystemStaticLoaded(true);
-    } else {
-      console.error('Erwartete Daten im "Systems"-Array nicht gefunden', jsonResponse);
-      setGisSystemStatic([]);
-    }
-  } catch (error) {
-    console.error("Fehler beim Laden der Daten: ", error);
-    setGisSystemStatic([]);
+/**
+ * Holt GIS-Systemdaten (Systemübersicht) vom TALAS WebService.
+ *
+ * @returns {Promise<Array>} Liste mit Systems[]
+ * @throws {Error} bei Fehler oder ungültiger Antwortstruktur
+ */
+export const fetchGisSystemStaticService = async () => {
+  const mode = process.env.NEXT_PUBLIC_API_PORT_MODE;
+
+  const apiBaseUrl = mode === "dev" ? `${window.location.protocol}//${window.location.hostname}:80/talas5/ClientData/WebServiceMap.asmx` : `${window.location.origin}/talas5/ClientData/WebServiceMap.asmx`;
+
+  const params = new URLSearchParams(window.location.search);
+  const idMap = params.get("m");
+  const idUser = params.get("u");
+
+  const url = `${apiBaseUrl}/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`;
+  console.log("📡 fetchGisSystemStaticService von service URL:", url);
+
+  const response = await fetch(url);
+
+  if (!response.ok) {
+    const message = `❌ Fehler: ${response.status} ${response.statusText}`;
+    console.error(message);
+    throw new Error(message);
  }
+
+  const jsonResponse = await response.json();
+
+  if (!jsonResponse?.Systems) {
+    throw new Error("Antwortstruktur ungültig – 'Systems' fehlt");
+  }
+
+  return jsonResponse.Systems;
 };