40 lines
1.1 KiB
Markdown
40 lines
1.1 KiB
Markdown
# analogInputsHistoryReduxFlow.md
|
|
|
|
## Flussdiagramm: Redux-Datenfluss der historischen analogen Eingänge
|
|
|
|
```mermaid
|
|
flowchart TD
|
|
|
|
Component["React-Komponente: AnalogInputsChart"] --> DispatchThunk["dispatch → fetchAnalogInputsHistoryThunk"]
|
|
DispatchThunk --> ThunkLogik["Thunk-Logik"]
|
|
ThunkLogik --> fetchService["fetchAnalogInputsHistoryService"]
|
|
|
|
fetchService -->|DEV| APIHandler["/api/cpl/fetchAnalogInputsHistory"]
|
|
fetchService -->|PROD| CPLWebserver["CPL: DIA0-Endpunkt"]
|
|
|
|
APIHandler --> DatenMock["Mockdaten geladen"]
|
|
CPLWebserver --> DatenLive["Live-Daten geladen"]
|
|
|
|
DatenMock --> Fulfilled["fulfilled → Redux aktualisieren"]
|
|
DatenLive --> Fulfilled["fulfilled → Redux aktualisieren"]
|
|
|
|
Fulfilled --> Slice["analogInputsHistorySlice speichert"]
|
|
Slice --> Update["Chart.js aktualisiert sich"]
|
|
|
|
|
|
```
|
|
|
|
---
|
|
|
|
## Erklärung:
|
|
|
|
- Die Komponente dispatcht den Thunk beim Laden.
|
|
- Der Service entscheidet, ob Mock-Daten oder Live-Daten geholt werden.
|
|
- Das Redux-Slice speichert die Daten zentral im State.
|
|
- Sobald die Daten da sind, aktualisiert sich das Chart automatisch.
|
|
|
|
---
|
|
|
|
**Stand:** 29.04.2025
|
|
**Projekt:** CPLv4.0 Weboberfläche
|