feat: zentrale API für json und jsmock + Diagramm-Doku aktualisiert
- Neue API /api/cpl/getDigitalOutputsHandler.ts implementiert (vereint json + jsmock) - fetchDigitalOutputsService.ts auf zentrale API umgestellt (weniger Code, klarere Struktur) - Nur production-Modus lädt weiterhin Skript /CPL?/CPL/SERVICE/digitalOutputs.js - README_digitalOutputs.md überarbeitet: - Diagrammtyp („flowchart“, Datenflussdiagramm) explizit benannt - API-Endpunkte konsolidiert dargestellt - CHANGELOG.md um neue API-Struktur und Dokumentationsänderung ergänzt
This commit is contained in:
@@ -1,99 +0,0 @@
|
||||
# 📦 Datenverarbeitung in CPL: JSON, jsmock, production
|
||||
|
||||
Dieses Dokument beschreibt die Architektur zur Verarbeitung von Digitalausgängen (DA) im CPL-System unter verschiedenen Modi.
|
||||
|
||||
## ✅ Unterstützte Modi
|
||||
|
||||
- `json` – Entwicklung mit lokalen Mock-JSON-Dateien (editierbar)
|
||||
- `jsmock` – Simulation des Geräts mit einer JS-Datei, die `window`-Variablen setzt
|
||||
- `production` – Echte CPL-Hardware mit CGI-Platzhaltern (JS in HTML/JS-Dateien)
|
||||
|
||||
---
|
||||
|
||||
## 🧩 Datenfluss-Überblick (UML Diagramm)
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
A[NEXT_PUBLIC_CPL_MODE] --> B{Modus}
|
||||
|
||||
B -->|json| C[API: fetchDigitalOutputsAPIHandler]
|
||||
C --> D[JSON-Datei (editable)]
|
||||
|
||||
B -->|jsmock| E[fetchDigitalOutputsService()]
|
||||
E --> F[<script> digitalOutputsMockData.js]
|
||||
F --> G[window.win_da_state / bezeichnung]
|
||||
|
||||
B -->|production| H[fetchDigitalOutputsService()]
|
||||
H --> I[<script> /CPL/digitalOutputs.js]
|
||||
I --> J[window.win_da_state / bezeichnung]
|
||||
|
||||
D & G & J --> K[Redux Store / Slice]
|
||||
K --> L[Redux Selector]
|
||||
L --> M[UI: DigitalOutputsWidget.tsx]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🧠 Entscheidungshilfe
|
||||
|
||||
| Modus | Quelle | Vorteil | Änderbar |
|
||||
| ------------ | ------------------------------------------ | ---------------------------- | -------------- |
|
||||
| `json` | `/mocks/api/SERVICE/*.json` | Schnell editierbar & testbar | ✅ Ja |
|
||||
| `jsmock` | `/mocks/device-cgi-simulator/SERVICE/*.js` | Realistische Simulation | ❌ Nur per API |
|
||||
| `production` | `/public/CPL/*.js` | Reale Gerätedaten | ❌ Nein |
|
||||
|
||||
---
|
||||
|
||||
## 🔁 Aktualisierung der Daten
|
||||
|
||||
### json
|
||||
|
||||
- ✅ `POST /api/cpl/updateDigitalOutputsHandler`
|
||||
- 📂 Schreibt direkt in JSON-Datei (z. B. `digitaleAusgaengeMockData.json`)
|
||||
|
||||
### jsmock
|
||||
|
||||
- ✅ `GET /api/fake-cpl/updateDigitalOutputsHandler?id=3&value=1`
|
||||
- ✍️ Ändert `.js` Datei per Regex und überschreibt `win_da_state = [...]`
|
||||
|
||||
### production
|
||||
|
||||
- ❌ Gerät entscheidet – nur lesender Zugriff über `<script>`
|
||||
- ⚙️ Änderung über CGI-URL z. B. `/digitalOutputs.html?OUT3=1`
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Tipps
|
||||
|
||||
- Verwende `setInterval()` bei `jsmock` oder `production`, um regelmäßig `<script>` neu zu laden
|
||||
- Bei `json`: nutze Redux-Thunk + Service → API → JSON
|
||||
- `fetchDigitalOutputsService.ts` kapselt alle Unterschiede sauber ab
|
||||
|
||||
---
|
||||
|
||||
## 📁 Verzeichnisse
|
||||
|
||||
```
|
||||
/mocks/api/SERVICE/ # JSON-Dateien
|
||||
/public/CPLmockData/SERVICE/ # jsmock-Skripte
|
||||
/public/CPL/SERVICE/ # Geräteplatzhalter
|
||||
/pages/api/fake-cpl/ # GET/UPDATE API für jsmock
|
||||
/pages/api/cpl/ # JSON- und Gerätelogik
|
||||
/store/digitalOutputs/ # Redux-Slice & Thunk
|
||||
```
|
||||
|
||||
## 🧩 Redux-Flow Übersicht (Mermaid)
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
A[Component: DigitalOutputsWidget] --> B[useEffect]
|
||||
B --> C[dispatch fetchDigitalOutputsThunk]
|
||||
C --> D[fetchDigitalOutputsService]
|
||||
D --> E{Moduswahl}
|
||||
E -->|json| F[API: /api/cpl/fetchDigitalOutputsAPIHandler]
|
||||
E -->|jsmock| G[<script> digitalOutputsMockData.js]
|
||||
E -->|production| H[<script> /CPL/digitalOutputs.js]
|
||||
|
||||
F & G & H --> I[Reducer: digitalOutputsSlice]
|
||||
I --> J[useSelector] --> A
|
||||
```
|
||||
@@ -8,7 +8,9 @@ Dieses Dokument beschreibt die Architektur und Datenflüsse für das **Lesen** u
|
||||
|
||||
---
|
||||
|
||||
## 🔁 Lesen der digitalen Ausgänge
|
||||
## 🔁 flowchart: Lesen der digitalen Ausgänge
|
||||
|
||||
<!-- flowchart (Typ: Datenflussdiagramm) oder Allgemein Ablaufsdiagramm -->
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
@@ -17,22 +19,21 @@ flowchart TD
|
||||
C --> D[fetchDigitalOutputsService]
|
||||
D --> E{Moduswahl: NEXT_PUBLIC_CPL_MODE}
|
||||
|
||||
E -->|json| F1[GET /api/cpl/fetchDigitalOutputsHandler.ts]
|
||||
F1 --> F2[digitalOutputsMockData.json]
|
||||
E -->|json oder jsmock| F[GET /api/cpl/getDigitalOutputsHandler.ts]
|
||||
F --> G[JSON oder geparste JS-Datei]
|
||||
|
||||
E -->|jsmock| G1[GET /api/fake-cpl/fetchDigitalOutputsDeviceMockHandler]
|
||||
G1 --> G2[digitalOutputsMockData.js → window.win_da_state]
|
||||
E -->|production| H[loadScript '/CPL?/CPL/SERVICE/digitalOutputs.js']
|
||||
H --> I[Platzhalter-basierte win_da_state]
|
||||
|
||||
E -->|production| H1[loadScript '/CPL?/CPL/SERVICE/digitalOutputs.js']
|
||||
H1 --> H2[Platzhalter-basierte win_da_state]
|
||||
|
||||
F2 & G2 & H2 --> I[Redux: digitalOutputsSlice]
|
||||
I --> J[useSelector] --> A
|
||||
G & I --> J[Redux: digitalOutputsSlice]
|
||||
J --> K[useSelector] --> A
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ✍️ Updaten der digitalen Ausgänge
|
||||
## ✍️ flowchart: Updaten der digitalen Ausgänge
|
||||
|
||||
<!-- flowchart (Typ: Datenflussdiagramm) oder Allgemein Ablaufsdiagramm -->
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
@@ -51,12 +52,11 @@ flowchart TD
|
||||
|
||||
## 🌐 API-Endpunkte
|
||||
|
||||
| Route | Methode | Modus | Funktion |
|
||||
| ------------------------------------------------------- | -------- | ------------- | ----------------------------- |
|
||||
| `/api/cpl/fetchDigitalOutputsHandler.ts` | `GET` | `json` | Liest JSON-Datei |
|
||||
| `/api/fake-cpl/fetchDigitalOutputsDeviceMockHandler.ts` | `GET` | `jsmock` | Liest Mock-JS-Datei |
|
||||
| `/CPL?/CPL/SERVICE/digitalOutputs.js` | `SCRIPT` | `production` | Liefert Platzhalter vom Gerät |
|
||||
| `/api/cpl/updateDigitalOutputsHandler.ts` | `POST` | `json/jsmock` | Speichert Statusänderung |
|
||||
| Route | Methode | Modus | Funktion |
|
||||
| ----------------------------------------- | -------- | ---------------- | ------------------------------ |
|
||||
| `/api/cpl/getDigitalOutputsHandler.ts` | `GET` | `json`, `jsmock` | Liest JSON-Datei oder JS-Datei |
|
||||
| `/CPL?/CPL/SERVICE/digitalOutputs.js` | `SCRIPT` | `production` | Liefert Platzhalter vom Gerät |
|
||||
| `/api/cpl/updateDigitalOutputsHandler.ts` | `POST` | `json`, `jsmock` | Speichert Statusänderung |
|
||||
|
||||
---
|
||||
|
||||
@@ -77,8 +77,7 @@ flowchart TD
|
||||
/mocks/api/SERVICE/ → JSON-Dateien
|
||||
/mocks/device-cgi-simulator/SERVICE/→ jsmock: digitalOutputsMockData.js
|
||||
/public/CPL/SERVICE/ → production: digitalOutputs.js
|
||||
/pages/api/cpl/ → JSON-/Update-Handler
|
||||
/pages/api/fake-cpl/ → jsmock-API-Handler
|
||||
/pages/api/cpl/ → GET/POST-Handler für json + jsmock
|
||||
/components/main/einausgaenge/ → UI-Komponente: DigitalOutputsWidget.tsx
|
||||
```
|
||||
|
||||
@@ -88,4 +87,5 @@ flowchart TD
|
||||
|
||||
- [x] Lesen funktioniert in allen Modi
|
||||
- [x] Schreiben funktioniert in allen Modi (production nur über Redirect)
|
||||
- [x] json + jsmock verwenden jetzt denselben API-Handler
|
||||
- [x] Redux-Integration ist vollständig
|
||||
|
||||
Reference in New Issue
Block a user