# Template-Backend-Zuordnung - MYP System

**Erstellt:** 2025-06-20  
**Version:** 1.0  
**System:** MYP (Manage Your Printers) - Mercedes-Benz TBA Marienfelde

## Überblick

Diese Dokumentation zeigt die vollständige Zuordnung zwischen HTML-Templates und Python-Backend-Verantwortlichkeiten im MYP-System. Das System verwendet eine moderne Flask-Blueprint-Architektur mit 15 Blueprint-Modulen und einer Hybrid-Struktur aus Server-Side-Rendering und JSON-APIs.

---

## Template-Kategorien

### 1. Hauptanwendung Templates

#### **dashboard.html**
- **Backend:** `app.py` → `dashboard()` Route
- **URL:** `/dashboard`
- **Berechtigungen:** `@login_required`
- **Variablen:** Basis-Template-Variablen
- **Zweck:** Haupt-Dashboard nach Login

#### **base.html**
- **Backend:** Template-Basis für alle anderen Templates
- **Variablen:** Globale Template-Variablen (production_mode, current_user, etc.)
- **Zweck:** Layout-Template mit Navigation

---

### 2. Authentifizierung

#### **login.html**
- **Backend:** `blueprints/auth.py` → `login()`
- **URL:** `/auth/login`
- **HTTP-Methoden:** GET, POST
- **Berechtigungen:** Öffentlich
- **Variablen:** 
  ```python
  {
    'error': str,  # Fehlermeldung bei Login-Fehlschlag
    'form': LoginForm  # WTForms-Instanz
  }
  ```
- **Zweck:** Benutzer-Anmeldung mit Formular-Validierung

---

### 3. Administrative Verwaltung

#### **admin.html**
- **Backend:** `blueprints/admin_unified.py` → Verschiedene Funktionen
- **URL-Muster:** `/admin`, `/admin/users`, `/admin/printers`, `/admin/logs`, `/admin/system`, `/admin/maintenance`
- **Berechtigungen:** `@admin_required`
- **Variablen:** 
  ```python
  {
    'active_tab': str,  # 'overview', 'users', 'printers', 'logs', 'system', 'maintenance'
    'users': list,      # Liste aller Benutzer (nur bei users-Tab)
    'printers': list,   # Liste aller Drucker (nur bei printers-Tab)
    'logs': list,       # System-Logs (nur bei logs-Tab)
    'stats': dict       # System-Statistiken
  }
  ```
- **Backend-Funktionen:**
  - `admin_overview()` - Hauptübersicht
  - `users_overview()` - Benutzerverwaltung
  - `printers_overview()` - Druckerverwaltung
  - `logs_overview()` - Log-Anzeige
  - `system_health()` - System-Informationen
  - `maintenance()` - Wartungsfunktionen

#### **admin_*.html** (Legacy-Templates)
Diese Templates werden teilweise noch verwendet, aber zunehmend durch das vereinheitlichte `admin.html` ersetzt:
- `admin_guest_requests.html`
- `admin_add_user.html`
- `admin_edit_user.html`
- `admin_add_printer.html`
- `admin_edit_printer.html`
- Weitere administrative Templates

---

### 4. Gast-System

#### **guest_request.html**
- **Backend:** `blueprints/guest.py` → `guest_request_form()`
- **URL:** `/request`
- **HTTP-Methoden:** GET, POST
- **Berechtigungen:** Öffentlich
- **Variablen:**
  ```python
  {
    'form': GuestRequestForm,  # WTForms für Gastanfrage
    'printers': list           # Verfügbare Drucker
  }
  ```

#### **guest_start_job.html**
- **Backend:** `blueprints/guest.py` → `guest_start_public()`
- **URL:** `/start`
- **Berechtigungen:** Öffentlich
- **Zweck:** Job-Start für Gäste mit OTP

