# analogInputsHistoryFlow.md

## Ablaufdiagramm: Historische Daten der analogen Eingänge in Chart.js

```mermaid
flowchart TD

User["User öffnet Seite /analogeEingaenge"] --> ReduxDispatch["Thunk ausgelöst: fetchAnalogInputsHistoryThunk"]

ReduxDispatch --> Entwicklung["Entwicklungsumgebung"]
ReduxDispatch --> Produktion["Produktivumgebung"]

Entwicklung --> ApiHandler["/api/cpl/fetchAnalogInputsHistory"]
Produktion --> CPLWebserver["CPL: /CPL?Service/empty.acp&DIA0"]

ApiHandler --> MockData["Mockdaten analogInput1 bis 8"]
CPLWebserver --> LiveData["Live-Messdaten AE1 bis AE8"]

MockData --> ReduxStore["Slice speichert Daten"]
LiveData --> ReduxStore["Slice speichert Daten"]

ReduxStore --> Chart["Chart.js zeigt 8 Linien"]
Chart --> UserAction["Legende: Eingänge ein-/ausblenden"]
```

---

## Erklärung:

- In der Entwicklungsumgebung werden die Daten aus Mock-Dateien geladen.
- In der Produktion werden die realen Daten vom CPL-Webserver über CGI-Endpoints geladen.
- Chart.js zeigt alle 8 analogen Eingänge gleichzeitig an, Nutzer kann über die Legende steuern.

---

**Stand:** 29.04.2025  
**Projekt:** CPLv4.0 Weboberfläche