docs: Projektstruktur der Dokumentation an Quellcode angepasst
- Verzeichnisstruktur unter /docs spiegelt nun die tatsächliche Projektstruktur wider - frontend/server-Trennung entfernt zugunsten von /docs/pages, /docs/redux, /docs/utils etc. - Erhöht Wiederauffindbarkeit, Übersichtlichkeit und Entwicklerfreundlichkeit
This commit is contained in:
ISA
79
docs/utils/devices/createAndSetDevices.md
Normal file
79
docs/utils/devices/createAndSetDevices.md
Normal file
@@ -0,0 +1,79 @@
|
||||
# 🧭 createAndSetDevices.js – Geräte setzen und verwalten
|
||||
|
||||
## Zweck
|
||||
|
||||
Diese Datei erstellt Leaflet-Marker für aktive Geräte basierend auf Webservice-Daten
|
||||
und konfiguriert Kontexteinträge für Interaktionen wie:
|
||||
|
||||
- Geräte-Popup anzeigen
|
||||
- Station per Klick öffnen
|
||||
- Statusinformationen einblenden
|
||||
- Redux-Aktionen für ausgewähltes Gerät auslösen
|
||||
|
||||
---
|
||||
|
||||
## Datenquellen
|
||||
|
||||
Die Daten stammen aus:
|
||||
|
||||
- `GisStationsStaticDistrict` (statische Stationsinfos)
|
||||
- `GisStationsStatusDistrict` (Statusinformationen)
|
||||
|
||||
Sie werden entweder über echte Webservices oder Mock-Daten geladen.
|
||||
|
||||
---
|
||||
|
||||
## Besonderheiten
|
||||
|
||||
- Marker werden mit Prioritätsicons gerendert
|
||||
- Redux-Slices:
|
||||
- `selectedDeviceSlice` wird bei Hover gesetzt
|
||||
- `lineVisibilitySlice` aktualisiert Linienstatus
|
||||
- Leaflet-Kontextmenü (nur Marker) mit Menüeintrag:
|
||||
„Station öffnen (Tab)“
|
||||
|
||||
---
|
||||
|
||||
## Dynamische URL mit Port-Logik
|
||||
|
||||
Die Station-Links im Kontextmenü nutzen keine feste URL mehr.
|
||||
Stattdessen wird dynamisch unterschieden:
|
||||
|
||||
```js
|
||||
const mode = process.env.NEXT_PUBLIC_API_PORT_MODE;
|
||||
|
||||
const baseUrl =
|
||||
mode === "dev"
|
||||
? \`\${window.location.protocol}//\${window.location.hostname}:80/talas5/\`
|
||||
: \`\${window.location.origin}/talas5/\`;
|
||||
```
|
||||
|
||||
➡ Dadurch wird verhindert, dass bei jeder Server-IP `.env.local` oder ein Build nötig ist.
|
||||
|
||||
---
|
||||
|
||||
## Kontextmenüaktion
|
||||
|
||||
```js
|
||||
window.open(`${baseUrl}cpl.aspx?ver=35&kue=24&id=${station.IdLD}`, "_blank");
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Weitere Funktionen
|
||||
|
||||
- Popup-HTML enthält Statusanzeigen (Name, Farbe, Meldung)
|
||||
- Marker werden auf Klick animiert (bounce-Effekt)
|
||||
- Kontextmenüeinträge werden sauber entfernt bei Klick außerhalb
|
||||
|
||||
---
|
||||
|
||||
## Siehe auch
|
||||
|
||||
- `setupPolylines.js`
|
||||
- `redux/slices/selectedDeviceSlice.js`
|
||||
- Webservices: `fetchGisStationsStaticDistrict.js`, `fetchGisStationsStatusDistrict.js`
|
||||
|
||||
---
|
||||
|
||||
📄 Pfad: `/docs/frontend/utils/devices/createAndSetDevices.md`
|
||||
77
docs/utils/polylines/setupPolylines.md
Normal file
77
docs/utils/polylines/setupPolylines.md
Normal file
@@ -0,0 +1,77 @@
|
||||
# 🧭 setupPolylines.js – Polylinien zeichnen und verwalten
|
||||
|
||||
## Zweck
|
||||
|
||||
Diese Datei enthält die zentrale Funktion `setupPolylines`, die in der Kartenkomponente (Leaflet) Polylinien sowie Marker basierend auf Gerätekonfigurationen zeichnet und verwaltet.
|
||||
|
||||
Sie wird verwendet, um:
|
||||
|
||||
- Polylinien basierend auf Koordinaten zu zeichnen
|
||||
- Stützpunkte visuell als Marker anzuzeigen
|
||||
- Marker kontextsensitiv mit Optionen (z. B. „Stützpunkt entfernen“, „Koordinaten anzeigen“) auszustatten
|
||||
- Linien aktualisieren und neue Koordinaten in die Datenbank schreiben
|
||||
- Kontextmenü-Interaktionen zu ermöglichen
|
||||
|
||||
---
|
||||
|
||||
## Besonderheiten
|
||||
|
||||
- Marker mit speziellen Icons (Start, Ende, Zwischenpunkt)
|
||||
- Interaktivität abhängig vom Bearbeitungsmodus (editMode aus `localStorage`)
|
||||
- Kontextmenü pro Marker und Linie individuell steuerbar
|
||||
- API-Aufrufe zur Koordinaten-Aktualisierung:
|
||||
`POST /api/talas_v5_DB/gisLines/updateLineCoordinates`
|
||||
|
||||
---
|
||||
|
||||
## Dynamische URL mit Port-Steuerung
|
||||
|
||||
Die Datei verwendet **keine feste API-Basis-URL** mehr aus `.env.local`.
|
||||
Stattdessen wird `NEXT_PUBLIC_API_PORT_MODE` genutzt, um zwischen Entwicklungs- und Produktionsumgebung zu unterscheiden:
|
||||
|
||||
```env
|
||||
NEXT_PUBLIC_API_PORT_MODE=dev
|
||||
```
|
||||
|
||||
### Beispiel im Code:
|
||||
|
||||
```js
|
||||
const mode = process.env.NEXT_PUBLIC_API_PORT_MODE;
|
||||
|
||||
const baseUrl =
|
||||
mode === "dev"
|
||||
? `${window.location.protocol}//${window.location.hostname}:80/talas5/`
|
||||
: `${window.location.origin}/talas5/`;
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Kontextmenüaktionen
|
||||
|
||||
- Station öffnen (neuer Tab)
|
||||
- Koordinaten anzeigen
|
||||
- Zoom in/out
|
||||
- Karte zentrieren
|
||||
- Stützpunkt hinzufügen/entfernen (wenn editMode)
|
||||
|
||||
---
|
||||
|
||||
## Speicherorte
|
||||
|
||||
- Polylinien und LineColors werden unter `window.polylines` und `window.lineColors` global gespeichert
|
||||
- Aktive Redux-Slices:
|
||||
- `polylineContextMenuSlice`
|
||||
- `addPoiOnPolylineSlice`
|
||||
- `polylineLayerVisibleSlice`
|
||||
|
||||
---
|
||||
|
||||
## Siehe auch
|
||||
|
||||
- API-Aufruf: `/api/talas_v5_DB/gisLines/updateLineCoordinates`
|
||||
- `utils/geometryUtils.js`, `poiUtils.js`, `eventHandlers.js`
|
||||
- `redux/slices/polylineContextMenuSlice.js`
|
||||
|
||||
---
|
||||
|
||||
📄 Pfad: `/docs/frontend/utils/polylines/setupPolylines.md`
|
||||
30
docs/utils/setupPOIs.md
Normal file
30
docs/utils/setupPOIs.md
Normal file
@@ -0,0 +1,30 @@
|
||||
# 🧭 `setupPOIs.js`
|
||||
|
||||
## Zweck
|
||||
|
||||
Zeichnet alle POI-Marker auf die Leaflet-Karte basierend auf Datenbankeinträgen. Bindet Popup, Kontextmenü, Drag'n'Drop und Redux-Zustand ein.
|
||||
|
||||
## Parameter
|
||||
|
||||
| Name | Beschreibung |
|
||||
| ----------------- | ---------------------------------------------------- |
|
||||
| `map` | Leaflet-Instanz |
|
||||
| `pois` | Array mit POI-Objekten aus der Datenbank |
|
||||
| `poiData` | Array mit Iconpfaden: `{ idPoi, path }` |
|
||||
| `poiTypMap` | Map-Objekt: `idPoiTyp → Name` |
|
||||
| `poiLayerVisible` | Gibt an, ob Layer überhaupt gezeichnet werden sollen |
|
||||
|
||||
## Besonderheiten
|
||||
|
||||
- Icon wird über `iconMap.get(idPoi)` bezogen
|
||||
- Fallback bei unbekanntem Icon (`default-icon.png`)
|
||||
- Rechteprüfung für Drag & Kontextmenü (`userRights.some(...)`)
|
||||
- Marker können bearbeitet, verschoben, gelöscht werden
|
||||
- Bei `mouseover` → Redux: `setSelectedPoi(poi)`
|
||||
|
||||
## Beispiel für Testdaten
|
||||
|
||||
```js
|
||||
const poi = { idPoi: 7, idPoiTyp: 2, position: "POINT(8.5 53.1)", description: "Mast", idLD: 123 };
|
||||
const poiData = [{ idPoi: 7, path: "poi-marker-icon-2.png" }];
|
||||
```
|
||||
Reference in New Issue
Block a user