feat: Zeitraum einstellbar in AnalogInputsChart mit Zoom- und Pan-Funktion umgesetzt

This commit is contained in:
ISA
2025-06-25 13:48:14 +02:00
parent 2fcd0755a4
commit 53c2a02224
13 changed files with 291 additions and 14 deletions

View File

@@ -0,0 +1,52 @@
<!-- /docs/components/main/analogInputs/AnalogInputsTable.md -->
# 🧮 AnalogInputsTable
Die Komponente `AnalogInputsTable` zeigt eine Tabelle mit allen verfügbaren analogen Eingängen an, einschließlich Messwert, Einheit und Bezeichnung.
---
## ⚙️ Funktion
- Ruft beim Laden die Liste der analogen Eingänge aus dem Redux-Store über `getAnalogInputsThunk()` ab.
- Zeigt alle Eingänge in einer Tabelle mit folgenden Spalten:
- Eingang (ID)
- Messwert
- Einheit
- Bezeichnung
- Aktion (Zahnrad-Icon zur Konfiguration)
---
## 🔄 Interaktion
- Beim Klick auf eine Tabellenzeile:
- Wird der Eingang als aktiv markiert (`activeId`)
- `setSelectedId` wird gesetzt → z.B. für Diagrammanzeige
- Beim Klick auf das ⚙️-Icon:
- `setSelectedInput` wird mit dem aktuellen Objekt befüllt
- Das Einstellungs-Modal (`AnalogInputsSettingsModal`) wird geöffnet
---
## 📦 Technologien
- `react-redux` für Zustand und Datenabruf
- `@iconify/react` für Icons (z.B. `mdi/waveform`, `mdi/settings`)
- Tailwind CSS für Styling und Layout
- Typ `AnalogInput` zur Definition der Eingangsdatenstruktur
---
## 🧪 Besonderheiten
- `unit` ist optional wird als `"-"` angezeigt, wenn nicht vorhanden
- Die Auswahlfarbe der Zeile (hellblau) zeigt den aktiven Eingang an
- Mobilfreundlich durch `overflow-x-auto` und responsives Tailwind-Layout
---
## 🔍 Hinweise
- Die `label`-, `value`- und `unit`-Werte stammen direkt aus dem Redux-State `analogInputs`
- Eingänge ohne `id` oder `label` werden gefiltert