docs: Diagramme für historische analoge Eingänge hinzugefügt
- Ablaufdiagramm analogInputsHistoryFlow.md erstellt - Redux-Datenfluss analogInputsHistoryReduxFlow.md dokumentiert - Sequenzdiagramm analogInputsHistorySequence.md erstellt - Mermaid-Syntax verwendet für einheitliche Entwicklerdokumentation
This commit is contained in:
@@ -0,0 +1,39 @@
|
||||
# analogInputsHistorySequence.md
|
||||
|
||||
## Sequenzdiagramm: Historische analoge Eingänge laden und darstellen
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
|
||||
User->>+ReactComponent: Seite "/analogeEingaenge" wird geladen
|
||||
ReactComponent->>+ReduxDispatch: dispatch(fetchAnalogInputsHistoryThunk())
|
||||
ReduxDispatch->>+Thunk: fetchAnalogInputsHistoryThunk
|
||||
Thunk->>+Service: fetchAnalogInputsHistoryService
|
||||
|
||||
alt Entwicklungsumgebung
|
||||
Service->>+APIHandler: /api/cpl/fetchAnalogInputsHistory
|
||||
APIHandler-->>Service: JSON-Mock-Daten
|
||||
else Produktionsumgebung
|
||||
Service->>+CPLWebserver: /CPL?Service/empty.acp&DIA0
|
||||
CPLWebserver-->>Service: JSON-Live-Daten
|
||||
end
|
||||
|
||||
Service-->>Thunk: Ergebnis-Daten
|
||||
Thunk-->>ReduxStore: fulfilled action (analogInputsHistorySlice)
|
||||
ReduxStore-->>ReactComponent: neue State-Daten verfügbar
|
||||
ReactComponent-->>Chart.js: aktualisierte Daten zeichnen
|
||||
Chart.js-->>User: Anzeige von 8 Eingängen, einzeln ein-/ausblendbar
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Erklärung:
|
||||
|
||||
- Unterschiedliche Datenquellen je nach Umgebung (DEV oder PROD)
|
||||
- Redux verwaltet den Zwischenstand über Slice + Thunk
|
||||
- UI aktualisiert sich automatisch nach erfolgreichem Laden
|
||||
|
||||
---
|
||||
|
||||
**Stand:** 29.04.2025
|
||||
**Projekt:** CPLv4.0 Weboberfläche
|
||||
Reference in New Issue
Block a user