From 97fbb6fdc1b04632e92533202061e61e415130fd Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Tue, 27 May 2025 19:41:17 +0200 Subject: [PATCH] docs --- components/contextmenu/CoordinatePopup.js | 2 +- components/contextmenu/useMapContextMenu.js | 2 +- .../devices/overlapping/PlusRoundIcon.js | 2 +- components/pois/AddPOIModal.js | 2 +- config/appVersion.js | 2 +- docs/components/DataSheet.md | 123 ------------------ docs/components/MapComponent.md | 60 --------- docs/components/TestScript.md | 44 +++++++ .../components/contextmenu/CoordinatePopup.md | 31 +++++ .../contextmenu/useMapContextMenu.md | 36 +++++ .../gisPolylines/PolylineContextMenu.md | 34 +++++ .../gisPolylines/icons/CircleIcon.md | 16 +++ docs/components/gisPolylines/icons/EndIcon.md | 15 +++ .../gisPolylines/icons/StartIcon.md | 15 +++ .../gisPolylines/icons/SupportPointIcons.md | 20 +++ .../devices/overlapping/PlusRoundIcon.md | 26 ++++ docs/components/mainComponent/MapComponent.md | 71 ++++++++++ .../mainComponent/hooks/useInitializeMap.md | 53 ++++++++ docs/components/pois/AddPOIModal.md | 28 ++++ docs/components/pois/PoiUpdateModal.md | 29 +++++ docs/hooks/layers/useAreaMarkersLayer.md | 13 ++ .../layers/useCiscoRouterMarkersLayer.md | 11 ++ docs/hooks/layers/useDauzMarkersLayer.md | 11 ++ docs/hooks/layers/useDrawLines.md | 11 ++ docs/hooks/layers/useEciMarkersLayer.md | 11 ++ docs/hooks/layers/useGmaMarkersLayer.md | 11 ++ docs/hooks/layers/useLteModemMarkersLayer.md | 10 ++ .../layers/useMessstellenMarkersLayer.md | 10 ++ docs/hooks/layers/useOtdrMarkersLayer.md | 10 ++ docs/hooks/layers/useSiemensMarkersLayer.md | 7 + .../layers/useSmsfunkmodemMarkersLayer.md | 7 + docs/hooks/layers/useSonstigeMarkersLayer.md | 7 + docs/hooks/layers/useTalasMarkersLayer.md | 6 + docs/hooks/layers/useTalasiclMarkersLayer.md | 6 + .../layers/useTkComponentsMarkersLayer.md | 6 + docs/hooks/layers/useUlafMarkersLayer.md | 7 + docs/hooks/layers/useWagoMarkersLayer.md | 6 + docs/hooks/layers/useWdmMarkersLayer.md | 7 + docs/hooks/useCreateAndSetDevices.md | 17 +++ docs/hooks/useDynamicMarkerLayers.md | 17 +++ docs/hooks/useFetchPoiData.md | 44 ------- docs/hooks/useLayerVisibility.md | 15 +++ docs/hooks/useLineData.md | 19 +++ docs/hooks/useMapComponentState.md | 18 +++ docs/hooks/useMarkerLayers.md | 16 +++ docs/hooks/usePolylineTooltipLayer.md | 15 +++ docs/pages/_app.md | 26 ++++ docs/pages/api.md | 67 ---------- docs/pages/api/[...path].md | 45 +++++++ docs/pages/api/apiProxy.md | 77 ----------- docs/pages/api/talas_v5_DB/area/readArea.md | 28 ++++ docs/pages/api/talas_v5_DB/area/updateArea.md | 32 +++++ .../talas_v5_DB/device/getAllStationsNames.md | 29 +++++ .../api/talas_v5_DB/device/getDevices.md | 34 +++++ .../api/talas_v5_DB/gisLines/readGisLines.md | 25 ++++ .../gisLines/updateLineCoordinates.md | 30 +++++ .../talas_v5_DB/locationDevice/getDeviceId.md | 26 ++++ .../locationDevice/locationDeviceNameById.md | 26 ++++ .../locationDevice/locationDevices.md | 27 ++++ .../api/talas_v5_DB/poiTyp/readPoiTyp.md | 36 +++++ docs/pages/api/talas_v5_DB/pois/addPoi.md | 25 ++++ docs/pages/api/talas_v5_DB/pois/deletePoi.md | 20 +++ docs/pages/api/talas_v5_DB/pois/getPoiById.md | 21 +++ docs/pages/api/talas_v5_DB/pois/poi-icons.md | 21 +++ .../pages/api/talas_v5_DB/pois/readAllPOIs.md | 17 +++ .../api/talas_v5_DB/pois/updateLocation.md | 23 ++++ docs/pages/api/talas_v5_DB/pois/updatePoi.md | 25 ++++ .../station/getAllStationsNames.md | 29 +++++ .../api/talas_v5_DB/station/getDevices.md | 40 ++++++ docs/pages/index.md | 32 +++++ docs/redux/api/fromDB/fetchLocationDevices.md | 70 ---------- docs/redux/api/fromWebService.md | 90 ------------- docs/redux/api/fromWebService/README.md | 61 --------- .../fetchGisStationsMeasurements.md | 81 ------------ .../fromWebService/fetchGisStationsStatic.md | 78 ----------- .../fetchGisStationsStaticDistrict.md | 77 ----------- .../fetchGisStationsStatusDistrict.md | 78 ----------- .../fromWebService/fetchGisSystemStatic.md | 76 ----------- .../database/locationDevicesFromDBSlice.md | 25 ++++ .../slices/database/locationDevicesSlice.md | 23 ++++ .../slices/database/priorityConfigSlice.md | 24 ++++ .../slices/db/locationDevicesFromDBSlice.md | 103 --------------- docs/redux/slices/db/poiTypesSlice.md | 93 ------------- docs/redux/store.md | 64 +++++++++ package-lock.json | 2 +- pages/index.js | 2 +- 86 files changed, 1452 insertions(+), 1185 deletions(-) delete mode 100644 docs/components/DataSheet.md delete mode 100644 docs/components/MapComponent.md create mode 100644 docs/components/contextmenu/CoordinatePopup.md create mode 100644 docs/components/contextmenu/useMapContextMenu.md create mode 100644 docs/components/gisPolylines/PolylineContextMenu.md create mode 100644 docs/components/gisPolylines/icons/CircleIcon.md create mode 100644 docs/components/gisPolylines/icons/EndIcon.md create mode 100644 docs/components/gisPolylines/icons/StartIcon.md create mode 100644 docs/components/gisPolylines/icons/SupportPointIcons.md create mode 100644 docs/components/icons/devices/overlapping/PlusRoundIcon.md create mode 100644 docs/components/mainComponent/MapComponent.md create mode 100644 docs/components/mainComponent/hooks/useInitializeMap.md create mode 100644 docs/components/pois/AddPOIModal.md create mode 100644 docs/components/pois/PoiUpdateModal.md create mode 100644 docs/hooks/layers/useAreaMarkersLayer.md create mode 100644 docs/hooks/layers/useCiscoRouterMarkersLayer.md create mode 100644 docs/hooks/layers/useDauzMarkersLayer.md create mode 100644 docs/hooks/layers/useDrawLines.md create mode 100644 docs/hooks/layers/useEciMarkersLayer.md create mode 100644 docs/hooks/layers/useGmaMarkersLayer.md create mode 100644 docs/hooks/layers/useLteModemMarkersLayer.md create mode 100644 docs/hooks/layers/useMessstellenMarkersLayer.md create mode 100644 docs/hooks/layers/useOtdrMarkersLayer.md create mode 100644 docs/hooks/layers/useSiemensMarkersLayer.md create mode 100644 docs/hooks/layers/useSmsfunkmodemMarkersLayer.md create mode 100644 docs/hooks/layers/useSonstigeMarkersLayer.md create mode 100644 docs/hooks/layers/useTalasMarkersLayer.md create mode 100644 docs/hooks/layers/useTalasiclMarkersLayer.md create mode 100644 docs/hooks/layers/useTkComponentsMarkersLayer.md create mode 100644 docs/hooks/layers/useUlafMarkersLayer.md create mode 100644 docs/hooks/layers/useWagoMarkersLayer.md create mode 100644 docs/hooks/layers/useWdmMarkersLayer.md create mode 100644 docs/hooks/useCreateAndSetDevices.md create mode 100644 docs/hooks/useDynamicMarkerLayers.md delete mode 100644 docs/hooks/useFetchPoiData.md create mode 100644 docs/hooks/useLayerVisibility.md create mode 100644 docs/hooks/useLineData.md create mode 100644 docs/hooks/useMapComponentState.md create mode 100644 docs/hooks/useMarkerLayers.md create mode 100644 docs/hooks/usePolylineTooltipLayer.md create mode 100644 docs/pages/_app.md delete mode 100644 docs/pages/api.md create mode 100644 docs/pages/api/[...path].md delete mode 100644 docs/pages/api/apiProxy.md create mode 100644 docs/pages/api/talas_v5_DB/area/readArea.md create mode 100644 docs/pages/api/talas_v5_DB/area/updateArea.md create mode 100644 docs/pages/api/talas_v5_DB/device/getAllStationsNames.md create mode 100644 docs/pages/api/talas_v5_DB/device/getDevices.md create mode 100644 docs/pages/api/talas_v5_DB/gisLines/readGisLines.md create mode 100644 docs/pages/api/talas_v5_DB/gisLines/updateLineCoordinates.md create mode 100644 docs/pages/api/talas_v5_DB/locationDevice/getDeviceId.md create mode 100644 docs/pages/api/talas_v5_DB/locationDevice/locationDeviceNameById.md create mode 100644 docs/pages/api/talas_v5_DB/locationDevice/locationDevices.md create mode 100644 docs/pages/api/talas_v5_DB/poiTyp/readPoiTyp.md create mode 100644 docs/pages/api/talas_v5_DB/pois/addPoi.md create mode 100644 docs/pages/api/talas_v5_DB/pois/deletePoi.md create mode 100644 docs/pages/api/talas_v5_DB/pois/getPoiById.md create mode 100644 docs/pages/api/talas_v5_DB/pois/poi-icons.md create mode 100644 docs/pages/api/talas_v5_DB/pois/readAllPOIs.md create mode 100644 docs/pages/api/talas_v5_DB/pois/updateLocation.md create mode 100644 docs/pages/api/talas_v5_DB/pois/updatePoi.md create mode 100644 docs/pages/api/talas_v5_DB/station/getAllStationsNames.md create mode 100644 docs/pages/api/talas_v5_DB/station/getDevices.md create mode 100644 docs/pages/index.md delete mode 100644 docs/redux/api/fromDB/fetchLocationDevices.md delete mode 100644 docs/redux/api/fromWebService.md delete mode 100644 docs/redux/api/fromWebService/README.md delete mode 100644 docs/redux/api/fromWebService/fetchGisStationsMeasurements.md delete mode 100644 docs/redux/api/fromWebService/fetchGisStationsStatic.md delete mode 100644 docs/redux/api/fromWebService/fetchGisStationsStaticDistrict.md delete mode 100644 docs/redux/api/fromWebService/fetchGisStationsStatusDistrict.md delete mode 100644 docs/redux/api/fromWebService/fetchGisSystemStatic.md create mode 100644 docs/redux/slices/database/locationDevicesFromDBSlice.md create mode 100644 docs/redux/slices/database/locationDevicesSlice.md create mode 100644 docs/redux/slices/database/priorityConfigSlice.md delete mode 100644 docs/redux/slices/db/locationDevicesFromDBSlice.md delete mode 100644 docs/redux/slices/db/poiTypesSlice.md create mode 100644 docs/redux/store.md diff --git a/components/contextmenu/CoordinatePopup.js b/components/contextmenu/CoordinatePopup.js index aa565d434..d18e82ce3 100644 --- a/components/contextmenu/CoordinatePopup.js +++ b/components/contextmenu/CoordinatePopup.js @@ -1,4 +1,4 @@ -// components/CoordinatePopup.js +// components/contextmenu/CoordinatePopup.js import React from "react"; const CoordinatePopup = ({ isOpen, coordinates, onClose }) => { diff --git a/components/contextmenu/useMapContextMenu.js b/components/contextmenu/useMapContextMenu.js index eba447e87..2ed3524e3 100644 --- a/components/contextmenu/useMapContextMenu.js +++ b/components/contextmenu/useMapContextMenu.js @@ -1,4 +1,4 @@ -// components/useMapContextMenu.js +// components/contextmenu/useMapContextMenu.js import { toast } from "react-toastify"; import { zoomIn, zoomOut, centerHere } from "../../utils/zoomAndCenterUtils"; diff --git a/components/icons/devices/overlapping/PlusRoundIcon.js b/components/icons/devices/overlapping/PlusRoundIcon.js index 21dc59f1e..389a648f2 100644 --- a/components/icons/devices/overlapping/PlusRoundIcon.js +++ b/components/icons/devices/overlapping/PlusRoundIcon.js @@ -1,4 +1,4 @@ -// /components/PlusRoundIcon.js +// /components/icons/devices/overlapping/PlusRoundIcon.js const plusRoundIcon = L.icon({ //iconUrl: "/img/plus_round.png", // Update with your actual path iconUrl: "/img/plus_round.png", // Update with your actual path diff --git a/components/pois/AddPOIModal.js b/components/pois/AddPOIModal.js index 3631cbacb..9ba33770a 100644 --- a/components/pois/AddPOIModal.js +++ b/components/pois/AddPOIModal.js @@ -1,4 +1,4 @@ -// /components/AddPOIModal.js +// /components/pois/AddPOIModal.js import React, { useState, useEffect } from "react"; import { useDispatch, useSelector } from "react-redux"; import { selectGisStationsStaticDistrict } from "../../redux/slices/webservice/gisStationsStaticDistrictSlice"; diff --git a/config/appVersion.js b/config/appVersion.js index ada23fa4a..774c1d3ce 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.194"; +export const APP_VERSION = "1.1.195"; diff --git a/docs/components/DataSheet.md b/docs/components/DataSheet.md deleted file mode 100644 index 600e54c1d..000000000 --- a/docs/components/DataSheet.md +++ /dev/null @@ -1,123 +0,0 @@ -# Komponenten-Dokumentation: `DataSheet.js` - -## Zweck - -Die Komponente `DataSheet` dient als Kontrollzentrale für die interaktive Kartenanwendung. Sie bietet Funktionen für: - -- Auswahl von Bereichen ("Stationen") aus einem Dropdown-Menü -- Steuerung der Sichtbarkeit von Layern wie POIs und Polyline (z. B. Kabelstrecken) -- Aktivierung des Editiermodus -- Steuerung von Layer-Zuständen über Redux und Recoil - ---- - -## Position im UI - -Die Komponente wird als Floating-Panel oben rechts auf der Karte angezeigt. Sie hat eine feste Breite (min/max) und ist als "Sidebar-Lightbox" implementiert. - ---- - -## Abhängigkeiten - -### Redux - -- `gisStationsStaticDistrictSlice` -- `gisSystemStaticSlice` -- `mapLayersSlice` -- `polylineLayerVisibleSlice` -- `gisStationsStaticSlice` - -* `poiLayerVisibleSlice` -* `zoomTriggerSlice` -* `selectedAreaSlice` - -### Hooks - -- `useInitGisStationsStatic()` - ---- - -## Funktionalität im Überblick - -### 1. **Bereiche Dropdown** - -- Gefüllt aus `GisStationsStatic.Points` -- Wird aktualisiert, wenn sich die Redux-Daten ändern -- Bei Auswahl wird `selectedAreaState` aktualisiert - -### 2. **Systemlayer-Checkboxen** - -- Daten kommen aus `GisSystemStatic` -- Jeder Eintrag hat `Name` und einen intern generierten `key` -- Sichtbarkeit wird über `mapLayersState` verwaltet -- Zustand wird in `localStorage` gespeichert - -### 3. **TALAS-Untermenu** - -- Bei Systemname "TALAS" wird eine Untergruppe angezeigt: - - Checkbox für Polyline (Kabelstrecken) - - Sichtbarkeit auch in `localStorage` - -### 4. **POI-Checkbox** - -- Redux-Slice `poiLayerVisibleSlice` -- Sichtbarkeit von POI-Layern auf der Karte - -### 5. **EditModeToggle** - -- Eine separate Komponente -- Aktiviert/Deaktiviert den Bearbeitungsmodus (z. B. für Kontextmenü-Einträge) -- Bei aktivem EditMode sind Checkboxen deaktiviert - ---- - -## Lokale Speicherwerte (localStorage) - -Folgende Werte werden zwischen Sitzungen gespeichert: - -| Key | Zweck | -| --------------------- | ---------------------------------- | -| `poiVisible` | Sichtbarkeit POI-Layer | -| `polylineVisible` | Sichtbarkeit Kabelstrecken | -| `mapLayersVisibility` | Sichtbarkeitsstatus für alle Layer | -| `editMode` | Status des Bearbeitungsmodus | - ---- - -## Bekannte Besonderheiten - -- **Fallbacks** für Redux-Selector: z. B. `|| []` bei leeren Listen -- **Fehlerprüfung** für `GisStationsStatic.Points` im useEffect -- **Doppelte Initialisierung von stationListing** (einmal aus `Points`, einmal aus `District`) - ---- - -## Voraussetzungen für korrekte Funktion - -- API-Endpunkt `/GisStationsStatic?idMap=...` muss korrekte Struktur liefern: `{ Points: [...] }` -- Redux Store muss korrekt initialisiert sein -- Hook `useInitGisStationsStatic` muss beim Mount ausgeführt werden - ---- - -## Weiterführende Dateien - -- `/hooks/useMapComponentState.js` -- `/components/EditModeToggle.js` -- Redux-Slices unter `/redux/slices/` - ---- - -## Speicherort für Dokumentation - -Empfohlenes Ziel: `/docs/DataSheet.md` - ---- - ---- - -## Hinweis zur Umstellung - -Diese Komponente wurde ursprünglich mit Recoil entwickelt. -Seit Version `1.1.96` ist der Zustand vollständig auf **Redux Toolkit** umgestellt. -Die Recoil-Atoms wurden entfernt und durch Redux-Slices ersetzt. diff --git a/docs/components/MapComponent.md b/docs/components/MapComponent.md deleted file mode 100644 index 3d4db7144..000000000 --- a/docs/components/MapComponent.md +++ /dev/null @@ -1,60 +0,0 @@ -# 🗺️ MapComponent – Webservice-Parameter - -## 🔄 URL-Parameter vom Aufrufer (z. B. TALAS.web) - -Die Anwendung wird mit Kurzparametern aufgerufen: - -``` -http://[SERVER]:3000/?m=12&u=484 -``` - -| Parameter | Bedeutung | -| --------- | -------------------------- | -| `m` | Map-ID (intern: `idMap`) | -| `u` | User-ID (intern: `idUser`) | - -Diese Parameter werden im Code wie folgt gelesen: - -```js -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -const idUser = params.get("u"); -``` - ---- - -## 🔁 Webservice-Proxy intern - -Die Next.js API-Routen übernehmen die Umwandlung zu den Webservices: - -```js -// Beispiel: /pages/api/gisSystemStatic.js -const targetUrl = `http://.../WebServiceMap.asmx/GisSystemStatic?idMap=${idMap}&idUser=${idUser}`; -``` - -➡ Die Konvertierung `m → idMap` und `u → idUser` erfolgt **nur im Backend (API-Routen)** - ---- - -## 🧠 Hinweis für Entwickler - -- `m` und `u` **immer** aus der URL im Client lesen -- Niemals `idMap` oder `idUser` direkt im Frontend erwarten -- Alle Webservice-Zugriffe im Frontend laufen über interne API-Routen `/api/...` -- Beispiel-Aufruf: - ```js - fetch(`/api/gisSystemStatic?m=${idMap}&u=${idUser}`); - ``` - ---- - -## 🌐 Beispiele aus der Praxis - -| Umgebung | URL-Aufruf-Beispiel | -| --------------------- | ------------------------------------------------------------- | -| Entwicklungs-PC | http://10.10.0.70:3000/?m=12&u=484 | -| Test-Server via TALAS | http://10.10.0.13/talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 | - ---- - -Diese Konvention ist essenziell für einheitliche Übergabe und Backend-Kompatibilität. diff --git a/docs/components/TestScript.md b/docs/components/TestScript.md index e69de29bb..c8184a986 100644 --- a/docs/components/TestScript.md +++ b/docs/components/TestScript.md @@ -0,0 +1,44 @@ + + +# 🧪 TestScript.js + +Ein einfaches React-Testskript zur Laufzeitüberprüfung von Codefragmenten in `setupPolylines.js`. + +## Zweck + +Dieses Skript durchsucht die geladene `setupPolylines.js`-Datei (per `raw-loader`) nach bestimmten Kontextmenüeinträgen: + +- „Stützpunkt entfernen“ +- „Stützpunkt hinzufügen“ + +## Vorgehen + +- Lädt `setupPolylines.js` als Text via `!!raw-loader!` +- Nutzt reguläre Ausdrücke zur Prüfung +- Gibt Ergebnisse farblich formatiert in der Konsole aus + +## Ausgaben + +| Zustand | Beschreibung | +|-------------|-----------------------------------------------------| +| ✅ Test bestanden | Der gesuchte Text wurde gefunden | +| ❌ Test fehlgeschlagen | Der gesuchte Text fehlt in der Datei | +| ℹ️ Info | Neutrale Zusatzinformationen in der Konsole | + +## Besonderheiten + +- Kein visuelles UI – Rückmeldung nur über `console.log` +- Eignet sich als Dev-Hilfe für Refactoring oder PR-Checks + +## Beispielausgabe + +```plaintext +✔ Test bestanden: Der Text für 'Stützpunkt entfernen' wurde gefunden. +ℹ️ Info: Überprüfung abgeschlossen. +``` + +## Hinweise + +- Wird automatisch beim Mount (via `useEffect`) ausgeführt +- `return null` → keine sichtbare Ausgabe + diff --git a/docs/components/contextmenu/CoordinatePopup.md b/docs/components/contextmenu/CoordinatePopup.md new file mode 100644 index 000000000..5ccb4858a --- /dev/null +++ b/docs/components/contextmenu/CoordinatePopup.md @@ -0,0 +1,31 @@ + + +# 📌 CoordinatePopup.js + +Zeigt ein modales Fenster mit Koordinateninformationen an, z. B. aus einem Kontextmenü heraus. + +## Features + +- Darstellung eines Koordinatenwerts (`lat,lng`) +- Kopieren in die Zwischenablage (Clipboard API + Fallback) +- Modal zentriert mit Tailwind CSS +- Zwei Buttons: „Kopieren“ und „Schließen“ + +## Props + +| Name | Typ | Beschreibung | +|-------------|-----------|------------------------------------| +| `isOpen` | `boolean` | Steuert Sichtbarkeit des Modals | +| `coordinates` | `string` | Zu zeigende Koordinaten (z. B. `"53.2,8.1"`) | +| `onClose` | `function` | Wird bei Klick auf „Schließen“ ausgelöst | + +## Design + +- Tailwind-Klassen für zentriertes Layout (`fixed`, `inset-0`, `z-50`) +- Leicht animierter Button-Hover + +## Interne Logik + +- Nutzt `navigator.clipboard.writeText` oder Fallback mit `document.execCommand("copy")` +- Stoppt Event-Bubbling, um Klick außerhalb zu erkennen + diff --git a/docs/components/contextmenu/useMapContextMenu.md b/docs/components/contextmenu/useMapContextMenu.md new file mode 100644 index 000000000..134d4cbd0 --- /dev/null +++ b/docs/components/contextmenu/useMapContextMenu.md @@ -0,0 +1,36 @@ + + +# 🖱️ useMapContextMenu.js + +Initialisiert Kontextmenüeinträge für die Leaflet-Karte. +Wird typischerweise in `initializeMap()` oder `MapComponent` verwendet. + +## Kontextmenüeinträge + +| Eintrag | Funktion | +|---------------------|------------------------------------------------| +| Koordinaten anzeigen | Öffnet `CoordinatePopup` mit aktueller Position | +| Reinzoomen | Zoomt 3 Stufen näher an das Zentrum heran | +| Rauszoomen | Zoomt 3 Stufen heraus | +| Hier zentrieren | Verschiebt Kartenzentrum auf Klickposition | +| POI hinzufügen | (nur bei `editMode=true`) öffnet POI-Dialog | + +## Parameter + +```js +addItemsToMapContextMenu( + map, + menuItemAdded, + setMenuItemAdded, + setShowCoordinatesModal, + setShowPoiModal, + setPopupCoordinates, + openPopupWithCoordinates +) +``` + +## Besonderheiten + +- Prüft auf `localStorage.editMode` für POI-Eintrag +- FlyTo-Animationen für Zoom-Vorgänge mit dynamischer Dauer +- Modularer Aufbau: `openPopupWithCoordinates` wird extern übergeben diff --git a/docs/components/gisPolylines/PolylineContextMenu.md b/docs/components/gisPolylines/PolylineContextMenu.md new file mode 100644 index 000000000..32ab16ae0 --- /dev/null +++ b/docs/components/gisPolylines/PolylineContextMenu.md @@ -0,0 +1,34 @@ + + +# 📐 PolylineContextMenu.js + +Ein einfaches benutzerdefiniertes Kontextmenü zur Interaktion mit Linien (Polylinien) auf der Karte. + +## Zweck + +Das Menü erlaubt folgende Interaktionen: + +- ➕ „Stützpunkt hinzufügen“ +- ➖ „Stützpunkt entfernen“ +- ❌ „Schließen“ + +Wird dynamisch positioniert anhand der Klickkoordinaten (`position.x`, `position.y`). + +## Props + +| Prop | Typ | Beschreibung | +|---------------|-----------|----------------------------------------------------| +| `position` | `{x, y}` | Position in Pixelkoordinaten (z. B. von Mausereignis) | +| `onAddPoint` | `function`| Handler für „Stützpunkt hinzufügen“ | +| `onRemovePoint` | `function` | Handler für „Stützpunkt entfernen“ | +| `onClose` | `function`| Handler zum Schließen des Menüs | + +## Styling + +- Absolut positioniertes `div` +- Weißer Hintergrund, schwarzer Rahmen +- Kein Tailwind – purer Inline-Style + +## Verwendung + +Eingebettet z. B. in `setupPolylines.js` oder `PolylineLayerManager`, um rechte Mausklicks auf Linien zu behandeln. diff --git a/docs/components/gisPolylines/icons/CircleIcon.md b/docs/components/gisPolylines/icons/CircleIcon.md new file mode 100644 index 000000000..6b063073c --- /dev/null +++ b/docs/components/gisPolylines/icons/CircleIcon.md @@ -0,0 +1,16 @@ + + +# 🔘 CircleIcon.js + +Ein einfacher, grauer runder Marker als Stützpunkt in einer Polyline. + +## Eigenschaften + +- Stil: grauer Kreis mit schwarzem Rand +- Größe: 10×10 px, IconSize 25×25 px (wegen Klickfläche) +- Klasse: `custom-circle-icon` + +## Verwendung + +Wird in Polylinien als Zwischenpunkt gesetzt. Inaktiv, aber sichtbar. + diff --git a/docs/components/gisPolylines/icons/EndIcon.md b/docs/components/gisPolylines/icons/EndIcon.md new file mode 100644 index 000000000..28189bd5a --- /dev/null +++ b/docs/components/gisPolylines/icons/EndIcon.md @@ -0,0 +1,15 @@ + + +# 🔲 EndIcon.js + +Ein Viereck zur Markierung des Endpunkts einer Polyline. + +## Eigenschaften + +- Stil: graues Quadrat mit schwarzem Rand +- Größe: 14×14 px +- Klasse: `custom-end-icon` + +## Verwendung + +Wird am letzten Punkt einer Linie gesetzt, z. B. `lineData.coordinates[line.length - 1]` diff --git a/docs/components/gisPolylines/icons/StartIcon.md b/docs/components/gisPolylines/icons/StartIcon.md new file mode 100644 index 000000000..a09d2a3d9 --- /dev/null +++ b/docs/components/gisPolylines/icons/StartIcon.md @@ -0,0 +1,15 @@ + + +# 🔺 StartIcon.js + +Ein SVG-Dreieck zur Markierung des Startpunkts einer Polyline. + +## Eigenschaften + +- Schwarzes Dreieck mit grauem Overlay (Polygon SVG) +- Größe: 18×18 px +- Klasse: `custom-start-icon` + +## Verwendung + +Wird am ersten Punkt einer Polyline platziert. diff --git a/docs/components/gisPolylines/icons/SupportPointIcons.md b/docs/components/gisPolylines/icons/SupportPointIcons.md new file mode 100644 index 000000000..1e0e102a6 --- /dev/null +++ b/docs/components/gisPolylines/icons/SupportPointIcons.md @@ -0,0 +1,20 @@ + + +# ➕➖ SupportPointIcons.js + +Definiert zwei Icons für interaktive Stützpunkte in einer Polyline: + +## AddSupportPointIcon + +- Grüner Kreis mit weißem Rand und Pluszeichen +- `iconSize`: 24×24 px + +## RemoveSupportPointIcon + +- Roter Kreis mit weißem Rand und Minuszeichen +- `iconSize`: 24×24 px + +## Verwendung + +- Hinzufügen/Entfernen von Zwischenpunkten in der Bearbeitungsansicht (editMode) +- Marker erscheinen z. B. bei Maus-Hover oder per Kontextmenü diff --git a/docs/components/icons/devices/overlapping/PlusRoundIcon.md b/docs/components/icons/devices/overlapping/PlusRoundIcon.md new file mode 100644 index 000000000..42d3b2569 --- /dev/null +++ b/docs/components/icons/devices/overlapping/PlusRoundIcon.md @@ -0,0 +1,26 @@ + + +# ➕ PlusRoundIcon.js + +Ein einfaches Leaflet-Icon, das ein rundes Pluszeichen darstellt. +Wird für zusätzliche UI-Markierungen auf Geräten oder überlappenden Icons verwendet. + +## Eigenschaften + +| Attribut | Wert | +|--------------|--------------------| +| `iconUrl` | `/img/plus_round.png` | +| `iconSize` | `[22, 22]` | +| `iconAnchor` | `[25, 55]` | +| `className` | `absolute top-0 left-0 z-10` (Tailwind) + +## Verwendung + +- Dient als Overlay-Symbol, z. B. für „Gerät hinzufügen“ oder zur Darstellung über bestehenden Icons +- Durch die `z-10`-Klasse immer im Vordergrund sichtbar +- Kombinierbar mit OverlappingMarkerSpiderfier oder Marker-Gruppen + +## Hinweis + +- Die Bilddatei `/img/plus_round.png` muss vorhanden sein +- Kann bei Bedarf dynamisch durch ein anderes Icon ersetzt werden diff --git a/docs/components/mainComponent/MapComponent.md b/docs/components/mainComponent/MapComponent.md new file mode 100644 index 000000000..7099b50c9 --- /dev/null +++ b/docs/components/mainComponent/MapComponent.md @@ -0,0 +1,71 @@ + + +# 🗺️ MapComponent.js + +Die zentrale React-Komponente zur Darstellung und Steuerung der Leaflet-Karte. +Bindet alle Marker, Layer, POIs, Linien und das Kontextmenü dynamisch ein. + +--- + +## 🎯 Zweck + +- Initialisiert die Leaflet-Karte (`useInitializeMap`) +- Bindet Marker & Polylinien über Redux und eigene Hooks +- Steuerung über Redux-Slices wie `selectedArea`, `zoomTrigger`, `polylineVisible` +- Kontextmenüs für Karte, POIs, Polylinien +- Unterstützung für Editierfunktionen über `editMode` (localStorage) + +--- + +## 🧱 Hauptbestandteile + +- `useEffect`-Hooks zum Laden und Aktualisieren von: + - Kartenlayern, POIs, Linien, Rechte, Systeme, Positionen +- Marker-Logik für 15+ Layergruppen (TALAS, ECI, GMA, etc.) +- Marker-Overlapping mit `OverlappingMarkerSpiderfier` +- Kontextmenüs (Karte & Polylinie) +- UI-Komponenten: + - `MapLayersControlPanel` + - `CoordinateInput` + - `CoordinatePopup` + - `AddPOIModal`, `PoiUpdateModal`, `VersionInfoModal` + +--- + +## 🧠 Zustand & Redux + +Verwendet umfangreiche Redux-Slices zur Steuerung von: + +- Linienstatus, POI-Typen, POI-Icons +- Gerätesysteme & Rechte +- Sichtbarkeit einzelner Layergruppen +- Aktuelle Selektion (Area, Gerät, POI) + +--- + +## 🔧 Lokale Steuerung + +- EditMode wird aus `localStorage` gelesen +- Karte speichert Zoom & Center dauerhaft im Browser +- Kontextmenü-Einträge ändern sich je nach Rechten & Modus + +--- + +## 🧪 Besonderheiten + +- Fehlerbehandlung für `contextmenu`-Fehler eingebaut → Auto-Neuladen +- Alle Marker-Updates mit Overlapping-Check & Z-Index-Steuerung +- Linien enthalten dynamische Tooltips mit `tooltipContents` +- Initiale Datenabfrage über Redux-Thunk-Kaskade + +--- + +## 🔗 Abhängigkeiten + +- Leaflet, OverlappingMarkerSpiderfier, React-Toastify +- Redux Toolkit (Thunks + Selectors) +- Tailwind CSS für visuelles Layout + +--- + +📄 Pfad: `/components/mainComponent/MapComponent.js` diff --git a/docs/components/mainComponent/hooks/useInitializeMap.md b/docs/components/mainComponent/hooks/useInitializeMap.md new file mode 100644 index 000000000..05b5acfa9 --- /dev/null +++ b/docs/components/mainComponent/hooks/useInitializeMap.md @@ -0,0 +1,53 @@ + + +# 🪄 useInitializeMap.js + +Custom React-Hook zur Initialisierung der Leaflet-Karte. +Ermöglicht die einfache Übergabe aller nötigen Parameter und abstrahiert die `initializeMap(...)`-Logik. + +--- + +## 📦 Zweck + +- Führt `initializeMap(...)` nur **einmal** aus, wenn `mapRef` existiert und `map === null` +- Kapselt die Initialisierung in ein `useEffect` + +--- + +## 🔧 Parameter + +| Name | Typ | Beschreibung | +|--------------------------|------------|---------------------------------------------------| +| `map` | `LeafletMap` (Zustand) | Wird initialisiert, wenn `null` | +| `mapRef` | `ref` | Referenz auf `
` | +| `setMap` | `function` | Callback zum Setzen der Karteninstanz | +| `setOms` | `function` | Callback für OverlappingMarkerSpiderfier | +| `setMenuItemAdded` | `function` | Wird genutzt, um mehrfaches Menü-Setup zu verhindern | +| `addItemsToMapContextMenu` | `function` | Logik zum Hinzufügen von Kontextmenüeinträgen | +| `hasRights` | `boolean` | Steuerung, ob POI-Menüs angezeigt werden dürfen | +| `setPolylineEventsDisabled` | `function` | Aktiviert/Deaktiviert Polyline-Events global | + +--- + +## 🌐 Verwendung + +In `MapComponent.js`: + +```js +useInitializeMap( + map, + mapRef, + setMap, + setOms, + setMenuItemAdded, + addItemsToMapContextMenu, + hasRights, + (value) => dispatch(setDisabled(value)) +); +``` + +--- + +## 📁 Quelle + +Wrappt `initializeMap()` aus `/utils/initializeMap.js` diff --git a/docs/components/pois/AddPOIModal.md b/docs/components/pois/AddPOIModal.md new file mode 100644 index 000000000..0a3017925 --- /dev/null +++ b/docs/components/pois/AddPOIModal.md @@ -0,0 +1,28 @@ + + +# ➕ AddPOIModal.js + +Zeigt ein modales Formular an, um einen neuen POI auf der Karte zu erstellen. +Die Koordinaten (`latlng`) werden automatisch übernommen. + +## Funktionen + +- POI-Name, Typ und zugehöriges Gerät auswählbar +- Koordinatenanzeige (`lat`, `lng`) +- Dynamisches Laden der Gerätedaten und POI-Typen +- Fehleranzeige bei fehlgeschlagenem Speichern +- Löst `addPoiThunk` + Refresh-Trigger (`incrementTrigger`) aus + +## Props + +| Prop | Typ | Beschreibung | +|----------|-----------|--------------------------------------------------| +| `onClose` | `function` | Schließt das Modal | +| `map` | `Leaflet` | (optional) zum Schließen evtl. offener Popups | +| `latlng` | `object` | Koordinaten für den neuen POI | + +## Redux + +- `fetchPoiTypThunk`, `fetchPoiIconsDataThunk` +- `addPoiThunk`, `resetAddPoiStatus` + diff --git a/docs/components/pois/PoiUpdateModal.md b/docs/components/pois/PoiUpdateModal.md new file mode 100644 index 000000000..df17e5ec7 --- /dev/null +++ b/docs/components/pois/PoiUpdateModal.md @@ -0,0 +1,29 @@ + + +# ✏️ PoiUpdateModal.js + +Ein Dialog zur Aktualisierung oder Löschung bestehender POIs. + +## Features + +- Zeigt aktuellen Namen, Beschreibung, Gerät und Typ +- Gerät und Typ auswählbar via `react-select` +- Unterstützt Löschen und Speichern von POIs +- Eingebundene Sicherheitsabfrage bei Löschen + +## Props + +| Prop | Typ | Beschreibung | +|------------|-----------|---------------------------------------| +| `onClose` | `function`| Schließt das Modal | +| `poiData` | `object` | Bestehende POI-Daten zur Bearbeitung | + +## Redux + +- `updatePoiThunk`, `deletePoiThunk` +- `fetchLocationDevicesThunk`, `fetchPoiTypThunk` + +## Technisches + +- Dynamische Gerätegruppenfilterung basierend auf `mapLayersVisibility` +- Formfelder mit `react-select` für bessere UX diff --git a/docs/hooks/layers/useAreaMarkersLayer.md b/docs/hooks/layers/useAreaMarkersLayer.md new file mode 100644 index 000000000..6b8d698fc --- /dev/null +++ b/docs/hooks/layers/useAreaMarkersLayer.md @@ -0,0 +1,13 @@ + + +# 🗺️ useAreaMarkersLayer.js + +Lädt Bereichs-/Stationsmarker aus einer API und rendert sie auf der Karte. + +## Features + +- Marker mit Tooltip für Standort & Bereich +- Draggable Marker (verschiebbar) +- Automatischer API-Fetch mit `fetch(...)` +- Dynamisches Layer-Handling via localStorage ("mapLayersVisibility") +- Automatisches Speichern neuer Koordinaten per `updateAreaThunk()` diff --git a/docs/hooks/layers/useCiscoRouterMarkersLayer.md b/docs/hooks/layers/useCiscoRouterMarkersLayer.md new file mode 100644 index 000000000..18947c16c --- /dev/null +++ b/docs/hooks/layers/useCiscoRouterMarkersLayer.md @@ -0,0 +1,11 @@ + + +# 🌐 useCiscoRouterMarkersLayer.js + +Hook zur Verwaltung aller Cisco-Router-Marker in der Leaflet-Karte. + +## Funktionen + +- Lädt Geräte per `createAndSetDevices(6, ...)` +- Fügt Marker hinzu & registriert Popup/Kontextmenü +- Verwendet `checkOverlappingMarkers(...)` diff --git a/docs/hooks/layers/useDauzMarkersLayer.md b/docs/hooks/layers/useDauzMarkersLayer.md new file mode 100644 index 000000000..6cac8ac43 --- /dev/null +++ b/docs/hooks/layers/useDauzMarkersLayer.md @@ -0,0 +1,11 @@ + + +# 🔧 useDauzMarkersLayer.js + +Spezialisierter Hook zur Verwaltung von DAUZ-Gerätemarkern (System-ID: 110) + +## Verhalten + +- Marker mit Popup & Kontextmenü +- Nutzung von `createAndSetDevices(...)` +- Sichtbarkeit direkt über Kartenlayer steuerbar diff --git a/docs/hooks/layers/useDrawLines.md b/docs/hooks/layers/useDrawLines.md new file mode 100644 index 000000000..039d75015 --- /dev/null +++ b/docs/hooks/layers/useDrawLines.md @@ -0,0 +1,11 @@ + + +# 🧬 useDrawLines.js + +Hook zur Konvertierung von GIS-Linien in kartentaugliche Koordinatenpaare. + +## Schritte + +- Lädt Linien mit `fetchGisLinesThunk()` +- Wandelt `points[x, y]` in Leaflet-Koordinaten `[lat, lng]` um +- Gibt `setLinePositions([...])` zurück diff --git a/docs/hooks/layers/useEciMarkersLayer.md b/docs/hooks/layers/useEciMarkersLayer.md new file mode 100644 index 000000000..b228e4b92 --- /dev/null +++ b/docs/hooks/layers/useEciMarkersLayer.md @@ -0,0 +1,11 @@ + + +# 🛰️ useEciMarkersLayer.js + +Verwaltet die Darstellung und Events für ECI-Marker (System-ID: 2) + +## Features + +- Kontextmenü & Popup für jeden Marker +- Erkennung überlappender Marker (`checkOverlappingMarkers`) +- Nutzung von `createAndSetDevices(...)` diff --git a/docs/hooks/layers/useGmaMarkersLayer.md b/docs/hooks/layers/useGmaMarkersLayer.md new file mode 100644 index 000000000..d4dee7f2b --- /dev/null +++ b/docs/hooks/layers/useGmaMarkersLayer.md @@ -0,0 +1,11 @@ + + +# 🌡️ useGmaMarkersLayer.js + +Spezialhook für GMA-Marker mit Messwertanzeige (LT, FBT, GT, RLF). + +## Besonderheiten + +- Tooltip enthält Temperatur-/Feuchtigkeitswerte aus Redux +- Eigenes Kontextmenü mit Zoom/Zentrieren +- Verwendet `marker.options.areaName` zur Messzuordnung diff --git a/docs/hooks/layers/useLteModemMarkersLayer.md b/docs/hooks/layers/useLteModemMarkersLayer.md new file mode 100644 index 000000000..e7f411b27 --- /dev/null +++ b/docs/hooks/layers/useLteModemMarkersLayer.md @@ -0,0 +1,10 @@ + + +# 📶 useLteModemMarkersLayer.js + +Steuert Marker vom Typ LTE-Modem (System-ID: 5) + +## Features + +- Standard-Kontextmenü + Popup +- Integration mit OMS und Overlap-Check diff --git a/docs/hooks/layers/useMessstellenMarkersLayer.md b/docs/hooks/layers/useMessstellenMarkersLayer.md new file mode 100644 index 000000000..3e3cddb78 --- /dev/null +++ b/docs/hooks/layers/useMessstellenMarkersLayer.md @@ -0,0 +1,10 @@ + + +# 🧾 useMessstellenMarkersLayer.js + +Für Messstellen-Marker (System-ID: 13) + +## Verhalten + +- Einfache Marker mit Tooltip +- Nutzung von `createAndSetDevices(...)` + Kontextmenü diff --git a/docs/hooks/layers/useOtdrMarkersLayer.md b/docs/hooks/layers/useOtdrMarkersLayer.md new file mode 100644 index 000000000..b7d79ff12 --- /dev/null +++ b/docs/hooks/layers/useOtdrMarkersLayer.md @@ -0,0 +1,10 @@ + + +# 🔍 useOtdrMarkersLayer.js + +Darstellung von OTDR-Messpunkten (System-ID: 9) + +## Funktionen + +- Popup-Interaktion beim Hover +- Marker mit Kontextmenü via `addContextMenuToMarker` diff --git a/docs/hooks/layers/useSiemensMarkersLayer.md b/docs/hooks/layers/useSiemensMarkersLayer.md new file mode 100644 index 000000000..8dc2c6ae4 --- /dev/null +++ b/docs/hooks/layers/useSiemensMarkersLayer.md @@ -0,0 +1,7 @@ +# 🏭 useSiemensMarkersLayer.js + +Für Siemens-Geräte (System-ID: 8). + +- Marker mit Kontextmenü und Overlap-Prüfung +- Integration mit OMS +- Nutzung von `checkOverlappingMarkers(...)` \ No newline at end of file diff --git a/docs/hooks/layers/useSmsfunkmodemMarkersLayer.md b/docs/hooks/layers/useSmsfunkmodemMarkersLayer.md new file mode 100644 index 000000000..be77c5efc --- /dev/null +++ b/docs/hooks/layers/useSmsfunkmodemMarkersLayer.md @@ -0,0 +1,7 @@ +# 📡 useSmsfunkmodemMarkersLayer.js + +Filtert `GisSystemStatic` nach SMS Modem (System 111 oder Name). + +- Icon: `/img/icons/pois/sms-funkmodem.png` +- Kontextmenü & Popup +- Sichtbarkeit über `isVisible` steuerbar \ No newline at end of file diff --git a/docs/hooks/layers/useSonstigeMarkersLayer.md b/docs/hooks/layers/useSonstigeMarkersLayer.md new file mode 100644 index 000000000..cf876ffef --- /dev/null +++ b/docs/hooks/layers/useSonstigeMarkersLayer.md @@ -0,0 +1,7 @@ +# ❔ useSonstigeMarkersLayer.js + +Für alle Geräte mit System-ID 200 (Sonstige). + +- Klassische Leaflet-Marker +- Kontextmenü und Popup +- Nutzung von `createAndSetDevices(...)` \ No newline at end of file diff --git a/docs/hooks/layers/useTalasMarkersLayer.md b/docs/hooks/layers/useTalasMarkersLayer.md new file mode 100644 index 000000000..ce85c4ffc --- /dev/null +++ b/docs/hooks/layers/useTalasMarkersLayer.md @@ -0,0 +1,6 @@ +# 🌐 useTalasMarkersLayer.js + +Für TALAS-Systeme (System-ID: 1). + +- Popup + Kontextmenü auf Marker +- Fügt Marker zuerst zu OMS, dann zu Karte hinzu \ No newline at end of file diff --git a/docs/hooks/layers/useTalasiclMarkersLayer.md b/docs/hooks/layers/useTalasiclMarkersLayer.md new file mode 100644 index 000000000..cfd112e60 --- /dev/null +++ b/docs/hooks/layers/useTalasiclMarkersLayer.md @@ -0,0 +1,6 @@ +# 🔗 useTalasiclMarkersLayer.js + +Spezialhook für Geräte vom Typ TALASICL (System-ID: 100). + +- Erstellt Marker mit Standardverhalten +- Kontextmenü, Popup, Overlap-Prüfung \ No newline at end of file diff --git a/docs/hooks/layers/useTkComponentsMarkersLayer.md b/docs/hooks/layers/useTkComponentsMarkersLayer.md new file mode 100644 index 000000000..cf615a30b --- /dev/null +++ b/docs/hooks/layers/useTkComponentsMarkersLayer.md @@ -0,0 +1,6 @@ +# ⚙️ useTkComponentsMarkersLayer.js + +Für TK-Komponenten (System-ID: 30). + +- Lädt Marker via `createAndSetDevices` +- Marker-Koordinaten können debug-geloggt werden \ No newline at end of file diff --git a/docs/hooks/layers/useUlafMarkersLayer.md b/docs/hooks/layers/useUlafMarkersLayer.md new file mode 100644 index 000000000..ee55b88cc --- /dev/null +++ b/docs/hooks/layers/useUlafMarkersLayer.md @@ -0,0 +1,7 @@ +# 💡 useUlafMarkersLayer.js + +Spezialhook für ULAF-Systeme (System-ID: 0). + +- Marker mit ULAF-Icon +- Kontextmenü und Popup (statisch) +- Dynamisch generierter Popupinhalt \ No newline at end of file diff --git a/docs/hooks/layers/useWagoMarkersLayer.md b/docs/hooks/layers/useWagoMarkersLayer.md new file mode 100644 index 000000000..144ce8c83 --- /dev/null +++ b/docs/hooks/layers/useWagoMarkersLayer.md @@ -0,0 +1,6 @@ +# 🧰 useWagoMarkersLayer.js + +Für WAGO-Systeme (System-ID: 7). + +- Kontextmenü, Popup, Overlapping-Support +- OMS-Integration und Layer-Hinzufügung \ No newline at end of file diff --git a/docs/hooks/layers/useWdmMarkersLayer.md b/docs/hooks/layers/useWdmMarkersLayer.md new file mode 100644 index 000000000..2453e5542 --- /dev/null +++ b/docs/hooks/layers/useWdmMarkersLayer.md @@ -0,0 +1,7 @@ +# 🔷 useWdmMarkersLayer.js + +Verwaltet WDM-Marker (System-ID: 10) in Leaflet. + +- Marker mit Kontextmenü +- Mouseover-Popup +- Nutzung von `createAndSetDevices(...)` \ No newline at end of file diff --git a/docs/hooks/useCreateAndSetDevices.md b/docs/hooks/useCreateAndSetDevices.md new file mode 100644 index 000000000..05f0d430a --- /dev/null +++ b/docs/hooks/useCreateAndSetDevices.md @@ -0,0 +1,17 @@ + + +# 🛠️ useCreateAndSetDevices.js + +Custom Hook zur Initialisierung von Leaflet-Markern für ein bestimmtes System. +Bindet `createAndSetDevices(...)` automatisch in einen `useEffect`. + +## Parameter + +- `systemId`: ID des Gerätesystems (z. B. 1 = TALAS) +- `setMarkersFunction`: Funktion zum Speichern der erzeugten Marker +- `GisSystemStatic`: Systemdaten aus Redux +- `priorityConfig`: Konfigurationsobjekt zur Prioritätsbewertung + +## Redux + +- Bezieht `polylineEventsDisabled` aus Redux zur Steuerung der Interaktivität diff --git a/docs/hooks/useDynamicMarkerLayers.md b/docs/hooks/useDynamicMarkerLayers.md new file mode 100644 index 000000000..8035346f6 --- /dev/null +++ b/docs/hooks/useDynamicMarkerLayers.md @@ -0,0 +1,17 @@ + + +# 🔄 useDynamicMarkerLayers.js + +Verwaltet alle Marker-Layergruppen dynamisch und modular in einem zentralen Hook. + +## Funktionen + +- Initialisiert LayerGroups für 15+ Gerätesysteme +- Ruft `createAndSetDevices()` pro System-ID auf +- Führt automatisch Overlap-Check aus (`checkOverlappingMarkers`) +- Speichert erzeugte Marker in `setMarkerStates` + +## Voraussetzungen + +- Karte (`map`) muss bereit sein +- `GisSystemStatic` + `priorityConfig` + Marker-Setter müssen übergeben werden diff --git a/docs/hooks/useFetchPoiData.md b/docs/hooks/useFetchPoiData.md deleted file mode 100644 index 8003bfb98..000000000 --- a/docs/hooks/useFetchPoiData.md +++ /dev/null @@ -1,44 +0,0 @@ -# 📍 useFetchPoiData – Laden von POI-Typen und Icons - -## Zweck - -Dieser React-Hook wird im Frontend verwendet, um: - -1. Alle POI-Typen (`poiTyp/readPoiTyp`) -2. Alle POI-Icons (`pois/poi-icons`) - -vom Server abzurufen und sie in lokale React-Komponenten zu laden. - ---- - -## Aufrufstruktur - -```js -const API_BASE_URL = typeof window !== "undefined" ? `${window.location.protocol}//${window.location.hostname}:3000` : ""; - -await fetch(`${API_BASE_URL}/api/talas_v5_DB/poiTyp/readPoiTyp`); -await fetch(`${API_BASE_URL}/api/talas_v5_DB/pois/poi-icons`); -``` - ---- - -## Erklärung - -Da die Anwendung produktiv über Port `80` läuft, aber die Next.js-API auf Port `3000`, wird `:3000` explizit in der URL ergänzt. - -Dieser Hook funktioniert nur im Client-Browser. Die Prüfung mit `typeof window !== "undefined"` schützt davor, dass `window` im SSR-Kontext (Server-Side Rendering) undefined ist. - ---- - -## Verhalten bei Fehlern - -- Wenn die Antwort nicht `ok` ist (z. B. 404, 500), wird ein Fehler in der Console angezeigt. -- Wenn die Daten kein Array sind (für `poiTyp`), wird eine zusätzliche Validierung ausgelöst. - ---- - -## Siehe auch - -- [`MapComponent`](../components/MapComponent.md) -- `pages/api/talas_v5_DB/poiTyp/readPoiTyp.js` -- `pages/api/talas_v5_DB/pois/poi-icons.js` diff --git a/docs/hooks/useLayerVisibility.md b/docs/hooks/useLayerVisibility.md new file mode 100644 index 000000000..a76503523 --- /dev/null +++ b/docs/hooks/useLayerVisibility.md @@ -0,0 +1,15 @@ + + +# 👁️ useLayerVisibility.js + +Custom Hook zur dynamischen Steuerung von Layer-Sichtbarkeit basierend auf Redux. + +## Features + +- Entfernt oder zeigt Marker je nach `mapLayersVisibility` +- Nutzt `OverlappingMarkerSpiderfier` (`oms`) +- Normalisiert Layer-Keys (z. B. `"GMA"` → `"gma"`) + +## Intern + +Verwendet `addContextMenuToMarker()` zur Kontextmenüintegration pro Marker. diff --git a/docs/hooks/useLineData.md b/docs/hooks/useLineData.md new file mode 100644 index 000000000..82b42230a --- /dev/null +++ b/docs/hooks/useLineData.md @@ -0,0 +1,19 @@ + + +# 📊 useLineData.js + +Lädt Linienstatusdaten (Farben, Tooltips) aus zwei Webservices in Redux und bereitet sie auf. + +## Rückgabe + +- `lineColors`: Farben pro Linie basierend auf Status +- `tooltipContents`: HTML-Tooltip pro Modul/Station + +## Datenquellen + +- `fetchGisLinesThunk()` (Struktur) +- `fetchGisLinesStatusThunk()` (Statusdaten) + +## Intern + +- Nutzt Map `valueMap`, um Messwert, Schleifenwert, Meldungen zu gruppieren diff --git a/docs/hooks/useMapComponentState.md b/docs/hooks/useMapComponentState.md new file mode 100644 index 000000000..e1a3b092b --- /dev/null +++ b/docs/hooks/useMapComponentState.md @@ -0,0 +1,18 @@ + + +# 🧠 useMapComponentState.js + +Sammelt zentrale UI-Zustände und Redux-Daten für die `MapComponent`. + +## Rückgabe + +- POI-Typen + Ladezustand +- `deviceName` (z. B. erstes Gerät) +- `locationDeviceData` +- `priorityConfig` +- `menuItemAdded`, `setMenuItemAdded` +- Sichtbarkeit des POI-Layers + +## Redux + +- `fetchPoiTypThunk`, `fetchGisStationsStaticDistrictThunk`, `fetchPriorityConfigThunk` diff --git a/docs/hooks/useMarkerLayers.md b/docs/hooks/useMarkerLayers.md new file mode 100644 index 000000000..46c160be0 --- /dev/null +++ b/docs/hooks/useMarkerLayers.md @@ -0,0 +1,16 @@ + + +# 📍 useMarkerLayers.js + +Steuert das Hinzufügen oder Entfernen von Markern in ein Leaflet-Map-Layer. + +## Verwendung + +```js +useMarkerLayers(map, gmaMarkers, "GMA"); +``` + +## Redux + +- Liest `mapLayersVisibility` aus dem Store +- Reagiert automatisch auf Änderungen diff --git a/docs/hooks/usePolylineTooltipLayer.md b/docs/hooks/usePolylineTooltipLayer.md new file mode 100644 index 000000000..aa42d0a7d --- /dev/null +++ b/docs/hooks/usePolylineTooltipLayer.md @@ -0,0 +1,15 @@ + + +# 💬 usePolylineTooltipLayer.js + +Initialisiert und steuert Polylinien + Tooltip-Verhalten für Linienmessdaten. + +## Funktion + +- Nutzt `setupPolylines(...)` zur Marker- und Linienerstellung +- Tooltip-Anzeige bei `mouseover`, dynamisch positioniert +- Entfernt alte Marker und Polylinien automatisch + +## Parameter (gekürzt) + +- `map`, `markers`, `setMarkers`, `setPolylines`, `linePositions`, `tooltipContents`, `lineColors`, etc. diff --git a/docs/pages/_app.md b/docs/pages/_app.md new file mode 100644 index 000000000..6e7523f39 --- /dev/null +++ b/docs/pages/_app.md @@ -0,0 +1,26 @@ + + +# 🌐 _app.js + +Diese Datei stellt die Haupt-Wrap-Komponente der Next.js-App dar. +Sie initialisiert globale Provider wie den Redux Store. + +## Features + +- Importiert globales CSS (`styles/global.css`) +- Bindet Redux `Provider` um alle Seiten-Komponenten +- Ermöglicht Zugriff auf Store in allen Seiten + +## Struktur + +```jsx + + + +``` + +## Pfad + +```bash +/pages/_app.js +``` \ No newline at end of file diff --git a/docs/pages/api.md b/docs/pages/api.md deleted file mode 100644 index 218d28f8d..000000000 --- a/docs/pages/api.md +++ /dev/null @@ -1,67 +0,0 @@ -# 📘 API-Routen in `/pages/api/` - -Dieses Dokument beschreibt die internen API-Routen der Anwendung (Next.js API Routes) und erklärt die verwendeten URL-Parameter sowie Konventionen bei der Nutzung im Backend. - ---- - -## 🔗 Übergabeparameter aus TALAS.web - -Beim Aufruf der Anwendung über TALAS.web werden die folgenden URL-Parameter übergeben: - -| Parameter | Bedeutung | Verwendung im Code | -|-----------|------------------|---------------------------| -| `m` | Map-ID (`idMap`) | `req.query.m` | -| `u` | User-ID (`idUser`)| `req.query.u` | - -> ⚠️ Es wird bewusst **nicht** `idMap` oder `idUser` verwendet, da TALAS mit Kurzparametern arbeitet. - -### Beispiel: - -```ts -const idMap = req.query.m; -const idUser = req.query.u; -``` - ---- - -## 🛠 Zweck des Verzeichnisses `/pages/api/` - -Alle Dateien in diesem Verzeichnis definieren serverseitige Endpunkte. Diese: - -- werden **nur auf dem Server ausgeführt** -- sind über `fetch('/api/...')` vom Frontend aufrufbar -- dienen als **Proxy zu SOAP-Webservices** oder **Zugriff auf die Datenbank** - ---- - -## 📁 Beispiel: Aufruf eines Webservice - -```bash -GET /api/gisSystemStatic?m=10&u=484 -``` - -Dieser Request wird serverseitig weitergeleitet an: - -``` -http://[SERVER]/talas5/ClientData/WebServiceMap.asmx/GisSystemStatic?idMap=10&idUser=484 -``` - ---- - -## 📄 Übersicht interner API-Routen - -| API-Route | Beschreibung | -|----------------------------------|------------------------------------------| -| `/api/gisSystemStatic` | Proxy zu WebService GisSystemStatic | -| `/api/gisStationsStaticDistrict` | Geräte-Liste inkl. Bereich | -| `/api/gisStationsMeasurements` | Live-Messwerte der Geräte | -| `/api/talas_v5_DB/pois/readLocations` | POIs aus der Datenbank (MySQL) | -| `/api/talas_v5_DB/device/getAllStationsNames` | Gerätnamen aus DB | - ---- - -## 🔐 Sicherheitshinweis - -- Kein sensibler Parameter darf hart codiert sein -- Alle Server-URLs werden über `.env.local` konfiguriert -- Nur `m` und `u` aus `req.query` verwenden – keine Fallbacks oder Defaults \ No newline at end of file diff --git a/docs/pages/api/[...path].md b/docs/pages/api/[...path].md new file mode 100644 index 000000000..d76f3bed0 --- /dev/null +++ b/docs/pages/api/[...path].md @@ -0,0 +1,45 @@ + + +# 🌐 [...path].js + +Next.js API-Proxy-Handler mit `http-proxy-middleware`. +Dient als Middleware zur Weiterleitung von API-Requests an das Backend (z. B. Raspberry Pi oder Entwicklungsserver). + +--- + +## 🔧 Funktion + +- Leitet alle Requests von `/api/...` an das definierte `target` weiter +- Entfernt `/api` aus dem URL-Pfad +- Erlaubt Cross-Origin Requests mit `changeOrigin: true` + +--- + +## Ziel-Logik + +```js +const mode = process.env.NEXT_PUBLIC_API_PORT_MODE; +const target = mode === "dev" ? "http://localhost:80" : "http://localhost"; +``` + +--- + +## Beispiel + +- Frontend-Request: `GET /api/GisStationsStaticDistrict` +- Weitergeleitet an: `GET http://localhost:80/GisStationsStaticDistrict` + +--- + +## Besonderheiten + +- Ermöglicht portunabhängige Proxy-Nutzung über `.env` +- Setzt `logLevel: "debug"` zur Diagnose + +--- + +## Pfad + +```bash +/pages/api/[...path].js +``` \ No newline at end of file diff --git a/docs/pages/api/apiProxy.md b/docs/pages/api/apiProxy.md deleted file mode 100644 index 2fd6741af..000000000 --- a/docs/pages/api/apiProxy.md +++ /dev/null @@ -1,77 +0,0 @@ -# 🌐 API Proxy – [...path].js - -## Zweck - -Diese Datei (`pages/api/[...path].js`) dient als **Catch-All Proxy** -für externe Webservice-Aufrufe über die Next.js API-Routing-Struktur. - -Sie leitet alle Anfragen unter `/api/...` an einen Zielserver weiter. - ---- - -## Technologie - -Verwendet wird: - -- [`http-proxy-middleware`](https://github.com/chimurai/http-proxy-middleware) -- Dynamische Zielauswahl basierend auf Umgebungsvariable `NEXT_PUBLIC_API_PORT_MODE` - ---- - -## Ziel-URL-Konfiguration - -```js -const mode = process.env.NEXT_PUBLIC_API_PORT_MODE; - -const target = - mode === "dev" - ? "http://localhost:80" - : "http://localhost"; // oder z. B. http://10.10.0.13 -``` - -➡ Dadurch entfällt die feste Konfiguration über `NEXT_PUBLIC_SERVER_URL`. - ---- - -## Beispiel: Weiterleitung - -Request im Browser: - -``` -GET /api/talas5/ClientData/WebServiceMap.asmx/GisSystemStatic?idMap=12&idUser=484 -``` - -→ wird weitergeleitet an: - -``` -http://localhost/talas5/ClientData/WebServiceMap.asmx/GisSystemStatic?idMap=12&idUser=484 -``` - ---- - -## Verwendete Einstellungen - -```js -export default createProxyMiddleware({ - target, - changeOrigin: true, - pathRewrite: { - "^/api": "/", // entfernt /api aus dem Pfad - }, - logLevel: "debug", -}); -``` - ---- - -## Vorteile - -| Punkt | Nutzen | -|---------------------------|------------------------------------------| -| Keine doppelte API-Konfiguration | ✅ `.env.local` bereinigt | -| Wiederverwendbar & flexibel | ✅ funktioniert lokal & auf Servern | -| Klar gekapselt in `[...path].js` | ✅ übersichtlich | - ---- - -📄 Pfad: `/docs/server/pages/api/apiProxy.md` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/area/readArea.md b/docs/pages/api/talas_v5_DB/area/readArea.md new file mode 100644 index 000000000..3d32a3e64 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/area/readArea.md @@ -0,0 +1,28 @@ + + +# 📥 readArea.js + +Liest Bereichskoordinaten (`location_coordinates`) aus der Datenbank basierend auf `idMaps` (und optional `idLocation`). + +## Methode + +- `GET` + +## URL-Parameter + +| Name | Beschreibung | +|-------------|--------------------------------------| +| `m` | Karten-ID (entspricht `idMaps`) | +| `idLocation` | (optional) ID eines bestimmten Bereichs | + +## Verhalten + +- Joint `location`, `location_coordinates` und `area`-Tabelle +- Gibt strukturierte Daten mit `x`, `y`, `location_name`, `area_name` zurück +- Nutzt MySQL-Pool (`getPool()`) + +## Beispiel + +```http +GET /api/talas_v5_DB/area/readArea?m=3 +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/area/updateArea.md b/docs/pages/api/talas_v5_DB/area/updateArea.md new file mode 100644 index 000000000..01d7fd46d --- /dev/null +++ b/docs/pages/api/talas_v5_DB/area/updateArea.md @@ -0,0 +1,32 @@ + + +# 📤 updateArea.js + +Aktualisiert die Koordinaten eines Bereichs (`location_coordinates`) basierend auf `idLocation` und `idMap`. + +## Methode + +- `PUT` + +## Request-Body + +```json +{ + "idLocation": 12, + "idMap": 3, + "x": 53.21421, + "y": 8.43212 +} +``` + +## Verhalten + +- Führt `UPDATE location_coordinates SET x=?, y=? WHERE idLocation=? AND idMaps=?` +- Gibt bei Erfolg `success: true` zurück +- Nutzt MySQL-Pool und `connection.release()` + +## Fehlerbehandlung + +- 400: Fehlende Daten +- 404: Kein Eintrag gefunden +- 500: Interner Fehler \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/device/getAllStationsNames.md b/docs/pages/api/talas_v5_DB/device/getAllStationsNames.md new file mode 100644 index 000000000..66fcda44b --- /dev/null +++ b/docs/pages/api/talas_v5_DB/device/getAllStationsNames.md @@ -0,0 +1,29 @@ + + +# 🧾 getAllStationsNames.js + +Liefert eine Zuordnungstabelle aller Geräte-IDs (`idLD`) zu ihren Namen (`name`). + +## Methode + +- `GET` + +## Antwortformat + +```json +{ + "123": "Kue 705", + "124": "Basisstation 1" +} +``` + +## Verhalten + +- Nutzt Tabelle `location_device` +- Gibt Fehler bei leerem Ergebnis (404) oder Datenbankfehler (500) + +## Pfad + +```bash +/pages/api/talas_v5_DB/device/getAllStationsNames.js +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/device/getDevices.md b/docs/pages/api/talas_v5_DB/device/getDevices.md new file mode 100644 index 000000000..6c1387f54 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/device/getDevices.md @@ -0,0 +1,34 @@ + + +# 🔌 getDevices.js + +API-Route zum Abrufen aller Geräteinformationen aus der `devices`-Tabelle. + +## Methode + +- `POST` (erwartet JSON-Body mit optionalem `activeSystems`-Array) + +## Verhalten + +- Führt ein einfaches `SELECT * FROM devices` aus +- Nutzt Singleton-MySQL-Pool für Verbindung +- Rückgabe: JSON-Array mit allen Geräteobjekten + +## Beispielantwort + +```json +[ + { + "id": 1, + "name": "Kue705", + "idsystem_typ": 1, + ... + } +] +``` + +## Pfad + +```bash +/pages/api/talas_v5_DB/device/getDevices.js +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/gisLines/readGisLines.md b/docs/pages/api/talas_v5_DB/gisLines/readGisLines.md new file mode 100644 index 000000000..fb83233c7 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/gisLines/readGisLines.md @@ -0,0 +1,25 @@ + + +# 🧭 readGisLines.js + +Liefert alle Linien aus der Tabelle `gis_lines`. + +## Methode + +- `GET` + +## Rückgabe + +- JSON-Array mit Objekten aus `gis_lines` +- Leeres Array bei keinen Treffern + +## Besonderheiten + +- Nutzt Singleton-Pool (`getPool()`) +- Immer HTTP 200, auch bei leerem Ergebnis + +## Beispiel + +```http +GET /api/talas_v5_DB/gisLines/readGisLines +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/gisLines/updateLineCoordinates.md b/docs/pages/api/talas_v5_DB/gisLines/updateLineCoordinates.md new file mode 100644 index 000000000..a123286b1 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/gisLines/updateLineCoordinates.md @@ -0,0 +1,30 @@ + + +# ✏️ updateLineCoordinates.js + +Aktualisiert die `points`-Spalte einer Linie in der Tabelle `gis_lines`. + +## Methode + +- `POST` + +## Request-Body + +```json +{ + "idLD": 7, + "idModul": 2, + "newCoordinates": [[53.2151, 8.4522], [53.2165, 8.4531]] +} +``` + +## Verhalten + +- Erzeugt aus Koordinaten eine `LINESTRING(...)` +- Nutzt `ST_GeomFromText()` in MySQL +- Transaktion mit Commit/Rollback + +## Fehlerfälle + +- 400: Ungültige oder fehlende Felder +- 500: Datenbankfehler \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/locationDevice/getDeviceId.md b/docs/pages/api/talas_v5_DB/locationDevice/getDeviceId.md new file mode 100644 index 000000000..aaaff0a8d --- /dev/null +++ b/docs/pages/api/talas_v5_DB/locationDevice/getDeviceId.md @@ -0,0 +1,26 @@ + + +# 🔍 getDeviceId.js + +Gibt die Geräte-ID (`idLD`) zu einem übergebenen Gerätenamen zurück. + +## Methode + +- `GET` + +## Parameter + +| Name | Beschreibung | +|-------------|----------------------| +| `deviceName` | Der Gerätename (z. B. "Kue705") | + +## Antwort + +```json +{ "idLD": 27 } +``` + +## Fehler + +- 400: Wenn `deviceName` fehlt +- 404: Gerät nicht gefunden \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/locationDevice/locationDeviceNameById.md b/docs/pages/api/talas_v5_DB/locationDevice/locationDeviceNameById.md new file mode 100644 index 000000000..fbadfec2d --- /dev/null +++ b/docs/pages/api/talas_v5_DB/locationDevice/locationDeviceNameById.md @@ -0,0 +1,26 @@ + + +# 🏷️ locationDeviceNameById.js + +Gibt den Namen eines Geräts anhand seiner ID zurück. + +## Methode + +- `GET` + +## Parameter + +| Name | Beschreibung | +|--------|------------------------| +| `idLD` | Geräte-ID (z. B. 27) | + +## Antwort + +```json +{ "name": "Kue705" } +``` + +## Fehler + +- 400: Fehlender Parameter +- 404: Gerät mit ID nicht gefunden \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/locationDevice/locationDevices.md b/docs/pages/api/talas_v5_DB/locationDevice/locationDevices.md new file mode 100644 index 000000000..3521a8f35 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/locationDevice/locationDevices.md @@ -0,0 +1,27 @@ + + +# 🗂️ locationDevices.js + +Gibt eine vollständige Liste aller Geräte in der Tabelle `location_device` zurück. + +## Methode + +- `GET` + +## Verhalten + +- Führt `SELECT * FROM location_device ORDER BY name` aus +- Gibt vollständige Objekte zurück + +## Beispielantwort + +```json +[ + { + "idLD": 27, + "name": "Kue705", + "description": "...", + ... + } +] +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/poiTyp/readPoiTyp.md b/docs/pages/api/talas_v5_DB/poiTyp/readPoiTyp.md new file mode 100644 index 000000000..244aa1827 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/poiTyp/readPoiTyp.md @@ -0,0 +1,36 @@ + + +# 🗂️ readPoiTyp.js + +Liefert alle verfügbaren POI-Typen aus der Tabelle `poityp`. + +## Methode + +- `GET` + +## Rückgabe + +- JSON-Array mit allen Einträgen in `poityp` + +## Besonderheiten + +- Gibt bei leerem Ergebnis `200` mit Warnung zurück +- Verwendet Singleton-Verbindungspool (`getPool()`) + +## Beispiel + +```http +GET /api/talas_v5_DB/poiTyp/readPoiTyp +``` + +## Antwort + +```json +[ + { + "idPoiTyp": 1, + "name": "Messgerät", + "icon": 12 + } +] +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/addPoi.md b/docs/pages/api/talas_v5_DB/pois/addPoi.md new file mode 100644 index 000000000..22c075cd4 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/addPoi.md @@ -0,0 +1,25 @@ + + +# ➕ addPoi.js + +Fügt einen neuen POI (Point of Interest) zur Datenbank hinzu. + +## Methode + +- `POST` + +## Request-Body + +```json +{ + "name": "POI A", + "poiTypeId": 1, + "latitude": 53.2, + "longitude": 8.1, + "idLD": 27 +} +``` + +## Besonderheiten + +- Position wird als `POINT(longitude latitude)` gespeichert \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/deletePoi.md b/docs/pages/api/talas_v5_DB/pois/deletePoi.md new file mode 100644 index 000000000..f09c740d0 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/deletePoi.md @@ -0,0 +1,20 @@ + + +# ❌ deletePoi.js + +Löscht einen POI anhand seiner ID. + +## Methode + +- `DELETE` + +## Query-Parameter + +| Parameter | Beschreibung | +|-----------|---------------------| +| `id` | ID des POI (`idPoi`) | + +## Antwort + +- 200: Erfolgreich gelöscht +- 404: POI nicht gefunden \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/getPoiById.md b/docs/pages/api/talas_v5_DB/pois/getPoiById.md new file mode 100644 index 000000000..ececf24d0 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/getPoiById.md @@ -0,0 +1,21 @@ + + +# 🔎 getPoiById.js + +Gibt die Beschreibung eines POIs zurück. + +## Methode + +- `GET` + +## Query-Parameter + +| Parameter | Beschreibung | +|-----------|--------------| +| `idPoi` | POI-ID | + +## Antwort + +```json +{ "description": "POI A" } +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/poi-icons.md b/docs/pages/api/talas_v5_DB/pois/poi-icons.md new file mode 100644 index 000000000..26a63d1b7 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/poi-icons.md @@ -0,0 +1,21 @@ + + +# 🖼️ poi-icons.js + +Gibt eine Liste aller POIs und ihrer zugehörigen Icon-Pfade zurück. + +## Methode + +- `GET` + +## Datenquelle + +- `poi` → `poiTyp` → `poiicons` + +## Antwort + +```json +[ + { "idPoi": 12, "path": "/icons/kue.svg" } +] +``` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/readAllPOIs.md b/docs/pages/api/talas_v5_DB/pois/readAllPOIs.md new file mode 100644 index 000000000..dcd1fda01 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/readAllPOIs.md @@ -0,0 +1,17 @@ + + +# 📋 readAllPOIs.js + +Gibt alle POIs mit Positionen zurück. + +## Methode + +- `GET` + +## Rückgabe + +- JSON-Array mit `idPoi`, `description`, `idPoiTyp`, `idLD`, `position` + +## Besonderheiten + +- Position wird per `ST_AsText(...)` als String geliefert \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/updateLocation.md b/docs/pages/api/talas_v5_DB/pois/updateLocation.md new file mode 100644 index 000000000..f995a3aad --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/updateLocation.md @@ -0,0 +1,23 @@ + + +# 🧭 updateLocation.js + +Aktualisiert die Position (`POINT`) eines POIs. + +## Methode + +- `POST` + +## Request-Body + +```json +{ + "id": 12, + "latitude": 53.2, + "longitude": 8.1 +} +``` + +## Antwort + +- 200: `{ success: true }` \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/pois/updatePoi.md b/docs/pages/api/talas_v5_DB/pois/updatePoi.md new file mode 100644 index 000000000..2e5088db2 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/pois/updatePoi.md @@ -0,0 +1,25 @@ + + +# 📝 updatePoi.js + +Aktualisiert Beschreibung, Typ und Gerät eines POIs. + +## Methode + +- `POST` + +## Request-Body + +```json +{ + "idPoi": 12, + "description": "POI A", + "idPoiTyp": 2, + "idLD": 27 +} +``` + +## Antwort + +- 200: Erfolgreich aktualisiert +- 404: POI nicht gefunden \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/station/getAllStationsNames.md b/docs/pages/api/talas_v5_DB/station/getAllStationsNames.md new file mode 100644 index 000000000..ff1a7c698 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/station/getAllStationsNames.md @@ -0,0 +1,29 @@ + + +# 🏷️ getAllStationsNames.js + +Liefert eine Mapping-Tabelle aus `idLD` → `name` aller Einträge in `location_device`. + +## Methode + +- `GET` + +## Rückgabe + +```json +{ + "12": "Hauptstation", + "13": "Unterstation" +} +``` + +## Verhalten + +- Antwort ist ein Key-Value-Objekt +- Nutzt `reduce()` zur Map-Erstellung +- Verwendet MySQL-Singleton-Pool + +## Fehler + +- 404: Wenn keine Daten vorhanden +- 500: Datenbankfehler \ No newline at end of file diff --git a/docs/pages/api/talas_v5_DB/station/getDevices.md b/docs/pages/api/talas_v5_DB/station/getDevices.md new file mode 100644 index 000000000..da765d1d8 --- /dev/null +++ b/docs/pages/api/talas_v5_DB/station/getDevices.md @@ -0,0 +1,40 @@ + + +# 📦 getDevices.js + +Gibt alle Geräte aus der `devices`-Tabelle zurück. + +## Methode + +- `POST` + +## Request-Body + +```json +{ + "activeSystems": [1, 2, 3] +} +``` + +⚠️ Hinweis: Im aktuellen Code wird der Parameter `activeSystems` nicht verwendet! + +## Rückgabe + +- JSON-Array mit Geräteobjekten + +## Beispielantwort + +```json +[ + { + "id": 1, + "name": "CPL V4.0", + "idsystem_typ": 1 + } +] +``` + +## Fehler + +- 404: Keine Ergebnisse +- 500: Datenbankfehler \ No newline at end of file diff --git a/docs/pages/index.md b/docs/pages/index.md new file mode 100644 index 000000000..d7da48530 --- /dev/null +++ b/docs/pages/index.md @@ -0,0 +1,32 @@ + + +# 🏠 index.js (Home-Seite) + +Die Hauptseite der Anwendung. +Bindet dynamisch die Leaflet-Karte (`MapComponent`) und ein Testscripting-Tool (`TestScript`). + +## Features + +- `MapComponent` ohne SSR eingebunden +- `TestScript` prüft per Konsole Logik/Strukturen +- Lädt POI-Daten per `fetchPoiMarkersThunk()` +- Liest URL-Parameter `m` und `u` +- Unterstützt POI-Hinzufügen über `addPoiThunk(...)` + +## Redux-Slices + +- `poiMarkersSlice` +- `addPoiSlice` +- `poiReadFromDbTrigger` + +## Struktur + +```jsx + + +``` + +## Besonderheiten + +- Dynamisches Nachladen der POIs bei Triggeränderung +- Fehleranzeige über `addPoiStatus` + `addPoiError` \ No newline at end of file diff --git a/docs/redux/api/fromDB/fetchLocationDevices.md b/docs/redux/api/fromDB/fetchLocationDevices.md deleted file mode 100644 index 79f57aaa0..000000000 --- a/docs/redux/api/fromDB/fetchLocationDevices.md +++ /dev/null @@ -1,70 +0,0 @@ -# 🌐 fetchLocationDevices - -Diese Funktion lädt alle Geräte für einen bestimmten Standort aus der Datenbank via API-Endpunkt. - ---- - -## 📍 Pfad - -``` -/redux/api/fromDB/fetchLocationDevices.js -``` - ---- - -## 📥 Funktion - -```ts -export const fetchLocationDevices = async () => { - const response = await fetch("/api/talas_v5_DB/locationDevice/locationDevices"); - if (!response.ok) { - throw new Error("Geräteliste konnte nicht geladen werden"); - } - return await response.json(); -}; -``` - ---- - -## 📡 API-Endpunkt - -```http -GET /api/talas_v5_DB/locationDevice/locationDevices -``` - -Dieser Endpunkt liefert eine JSON-Liste aller Geräte eines Standorts (z. B. für Map-Rendering, POI-Anzeige, Standortübersicht etc.). - ---- - -## 🧪 Fehlerbehandlung - -Falls der Request fehlschlägt (z. B. Statuscode ≠ 2xx), wird folgender Fehler ausgelöst: - -``` -"Geräteliste konnte nicht geladen werden" -``` - -Dies kann im Redux-Slice über den `.rejected`-Case ausgewertet werden. - ---- - -## 🧩 Verwendung - -```ts -import { fetchLocationDevices } from "@/redux/api/fromDB/fetchLocationDevices"; - -const result = await fetchLocationDevices(); -console.log(result); // Erwartet: Array von Geräteobjekten -``` - -Diese Funktion wird typischerweise im Redux-Thunk `fetchLocationDevicesFromDB` verwendet: -```ts -const data = await fetchLocationDevices(); -``` - ---- - -## 🔄 Zusammenhang - -- Eingebunden in: [`locationDevicesFromDBSlice.js`](./locationDevicesFromDBSlice.md) -- Redux Thunk: `fetchLocationDevicesFromDB` \ No newline at end of file diff --git a/docs/redux/api/fromWebService.md b/docs/redux/api/fromWebService.md deleted file mode 100644 index 1885408e1..000000000 --- a/docs/redux/api/fromWebService.md +++ /dev/null @@ -1,90 +0,0 @@ -# 📡 Webservices – Redux Integration (/redux/api/fromWebService) - -In diesem Verzeichnis befinden sich alle Webservice-Fetch-Funktionen für die Kommunikation mit TALAS.web über SOAP-Endpunkte. - ---- - -## Übergabe der Parameter über URL (`m`, `u`) - -TALAS.web ruft die Kartenansicht in der Regel so auf: - -``` -http://[SERVER]:3000/?m=10&u=484 -``` - -Daraus ergeben sich folgende Zuweisungen: - -| URL-Parameter | Bedeutung | Variable im Code | -| ------------- | --------- | -------------------------------- | -| `m` | `idMap` | `const idMap = params.get("m")` | -| `u` | `idUser` | `const idUser = params.get("u")` | - -### Beispiel: - -```ts -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -const idUser = params.get("u"); -``` - ---- - -## Änderung am 2025-05-15 - -Vorher wurden Default-Werte über `.env.local` als Fallback genutzt: - -```ts -const idMap = params.get("idMap") || process.env.NEXT_PUBLIC_DEFAULT_ID_MAP || "12"; -``` - -Das wurde entfernt, um folgende Ziele zu erreichen: - -- ❌ Keine fest eingetragenen Defaults im Browser sichtbar -- ✅ Verbindlichkeit: TALAS.web übergibt die Werte immer korrekt via URL -- 🔐 Sicherheit: Kein versehentliches Verwenden eines falschen Users -- 🔍 Fehler leichter erkennbar (Parameter nicht gefunden = echter Fehler) - ---- - -## Hinweis zur Webservice-Konfiguration - -Die Webservice-Basisadresse wird **nicht mehr über `.env.local` gesteuert**. - -Stattdessen wird sie dynamisch im Client anhand des aktuellen Hostnamens bestimmt: - -```js -const baseUrl = `${window.location.origin}/talas5/ClientData/WebServiceMap.asmx`; -``` - -➡ Dadurch ist kein Rebuild mehr nötig bei IP-Wechseln oder Serverumzügen. -Die Build-Version kann auf jedem Server wiederverwendet werden. - ---- - -## Optional: Validierung einbauen - -Falls gewünscht, kann ein expliziter Fehler ausgelöst werden: - -```ts -if (!idMap || !idUser) { - throw new Error("Fehlende URL-Parameter: idMap oder idUser"); -} -``` - ---- - -## Betroffene Dateien - -Diese Änderung betrifft alle Funktionen in: - -``` -/redux/api/fromWebService/fetchGisStationsStatic.js -/redux/api/fromWebService/fetchGisStationsStaticDistrict.js -/redux/api/fromWebService/fetchGisStationsStatusDistrict.js -/redux/api/fromWebService/fetchGisStationsMeasurements.js -/redux/api/fromWebService/fetchGisSystemStatic.js -``` - ---- - -Diese Konvention stellt sicher, dass Webservices unabhängig von IP und Serverkonfiguration aufgerufen werden können. diff --git a/docs/redux/api/fromWebService/README.md b/docs/redux/api/fromWebService/README.md deleted file mode 100644 index aea7dc01f..000000000 --- a/docs/redux/api/fromWebService/README.md +++ /dev/null @@ -1,61 +0,0 @@ -# 📁 Webservice-Dokumentation – fromWebService - -Dieses Verzeichnis dokumentiert alle Webservice-Aufrufe, -die über `/redux/api/fromWebService/` im Projekt ausgeführt werden. - ---- - -## 🌐 Hintergrund - -Die TALAS.web-Anwendung übergibt `idMap` und `idUser` über die URL-Parameter: - -``` -http:///talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 -``` - -Daraus entstehen Webservice-Aufrufe wie: - -``` -/talas5/ClientData/WebServiceMap.asmx/GisSystemStatic?idMap=12&idUser=484 -``` - -Alle Webservices nutzen den Port 80 – auch in der Entwicklungsumgebung. -Daher wird zentral über `.env.local` gesteuert: - -```env -NEXT_PUBLIC_API_PORT_MODE=dev -``` - ---- - -## 📄 Enthaltene Dokumentationen - -| Dateiname | Zweck | -|----------------------------------------|--------------------------------------| -| [`fetchGisSystemStatic.md`](./fetchGisSystemStatic.md) | Systemübersicht aller Geräte | -| [`fetchGisStationsMeasurements.md`](./fetchGisStationsMeasurements.md) | Messwerte der Geräte | -| [`fetchGisStationsStatic.md`](./fetchGisStationsStatic.md) | Statische Standortinformationen | -| [`fetchGisStationsStaticDistrict.md`](./fetchGisStationsStaticDistrict.md) | Gerätestruktur je Bezirk | -| [`fetchGisStationsStatusDistrict.md`](./fetchGisStationsStatusDistrict.md) | Aktueller Gerätestatus nach Bezirk | - ---- - -## 🔁 Verzeichnisstruktur - -```bash -/docs -└── frontend - └── redux - └── api - └── fromWebService - ├── fetchGisSystemStatic.md - ├── fetchGisStationsMeasurements.md - ├── fetchGisStationsStatic.md - ├── fetchGisStationsStaticDistrict.md - ├── fetchGisStationsStatusDistrict.md - └── README.md ← (diese Datei) -``` - ---- - -Diese Übersicht hilft Entwicklern beim Einstieg und zeigt, wie zentrale Webservice-Kommunikation im Projekt funktioniert. \ No newline at end of file diff --git a/docs/redux/api/fromWebService/fetchGisStationsMeasurements.md b/docs/redux/api/fromWebService/fetchGisStationsMeasurements.md deleted file mode 100644 index d6d2579ed..000000000 --- a/docs/redux/api/fromWebService/fetchGisStationsMeasurements.md +++ /dev/null @@ -1,81 +0,0 @@ -# 🌐 fetchGisStationsMeasurements – Geräte-Messwerte abrufen - -## Zweck - -Diese Funktion ruft Messwerte aller Geräte einer Karte ab. -Die Daten werden vom Webservice `GisStationsMeasurements` bereitgestellt. - ---- - -## Webservice-Endpunkt - -``` -GisStationsMeasurements?idMap={idMap}&idUser={idUser} -``` - ---- - -## Besonderheit: Port-Steuerung per Umgebungsvariable - -Die Webservices (z. B. `WebServiceMap.asmx`) laufen **immer auf Port 80** – -auch in der Entwicklungsumgebung. - -Um das zu berücksichtigen, wird der Port über `.env.local` gesteuert: - -```env -NEXT_PUBLIC_API_PORT_MODE=dev -``` - -### Beispiel (aus dem Code): - -```js -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`; -``` - ---- - -## Parameter - -| URL-Parameter | Beschreibung | Übergabe durch TALAS.web | -|---------------|--------------|---------------------------| -| `m` | Map-ID | Ja | -| `u` | User-ID | Ja | - -Diese Parameter werden clientseitig aus der URL gelesen: - -```js -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -const idUser = params.get("u"); -``` - ---- - -## Beispiel-Aufruf - -``` -http://10.10.0.13/talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 -``` - -→ ergibt folgenden Webservice-Aufruf: - -``` -http://10.10.0.13/talas5/ClientData/WebServiceMap.asmx/GisStationsMeasurements?idMap=12&idUser=484 -``` - ---- - -## Siehe auch - -- `.env.local` → `NEXT_PUBLIC_API_PORT_MODE` -- `docs/frontend/redux/api/fromWebService/fetchGisSystemStatic.md` -- API-Datei: `/redux/api/fromWebService/fetchGisStationsMeasurements.js` - ---- - -📄 Pfad: `/docs/frontend/redux/api/fromWebService/fetchGisStationsMeasurements.md` \ No newline at end of file diff --git a/docs/redux/api/fromWebService/fetchGisStationsStatic.md b/docs/redux/api/fromWebService/fetchGisStationsStatic.md deleted file mode 100644 index ef65e5ecb..000000000 --- a/docs/redux/api/fromWebService/fetchGisStationsStatic.md +++ /dev/null @@ -1,78 +0,0 @@ -# 🌐 fetchGisStationsStatic – Standortdaten der Karte abrufen - -## Zweck - -Diese Funktion ruft die statischen Standortinformationen aller Geräte für eine bestimmte Karte ab. -Sie nutzt den Webservice-Endpunkt `GisStationsStatic`. - ---- - -## Webservice-Endpunkt - -``` -GisStationsStatic?idMap={idMap} -``` - ---- - -## Besonderheit: Port-Steuerung über Umgebungsvariable - -Die Webservices laufen immer auf Port 80 – auch in der Entwicklungsumgebung. - -Die Funktion erkennt dies anhand der Umgebungsvariable in `.env.local`: - -```env -NEXT_PUBLIC_API_PORT_MODE=dev -``` - -### Codeauszug: - -```js -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`; -``` - ---- - -## Parameter - -| URL-Parameter | Beschreibung | Übergabe durch TALAS.web | -|---------------|--------------|---------------------------| -| `m` | Map-ID | Ja | - -Die Map-ID wird aus der URL gelesen: - -```js -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -``` - ---- - -## Beispiel - -``` -http://10.10.0.13/talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 -``` - -→ wird zu: - -``` -http://10.10.0.13/talas5/ClientData/WebServiceMap.asmx/GisStationsStatic?idMap=12 -``` - ---- - -## Siehe auch - -- `.env.local` → `NEXT_PUBLIC_API_PORT_MODE` -- `fetchGisSystemStatic.md` -- `fetchGisStationsMeasurements.md` - ---- - -📄 Pfad: `/docs/frontend/redux/api/fromWebService/fetchGisStationsStatic.md` \ No newline at end of file diff --git a/docs/redux/api/fromWebService/fetchGisStationsStaticDistrict.md b/docs/redux/api/fromWebService/fetchGisStationsStaticDistrict.md deleted file mode 100644 index 093becaf8..000000000 --- a/docs/redux/api/fromWebService/fetchGisStationsStaticDistrict.md +++ /dev/null @@ -1,77 +0,0 @@ -# 🌐 fetchGisStationsStaticDistrict – Statische Gerätebezirksdaten abrufen - -## Zweck - -Diese Funktion ruft alle statischen Geräte- und Sektordaten eines bestimmten Kartenbereichs ab. -Sie basiert auf dem Webservice-Endpunkt `GisStationsStaticDistrict`. - ---- - -## Webservice-Endpunkt - -``` -GisStationsStaticDistrict?idMap={idMap}&idUser={idUser} -``` - ---- - -## Portsteuerung über Umgebungsvariable - -Da die Webservices in allen Umgebungen auf Port 80 laufen, wird der Zugriff über eine Umgebungsvariable gesteuert: - -```env -NEXT_PUBLIC_API_PORT_MODE=dev -``` - -### Codebeispiel: - -```js -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`; -``` - ---- - -## URL-Parameter - -| Parameter | Beschreibung | Wird übergeben durch | -|-----------|--------------|------------------------| -| `m` | Map-ID | TALAS.web (in URL) | -| `u` | User-ID | TALAS.web (in URL) | - -```js -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -const idUser = params.get("u"); -``` - ---- - -## Beispiel - -``` -http://10.10.0.13/talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 -``` - -→ wird übersetzt zu: - -``` -http://10.10.0.13/talas5/ClientData/WebServiceMap.asmx/GisStationsStaticDistrict?idMap=12&idUser=484 -``` - ---- - -## Siehe auch - -- `.env.local` → `NEXT_PUBLIC_API_PORT_MODE` -- `fetchGisStationsStatic.js` -- `fetchGisStationsMeasurements.js` -- `fetchGisSystemStatic.js` - ---- - -📄 Pfad: `/docs/frontend/redux/api/fromWebService/fetchGisStationsStaticDistrict.md` \ No newline at end of file diff --git a/docs/redux/api/fromWebService/fetchGisStationsStatusDistrict.md b/docs/redux/api/fromWebService/fetchGisStationsStatusDistrict.md deleted file mode 100644 index 14c4d5fc3..000000000 --- a/docs/redux/api/fromWebService/fetchGisStationsStatusDistrict.md +++ /dev/null @@ -1,78 +0,0 @@ -# 🌐 fetchGisStationsStatusDistrict – Gerätestatus nach Bezirken abrufen - -## Zweck - -Diese Funktion ruft die aktuellen Statusdaten aller Geräte eines bestimmten Kartenbezirks ab. -Sie basiert auf dem Webservice-Endpunkt `GisStationsStatusDistrict`. - ---- - -## Webservice-Endpunkt - -``` -GisStationsStatusDistrict?idMap={idMap}&idUser={idUser} -``` - ---- - -## Portsteuerung über Umgebungsvariable - -Da die Webservices in allen Umgebungen über Port 80 laufen, -wird der Zugriff über eine Umgebungsvariable in `.env.local` konfiguriert: - -```env -NEXT_PUBLIC_API_PORT_MODE=dev -``` - -### Codebeispiel: - -```js -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`; -``` - ---- - -## URL-Parameter - -| Parameter | Beschreibung | Übergabe durch TALAS.web | -|-----------|--------------|---------------------------| -| `m` | Map-ID | Ja | -| `u` | User-ID | Ja | - -```js -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -const idUser = params.get("u"); -``` - ---- - -## Beispiel - -``` -http://10.10.0.13/talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 -``` - -→ wird übersetzt zu: - -``` -http://10.10.0.13/talas5/ClientData/WebServiceMap.asmx/GisStationsStatusDistrict?idMap=12&idUser=484 -``` - ---- - -## Siehe auch - -- `.env.local` → `NEXT_PUBLIC_API_PORT_MODE` -- `fetchGisStationsStaticDistrict.js` -- `fetchGisStationsMeasurements.js` -- `fetchGisSystemStatic.js` - ---- - -📄 Pfad: `/docs/frontend/redux/api/fromWebService/fetchGisStationsStatusDistrict.md` \ No newline at end of file diff --git a/docs/redux/api/fromWebService/fetchGisSystemStatic.md b/docs/redux/api/fromWebService/fetchGisSystemStatic.md deleted file mode 100644 index b61989233..000000000 --- a/docs/redux/api/fromWebService/fetchGisSystemStatic.md +++ /dev/null @@ -1,76 +0,0 @@ -# 🌐 fetchGisSystemStatic – Geräte-Systemdaten abrufen - -## Zweck - -Diese Funktion ruft die Gerätestatus-Übersicht für eine bestimmte Karte ab: - -WebService-Endpunkt: - -``` -GisSystemStatic?idMap={idMap}&idUser={idUser} -``` - ---- - -## Besonderheit bei der URL - -Die Webservices (z. B. `WebServiceMap.asmx`) laufen **immer auf Port 80**, -egal ob im Entwicklungsmodus (`localhost`, `:3000`) oder auf dem Testserver (`10.10.0.13`). - -Daher wird im Code explizit `:80` gesetzt – gesteuert über die Umgebungsvariable: - -```env -NEXT_PUBLIC_API_PORT_MODE=dev -``` - -### Beispiel (aus dem Code): - -```js -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`; -``` - ---- - -## Parameter - -Die Funktion liest folgende URL-Parameter ein: - -| URL-Parameter | Beschreibung | Übergabe durch TALAS.web | -| ------------- | ------------ | ------------------------ | -| `m` | Map-ID | Ja | -| `u` | User-ID | Ja | - -Diese werden aus der URL wie folgt gelesen: - -```js -const params = new URLSearchParams(window.location.search); -const idMap = params.get("m"); -const idUser = params.get("u"); -``` - ---- - -## Beispiel-Aufruf - -TALAS-Aufruf: - -``` -http://10.10.0.13/talas5/MessagesMap/mapTypeC.aspx?m=12&u=484 -``` - -wird im Webservice-Request zu: - -``` -http://10.10.0.13/talas5/ClientData/WebServiceMap.asmx/GisSystemStatic?idMap=12&idUser=484 -``` - ---- - -## Siehe auch - -- `.env.local` → `NEXT_PUBLIC_API_PORT_MODE` -- `docs/fromWebService.md` -- API-Datei: `/redux/api/fromWebService/fetchGisSystemStatic.js` -- 📄 Pfad: `/docs/frontend/redux/api/fromWebService/fetchGisSystemStatic.md` diff --git a/docs/redux/slices/database/locationDevicesFromDBSlice.md b/docs/redux/slices/database/locationDevicesFromDBSlice.md new file mode 100644 index 000000000..3eedc3fba --- /dev/null +++ b/docs/redux/slices/database/locationDevicesFromDBSlice.md @@ -0,0 +1,25 @@ + + +# 🧩 locationDevicesFromDBSlice.js + +Redux-Slice für das Laden von Geräten aus der Datenbank-Tabelle `location_device`. + +## Zustand + +```js +{ + devices: [], + status: "idle" | "loading" | "succeeded" | "failed", + error: string | null +} +``` + +## Thunk + +- `fetchLocationDevicesThunk` (async) + +## Selector + +```js +selectLocationDevices = (state) => state.locationDevicesFromDB.devices +``` \ No newline at end of file diff --git a/docs/redux/slices/database/locationDevicesSlice.md b/docs/redux/slices/database/locationDevicesSlice.md new file mode 100644 index 000000000..1030038a8 --- /dev/null +++ b/docs/redux/slices/database/locationDevicesSlice.md @@ -0,0 +1,23 @@ + + +# 🧩 locationDevicesSlice.js + +Zweite Variante des Slices für Geräte (veraltet oder parallel verwendet). + +## Zustand + +```js +{ + data: [], + status: "idle" | "loading" | "succeeded" | "failed", + error: string | null +} +``` + +## Selector + +```js +selectLocationDevices = (state) => state.locationDevices.data +``` + +⚠️ Beachte: Duplikat zu `locationDevicesFromDBSlice.js` \ No newline at end of file diff --git a/docs/redux/slices/database/priorityConfigSlice.md b/docs/redux/slices/database/priorityConfigSlice.md new file mode 100644 index 000000000..e3a040089 --- /dev/null +++ b/docs/redux/slices/database/priorityConfigSlice.md @@ -0,0 +1,24 @@ + + +# 🧩 priorityConfigSlice.js + +Lädt die Prioritätskonfiguration für Marker (z. B. zur farblichen Darstellung). + +## Zustand + +```js +{ + data: [], + status: "idle" | "succeeded" +} +``` + +## Thunk + +- `fetchPriorityConfigThunk` + +## Selector + +```js +selectPriorityConfig = (state) => state.priorityConfig.data +``` \ No newline at end of file diff --git a/docs/redux/slices/db/locationDevicesFromDBSlice.md b/docs/redux/slices/db/locationDevicesFromDBSlice.md deleted file mode 100644 index a9af9c583..000000000 --- a/docs/redux/slices/db/locationDevicesFromDBSlice.md +++ /dev/null @@ -1,103 +0,0 @@ -# 📦 locationDevicesFromDBSlice - -Zuständig für das Laden und Speichern der Geräteinformationen pro Standort (Location) aus der Datenbank. - -## 🧠 Zweck - -Dieses Slice verwaltet die Geräte, die mit einem bestimmten Standort (Location) verknüpft sind. -Es nutzt ein `createAsyncThunk`, um die Daten vom Webservice bzw. von der lokalen Datenbank zu laden. - ---- - -## 🔁 Datenfluss - -1. **Dispatch `fetchLocationDevicesFromDB()`** -2. **Daten werden über `fetchLocationDevices()` geladen** -3. **Status wird aktualisiert (`loading`, `succeeded`, `failed`)** -4. **Geräte-Liste (`devices`) wird gespeichert** - ---- - -## 🧩 Slice-Definition - -```js -initialState: { - devices: [], // Geräte-Liste pro Standort - status: "idle", // "idle" | "loading" | "succeeded" | "failed" - error: null // Fehlernachricht im Fehlerfall -} -``` - ---- - -## 🔧 Actions - -| Action Type | Beschreibung | -|--------------------------------------------|--------------------------------------------------| -| `fetchLocationDevicesFromDB/pending` | Startet den Ladeprozess | -| `fetchLocationDevicesFromDB/fulfilled` | Speichert die empfangenen Geräte in `devices` | -| `fetchLocationDevicesFromDB/rejected` | Speichert die Fehlermeldung in `error` | - ---- - -## 📥 Async Thunk - -```ts -export const fetchLocationDevicesFromDB = createAsyncThunk( - "locationDevicesFromDB/fetchLocationDevicesFromDB", - async () => { - return fetchLocationDevices(); // API-Aufruf aus services/api - } -); -``` - -Die Funktion `fetchLocationDevices()` befindet sich unter: - -``` -/redux/api/fromDB/fetchLocationDevices.js -``` - ---- - -## 🧪 Verwendung in Komponenten - -### Beispiel mit `useSelector` & `useDispatch` - -```tsx -import { useSelector, useDispatch } from "react-redux"; -import { fetchLocationDevicesFromDB } from "@/redux/slices/db/locationDevicesFromDBSlice"; - -const dispatch = useDispatch(); -const devices = useSelector((state) => state.locationDevicesFromDB.devices); -const status = useSelector((state) => state.locationDevicesFromDB.status); - -useEffect(() => { - dispatch(fetchLocationDevicesFromDB()); -}, []); -``` - ---- - -## 🧩 Integration im Store - -```ts -import locationDevicesFromDBReducer from "./slices/db/locationDevicesFromDBSlice"; - -export const store = configureStore({ - reducer: { - locationDevicesFromDB: locationDevicesFromDBReducer, - // weitere Slices ... - }, -}); -``` - ---- - -## 📌 Hinweis - -Dieses Slice ist Bestandteil der neuen Redux-Architektur (ehemals Recoil) -→ siehe auch `CHANGELOG.md` Version `1.1.97` bis `1.1.98`. - -``` -Pfad: /redux/slices/db/locationDevicesFromDBSlice.js -``` \ No newline at end of file diff --git a/docs/redux/slices/db/poiTypesSlice.md b/docs/redux/slices/db/poiTypesSlice.md deleted file mode 100644 index c772c22a7..000000000 --- a/docs/redux/slices/db/poiTypesSlice.md +++ /dev/null @@ -1,93 +0,0 @@ -# 🧭 poiTypesSlice - -Verwaltet die Point-of-Interest (POI) Typen, die vom Server bereitgestellt werden – z. B. für die Darstellung von Symbolen oder Layer-Kategorien in der Karte. - ---- - -## 📍 Datei - -``` -/redux/slices/db/poiTypesSlice.js -``` - ---- - -## 📦 Initialer State - -```ts -{ - data: [], // Liste der POI-Typen - status: "idle" // Ladezustand: "idle" | "loading" | "succeeded" | "failed" -} -``` - ---- - -## ⚙️ Async Thunk: `fetchPoiTypes` - -```ts -export const fetchPoiTypes = createAsyncThunk("poiTypes/fetchPoiTypes", async () => { - let API_BASE_URL = ""; - - if (typeof window !== "undefined") { - API_BASE_URL = `${window.location.protocol}//${window.location.hostname}:3000`; - } else { - API_BASE_URL = "http://localhost:3000"; - } - - const response = await fetch(`${API_BASE_URL}/api/talas_v5_DB/poiTyp/readPoiTyp`); - return await response.json(); -}); -``` - ---- - -## 🔁 Lifecycle im Slice - -| Zustand | Beschreibung | -|--------------------|--------------------------------------| -| `pending` | Setzt `status = "loading"` | -| `fulfilled` | Speichert `payload` in `state.data` und setzt `status = "succeeded"` | -| `rejected` | Setzt `status = "failed"` | - ---- - -## 🧪 Verwendung im Component - -```tsx -import { useSelector, useDispatch } from "react-redux"; -import { fetchPoiTypes } from "@/redux/slices/db/poiTypesSlice"; - -const dispatch = useDispatch(); -const poiTypes = useSelector((state) => state.poiTypes.data); -const status = useSelector((state) => state.poiTypes.status); - -useEffect(() => { - dispatch(fetchPoiTypes()); -}, []); -``` - ---- - -## 🧩 Store Integration - -```ts -import poiTypesReducer from "./slices/db/poiTypesSlice"; - -export const store = configureStore({ - reducer: { - poiTypes: poiTypesReducer, - // weitere ... - }, -}); -``` - ---- - -## 🌐 API-Endpunkt - -```http -GET /api/talas_v5_DB/poiTyp/readPoiTyp -``` - -Erwartet JSON-Antwort mit allen verfügbaren POI-Typen für die App. \ No newline at end of file diff --git a/docs/redux/store.md b/docs/redux/store.md new file mode 100644 index 000000000..95664ef63 --- /dev/null +++ b/docs/redux/store.md @@ -0,0 +1,64 @@ + + +# 🧠 Redux Store (store.js) + +Zentrale Konfiguration des globalen Redux-Stores für die Anwendung. +Er verwaltet Zustand für Daten aus Webservices, der Datenbank und UI-Status. + +--- + +## 🔌 Verwendung + +```js +import { Provider } from "react-redux"; +import { store } from "../redux/store"; + + + + +``` + +--- + +## 🔁 Struktur + +Der Store besteht aus drei Bereichen: + +### 1. `database` + +- `poiMarkers`, `addPoi`, `poiLayerVisible` +- `gisLinesFromDatabase`, `polylineLayerVisible` +- `readPoiMarkersStore`, `priorityConfig`, `locationDevicesFromDB` + +### 2. `webservice` + +- `gisStationsStaticDistrict`, `gisStationsStatusDistrict`, `gisSystemStatic` +- `gisStationsMeasurements`, `gisLinesStatusFromWebservice`, `userRights` + +### 3. `ui / interaktiv` + +- `mapLayers`, `selectedDevice`, `selectedPoi`, `selectedArea` +- `lineVisibility`, `zoomTrigger`, `urlParameter`, `polylineContextMenu` +- `polylineEventsDisabled`, `addPoiOnPolyline` + +--- + +## ⚙️ Einrichtung + +```js +export const store = configureStore({ + reducer: { + selectedDevice: selectedDeviceReducer, + poiMarkers: poiMarkersReducer, + ... + } +}); +``` + +--- + +## 📁 Pfad + +```bash +/redux/store.js +``` \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index a470322f4..238125eb1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,5 +1,5 @@ { - "name": "23.05.2025 NodeMap", + "name": "27.05.2025 NodeMap", "lockfileVersion": 3, "requires": true, "packages": { diff --git a/pages/index.js b/pages/index.js index cc893a730..58777a5ee 100644 --- a/pages/index.js +++ b/pages/index.js @@ -1,4 +1,4 @@ -"use client"; +"use client"; // /pages/index.js import React, { useEffect, useState } from "react"; import dynamic from "next/dynamic"; import { useSelector, useDispatch } from "react-redux";