README Update
This commit is contained in:
127
README.md
127
README.md
@@ -8,6 +8,9 @@ Die Anwendung ist mit **Next.js**, **React**, **Redux Toolkit**, **Tailwind CSS*
|
|||||||
> Diese README richtet sich an Entwickler, Administratoren und fortgeschrittene Benutzer.
|
> Diese README richtet sich an Entwickler, Administratoren und fortgeschrittene Benutzer.
|
||||||
> Sie enthält technische Einrichtung, Systemüberblick, Benutzeranleitung und Hinweise zur Webservice-Integration.
|
> Sie enthält technische Einrichtung, Systemüberblick, Benutzeranleitung und Hinweise zur Webservice-Integration.
|
||||||
|
|
||||||
|
> 🖥 Entwicklung & Test unter Windows 11 mit Node.js v18.17.1 und IIS
|
||||||
|
> 📦 MySQL 8.0 läuft lokal in einem Docker-Container (nur für Entwicklung)
|
||||||
|
> 🗄 In der Produktionsumgebung läuft ein echter Windows-MySQL-Dienst
|
||||||
|
|
||||||
## 📌 Ziel des Projekts in 30 Sekunden
|
## 📌 Ziel des Projekts in 30 Sekunden
|
||||||
|
|
||||||
@@ -16,6 +19,17 @@ Sie funktioniert vollständig lokal und offline auf Windows-Servern – gesteuer
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## 🧰 Erste Schritte für Entwickler
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone http://10.10.0.12:3000/ISA/nodeMap
|
||||||
|
cd nodeMap
|
||||||
|
npm install
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## 🧭 Zielumgebung
|
## 🧭 Zielumgebung
|
||||||
|
|
||||||
- Windows-Produktionsserver (offline, kein Internet)
|
- Windows-Produktionsserver (offline, kein Internet)
|
||||||
@@ -27,7 +41,7 @@ Sie funktioniert vollständig lokal und offline auf Windows-Servern – gesteuer
|
|||||||
|
|
||||||
## 🔄 Wie funktioniert das System?
|
## 🔄 Wie funktioniert das System?
|
||||||
|
|
||||||
1. TALAS ruft die App mit URL auf: `http://10.10.0.13:3000/?m=10&u=484`
|
1. TALAS ruft die App mit URL auf: `http://10.10.0.13/talas5/MessagesMap/mapTypC.aspx?m=12&u=484`
|
||||||
2. Die App liest `m` und `u` aus der URL
|
2. Die App liest `m` und `u` aus der URL
|
||||||
3. `MapComponent` lädt POIs, Linien, Rechte entsprechend
|
3. `MapComponent` lädt POIs, Linien, Rechte entsprechend
|
||||||
4. API-Endpunkte kommunizieren lokal mit Datenbankserver (MySQL)
|
4. API-Endpunkte kommunizieren lokal mit Datenbankserver (MySQL)
|
||||||
@@ -42,9 +56,9 @@ Sie funktioniert vollständig lokal und offline auf Windows-Servern – gesteuer
|
|||||||
- POI hinzufügen, bearbeiten, verschieben, löschen
|
- POI hinzufügen, bearbeiten, verschieben, löschen
|
||||||
- Gerätestatus und Layeranzeige
|
- Gerätestatus und Layeranzeige
|
||||||
- Intervallbasierte Datenaktualisierung
|
- Intervallbasierte Datenaktualisierung
|
||||||
- Integration als iFrame in TALAS
|
- Integration als iFrame in TALAS.web
|
||||||
- Versionsanzeige über `.env.local`
|
- Versionsanzeige über `.env.local`
|
||||||
- Testdaten per Mock-API möglich
|
- Testdaten per Mock-API möglich (nur in der Entwicklungsumgebung)
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -95,11 +109,13 @@ C:\inetpub\wwwroot/talas5/nodeMap
|
|||||||
Beinhaltet:
|
Beinhaltet:
|
||||||
|
|
||||||
- `.next/`, `node_modules/`, `public/`
|
- `.next/`, `node_modules/`, `public/`
|
||||||
- `components/`, `pages/`, `redux/`, `hooks/`, `services/`, `config/`, `utils/`, `lib/`
|
|
||||||
- `package.json`, `.env.local`
|
- `package.json`, `.env.local`
|
||||||
|
-Zum Erstellen des Windows-Dienstes nodeMapService werden folgende Dateien benötigt: nssm.exe, nssm Installation.md, Start-Dev.ps1 und StartNodeApp.bat
|
||||||
|
|
||||||
### 3. Starten
|
### 3. Starten
|
||||||
|
|
||||||
|
Erstellte Windows Dienst "nodeMapService" starten oder im Terminal
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
npm start
|
npm start
|
||||||
```
|
```
|
||||||
@@ -108,11 +124,10 @@ npm start
|
|||||||
|
|
||||||
## 🔁 Code-Update
|
## 🔁 Code-Update
|
||||||
|
|
||||||
Wenn keine neue Bibliotheken installiert ist mit npm install:
|
Wenn keine neuen Bibliotheken installiert wurden mit npm install:
|
||||||
|
|
||||||
- `.next/` ersetzen
|
- `.next/` ersetzen
|
||||||
- `components/`, `redux/`, `config/`, etc. nur bei Änderungen
|
- `.env.local` bei Änderung
|
||||||
- `.env.local` ggf. anpassen
|
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -125,12 +140,12 @@ Wenn keine neue Bibliotheken installiert ist mit npm install:
|
|||||||
Beispiel:
|
Beispiel:
|
||||||
|
|
||||||
```
|
```
|
||||||
http://10.10.0.13:3000/?m=8&u=482
|
`http://10.10.0.13/talas5/MessagesMap/mapTypC.aspx?m=12&u=484`
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🔗 Integration in TALAS
|
## 🔗 Integration in TALAS.web
|
||||||
|
|
||||||
- Die App wird in einem **iFrame** geladen
|
- Die App wird in einem **iFrame** geladen
|
||||||
- Startet über `?m=X&u=Y` für Map-/User-IDs
|
- Startet über `?m=X&u=Y` für Map-/User-IDs
|
||||||
@@ -148,7 +163,7 @@ NEXT_PUBLIC_SERVER_URL=http://10.10.0.13:3000
|
|||||||
```
|
```
|
||||||
|
|
||||||
- Nur `NEXT_PUBLIC_...` ist im Browser sichtbar
|
- Nur `NEXT_PUBLIC_...` ist im Browser sichtbar
|
||||||
- Keine Passwörter oder Tokens hier speichern
|
- Keine Passwörter oder vertraulichen Daten mit `NEXT_PUBLIC_` speichern – diese sind im Browser sichtbar
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -191,10 +206,11 @@ if (process.env.NEXT_PUBLIC_DEBUG === 'true') console.log(...)
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🚫 Tests
|
## ✅ Tests & Qualitätssicherung
|
||||||
|
|
||||||
- Jest & Cypress = nur Entwicklung
|
- **E2E-Tests:** Cypress (nur in der Entwicklungsumgebung)
|
||||||
- Leaflet schwer testbar → manuell prüfen
|
- **Unit-Tests:** Aktuell keine Jest-Tests aufgrund Leaflet-Komplexität
|
||||||
|
- **Empfehlung:** Manuelle Tests nach jedem Deployment durchführen (Checkliste vorbereiten)
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -232,11 +248,11 @@ NEXT_PUBLIC_SERVER_URL=http://10.10.0.13:3000
|
|||||||
|
|
||||||
- Node.js und npm müssen installiert sein: https://nodejs.org
|
- Node.js und npm müssen installiert sein: https://nodejs.org
|
||||||
- MySQL Datenbank läuft in einem Docker-Container (lokal bei Entwicklung)
|
- MySQL Datenbank läuft in einem Docker-Container (lokal bei Entwicklung)
|
||||||
- TALAS V5 ist im IIS lokal installiert
|
- TALAS V5/TALAS.web ist im IIS lokal installiert
|
||||||
|
|
||||||
### Leaflet mapTiles
|
### Leaflet mapTiles
|
||||||
|
|
||||||
- Damit nicht ausversehen mapTiles gelöscht werden, werden die hier eingefügt, falls vorhanden ist dann nicht mehr nötig mapTiles auf dem server einzufügen:
|
- Damit nicht ausversehen mapTiles gelöscht werden beim Code Update, werden die hier eingefügt, wenn vorhanden, müssen keine mapTiles manuell kopiert werden mapTiles auf dem server einzufügen:
|
||||||
`C:\inetpub\wwwroot\talas5\TileMap`
|
`C:\inetpub\wwwroot\talas5\TileMap`
|
||||||
|
|
||||||
### Serverkonfiguration
|
### Serverkonfiguration
|
||||||
@@ -280,15 +296,9 @@ NEXT_PUBLIC_SERVER_URL=http://10.10.0.13:3000
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 📘 Hinweis
|
|
||||||
|
|
||||||
Diese README kombiniert technische Projektstruktur, Setup- & Deployment-Ablauf sowie Benutzeranleitung, um sowohl neue Entwickler als auch Administratoren umfassend einzuweisen.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📡 Webservice-Anbindung (Backend: TALAS.web)
|
## 📡 Webservice-Anbindung (Backend: TALAS.web)
|
||||||
|
|
||||||
NodeMap verwendet verschiedene Webservices, die von **TALAS V5** im IIS bereitgestellt werden.
|
NodeMap verwendet verschiedene Webservices, die von **TALAS V5/TALAS.web** im IIS bereitgestellt werden.
|
||||||
Diese Services liefern dynamische GIS-, Geräte- und Statusdaten für die MapComponent.
|
Diese Services liefern dynamische GIS-, Geräte- und Statusdaten für die MapComponent.
|
||||||
|
|
||||||
### URL des Webservice:
|
### URL des Webservice:
|
||||||
@@ -305,13 +315,13 @@ http://localhost/talas5/ClientData/WebServiceMap.asmx
|
|||||||
| --------------------------- | ------------------------------------------ |
|
| --------------------------- | ------------------------------------------ |
|
||||||
| `CablesStatic` | Liste aller Stränge |
|
| `CablesStatic` | Liste aller Stränge |
|
||||||
| `GetIconsStatic` | Liste aller Icons |
|
| `GetIconsStatic` | Liste aller Icons |
|
||||||
| `GisLinesStatus` | Liste aller Statis der Linien |
|
| `GisLinesStatus` | Liste aller Status der Linien |
|
||||||
| `GisStationsMeasurements` | Liste aller Messungen der Geräte |
|
| `GisStationsMeasurements` | Liste aller Messungen der Geräte |
|
||||||
| `GisStationsStaticDistrict` | Liste aller Geraete einer bestimmten Karte |
|
| `GisStationsStaticDistrict` | Liste aller Geraete einer bestimmten Karte |
|
||||||
| `GisStationsStatusDistrict` | Liste aller Statis der Geräte |
|
| `GisStationsStatusDistrict` | Liste aller Statis der Geräte |
|
||||||
| `GisSystemStatic` | Liste aller angezeigten Systeme |
|
| `GisSystemStatic` | Liste aller angezeigten Systeme |
|
||||||
|
|
||||||
Die Webservices liefern meist JSON und werden im Frontend über `services/*.js` abgefragt.
|
Die Webservices liefern JSON und werden im Frontend über `services/*.js` abgefragt.
|
||||||
Die Daten werden verarbeitet, zwischengespeichert und z. T. über Redux oder Recoil in der Karte dargestellt.
|
Die Daten werden verarbeitet, zwischengespeichert und z. T. über Redux oder Recoil in der Karte dargestellt.
|
||||||
|
|
||||||
➡ Damit alles funktioniert, müssen:
|
➡ Damit alles funktioniert, müssen:
|
||||||
@@ -319,3 +329,72 @@ Die Daten werden verarbeitet, zwischengespeichert und z. T. über Redux oder R
|
|||||||
- der IIS laufen
|
- der IIS laufen
|
||||||
- der `WebServiceMap.asmx` erreichbar sein
|
- der `WebServiceMap.asmx` erreichbar sein
|
||||||
- die IP in `.env.local` korrekt gesetzt sein
|
- die IP in `.env.local` korrekt gesetzt sein
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🔁 🧳 Standard-Deployment-Ablauf auf dem Server
|
||||||
|
|
||||||
|
### Zielverzeichnis:
|
||||||
|
|
||||||
|
```
|
||||||
|
C:\inetpub\wwwroot/talas5/nodeMap
|
||||||
|
```
|
||||||
|
|
||||||
|
### Schritte:
|
||||||
|
|
||||||
|
1. **Build erstellen**
|
||||||
|
Führe `npm run build` in der Entwicklungsumgebung aus
|
||||||
|
|
||||||
|
2. **Build-Dateien sammeln**
|
||||||
|
Kopiere folgende Ordner/Dateien in einen neuen Ordner:
|
||||||
|
|
||||||
|
- `.next/`
|
||||||
|
- `node_modules/`
|
||||||
|
- `public/`
|
||||||
|
- `package.json`
|
||||||
|
- `.env.local`
|
||||||
|
|
||||||
|
3. **IP-Adresse aktualisieren**
|
||||||
|
Verwende „Find in Files“ in VSCode, um z. B. `10.10.0.13` durch neue Server-IP zu ersetzen
|
||||||
|
|
||||||
|
4. **ZIP erstellen**
|
||||||
|
Packe den Build-Ordner als ZIP (z. B. `nodeMap_V1.1.62.zip`)
|
||||||
|
|
||||||
|
5. **ZIP auf Server hochladen**
|
||||||
|
|
||||||
|
6. **ZIP entpacken auf dem Server**
|
||||||
|
z. B. nach: `C:\inetpub\wwwroot/talas5/nodeMap V1.1.62`
|
||||||
|
|
||||||
|
7. **Dienst beenden (falls aktiv)**
|
||||||
|
Beende `NodeMapService`, falls dieser noch `npm run dev` nutzt
|
||||||
|
|
||||||
|
8. **Backup vom alten nodeMap-Ordner erstellen**
|
||||||
|
Benenne z. B. um in `nodeMap_Alt_1.1.56`
|
||||||
|
|
||||||
|
9. **Neuen Ordner umbenennen → `nodeMap`**
|
||||||
|
|
||||||
|
10. **Wechsle in neuen Ordner**
|
||||||
|
|
||||||
|
```powershell
|
||||||
|
cd C:\inetpub\wwwroot/talas5/nodeMap
|
||||||
|
```
|
||||||
|
|
||||||
|
11. **App starten**
|
||||||
|
Windows Server Dienst "nodeMapService" starten
|
||||||
|
oder in Terminal
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm start
|
||||||
|
```
|
||||||
|
|
||||||
|
12. **Testen im Browser**
|
||||||
|
|
||||||
|
```url
|
||||||
|
http://10.10.0.13/talas5/MessagesMap/mapTypC.aspx?m=12&u=484
|
||||||
|
```
|
||||||
|
|
||||||
|
13. Bei erst Installation auf dem Server Windows-Dienst `NodeMapService` auf dem Server erstellen
|
||||||
|
mit nssm.exe
|
||||||
|
> Der Dienst führt Batch-Skript `StartNodeApp.bat` aus.
|
||||||
|
> `StartNodeApp.bat` führt `Start-Dev.ps1` aus
|
||||||
|
> `Start-Dev.ps1`führt `npm start` aus
|
||||||
|
|||||||
@@ -1,384 +0,0 @@
|
|||||||
# 🌍 NodeMap – Interaktive Kartenvisualisierung mit Leaflet & React
|
|
||||||
|
|
||||||
NodeMap ist eine modulare Kartenanwendung zur Visualisierung und Bearbeitung von GIS-Daten, POIs und Gerätestatus in einer interaktiven Leaflet-Karte.
|
|
||||||
Die Anwendung ist mit **Next.js**, **React**, **Redux Toolkit**, **Tailwind CSS** und **Leaflet** umgesetzt.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
> Diese README richtet sich an Entwickler, Administratoren und fortgeschrittene Benutzer.
|
|
||||||
> Sie enthält technische Einrichtung, Systemüberblick, Benutzeranleitung und Hinweise zur Webservice-Integration.
|
|
||||||
|
|
||||||
## 📌 Ziel des Projekts in 30 Sekunden
|
|
||||||
|
|
||||||
Diese Anwendung dient der Visualisierung und Bearbeitung von Karteninhalten (POIs, Gerätestatus) innerhalb von TALAS V5.
|
|
||||||
Sie funktioniert vollständig lokal und offline auf Windows-Servern – gesteuert über URL-Parameter `?m=` (Map-ID) und `?u=` (User-ID).
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧭 Zielumgebung
|
|
||||||
|
|
||||||
- Windows-Produktionsserver (offline, kein Internet)
|
|
||||||
- Kommunikation nur im lokalen Netzwerk
|
|
||||||
- Nutzerzugriff per VPN + Remote Desktop (RDP)
|
|
||||||
- Integration per iFrame in TALAS V5 / TALAS.web
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔄 Wie funktioniert das System?
|
|
||||||
|
|
||||||
1. TALAS ruft die App mit URL auf: `http://10.10.0.13:3000/?m=10&u=484`
|
|
||||||
2. Die App liest `m` und `u` aus der URL
|
|
||||||
3. `MapComponent` lädt POIs, Linien, Rechte entsprechend
|
|
||||||
4. API-Endpunkte kommunizieren lokal mit Datenbankserver (MySQL)
|
|
||||||
5. Interaktive Bearbeitung (POI hinzufügen, verschieben, löschen) ist möglich
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🚀 Funktionen
|
|
||||||
|
|
||||||
- Leaflet-basierte interaktive Karte
|
|
||||||
- Rechtebasierte UI durch URL-Parameter (`?m`, `?u`)
|
|
||||||
- POI hinzufügen, bearbeiten, verschieben, löschen
|
|
||||||
- Gerätestatus und Layeranzeige
|
|
||||||
- Intervallbasierte Datenaktualisierung
|
|
||||||
- Integration als iFrame in TALAS
|
|
||||||
- Versionsanzeige über `.env.local`
|
|
||||||
- Testdaten per Mock-API möglich
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧱 Projektstruktur
|
|
||||||
|
|
||||||
```bash
|
|
||||||
components/ → UI-Komponenten inkl. Map
|
|
||||||
config/ → zentrale Variablen (.env.local)
|
|
||||||
hooks/ → eigene React-Hooks
|
|
||||||
redux/ → globale Zustände (Slices)
|
|
||||||
services/ → API-Kommunikation, Mock-Logik
|
|
||||||
utils/ → POI- und Linienverarbeitung
|
|
||||||
lib/ → Formatierungen, Umrechnungen
|
|
||||||
public/ → mapTiles, Bilder, Icons
|
|
||||||
pages/ → Next.js Seiten & Routen
|
|
||||||
scripts/ → lokale Tools (nur Dev)
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## ⚙ Lokale Entwicklung
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm install
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
> 🔧 Nur für Entwicklung. Kein VPN, kein iFrame nötig.
|
|
||||||
> API-Aufrufe ggf. via Mockdaten.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🖥 Installation auf Server (Test oder Produktion)
|
|
||||||
|
|
||||||
### 1. Build erstellen
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm install
|
|
||||||
npm run build
|
|
||||||
```
|
|
||||||
|
|
||||||
### 2. Dateien übertragen nach:
|
|
||||||
|
|
||||||
```
|
|
||||||
C:\inetpub\wwwroot/talas5/nodeMap
|
|
||||||
```
|
|
||||||
|
|
||||||
Beinhaltet:
|
|
||||||
|
|
||||||
- `.next/`, `node_modules/`, `public/`
|
|
||||||
- `components/`, `pages/`, `redux/`, `hooks/`, `services/`, `config/`, `utils/`, `lib/`
|
|
||||||
- `package.json`, `.env.local`
|
|
||||||
|
|
||||||
### 3. Starten
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm start
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔁 Code-Update
|
|
||||||
|
|
||||||
Wenn keine neue Bibliotheken installiert ist mit npm install:
|
|
||||||
|
|
||||||
- `.next/` ersetzen
|
|
||||||
- `components/`, `redux/`, `config/`, etc. nur bei Änderungen
|
|
||||||
- `.env.local` ggf. anpassen
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🌐 Portfreigabe
|
|
||||||
|
|
||||||
- Anwendung läuft auf Port `3000`
|
|
||||||
- Muss in Windows-Firewall freigegeben sein
|
|
||||||
- Kein Zugriff über `localhost` im Netzwerk – **nur über IP**
|
|
||||||
|
|
||||||
Beispiel:
|
|
||||||
|
|
||||||
```
|
|
||||||
http://10.10.0.13:3000/?m=8&u=482
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔗 Integration in TALAS
|
|
||||||
|
|
||||||
- Die App wird in einem **iFrame** geladen
|
|
||||||
- Startet über `?m=X&u=Y` für Map-/User-IDs
|
|
||||||
- Rechte und Inhalte werden automatisch geladen
|
|
||||||
- Kein statischer Export (`npm run export`) notwendig!
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔐 Konfiguration – `.env.local`
|
|
||||||
|
|
||||||
```env
|
|
||||||
NEXT_PUBLIC_APP_VERSION=1.1.59
|
|
||||||
NEXT_PUBLIC_USE_MOCK_API=true
|
|
||||||
NEXT_PUBLIC_SERVER_URL=http://10.10.0.13:3000
|
|
||||||
```
|
|
||||||
|
|
||||||
- Nur `NEXT_PUBLIC_...` ist im Browser sichtbar
|
|
||||||
- Keine Passwörter oder Tokens hier speichern
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧠 Zustand: Recoil zu Redux-Migration
|
|
||||||
|
|
||||||
| Zustand / Atom | Migration |
|
|
||||||
| ------------------------ | --------------------- |
|
|
||||||
| poiLayerVisible (Recoil) | ✅ zu Redux umgezogen |
|
|
||||||
| selectedPoi | ❌ noch in Recoil |
|
|
||||||
| mapLayersState | ✅ bereits in Redux |
|
|
||||||
|
|
||||||
➡ Neue Features bitte nur noch mit Redux umsetzen!
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧪 Mockdaten (nur Entwicklung)
|
|
||||||
|
|
||||||
```env
|
|
||||||
NEXT_PUBLIC_USE_MOCK_API=true
|
|
||||||
```
|
|
||||||
|
|
||||||
→ Lädt `/api/mockData/...` statt echtem Server.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧰 Fehler & Debug
|
|
||||||
|
|
||||||
- Fehler per Toast oder `console.log`
|
|
||||||
- Logging möglich:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm start > log.txt 2>&1
|
|
||||||
```
|
|
||||||
|
|
||||||
- Nur aktiv bei:
|
|
||||||
|
|
||||||
```js
|
|
||||||
if (process.env.NEXT_PUBLIC_DEBUG === 'true') console.log(...)
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🚫 Tests
|
|
||||||
|
|
||||||
- Jest & Cypress = nur Entwicklung
|
|
||||||
- Leaflet schwer testbar → manuell prüfen
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧩 Abhängigkeiten
|
|
||||||
|
|
||||||
- Next.js, React, Redux Toolkit, Leaflet
|
|
||||||
- Tailwind CSS, Toastify
|
|
||||||
- Full list → `package.json`
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🏷 Versionierung
|
|
||||||
|
|
||||||
```env
|
|
||||||
NEXT_PUBLIC_APP_VERSION=1.1.59
|
|
||||||
```
|
|
||||||
|
|
||||||
→ Wird in der Fußzeile angezeigt.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧪 Beispiel `.env.local`
|
|
||||||
|
|
||||||
```env
|
|
||||||
NEXT_PUBLIC_APP_VERSION=1.1.59
|
|
||||||
NEXT_PUBLIC_USE_MOCK_API=true
|
|
||||||
NEXT_PUBLIC_SERVER_URL=http://10.10.0.13:3000
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🛠 Zusätzliche Hinweise
|
|
||||||
|
|
||||||
### Voraussetzungen
|
|
||||||
|
|
||||||
- Node.js und npm müssen installiert sein: https://nodejs.org
|
|
||||||
- MySQL Datenbank läuft in einem Docker-Container (lokal bei Entwicklung)
|
|
||||||
- TALAS V5 ist im IIS lokal installiert
|
|
||||||
|
|
||||||
### Leaflet mapTiles
|
|
||||||
|
|
||||||
- Damit nicht ausversehen mapTiles gelöscht werden, werden die hier eingefügt, falls vorhanden ist dann nicht mehr nötig mapTiles auf dem server einzufügen:
|
|
||||||
`C:\inetpub\wwwroot\talas5\TileMap`
|
|
||||||
|
|
||||||
### Serverkonfiguration
|
|
||||||
|
|
||||||
- Port 3000 muss freigegeben sein
|
|
||||||
- `.env.local`, `config.js`, `[...]path.js` und `MapComponent.js` müssen IP und API-Endpunkte korrekt konfiguriert haben
|
|
||||||
- Die Anwendung wird über einen `nssm` Windows-Service gestartet (optional)
|
|
||||||
- Browser: Chrome ab Version 125.0.6420.142 empfohlen
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧭 Benutzeranleitung
|
|
||||||
|
|
||||||
- **Station öffnen:** Rechte Maustaste → "Station öffnen" oder "Station öffnen (Tab)"
|
|
||||||
- **POI hinzufügen:** Rechtsklick → "POI hinzufügen" → Formular ausfüllen
|
|
||||||
- **POI bearbeiten/löschen:** Kontextmenü verwenden
|
|
||||||
- **POI verschieben:** Drag & Drop des Markers, automatische DB-Aktualisierung
|
|
||||||
- **Koordinaten anzeigen:** Kontextmenüoption nutzen
|
|
||||||
- **Zoom:** Mausrad oder Kontextmenüoption
|
|
||||||
- **Layer filtern:** Checkboxen im rechten Panel (`DataSheet`)
|
|
||||||
- **Station auswählen:** Dropdown oben rechts
|
|
||||||
- **Zentrieren:** Rechtsklick → "Hier zentrieren"
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧰 Fehlerbehandlung
|
|
||||||
|
|
||||||
- Seite neu laden, wenn POIs nicht korrekt geladen werden
|
|
||||||
- Sicherstellen, dass alle API-Endpunkte erreichbar sind
|
|
||||||
- `.env.local` prüfen
|
|
||||||
- Port 3000 freigeben
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📂 Erweiterte Verzeichnisstruktur
|
|
||||||
|
|
||||||
- `/styles/`: Tailwind- und CSS-Dateien
|
|
||||||
- `/store/`: Recoil-Atome (teilweise durch Redux ersetzt)
|
|
||||||
- `/api/`: POI-spezifische Endpunkte wie `addLocation.js`, `updateLocation.js`, `locations.js`
|
|
||||||
- `/config/config.js`: zentrale Konfigurationswerte (API, Server-IP, etc.)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📘 Hinweis
|
|
||||||
|
|
||||||
Diese README kombiniert technische Projektstruktur, Setup- & Deployment-Ablauf sowie Benutzeranleitung, um sowohl neue Entwickler als auch Administratoren umfassend einzuweisen.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📡 Webservice-Anbindung (Backend: TALAS.web)
|
|
||||||
|
|
||||||
NodeMap verwendet verschiedene Webservices, die von **TALAS V5** im IIS bereitgestellt werden.
|
|
||||||
Diese Services liefern dynamische GIS-, Geräte- und Statusdaten für die MapComponent.
|
|
||||||
|
|
||||||
### URL des Webservice:
|
|
||||||
|
|
||||||
```
|
|
||||||
http://localhost/talas5/ClientData/WebServiceMap.asmx
|
|
||||||
```
|
|
||||||
|
|
||||||
> 🔧 In `.env.local` oder `config.js` muss die Adresse je nach Umgebung angepasst werden (z. B. `http://10.10.0.13/talas5/...`)
|
|
||||||
|
|
||||||
### Verfügbare Methoden (Auszug):
|
|
||||||
|
|
||||||
| Endpunkt | Zweck / Datenquelle |
|
|
||||||
| --------------------------- | ------------------------------------------ |
|
|
||||||
| `CablesStatic` | Liste aller Stränge |
|
|
||||||
| `GetIconsStatic` | Liste aller Icons |
|
|
||||||
| `GisLinesStatus` | Liste aller Statis der Linien |
|
|
||||||
| `GisStationsMeasurements` | Liste aller Messungen der Geräte |
|
|
||||||
| `GisStationsStaticDistrict` | Liste aller Geraete einer bestimmten Karte |
|
|
||||||
| `GisStationsStatusDistrict` | Liste aller Statis der Geräte |
|
|
||||||
| `GisSystemStatic` | Liste aller angezeigten Systeme |
|
|
||||||
|
|
||||||
Die Webservices liefern meist JSON und werden im Frontend über `services/*.js` abgefragt.
|
|
||||||
Die Daten werden verarbeitet, zwischengespeichert und z. T. über Redux oder Recoil in der Karte dargestellt.
|
|
||||||
|
|
||||||
➡ Damit alles funktioniert, müssen:
|
|
||||||
|
|
||||||
- der IIS laufen
|
|
||||||
- der `WebServiceMap.asmx` erreichbar sein
|
|
||||||
- die IP in `.env.local` korrekt gesetzt sein
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔁 🧳 Standard-Deployment-Ablauf auf dem Server
|
|
||||||
|
|
||||||
### Zielverzeichnis:
|
|
||||||
|
|
||||||
```
|
|
||||||
C:\inetpub\wwwroot/talas5/nodeMap
|
|
||||||
```
|
|
||||||
|
|
||||||
### Schritte:
|
|
||||||
|
|
||||||
1. **Build erstellen**
|
|
||||||
Führe `npm run build` in der Entwicklungsumgebung aus
|
|
||||||
|
|
||||||
2. **Build-Dateien sammeln**
|
|
||||||
Kopiere folgende Ordner/Dateien in einen neuen Ordner:
|
|
||||||
|
|
||||||
- `.next/`
|
|
||||||
- `node_modules/`
|
|
||||||
- `public/`
|
|
||||||
- `package.json`
|
|
||||||
- `.env.local`
|
|
||||||
|
|
||||||
3. **IP-Adresse aktualisieren**
|
|
||||||
Verwende „Find in Files“ in VSCode, um z. B. `10.10.0.13` durch neue Server-IP zu ersetzen
|
|
||||||
|
|
||||||
4. **ZIP erstellen**
|
|
||||||
Packe den Build-Ordner als ZIP (z. B. `nodeMap_V1.1.59.zip`)
|
|
||||||
|
|
||||||
5. **ZIP auf Server hochladen**
|
|
||||||
|
|
||||||
6. **ZIP entpacken auf dem Server**
|
|
||||||
z. B. nach: `C:\inetpub\wwwroot alas5
|
|
||||||
odeMap V1.1.59`
|
|
||||||
|
|
||||||
7. **Dienst beenden (falls aktiv)**
|
|
||||||
Beende `NodeMapService`, falls dieser noch `npm run dev` nutzt
|
|
||||||
|
|
||||||
8. **Backup vom alten nodeMap-Ordner erstellen**
|
|
||||||
Benenne z. B. um in `nodeMap_Alt_1.1.56`
|
|
||||||
|
|
||||||
9. **Neuen Ordner umbenennen → `nodeMap`**
|
|
||||||
|
|
||||||
10. **Wechsle in neuen Ordner**
|
|
||||||
|
|
||||||
```powershell
|
|
||||||
cd C:\inetpub\wwwroot/talas5/nodeMap
|
|
||||||
```
|
|
||||||
|
|
||||||
11. **App starten**
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm start
|
|
||||||
```
|
|
||||||
|
|
||||||
12. **Testen im Browser**
|
|
||||||
|
|
||||||
```url
|
|
||||||
http://10.10.0.13/talas5/MessagesMap/mapTypC.aspx?m=12&u=484
|
|
||||||
```
|
|
||||||
|
|
||||||
13. **(Zukunft)**: Windows-Dienst `NodeMapService` auf `npm start` anpassen
|
|
||||||
@@ -2,5 +2,5 @@
|
|||||||
cd 'C:\inetpub\wwwroot\talas5\nodeMap'
|
cd 'C:\inetpub\wwwroot\talas5\nodeMap'
|
||||||
|
|
||||||
# F<>hre den npm Befehl aus
|
# F<>hre den npm Befehl aus
|
||||||
npm run dev
|
npm start
|
||||||
|
|
||||||
|
|||||||
@@ -1,2 +1,2 @@
|
|||||||
// /config/appVersion
|
// /config/appVersion
|
||||||
export const APP_VERSION = "1.1.63";
|
export const APP_VERSION = "1.1.64";
|
||||||
|
|||||||
Reference in New Issue
Block a user