#### **guest_job_status.html**
- **Backend:** `blueprints/guest.py` → `guest_job_status()`
- **URL:** `/job/<int:job_id>/status`
- **Variablen:**
  ```python
  {
    'job': Job,                    # Job-Objekt
    'guest_request': GuestRequest  # Gastanfrage-Objekt
  }
  ```

#### **guest_status.html**
- **Backend:** `blueprints/guest.py` → `guest_request_status()`
- **URL:** `/request/<int:request_id>`
- **Variablen:**
  ```python
  {
    'request': GuestRequest,  # Gastanfrage
    'job': Job,              # Zugehöriger Job
    'otp_code': str,         # OTP-Code für Job-Start
    'show_start_link': bool  # Ob Start-Link angezeigt werden soll
  }
  ```

#### Weitere Gast-Templates:
- `guest_requests_overview.html` - Übersicht aller Gastanfragen
- `guest_requests_by_email.html` - Anfragen nach E-Mail filtern
- `guest_status_check.html` - Status-Prüfung für Gäste

---

### 5. Kalender-System

#### **calendar.html**
- **Backend:** `blueprints/calendar.py` → `calendar_view()`
- **URL:** `/calendar`
- **Berechtigungen:** `@login_required`
- **Variablen:**
  ```python
  {
    'printers': list,   # Verfügbare Drucker
    'can_edit': bool    # Benutzer-Berechtigung zum Bearbeiten
  }
  ```
- **JavaScript-Integration:** FullCalendar.js
- **API-Backend:** Umfangreiche Calendar-API-Endpunkte für CRUD-Operationen

---

### 6. Benutzerverwaltung

#### **profile.html**
- **Backend:** `blueprints/user_management.py` → `user_profile()`
- **URL:** `/user/profile`
- **Berechtigungen:** `@login_required`
- **Variablen:**
  ```python
  {
    'user': User  # Aktueller Benutzer mit allen Profildaten
  }
  ```

#### **settings.html**
- **Backend:** `blueprints/user_management.py` → `user_settings()`
- **URL:** `/user/settings`
- **Berechtigungen:** `@login_required`
- **Variablen:**
  ```python
  {
    'user': User  # Benutzer-Einstellungen und Präferenzen
  }
  ```

---

### 7. Hardware-Steuerung

#### **tapo_control.html**
- **Backend:** `blueprints/tapo_control.py` → `tapo_dashboard()`
- **URL:** `/tapo/`
- **Berechtigungen:** `@require_permission(Permission.CONTROL_PRINTER)`
- **Variablen:**
  ```python
  {
    'outlets': dict,         # Steckdosen-Status
    'total_outlets': int,    # Gesamtanzahl Steckdosen
    'online_outlets': int,   # Online-Steckdosen
    'fixed_layout': bool     # Layout-Modus
  }
  ```

#### **tapo_manual_control.html**
- **Backend:** `blueprints/tapo_control.py` → `manual_control()`
- **URL:** `/tapo/manual-control`
- **Berechtigungen:** `@admin_required`
- **HTTP-Methoden:** GET, POST
- **Zweck:** Manuelle Steckdosen-Steuerung für Administratoren

#### **drucker_steuerung.html**
- **Backend:** `blueprints/drucker_steuerung.py` → `drucker_uebersicht()`
- **URL:** `/drucker/`
- **Berechtigungen:** `@login_required`
- **Variablen:**
  ```python
  {
    'drucker': list,              # Drucker-Liste
    'stats': dict,                # Statistiken
    'system_status': str,         # System-Status
    'seiten_titel': str,          # Seitentitel
    'benutzer_kann_steuern': bool,# Steuerungs-Berechtigung
    'letztes_update': str,        # Letztes Update
    'refresh_url': str            # Refresh-URL
  }
  ```

#### **drucker_details.html**
- **Backend:** `blueprints/drucker_steuerung.py` → `drucker_details()`
- **URL:** `/drucker/details/<int:drucker_id>`
- **Variablen:**
  ```python
  {
    'drucker': dict,           # Drucker-Details
    'stats': dict,             # Drucker-Statistiken
    'seiten_titel': str,       # Seitentitel
    'steuerungs_urls': dict,   # Steuerungs-URLs
    'detail_daten': dict       # Detail-Informationen
  }
  ```

