UML Dagramme Beispiele

docs/Diagramme/classDiagram.md

@@ -0,0 +1,17 @@
+### 🟩 Datei: `classDiagram.md`
+
+```mermaid
+classDiagram
+  class User {
+    +String name
+    +int id
+    +login()
+  }
+
+  class Admin {
+    +String role
+  }
+
+  User <|-- Admin
+
+```

docs/Diagramme/erdiagramm.md

@@ -0,0 +1,21 @@
+### 🟩 Datei: `erdiagramm.md`
+
+```mermaid
+erDiagram
+  Kunden ||--o{ Bestellungen : hat
+  Bestellungen ||--|{ Artikel : enthält
+  Kunden {
+    string name
+    string adresse
+  }
+  Bestellungen {
+    int id
+    date datum
+  }
+  Artikel {
+    int artikel_id
+    string bezeichnung
+    float preis
+  }
+
+```

docs/Diagramme/flowchart-lr.md

@@ -0,0 +1,9 @@
+### 🟩 Datei: `flowchart-lr.md`
+
+```mermaid
+graph LR
+  A[Start] --> B[Bearbeiten]
+  B --> C[Speichern]
+  C --> D[Fertig]
+
+```

docs/Diagramme/flowchart-td.md

@@ -0,0 +1,9 @@
+### 🟩 Datei: `flowchart-td.md`
+
+```mermaid
+graph TD
+  Start --> Schritt1["Modul auswählen"]
+  Schritt1 --> Schritt2["Daten abrufen"]
+  Schritt2 --> Schritt3["Ergebnis anzeigen"]
+
+```

docs/Diagramme/ganttdiagramm.md

@@ -0,0 +1,12 @@
+### 🟩 Datei: `ganttdiagramm.md`
+
+```mermaid
+gantt
+  title Projektzeitplan CPLv4.0
+  dateFormat  YYYY-MM-DD
+  section Entwicklung
+  Planung           :done,    des1, 2024-09-01, 5d
+  Umsetzung         :active,  dev1, 2024-09-06, 10d
+  Tests             :         test, 2024-09-18, 7d
+
+```

docs/Diagramme/journeydiagramm.md

@@ -0,0 +1,16 @@
+### 🟩 Datei: `ganttdiagramm.md`
+
+```mermaid
+journey
+  title CPLv4.0 Benutzererlebnis
+  section Start
+    Öffnet Dashboard: 5: User
+    Erkennt Status: 4: User
+  section Konfiguration
+    Stellt Slot ein: 3: User
+    Speichert Referenzkurve: 4: User
+  section Analyse
+    Vergleicht Kurven: 4: User
+    Exportiert Ergebnisse: 2: User
+
+```

docs/Diagramme/redux-prozessdiagramm.md

@@ -1,5 +1,3 @@
----
-
 ### 🟩 Datei: `redux-prozessdiagramm.md`
 
 ```mermaid

docs/Diagramme/sequenzdiagramm.md

@@ -0,0 +1,16 @@
+### 🟩 Datei: `sequenzdiagramm.md`
+
+```mermaid
+sequenceDiagram
+  participant User
+  participant UI
+  participant Redux
+  participant API
+
+  User->>UI: Klick auf Modul
+  UI->>Redux: Dispatch Action
+  Redux->>API: API Request
+  API-->>Redux: Antwort
+  Redux->>UI: Update View
+
+```

docs/Diagramme/tdr-redux-struktur.md

@@ -1,11 +0,0 @@
-# 🧠 Redux-Datenstruktur für TDR und TDM
-
-```mermaid
-graph TD
-  SlotData["SlotData\n+ slotIndex\n+ tdrList[]"] --> TDRMeasurement["TDRMeasurement\n+ id\n+ t\n+ d\n+ p\n+ s\n+ a"]
-  fetchAllTDMData["fetchAllTDMData.ts"] --> TDMChartSlice["tdmChartSlice (Redux)\n+ data: SlotData[]"]
-  fetchTDRChartThunk["fetchTDRChartDataByIdThunk.ts"] --> TDRChartSlice["tdrChartDataByIdSlice (Redux)\n+ data: Record<id, TDRChartPoint[]>"]
-  fetchTDRChartThunk --> fetchTDRChartService["fetchTDRChartDataById.ts"]
-  kabelueberwachung["kabelueberwachung.tsx"] --> fetchAllTDMData
-  kabelueberwachung --> fetchTDRChartThunk
-```

docs/Diagramme/zustandsdiagramm.md

@@ -0,0 +1,11 @@
+### 🟩 Datei: `zustanddiagramm.md`
+
+```mermaid
+stateDiagram
+  [*] --> Offline
+  Offline --> Verbinde
+  Verbinde --> Online
+  Online --> Trennen
+  Trennen --> Offline
+
+```