docsForDev update
This commit is contained in:
Ismail Ali
@@ -1,102 +1,75 @@
|
||||
# ⚡ CPLv4.0 – Frontend für das Kabelüberwachungssystem
|
||||
# 📚 Entwicklerdokumentation für CPLv4.0 Frontend
|
||||
|
||||
Das Frontend von CPLv4.0 stellt verschiedene Systeminformationen, Messdaten und Konfigurationen übersichtlich dar.
|
||||
Die Benutzeroberfläche ist intuitiv und modular aufgebaut und bietet Zugriff auf digitale sowie analoge Ein-/Ausgänge, TDR-Messungen, Referenzkurven, Systemmeldungen und Einstellungen.
|
||||
Willkommen zur technischen Dokumentation des CPLv4.0 Frontends.
|
||||
Dieses Verzeichnis enthält alle Details zur Architektur, zu den Datenflüssen, zum Redux-Management und zu den verwendeten APIs.
|
||||
|
||||
---
|
||||
|
||||
## 🧭 Seitenübersicht
|
||||
## 📆 Übersicht
|
||||
|
||||
### 🔹 **Header**
|
||||
Dieses Dokument erklärt die technische Struktur und den Ablauf des Projekts für Entwickler. Es dient als Einstiegspunkt für die detaillierte Dokumentation in den jeweiligen Unterordnern.
|
||||
|
||||
- Zeigt den Namen der Station / des Geräts (CPL)
|
||||
- Abmelden-Button für Admins
|
||||
|
||||
### 🔹 **Footer**
|
||||
|
||||
- Firmenname, Telefonnummer, E-Mail
|
||||
- PDF-Handbücher (Anleitung) als Slider mit Download-Funktion
|
||||
- **Architektur**: Aufbau des Systems und der Hauptkomponenten
|
||||
- **Datenflüsse**: Flowcharts und Sequenzdiagramme wichtiger Abläufe
|
||||
- **Redux**: State-Management über Slices und Thunks
|
||||
- **APIs**: Beschreibung der genutzten API-Endpunkte
|
||||
- **Deployment**: Schritte für Build und Veröffentlichung auf CPL
|
||||
- **Glossar**: Erklärung wichtiger technischer Begriffe
|
||||
|
||||
---
|
||||
|
||||
### 🖥️ **/dashboard** – Übersicht
|
||||
## 📂 Verzeichnisstruktur
|
||||
|
||||
- Letzten 20 Meldungen aus dem System
|
||||
- Versionsinformationen (Frontend, Backend)
|
||||
- Baugruppenträger mit Modulnamen und Statusanzeige (grün = OK, rot = Fehler)
|
||||
- Netzwerk-Informationen:
|
||||
- IP-Adresse
|
||||
- Subnetzmaske
|
||||
- Gateway
|
||||
- OPC UA Status (in Betrieb oder offline)
|
||||
- OPC UA Nodeset Name
|
||||
|
||||
---
|
||||
|
||||
### 📡 **/kabelueberwachung** – Kabelüberwachung
|
||||
|
||||
- Visualisierung der Slots (KUE 1–32) in 4 Racks
|
||||
- Darstellung von:
|
||||
- Isolationswiderstand
|
||||
- Schleifenwiderstand
|
||||
- TDR-Messkurven und Vergleich mit Referenzkurve
|
||||
- Alarme (z. B. Erdschluss, Aderbruch)
|
||||
- Einstellung pro Slot (via Zahnrad → Modal)
|
||||
|
||||
---
|
||||
|
||||
### 🔌 **/einausgaenge** – Digitale Ein- und Ausgänge
|
||||
|
||||
- Digitale Eingänge (1–32) mit Statusanzeige
|
||||
- Digitale Ausgänge (1–4) mit Umschaltfunktion (Toggle)
|
||||
- Modale für Beschreibung und Konfiguration
|
||||
|
||||
---
|
||||
|
||||
### 🌡️ **/analogeEingaenge**
|
||||
|
||||
- Tabelle mit analogen Eingangswerten (z. B. Temperatur, Spannung)
|
||||
- Diagramm zur Visualisierung von Verlauf / Trends
|
||||
|
||||
---
|
||||
|
||||
### 📝 **/meldungen**
|
||||
|
||||
- Gesamte Meldungshistorie
|
||||
- Anzeige von Statusfarbe, Zeit, Gewichtung, Nachricht, Quelle
|
||||
- Pagination (10 Meldungen pro Seite)
|
||||
|
||||
---
|
||||
|
||||
### ⚙️ **/einstellungen**
|
||||
|
||||
- Allgemeine Systemeinstellungen
|
||||
- OPC UA Konfiguration
|
||||
- Benutzer, Verschlüsselung, Clients
|
||||
- Verbindung & Nodeset-Verwaltung
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Technologien
|
||||
|
||||
- **Next.js** (Pages Router)
|
||||
- **React** (mit funktionalen Komponenten & Hooks)
|
||||
- **Tailwind CSS** für responsives UI-Design
|
||||
- **Redux Toolkit** zur Zustandverwaltung
|
||||
- **Mockdaten** im Verzeichnis `public/CPLmockData/`
|
||||
- **Iconify Icons** & **Bootstrap Icons** für UI-Darstellung
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Installation auf dem CPLv4.0
|
||||
|
||||
```bash
|
||||
git clone http://10.10.0.12:3000/ISA/CPL_V4_Frontend
|
||||
cd cplv4-frontend
|
||||
npm install
|
||||
npm run build
|
||||
|
||||
Danach:
|
||||
Inhalt des out-Verzeichnisses per FTP auf das CPL-Gerät kopieren
|
||||
Ziel: B → WEBS Verzeichnis
|
||||
```plaintext
|
||||
/docsForDev/
|
||||
├── Architektur/
|
||||
│ ├── ArchitekturUebersicht.md
|
||||
│ └── KomponentenDiagramm.md
|
||||
├── Datenflüsse/
|
||||
│ ├── SystemVoltTempFlow.md
|
||||
│ ├── TDRSequenz.md
|
||||
│ └── MeldungenFlow.md
|
||||
├── Redux/
|
||||
│ ├── ReduxStateUebersicht.md
|
||||
│ └── WichtigeThunks.md
|
||||
├── APIs/
|
||||
│ ├── SystemAPI.md
|
||||
│ └── KabelueberwachungAPI.md
|
||||
├── Deployment/
|
||||
│ └── DeploymentCPL.md
|
||||
├── Glossar/
|
||||
│ └── Begriffe.md
|
||||
└── README.md # Diese Datei
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Inhalte
|
||||
|
||||
- **Technische Zusammenhänge** zwischen Frontend, Backend und Embedded-System
|
||||
- **Redux-Slices** und **Thunks** im Detail beschrieben
|
||||
- **Flowcharts und Sequenzdiagramme** zur Veranschaulichung der Abläufe
|
||||
- **API-Dokumentation** für Datenabrufe und Systembefehle
|
||||
- **Mock-Daten-Strategie** für Entwicklung ohne Hardware
|
||||
- **Deployment-Anleitung** für CPL ("out"-Verzeichnis Upload)
|
||||
|
||||
---
|
||||
|
||||
## 💬 Hinweise für Entwickler
|
||||
|
||||
- Neue Redux-Slices oder Thunks bitte hier in den passenden Dateien dokumentieren.
|
||||
- Anpassungen an Komponenten oder APIs sollten mit neuen Diagrammen oder Updates versehen werden.
|
||||
- Mock-Daten sollten beschrieben werden, wenn neue Felder hinzukommen.
|
||||
- Deployment-Anweisungen aktualisieren, falls sich der Ablauf ändert.
|
||||
|
||||
---
|
||||
|
||||
## 📣 Ziel
|
||||
|
||||
Eine klare, aktuelle und wartbare technische Dokumentation für das gesamte CPLv4.0 Frontend Projekt, die sowohl neue als auch bestehende Entwickler effektiv unterstützt.
|
||||
|
||||
---
|
||||
|
||||
## 👨💼 Kontakt
|
||||
|
||||
Bei Fragen oder Unklarheiten zur Dokumentation bitte an das CPLv4.0 Entwicklungsteam wenden.
|
||||
|
||||
Reference in New Issue
Block a user