---

### 8. Energiemonitoring

#### **energy_dashboard.html**
- **Backend:** `blueprints/energy_monitoring.py` → `energy_dashboard()`
- **URL:** `/energy/`
- **Berechtigungen:** `@login_required`
- **Variablen:**
  ```python
  {
    'stats': dict,           # Energiestatistiken
    'current_user': User,    # Aktueller Benutzer
    'page_title': str        # Seitentitel
  }
  ```

#### **energy_device_details.html**
- **Backend:** `blueprints/energy_monitoring.py` → `device_details()`
- **URL:** `/energy/device/<int:device_id>`
- **Variablen:**
  ```python
  {
    'device': Printer,       # Gerät (Drucker)
    'energy_data': dict,     # Energiedaten
    'current_user': User,    # Aktueller Benutzer
    'page_title': str        # Seitentitel
  }
  ```

---

### 9. Rechtliche Seiten

#### **imprint.html**
- **Backend:** `blueprints/legal_pages.py` → `imprint()`
- **URL:** `/impressum`
- **Variablen:** `{'title': 'Impressum'}`

#### **privacy.html**
- **Backend:** `blueprints/legal_pages.py` → `privacy()`
- **URL:** `/datenschutz`
- **Variablen:** `{'title': 'Datenschutzerklärung'}`

#### **terms.html**
- **Backend:** `blueprints/legal_pages.py` → `terms()`
- **URL:** `/nutzungsbedingungen`
- **Variablen:** `{'title': 'Nutzungsbedingungen'}`

#### **legal.html**
- **Backend:** `blueprints/legal_pages.py` → `legal()`
- **URL:** `/rechtliches`
- **Variablen:** `{'title': 'Rechtliche Hinweise'}`

#### **system_info.html**
- **Backend:** `blueprints/legal_pages.py` → `system_info()`
- **URL:** `/system-info`
- **Variablen:**
  ```python
  {
    'title': 'Systeminformationen',
    'system': dict  # System-Informationen
  }
  ```

---

### 10. Fehlerseiten

#### **errors/*.html**
- **Backend:** `app.py` → Verschiedene Error-Handler
- **Templates:**
  - `errors/400.html` - Bad Request
  - `errors/401.html` - Unauthorized  
  - `errors/403.html` - Forbidden
  - `errors/404.html` - Not Found
  - `errors/405.html` - Method Not Allowed
  - `errors/413.html` - Payload Too Large
  - `errors/429.html` - Rate Limit Exceeded
  - `errors/500.html` - Internal Server Error
  - `errors/502.html` - Bad Gateway
  - `errors/503.html` - Service Unavailable
  - `errors/505.html` - HTTP Version Not Supported

---

## API-Only Blueprints (Kein HTML-Rendering)

Diese Blueprints verwenden **ausschließlich JSON-APIs** ohne HTML-Templates:

### **printers.py**
- **URL-Prefix:** `/api/printers`
- **Endpunkte:** Drucker-CRUD, Status-Monitoring, Tapo-Integration
- **Berechtigungen:** Verschiedene Permissions

### **jobs.py**
- **URL-Prefix:** `/api/jobs`
- **Endpunkte:** Job-Management, Start/Pause/Resume/Finish
- **Berechtigungen:** `@login_required`, `@job_owner_required`

### **kiosk.py**
- **URL-Prefix:** `/api/kiosk`
- **Endpunkte:** Kiosk-Modus-Steuerung
- **Berechtigungen:** Teilweise `@login_required`

### **uploads.py**
- **URL-Prefix:** `/api`
- **Endpunkte:** Datei-Upload und -Management
- **Berechtigungen:** Verschiedene (`@login_required`, `@admin_required`)

### **sessions.py**
- **URL-Prefix:** `/api/session`
- **Endpunkte:** Session-Management (Heartbeat, Status, Extend)
- **Berechtigungen:** `@login_required`

### **api.py**
- **URL-Prefix:** `/api`
- **Endpunkte:** Allgemeine System-APIs (Stats, Health, Notifications)
- **Berechtigungen:** Verschiedene

---

## Template-Hierarchie

### **Base Templates:**
- `base.html` - Haupt-Layout mit Navigation
- `base-production.html` - Production-optimiertes Layout (falls verwendet)

### **Component Templates:**
- `includes/navbar.html` - Navigation
- `components/printer_status.html` - Drucker-Status-Komponente
- `macros/ui_components.html` - UI-Makros

### **Spezielle Templates:**
- `static/offline.html` - Offline-Seite für PWA
- `jobs/new.html` - Job-Erstellung (möglicherweise in Zukunft)

---

## Berechtigungssystem

### **Dekorator-Arten:**
1. `@login_required` - Standard-Anmeldung erforderlich
2. `@admin_required` - Administrator-Berechtigung
3. `@require_permission(Permission.*)` - Spezifische Berechtigung
4. `@job_owner_required` - Job-Besitzer-Berechtigung
5. `@approver_required` - Genehmiger-Berechtigung
6. `@users_admin_required` - Benutzer-Administrator

### **Permission-Konstanten:**
- `Permission.ADMIN` - Administrative Rechte
- `Permission.CONTROL_PRINTER` - Drucker-Steuerung
- `Permission.APPROVE_JOBS` - Job-Genehmigung
- Weitere spezifische Berechtigungen

---

## Datenfluss-Muster

### **Template-Rendering:**
1. **Route-Handler** in Blueprint erhält Request
2. **Datenbank-Abfrage** über SQLAlchemy-Models
3. **Berechtigungs-Prüfung** über Dekoratoren
4. **Template-Variablen** werden zusammengestellt
5. **render_template()** generiert HTML
6. **Response** wird an Client gesendet

### **API-Endpunkte:**
1. **Route-Handler** in Blueprint erhält Request
2. **JSON-Daten** aus Request extrahieren
3. **Geschäftslogik** ausführen
4. **jsonify()** generiert JSON-Response
5. **Response** wird an Client gesendet

---

## Entwicklungsrichtlinien

### **Template-Erstellung:**
1. Verwende `render_template()` mit sprechenden Template-Namen
2. Übergebe strukturierte Variablen-Dictionaries
3. Implementiere Fehlerbehandlung mit try-catch
4. Nutze Template-Vererbung über `base.html`
5. Dokumentiere Template-Variablen in Docstrings

### **API-Entwicklung:**
1. Verwende `jsonify()` für JSON-Responses
2. Implementiere einheitliche Error-Response-Struktur
3. Nutze HTTP-Status-Codes korrekt
4. Validiere Input-Daten mit WTForms oder Marshmallow
5. Logge API-Aufrufe für Debugging

### **Blueprint-Organisation:**
1. Ein Blueprint pro Funktionsbereich
2. Klare URL-Präfixe verwenden
3. Berechtigungen auf Blueprint-Ebene definieren
4. Getrennte API- und Template-Routen wenn sinnvoll
5. Dokumentiere Blueprint-Zweck in Docstring

---

## Zusammenfassung

Das MYP-System zeigt eine moderne Flask-Architektur mit:

- **25+ HTML-Templates** für Server-Side-Rendering
- **100+ API-Endpunkte** für dynamische Funktionalität
- **Hybrid-Architektur** zwischen Templates und APIs
- **Modulare Blueprint-Organisation** für Wartbarkeit
- **Konsistentes Berechtigungssystem** für Sicherheit
- **Klare Datenfluss-Muster** für Nachvollziehbarkeit

Die Dokumentation bietet Entwicklern eine vollständige Referenz für die Zuordnung zwischen Frontend-Templates und Backend-Logik im MYP-System.