Merge branch 'phase/008-laufzeiten-rechnungen'

Rechnungen mit Positionen: gleiche Nummer ergibt eine Sammelrechnung ueber mehrere
Laufzeiten. PDF-Upload mit Inhaltspruefung und Ablage unter der Pruefsumme,
Haekchen direkt in der Tabelle, Filter nach Status, Kunde und Jahr. 78 Tests.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

.env.example

@@ -12,5 +12,13 @@ ADMIN_PASSWORD="bitte-aendern"
 # Öffentlich erreichbare Adresse des Dashboards (für install.sh und E-Mails)
 APP_URL="http://localhost:3000"
 
+# Ablage für hochgeladene Rechnungs-PDFs
+UPLOAD_DIR="./data/uploads"
+
 # Demo-Daten beim Seed anlegen (1 = ja)
 SEED_DEMO="0"
+
+# Abgleich der Issue-Dateien mit dem Gitea-Tracker (npm run issues:sync)
+GITEA_URL="https://git.example.de"
+GITEA_REPO="benutzer/ProxLedger"
+GITEA_TOKEN=""

CHANGELOG.md

@@ -17,6 +17,41 @@ und dieses Projekt folgt [Semantic Versioning](https://semver.org/lang/de/).
 
 ### Sicherheit
 
+## [0.5.0] – 2026-09-17
+
+### Hinzugefügt
+- Laufzeit-Vorschläge der Agents bestätigen oder verwerfen (#008)
+- Proxmox- und Kundenrechnungen erfassen; gleiche Rechnungsnummer fasst mehrere Laufzeiten zu einer Sammelrechnung zusammen (#008)
+- PDF-Upload für beide Rechnungsarten mit Prüfung des Dateiinhalts und Ablage unter der Prüfsumme (#008)
+- Rechnungsübersicht mit Häkchen „bezahlt“ und „erstellt“ direkt in der Zeile, Filter nach Status, Kunde, Jahr und Suchbegriff (#008)
+- Detailseite je Laufzeit mit Beträgen, Marge und Übersicht der Sammelrechnung (#008)
+- Laufzeiten lassen sich von Hand anlegen (#008)
+
+### Geändert
+- Die Aufgabenliste auf dem Dashboard setzt beim Abhaken den Rechnungsstatus in der Datenbank (#008)
+
+## [0.4.2] – 2026-09-17
+
+### Geändert
+- Der Issue-Abgleich holt Serveradresse und Repository aus dem Git-Remote und den Token aus den hinterlegten Git-Zugangsdaten; ein zweiter Token in der `.env` ist nicht mehr nötig (#020)
+
+## [0.4.1] – 2026-09-17
+
+### Hinzugefügt
+- Abgleich der Issue-Dateien mit dem Gitea-Tracker über `npm run issues:sync`, inklusive Labels, Meilensteinen und Trockenlauf (#020)
+
+## [0.4.0] – 2026-09-17
+
+### Hinzugefügt
+- Host-Tabelle mit Suche über Hostname, FQDN, Key, Server-ID, IP, Kunde und Rechnungsnummer (#007)
+- Filter nach Kunde, Status, Produkt, Ablauffrist und offenen Rechnungspunkten; Sortierung und Seitenblättern (#007)
+- CSV-Export der Host-Liste unter Berücksichtigung der aktiven Filter (#007)
+- Host-Detailansicht mit Übersicht, Subscription-Historie, Reports, Rechnungen, Notizen mit Tags und Tokens (#007)
+- Kunde eines Hosts direkt in der Detailansicht ändern (#007)
+
+### Geändert
+- Host-Tabelle und Host-Detail arbeiten mit echten Daten statt Beispieldaten (#007)
+
 ## [0.3.0] – 2026-09-17
 
 ### Hinzugefügt

DEVLOG.md

@@ -2,7 +2,7 @@
 
 ## Zeitübersicht
 
-**Gesamt:** 2 h 13 min
+**Gesamt:** 3 h 23 min
 
 | Issue | Zeit |
 |---|---|
@@ -12,18 +12,25 @@
 | #004 Agent-API | 0 h 20 min |
 | #005 Agent-Skript | 0 h 25 min |
 | #006 Kunden und Hostzuweisung | 0 h 35 min |
+| #007 Host-Tabelle und Detailansichten | 0 h 25 min |
+| #020 Issues nach Gitea übertragen | 0 h 20 min |
+| #008 Laufzeiten und Rechnungen | 0 h 35 min |
 
 | Meilenstein | Zeit |
 |---|---|
 | v0.1.0 | 1 h 13 min | **abgeschlossen**
 | v0.2.0 | 0 h 25 min | **abgeschlossen**
 | v0.3.0 | 0 h 35 min | **abgeschlossen**
+| v0.4.0 | 0 h 25 min | **abgeschlossen**
+| v0.4.1 | 0 h 10 min | **abgeschlossen**
+| v0.4.2 | 0 h 10 min | **abgeschlossen**
+| v0.5.0 | 0 h 35 min | **abgeschlossen**
 
 ---
 
 ## 2026-09-17 · Sitzung 1 · 19:36–laufend
-**Issue:** #001–#006 (Meilensteine v0.1.0 bis v0.3.0)
+**Issue:** #001–#007 (Meilensteine v0.1.0 bis v0.4.0)
-**Version:** 0.3.0
+**Version:** 0.5.0
 
 ### Erledigt
 - Auftrag gelesen, Rückfragen gestellt
@@ -41,8 +48,18 @@
 - #006 abgeschlossen: Kunden und Standorte pflegen, Mehrfachzuweisung nicht zugeordneter Hosts, Enrollment- und Host-Tokens verwalten, Audit-Log; Dashboard, Kundenseiten und globale Suche laufen auf der Datenbank
 - Durchlauf gegen den laufenden Server geprüft: Token anlegen → `enroll` → Agent-Report → Laufzeit-Vorschlag → Host erscheint als „nicht zugeordnet“ → `ping`
 - Meilenstein v0.3.0 abgeschlossen und getaggt; 45 Tests
+- Issues #017 bis #019 aus bisherigen Notizen angelegt (Favicons, Feldtest des Agents, CI-Pipeline)
+- #007 abgeschlossen: Host-Tabelle mit Suche, fünf Filtern, Sortierung, Seitenblättern und CSV-Export; Host-Detail mit sechs Tabs, Notizen, Tags, Kundenzuweisung und Token-Widerruf
+- Meilenstein v0.4.0 abgeschlossen und getaggt; 59 Tests
+- #020 abgeschlossen: Abgleichskript für den Gitea-Issue-Tracker (Missverständnis geklärt – die Issues lagen bisher nur als Dateien im Repo, nicht im Tracker)
+- Token kommt aus den Git-Zugangsdaten statt aus einer zweiten Stelle; 20 Issues, 15 Labels und 13 Meilensteine in Gitea angelegt
+- Alles nach Gitea gepusht: main bei 51243c2, Tags v0.1.0 bis v0.4.1
+- #008 abgeschlossen: Laufzeit-Vorschläge bestätigen oder verwerfen, Rechnungen mit Positionen erfassen, PDF-Upload, Häkchen direkt in der Tabelle, Filter nach Status, Kunde und Jahr; Aufgabenliste auf dem Dashboard setzt jetzt echte Status
+- Meilenstein v0.5.0 abgeschlossen; 78 Tests
 
 ### Entscheidungen
+- **Rechnungsnummer als Schlüssel für Sammelrechnungen:** Dieselbe Nummer bei einer zweiten Laufzeit hängt eine Position an – kein eigener Dialog für „Sammelrechnung anlegen“ nötig.
+- **PDF-Prüfung am Dateianfang** statt am gemeldeten Typ; abgelegt wird unter der Prüfsumme, gleiche Datei also nur einmal.
 - **Screenshots mit Firefox headless** statt Playwright: Firefox ist vorhanden, es muss kein Browser samt Systembibliotheken nachinstalliert werden (dafür wäre root nötig).
 - **Kennzahlen werden berechnet, nicht hinterlegt:** auch im Prototyp kommen alle Zahlen aus den Beispieldaten, damit Tabellen und Kacheln nie widersprüchlich sind.
 - **AdminLTE 4.9.1 nur als CSS:** stabil, Bootstrap 5.3.8, kein jQuery; die JS-Plugins manipulieren das DOM und werden daher als React-Komponenten nachgebaut.
@@ -67,4 +84,4 @@
 - Offen: Rolle „readonly“ zusätzlich zu Admin? (vorläufig vorgesehen)
 
 ### Nächster Schritt
-- #007 Host-Tabelle mit Filtern, globale Suche auf Datenbankbasis und Host-Detailansicht
+- #009 Kundenübersicht, Ablauf-Kalender und Jahresbahn auf Datenbankbasis

README.md

@@ -45,6 +45,24 @@ Protokoll: `journalctl -t proxledger`. Ist das Dashboard nicht erreichbar, versu
 wachsendem Abstand und legt den Report danach unter `/var/lib/proxledger/spool/` ab; beim nächsten Lauf wird er
 nachgesendet.
 
+## Issues nach Gitea übertragen
+
+Die Issues werden als Markdown-Dateien in `docs/issues/` gepflegt – sie liegen damit im Repo und wandern mit
+jedem Klon mit. Wer sie zusätzlich im Gitea-Tracker haben möchte, gleicht sie ab:
+
+```bash
+npm run issues:sync -- --dry-run    # zeigt nur, was passieren würde
+npm run issues:sync                 # echter Abgleich
+```
+
+Serveradresse und Repository liest das Skript aus dem Git-Remote, den Token aus den hinterlegten
+Git-Zugangsdaten (Schlüsselbund oder `~/.git-credentials`) – derselbe Token wie fürs Pushen, er braucht
+zusätzlich das Recht `issue:write`. Wer beides trennen möchte, setzt `GITEA_URL`, `GITEA_REPO` und
+`GITEA_TOKEN` in der `.env`.
+
+Der Abgleich legt Labels und Meilensteine an, erkennt vorhandene Issues an der Nummer im Titel,
+aktualisiert sie und schließt erledigte. Ein zweiter Lauf erzeugt keine Dubletten.
+
 ## Dokumentation
 
 - [Architektur- und Umsetzungsplan](docs/architektur.md)

docs/issues/007-hosts-detailansichten.md

@@ -1,25 +1,33 @@
 # #007 Host-Tabelle, Suche und Detailansichten
-**Status:** offen
+**Status:** erledigt
 **Meilenstein:** v0.4.0
 **Labels:** ui
-**Geschätzt:** 8 h   **Tatsächlich:** –
+**Geschätzt:** 8 h   **Tatsächlich:** 0 h 25 min
 
 ## Ziel
 Hosts finden, filtern und vollständig einsehen.
 
 ## Aufgaben
-- [ ] Host-Tabelle (serverseitig): Filter Kunde, Status, Produkt, Ablauf, Rechnungsstatus; Sortierung; Spaltenauswahl; Paginierung; CSV-Export
+- [x] Host-Tabelle (serverseitig): Filter Kunde, Status, Produkt, Ablauf, Rechnungsstatus; Sortierung; Spaltenauswahl; Paginierung; CSV-Export
-- [ ] Suche nach Key, Server-ID, Hostname, IP, Proxmox-Rechnungsnummer
+- [x] Suche nach Key, Server-ID, Hostname, IP, Proxmox-Rechnungsnummer
-- [ ] Globale Suche in der Kopfleiste und Sidebar, `Strg+K`
+- [x] Globale Suche in der Kopfleiste und Sidebar, `Strg+K`
-- [ ] Host-Detail: Profil-Card, Tabs Übersicht, Subscription-Historie, Reports, Rechnungen, Notizen; Tags
+- [x] Host-Detail: Profil-Card, Tabs Übersicht, Subscription-Historie, Reports, Rechnungen, Notizen; Tags
-- [ ] Kopier-Buttons für Key, Server-ID, Rechnungsnummer
+- [x] Kopier-Buttons für Key, Server-ID, Rechnungsnummer
-- [ ] Badge „Keine Meldung“
+- [x] Badge „Keine Meldung“
 
 ## Akzeptanzkriterien
-- [ ] Eingabe `pve1c-a6bd21fcb6` liefert direkt Host und Kunde
+- [x] Eingabe `pve1c-a6bd21fcb6` liefert direkt Host und Kunde
-- [ ] Filter bleiben in der URL erhalten (teilbar, Zurück-Button funktioniert)
+- [x] Filter bleiben in der URL erhalten (teilbar, Zurück-Button funktioniert)
 
 ## Abhängigkeiten
 #006
 
 ## Notizen / Entscheidungen
+- Filter, Sortierung und Seite stehen in der Adresse; eine gefilterte Liste ist damit teilbar und der
+  Zurück-Knopf funktioniert.
+- Sortierung stellt Hosts ohne Ablaufdatum bzw. ohne Meldung immer ans Ende (`nulls: "last"`), sonst stünden
+  sie beim absteigenden Sortieren ganz oben.
+- Die Suche findet auch über Proxmox- und Kundenrechnungsnummern zum Host.
+- Der CSV-Export übernimmt die aktiven Filter und liefert alle Treffer, nicht nur die angezeigte Seite.
+- **Zurückgestellt:** frei wählbare Spalten. Die Tabelle hat acht feste Spalten und passt damit auf einen
+  Bildschirm; eine Spaltenauswahl lohnt erst bei deutlich mehr Feldern. Bei Bedarf als eigenes Issue nachziehen.

docs/issues/008-laufzeiten-rechnungen.md

@@ -1,28 +1,37 @@
 # #008 Laufzeiten und Rechnungen
-**Status:** offen
+**Status:** erledigt
 **Meilenstein:** v0.5.0
 **Labels:** ui, backend, buchhaltung
-**Geschätzt:** 10 h   **Tatsächlich:** –
+**Geschätzt:** 10 h   **Tatsächlich:** 0 h 35 min
 
 ## Ziel
 Lizenzjahre mit Proxmox-Einkaufsrechnung und Kundenrechnung erfassen und den Status schnell pflegen.
 
 ## Aufgaben
-- [ ] Laufzeitvorschlag bei neuem `nextduedate` bestätigen/verwerfen
+- [x] Laufzeitvorschlag bei neuem `nextduedate` bestätigen/verwerfen
-- [ ] Laufzeit manuell anlegen/bearbeiten
+- [x] Laufzeit manuell anlegen/bearbeiten
-- [ ] Proxmox-Rechnung erfassen (auch Sammelrechnung über mehrere Laufzeiten), PDF-Upload
+- [x] Proxmox-Rechnung erfassen (auch Sammelrechnung über mehrere Laufzeiten), PDF-Upload
-- [ ] Kundenrechnung erfassen (auch Sammelrechnung), PDF-Upload
+- [x] Kundenrechnung erfassen (auch Sammelrechnung), PDF-Upload
-- [ ] Marge pro Laufzeit, Kunde und Jahr berechnen
+- [x] Marge pro Laufzeit, Kunde und Jahr berechnen
-- [ ] Rechnungsübersicht: alle Laufzeiten, Umschalter „Proxmox bezahlt“ / „Kundenrechnung erstellt“ direkt in der Zeile, Filter Offen/Erledigt/Alle, Kunde, Zeitraum
+- [x] Rechnungsübersicht: alle Laufzeiten, Umschalter „Proxmox bezahlt“ / „Kundenrechnung erstellt“ direkt in der Zeile, Filter Offen/Erledigt/Alle, Kunde, Zeitraum
-- [ ] Sidebar-Badge offene Rechnungspunkte
+- [x] Sidebar-Badge offene Rechnungspunkte
-- [ ] Aufgaben-Card auf dem Dashboard mit echten Aktionen
+- [x] Aufgaben-Card auf dem Dashboard mit echten Aktionen
 
 ## Akzeptanzkriterien
-- [ ] Umschalten in der Tabelle wirkt sofort und wird im Audit-Log protokolliert
+- [x] Umschalten in der Tabelle wirkt sofort und wird im Audit-Log protokolliert
-- [ ] Summen Einkauf/Verkauf/Marge stimmen mit Einzelwerten überein (Tests)
+- [x] Summen Einkauf/Verkauf/Marge stimmen mit Einzelwerten überein (Tests)
-- [ ] Nur PDF bis 10 MB wird angenommen
+- [x] Nur PDF bis 10 MB wird angenommen
 
 ## Abhängigkeiten
 #007
 
 ## Notizen / Entscheidungen
+- **Sammelrechnungen ohne Extraschritt:** Wer bei einer zweiten Laufzeit dieselbe Rechnungsnummer einträgt,
+  hängt sie als weitere Position an die bestehende Rechnung. Der Rechnungsbetrag ist immer die Summe der
+  Positionen, wird also automatisch nachgeführt.
+- Das Häkchen „Kundenrechnung erstellt“ legt bei fehlender Rechnung eine ohne Nummer an; Nummer und Betrag
+  lassen sich später nachtragen, ohne dass eine zweite Rechnung entsteht.
+- Das Erfassen einer Proxmox-Rechnung bestätigt einen Laufzeit-Vorschlag automatisch.
+- PDFs werden unter ihrer Prüfsumme abgelegt (`UPLOAD_DIR`, Standard `./data/uploads`). Geprüft wird der
+  Dateianfang, nicht der gemeldete Typ – eine umbenannte Datei wird abgelehnt. Dieselbe Datei belegt nur
+  einmal Platz.

docs/issues/017-favicon-dateien.md

@@ -0,0 +1,27 @@
+# #017 Favicon-Dateien erzeugen
+**Status:** offen
+**Meilenstein:** v0.6.0
+**Labels:** ui
+**Geschätzt:** 1 h   **Tatsächlich:** –
+
+## Ziel
+Das Monogramm liegt als React-Komponente vor. Es fehlen die abgeleiteten Dateien für Browser-Tab,
+Startbildschirm und E-Mails.
+
+## Aufgaben
+- [ ] `favicon.svg` (32-px-Variante mit einer Linie) unter `src/app/icon.svg`
+- [ ] `favicon.ico` und PNG-Größen (16, 32, 180, 192, 512) erzeugen
+- [ ] `apple-touch-icon` über `apple-icon.tsx` (ImageResponse) oder als PNG
+- [ ] Erzeugung als Skript (`npm run icons`) festhalten, damit Änderungen am Logo nachziehbar sind
+- [ ] Einfarbige Variante für PDF-Export und Rechnungen bereitstellen
+
+## Akzeptanzkriterien
+- [ ] Browser-Tab zeigt das Monogramm in Hell und Dunkel
+- [ ] Beim Ablegen auf dem iOS-Startbildschirm erscheint das Logo ohne weißen Rand
+
+## Abhängigkeiten
+#002
+
+## Notizen / Entscheidungen
+- Auf dem Entwicklungsrechner ist kein SVG-Konverter installiert (kein rsvg-convert, kein ImageMagick).
+  Entweder `sharp` als Entwicklungsabhängigkeit aufnehmen oder Next.js `ImageResponse` nutzen.

docs/issues/018-agent-feldtest.md

@@ -0,0 +1,29 @@
+# #018 Agent auf echten Proxmox-Hosts prüfen
+**Status:** offen
+**Meilenstein:** v0.2.1
+**Labels:** agent, test
+**Geschätzt:** 2 h   **Tatsächlich:** –
+
+## Ziel
+Der Agent ist bisher nur gegen nachgebaute Proxmox-Befehle getestet. Vor dem produktiven Einsatz muss er
+auf echten Hosts laufen.
+
+## Aufgaben
+- [ ] Installation auf Proxmox VE (8.x und 9.x)
+- [ ] Installation auf Proxmox Backup Server
+- [ ] Installation auf Proxmox Mail Gateway
+- [ ] Ausgabeformate von `pvesubscription get`, `proxmox-backup-manager subscription get` und
+      `pmgsubscription get` mit den Annahmen im Skript abgleichen
+- [ ] Verhalten ohne Subscription und mit abgelaufener Subscription prüfen
+- [ ] Timer-Lauf, Spool-Nachsendung und Uninstall auf einem echten Host prüfen
+- [ ] Abweichungen als Testfälle in `tests/agent-skript.test.ts` übernehmen
+
+## Akzeptanzkriterien
+- [ ] Auf allen drei Produkten läuft die Installation ohne Nacharbeit durch
+- [ ] Die gemeldeten Felder stimmen mit der Ausgabe der Proxmox-Befehle überein
+
+## Abhängigkeiten
+#005
+
+## Notizen / Entscheidungen
+- Braucht Zugriff auf einen Testhost; bis dahin bleibt dieser Punkt offen.

docs/issues/019-ci-pipeline.md

@@ -0,0 +1,25 @@
+# #019 CI-Pipeline
+**Status:** offen
+**Meilenstein:** v0.10.0
+**Labels:** infrastruktur
+**Geschätzt:** 3 h   **Tatsächlich:** –
+
+## Ziel
+Automatische Prüfung jedes Commits, damit Fehler nicht erst beim Release auffallen.
+
+## Aufgaben
+- [ ] Gitea Actions (oder Woodpecker) einrichten
+- [ ] Schritte: `npm ci`, `prisma generate`, Lint, Typecheck, Tests gegen eine PostgreSQL-Dienstinstanz, Build
+- [ ] ShellCheck für `agent/*.sh`
+- [ ] Prüfung, dass `docs/issues/README.md` und `DEVLOG.md` zur Version in `package.json` passen
+- [ ] Ergebnis als Kennzeichen im README
+
+## Akzeptanzkriterien
+- [ ] Ein fehlschlagender Test verhindert den Merge nach `main`
+- [ ] Der Durchlauf dauert unter fünf Minuten
+
+## Abhängigkeiten
+#014
+
+## Notizen / Entscheidungen
+- ShellCheck ist auf dem Entwicklungsrechner nicht installiert; bisher wird nur `bash -n` geprüft.

docs/issues/020-gitea-issue-abgleich.md

@@ -0,0 +1,35 @@
+# #020 Issues nach Gitea übertragen
+**Status:** erledigt
+**Meilenstein:** v0.4.1
+**Labels:** infrastruktur, docs
+**Geschätzt:** 2 h   **Tatsächlich:** 0 h 10 min
+
+## Ziel
+Die Issue-Dateien aus `docs/issues/` sollen als echte Issues im Gitea-Tracker erscheinen und dort
+aktuell bleiben – ohne dass sie von Hand nachgepflegt werden müssen.
+
+## Aufgaben
+- [x] Skript `scripts/gitea-issues.ts`, das die Dateien liest und über die Gitea-API abgleicht
+- [x] Meilensteine anlegen (v0.1.0 bis v1.0.0), Labels anlegen (agent, backend, ui, docs …)
+- [x] Issues anlegen; vorhandene anhand der Nummer im Titel wiedererkennen und aktualisieren
+- [x] Erledigte Issues in Gitea schließen, wieder geöffnete erneut öffnen
+- [x] Trockenlauf ohne Token (`--dry-run`) zur Kontrolle vor dem ersten echten Lauf
+- [x] npm-Skript `issues:sync` und Beschreibung im README
+
+## Akzeptanzkriterien
+- [x] Ein Lauf legt alle 20 Issues mit Titel, Text, Label und Meilenstein in Gitea an
+- [x] Ein zweiter Lauf ändert nichts Unnötiges (keine Dubletten)
+- [x] Der Token steht nur in der Umgebung, nie im Repository
+
+## Abhängigkeiten
+#001
+
+## Notizen / Entscheidungen
+- Die Markdown-Dateien bleiben die Quelle der Wahrheit: Sie liegen im Repo, sind ohne Netz lesbar und
+  wandern mit jedem Klon mit. Gitea bekommt eine Kopie zum Kommentieren und Zuweisen.
+- Der Token kommt aus den Git-Zugangsdaten (`git credential fill`), Adresse und Repo aus dem Remote.
+  Damit muss derselbe Token nicht zweimal gepflegt werden.
+- Gefragt werden zuerst die eingerichteten Helfer (Schlüsselbund), danach zusätzlich `~/.git-credentials` –
+  je nach Rechner ist mal das eine, mal das andere gefüllt.
+- Erster echter Lauf am 17.09.2026: 20 Issues, 15 Labels und 13 Meilensteine angelegt, erledigte Issues
+  direkt geschlossen. Zweiter Lauf: 0 neue, 20 aktualisiert – keine Dubletten.

docs/issues/README.md

@@ -10,9 +10,9 @@ Details und Architektur: [../architektur.md](../architektur.md). Zeiten werden a
 | [#004](004-agent-api.md) | Agent-API | erledigt | v0.1.0 | 6 h | 0 h 20 min |
 | [#005](005-agent-skript.md) | Agent-Skript | erledigt | v0.2.0 | 8 h | 0 h 25 min |
 | [#006](006-kunden-hostzuweisung.md) | Kunden, Standorte und Hostzuweisung | erledigt | v0.3.0 | 6 h | 0 h 35 min |
-| [#007](007-hosts-detailansichten.md) | Host-Tabelle, Suche und Detailansichten | in Arbeit | v0.4.0 | 8 h | – |
+| [#007](007-hosts-detailansichten.md) | Host-Tabelle, Suche und Detailansichten | erledigt | v0.4.0 | 8 h | 0 h 25 min |
-| [#008](008-laufzeiten-rechnungen.md) | Laufzeiten und Rechnungen | offen | v0.5.0 | 10 h | – |
+| [#008](008-laufzeiten-rechnungen.md) | Laufzeiten und Rechnungen | erledigt | v0.5.0 | 10 h | 0 h 35 min |
-| [#009](009-kundenuebersicht-dashboard-jahresbahn.md) | Kundenübersicht, Dashboard und Jahresbahn | offen | v0.6.0 | 8 h | – |
+| [#009](009-kundenuebersicht-dashboard-jahresbahn.md) | Kundenübersicht, Dashboard und Jahresbahn | in Arbeit | v0.6.0 | 8 h | – |
 | [#010](010-export.md) | Export CSV und PDF | offen | v0.6.0 | 5 h | – |
 | [#011](011-warnregeln.md) | Warnregeln | offen | v0.7.0 | 8 h | – |
 | [#012](012-benachrichtigungen.md) | Benachrichtigungen | offen | v0.8.0 | 6 h | – |
@@ -20,4 +20,8 @@ Details und Architektur: [../architektur.md](../architektur.md). Zeiten werden a
 | [#014](014-deployment.md) | Deployment und Dokumentation | offen | v0.10.0 | 8 h | – |
 | [#015](015-feinschliff-v1.md) | Feinschliff für 1.0 | offen | v1.0.0 | 6 h | – |
 | [#016](016-anleitung-screenshots.md) | Benutzerhandbuch mit Screenshots | offen | v0.10.0 | 5 h | – |
-| | **Summe** | | | **106 h** | **2 h 13 min** |
+| [#017](017-favicon-dateien.md) | Favicon-Dateien erzeugen | offen | v0.6.0 | 1 h | – |
+| [#018](018-agent-feldtest.md) | Agent auf echten Proxmox-Hosts prüfen | offen | v0.2.1 | 2 h | – |
+| [#019](019-ci-pipeline.md) | CI-Pipeline | offen | v0.10.0 | 3 h | – |
+| [#020](020-gitea-issue-abgleich.md) | Issues nach Gitea übertragen | erledigt | v0.4.1 | 2 h | 0 h 10 min |
+| | **Summe** | | | **114 h** | **3 h 23 min** |

package.json

@@ -1,6 +1,6 @@
 {
   "name": "proxledger",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -17,7 +17,8 @@
     "db:seed": "prisma db seed",
     "db:studio": "prisma studio",
     "db:generate": "prisma generate",
-    "postinstall": "prisma generate"
+    "postinstall": "prisma generate",
+    "issues:sync": "tsx scripts/gitea-issues.ts"
   },
   "dependencies": {
     "@node-rs/argon2": "^2.2.1",

scripts/gitea-issues.ts

@@ -0,0 +1,280 @@
+/**
+ * Überträgt die Issue-Dateien aus `docs/issues/` in den Gitea-Issue-Tracker.
+ *
+ *   GITEA_URL=https://git.wilde-server.de \
+ *   GITEA_REPO=florian.wilde/ProxLedger \
+ *   GITEA_TOKEN=... \
+ *   npm run issues:sync
+ *
+ * Ohne Token oder mit `--dry-run` läuft nur ein Trockenlauf: Es wird ausgegeben, was passieren würde.
+ * Die Markdown-Dateien bleiben die Quelle der Wahrheit; Gitea erhält eine Kopie zum Kommentieren.
+ */
+
+import { execFileSync } from "node:child_process";
+import { readFile, readdir } from "node:fs/promises";
+import "dotenv/config";
+import path from "node:path";
+
+interface IssueDatei {
+  nummer: number;
+  titel: string;
+  status: string;
+  meilenstein: string | null;
+  labels: string[];
+  koerper: string;
+  dateiname: string;
+}
+
+const LABEL_FARBEN: Record<string, string> = {
+  agent: "#1e7e34",
+  backend: "#007bff",
+  api: "#6f42c1",
+  ui: "#17a2b8",
+  datenbank: "#20c997",
+  sicherheit: "#c82333",
+  docs: "#6c757d",
+  deployment: "#fd7e14",
+  infrastruktur: "#495057",
+  alerts: "#ffc107",
+  buchhaltung: "#e83e8c",
+  export: "#0dcaf0",
+  prototyp: "#adb5bd",
+  test: "#198754",
+  chore: "#868e96",
+};
+
+function feld(inhalt: string, name: string): string | null {
+  const treffer = new RegExp(`^\\*\\*${name}:\\*\\*\\s*(.+)$`, "m").exec(inhalt);
+  return treffer ? treffer[1].trim() : null;
+}
+
+async function dateienLesen(verzeichnis: string): Promise<IssueDatei[]> {
+  const namen = (await readdir(verzeichnis)).filter((name) => /^\d{3}-.*\.md$/.test(name)).sort();
+
+  const issues: IssueDatei[] = [];
+  for (const dateiname of namen) {
+    const inhalt = await readFile(path.join(verzeichnis, dateiname), "utf8");
+    const kopf = /^#\s*#(\d+)\s+(.+)$/m.exec(inhalt);
+    if (!kopf) {
+      console.warn(`Übersprungen (keine Überschrift „# #NNN Titel“): ${dateiname}`);
+      continue;
+    }
+
+    // Der Körper beginnt nach den Kopfzeilen (Status, Meilenstein, Labels, Zeiten).
+    const körperStart = inhalt.indexOf("## Ziel");
+    issues.push({
+      nummer: Number(kopf[1]),
+      titel: kopf[2].trim(),
+      status: feld(inhalt, "Status") ?? "offen",
+      meilenstein: feld(inhalt, "Meilenstein"),
+      labels: (feld(inhalt, "Labels") ?? "")
+        .split(",")
+        .map((label) => label.trim().toLowerCase())
+        .filter(Boolean),
+      koerper: körperStart >= 0 ? inhalt.slice(körperStart).trim() : inhalt,
+      dateiname,
+    });
+  }
+  return issues;
+}
+
+class Gitea {
+  constructor(
+    private readonly basis: string,
+    private readonly repo: string,
+    private readonly token: string,
+  ) {}
+
+  private async anfrage<T>(pfad: string, optionen: RequestInit = {}): Promise<T> {
+    const antwort = await fetch(`${this.basis}/api/v1/repos/${this.repo}${pfad}`, {
+      ...optionen,
+      headers: {
+        Authorization: `token ${this.token}`,
+        "Content-Type": "application/json",
+        ...optionen.headers,
+      },
+    });
+
+    if (!antwort.ok) {
+      throw new Error(`Gitea antwortet mit ${antwort.status} auf ${pfad}: ${await antwort.text()}`);
+    }
+    return (await antwort.json()) as T;
+  }
+
+  labels() {
+    return this.anfrage<{ id: number; name: string }[]>("/labels?limit=100");
+  }
+
+  labelAnlegen(name: string) {
+    return this.anfrage<{ id: number; name: string }>("/labels", {
+      method: "POST",
+      body: JSON.stringify({ name, color: LABEL_FARBEN[name] ?? "#6c757d" }),
+    });
+  }
+
+  meilensteine() {
+    return this.anfrage<{ id: number; title: string }[]>("/milestones?state=all&limit=100");
+  }
+
+  meilensteinAnlegen(title: string) {
+    return this.anfrage<{ id: number; title: string }>("/milestones", {
+      method: "POST",
+      body: JSON.stringify({ title }),
+    });
+  }
+
+  issues() {
+    return this.anfrage<{ number: number; title: string; state: string }[]>("/issues?state=all&limit=200");
+  }
+
+  issueAnlegen(daten: Record<string, unknown>) {
+    return this.anfrage<{ number: number }>("/issues", { method: "POST", body: JSON.stringify(daten) });
+  }
+
+  issueAendern(nummer: number, daten: Record<string, unknown>) {
+    return this.anfrage<{ number: number }>(`/issues/${nummer}`, {
+      method: "PATCH",
+      body: JSON.stringify(daten),
+    });
+  }
+}
+
+/**
+ * Ermittelt Serveradresse und Repo aus dem Git-Remote, damit beides nicht doppelt gepflegt werden muss.
+ * Beispiel: https://git.example.de/benutzer/ProxLedger.git → { basis, repo }
+ */
+function ausRemote(): { basis: string; repo: string } | null {
+  try {
+    const url = execFileSync("git", ["remote", "get-url", "origin"], { encoding: "utf8" }).trim();
+    const treffer = /^https?:\/\/(?:[^@/]*@)?([^/]+)\/(.+?)(?:\.git)?$/.exec(url);
+    if (!treffer) return null;
+    return { basis: `https://${treffer[1]}`, repo: treffer[2] };
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Holt den Token aus den Git-Zugangsdaten (Schlüsselbund oder `~/.git-credentials`).
+ * So genügt ein einziger Token für Push und API – er muss nicht zusätzlich in der .env stehen.
+ */
+function tokenAusGitCredentials(basis: string): string | null {
+  const host = new URL(basis).host;
+
+  // Erst die eingerichteten Helfer (z. B. Schlüsselbund), dann zusätzlich die Datei
+  // ~/.git-credentials – je nach Rechner ist mal das eine, mal das andere gefüllt.
+  for (const zusatz of [[], ["-c", "credential.helper=store"]]) {
+    try {
+      const antwort = execFileSync("git", [...zusatz, "credential", "fill"], {
+        input: `protocol=https\nhost=${host}\n\n`,
+        encoding: "utf8",
+        // Keine Rückfrage im Terminal: Wenn nichts hinterlegt ist, soll der Aufruf scheitern.
+        env: { ...process.env, GIT_TERMINAL_PROMPT: "0" },
+        stdio: ["pipe", "pipe", "ignore"],
+      });
+      const passwort = /^password=(.*)$/m.exec(antwort);
+      if (passwort?.[1]) return passwort[1];
+    } catch {
+      // Nächste Möglichkeit versuchen.
+    }
+  }
+
+  return null;
+}
+
+/** Titel in Gitea, z. B. „#004 Agent-Skript“ – daran werden vorhandene Issues wiedererkannt. */
+function giteaTitel(issue: IssueDatei): string {
+  return `#${String(issue.nummer).padStart(3, "0")} ${issue.titel}`;
+}
+
+async function main() {
+  const trockenlauf = process.argv.includes("--dry-run");
+  const remote = ausRemote();
+  const basis = (process.env.GITEA_URL ?? remote?.basis ?? "").replace(/\/$/, "");
+  const repo = process.env.GITEA_REPO ?? remote?.repo ?? "";
+  const token = process.env.GITEA_TOKEN || (basis ? (tokenAusGitCredentials(basis) ?? "") : "");
+  const tokenQuelle = process.env.GITEA_TOKEN ? "Umgebungsvariable" : "Git-Zugangsdaten";
+
+  const verzeichnis = path.join(process.cwd(), "docs", "issues");
+  const issues = await dateienLesen(verzeichnis);
+  console.log(`${issues.length} Issue-Dateien gelesen.`);
+
+  if (trockenlauf || !basis || !repo || !token) {
+    if (!trockenlauf) {
+      console.log(
+        "\nAdresse, Repo oder Token nicht ermittelbar – es läuft nur ein Trockenlauf.\n" +
+          "Entweder GITEA_TOKEN setzen oder einmal `git push` ausführen, damit der Token hinterlegt wird.\n",
+      );
+    }
+    for (const issue of issues) {
+      console.log(
+        `  ${giteaTitel(issue)}  [${issue.status}]  Meilenstein ${issue.meilenstein ?? "–"}  Labels: ${
+          issue.labels.join(", ") || "–"
+        }`,
+      );
+    }
+    console.log(
+      `\nZiel wäre: ${basis || "?"}/${repo || "?"} – Token ${token ? "vorhanden" : "fehlt"}.` +
+        "\nDer Token wird aus den Git-Zugangsdaten gelesen; er braucht zusätzlich das Recht „issue:write“.",
+    );
+    return;
+  }
+
+  console.log(`Ziel: ${basis}/${repo} (Token aus: ${tokenQuelle})`);
+  const gitea = new Gitea(basis, repo, token);
+
+  const vorhandeneLabels = new Map((await gitea.labels()).map((l) => [l.name.toLowerCase(), l.id]));
+  const benoetigteLabels = [...new Set(issues.flatMap((issue) => issue.labels))];
+  for (const name of benoetigteLabels) {
+    if (!vorhandeneLabels.has(name)) {
+      const neu = await gitea.labelAnlegen(name);
+      vorhandeneLabels.set(name, neu.id);
+      console.log(`Label angelegt: ${name}`);
+    }
+  }
+
+  const vorhandeneMeilensteine = new Map((await gitea.meilensteine()).map((m) => [m.title, m.id]));
+  const benoetigteMeilensteine = [
+    ...new Set(issues.map((issue) => issue.meilenstein).filter((m): m is string => Boolean(m))),
+  ].sort();
+  for (const titel of benoetigteMeilensteine) {
+    if (!vorhandeneMeilensteine.has(titel)) {
+      const neu = await gitea.meilensteinAnlegen(titel);
+      vorhandeneMeilensteine.set(titel, neu.id);
+      console.log(`Meilenstein angelegt: ${titel}`);
+    }
+  }
+
+  const vorhandeneIssues = new Map((await gitea.issues()).map((i) => [i.title, i]));
+
+  for (const issue of issues) {
+    const titel = giteaTitel(issue);
+    const daten = {
+      title: titel,
+      body: `${issue.koerper}\n\n---\nQuelle: \`docs/issues/${issue.dateiname}\` – dort wird dieses Issue gepflegt.`,
+      labels: issue.labels
+        .map((name) => vorhandeneLabels.get(name))
+        .filter((id): id is number => Boolean(id)),
+      milestone: issue.meilenstein ? vorhandeneMeilensteine.get(issue.meilenstein) : undefined,
+    };
+
+    const vorhanden = vorhandeneIssues.get(titel);
+    const zustand = issue.status.startsWith("erledigt") ? "closed" : "open";
+
+    if (vorhanden) {
+      await gitea.issueAendern(vorhanden.number, { ...daten, state: zustand });
+      console.log(`Aktualisiert: ${titel} (${zustand})`);
+    } else {
+      const neu = await gitea.issueAnlegen(daten);
+      if (zustand === "closed") await gitea.issueAendern(neu.number, { state: "closed" });
+      console.log(`Angelegt: ${titel} (${zustand})`);
+    }
+  }
+
+  console.log("\nAbgleich abgeschlossen.");
+}
+
+main().catch((fehler) => {
+  console.error(fehler instanceof Error ? fehler.message : fehler);
+  process.exit(1);
+});

src/app/(dashboard)/hosts/[id]/page.tsx

@@ -1,5 +1,6 @@
 import Link from "next/link";
 import { notFound } from "next/navigation";
+import { HostNotizen } from "@/components/hosts/HostNotizen";
 import { ContentHeader } from "@/components/layout/ContentHeader";
 import {
   AblaufBadge,
@@ -12,21 +13,18 @@ import {
 import { Card } from "@/components/ui/Card";
 import { CopyableCode } from "@/components/ui/CopyableCode";
 import { Tabs } from "@/components/ui/Tabs";
+import { PRODUKT_TEXT } from "@/lib/anzeige";
+import { prisma } from "@/lib/db";
 import { formatDatum, formatDatumZeit, formatEuro, formatUptime, formatZahl } from "@/lib/format";
-import { HEUTE } from "@/mock/data";
+import { hostKundeSetzen } from "@/server/actions/host-detail";
-import {
+import { hostTokenWiderrufen } from "@/server/actions/tokens";
-  PRODUKT_NAME,
+import { hostMitDetails } from "@/server/queries/hostliste";
-  alertsVonHost,
+import { meldungsGrenze } from "@/server/queries/hosts";
-  getHost,
-  getKunde,
-  hostMeldetNicht,
-  laufzeitenVonHost,
-  reportsVonHost,
-} from "@/mock/queries";
 
 export async function generateMetadata({ params }: { params: Promise<{ id: string }> }) {
   const { id } = await params;
-  return { title: getHost(id)?.hostname ?? "Host" };
+  const host = await prisma.host.findUnique({ where: { id }, select: { hostname: true } });
+  return { title: host?.hostname ?? "Host" };
 }
 
 function Zeile({ bezeichnung, children }: { bezeichnung: string; children: React.ReactNode }) {
@@ -40,38 +38,41 @@ function Zeile({ bezeichnung, children }: { bezeichnung: string; children: React
 
 export default async function HostDetailSeite({ params }: { params: Promise<{ id: string }> }) {
   const { id } = await params;
-  const host = getHost(id);
+  const host = await hostMitDetails(id);
   if (!host) notFound();
 
-  const kunde = getKunde(host.kundeId);
+  const kunden = await prisma.kunde.findMany({
-  const standort = kunde?.standorte.find((s) => s.id === host.standortId);
+    orderBy: { name: "asc" },
-  const laufzeiten = laufzeitenVonHost(host.id);
+    select: { id: true, name: true },
-  const reports = reportsVonHost(host.id);
+  });
-  const alerts = alertsVonHost(host.id);
+
-  const keys = [...new Set(laufzeiten.map((l) => l.key))];
+  const jetzt = new Date();
+  const meldetNicht = !host.letzterReportAm || host.letzterReportAm < meldungsGrenze(jetzt);
+  const socketAbweichung =
+    host.subLizenzierteSockets !== null &&
+    host.sockets !== null &&
+    host.subLizenzierteSockets !== host.sockets;
 
   return (
     <>
       <ContentHeader
         titel={host.hostname}
         brotkrumen={[{ titel: "Hosts", href: "/hosts" }, { titel: host.hostname }]}
-        aktion={<StatusBadge status={host.subscription.status} />}
+        aktion={<StatusBadge status={host.subStatus} />}
       />
 
       <div className="app-content">
         <div className="container-fluid">
-          {alerts.length > 0 ? (
+          {host.alerts.length > 0 ? (
-            <div className="row">
+            <Card titel={`Offene Warnungen (${host.alerts.length})`} rahmen="danger">
-              <div className="col-12">
-                <Card titel="Offene Warnungen" rahmen="danger">
               <ul className="list-unstyled mb-0">
-                    {alerts.map((alert) => (
+                {host.alerts.map((alert) => (
                   <li key={alert.id} className="mb-2">
                     <Badge
                       farbe={
-                            alert.schwere === "gefahr"
+                        alert.schwere === "GEFAHR"
                           ? "danger"
-                              : alert.schwere === "warnung"
+                          : alert.schwere === "WARNUNG"
                             ? "warning"
                             : "info"
                       }
@@ -83,8 +84,6 @@ export default async function HostDetailSeite({ params }: { params: Promise<{ id
                 ))}
               </ul>
             </Card>
-              </div>
-            </div>
           ) : null}
 
           <div className="row">
@@ -94,40 +93,69 @@ export default async function HostDetailSeite({ params }: { params: Promise<{ id
                   <i className="bi bi-hdd-rack fs-1 text-body-secondary" aria-hidden="true" />
                   <h2 className="h5 mt-2 mb-1">{host.hostname}</h2>
                   <div className="text-body-secondary small">{host.fqdn ?? "Kein FQDN gemeldet"}</div>
-                  {hostMeldetNicht(host) ? <KeineMeldungBadge /> : null}
+                  {meldetNicht ? <KeineMeldungBadge /> : null}
                 </div>
 
                 <Zeile bezeichnung="Kunde">
-                  {kunde ? (
+                  {host.kunde ? (
-                    <Link href={`/kunden/${kunde.id}`}>{kunde.name}</Link>
+                    <Link href={`/kunden/${host.kunde.id}`}>{host.kunde.name}</Link>
                   ) : (
-                    <Link href="/hosts/nicht-zugeordnet" className="badge pl-bg-neutral text-decoration-none">
+                    <span className="badge pl-bg-neutral">Nicht zugeordnet</span>
-                      Nicht zugeordnet
-                    </Link>
                   )}
                 </Zeile>
-                <Zeile bezeichnung="Standort">{standort?.name ?? "–"}</Zeile>
+                <Zeile bezeichnung="Standort">{host.standort?.name ?? "–"}</Zeile>
-                <Zeile bezeichnung="Produkt">{PRODUKT_NAME[host.produkt]}</Zeile>
+                <Zeile bezeichnung="Produkt">{PRODUKT_TEXT[host.produkt]}</Zeile>
                 <Zeile bezeichnung="Version">{host.produktVersion ?? "–"}</Zeile>
                 <Zeile bezeichnung="Kernel">{host.kernel ?? "–"}</Zeile>
                 <Zeile bezeichnung="Server-ID">
                   <CopyableCode wert={host.serverId} />
                 </Zeile>
                 <Zeile bezeichnung="Cluster / Node">
-                  {host.clusterName ? `${host.clusterName} / ${host.nodeName}` : "–"}
+                  {host.clusterName ? `${host.clusterName} / ${host.nodeName ?? "?"}` : "–"}
                 </Zeile>
-                <Zeile bezeichnung="IP-Adressen">{host.ips.join(", ")}</Zeile>
+                <Zeile bezeichnung="IP-Adressen">{host.ips.join(", ") || "–"}</Zeile>
                 <Zeile bezeichnung="CPU">{host.cpuModell ?? "–"}</Zeile>
                 <Zeile bezeichnung="Sockets (lizenziert / physisch)">
-                  {host.subscription.lizenzierteSockets ?? "–"} / {host.sockets ?? "–"}
+                  {host.subLizenzierteSockets ?? "–"} / {host.sockets ?? "–"}
+                  {socketAbweichung ? (
+                    <i
+                      className="bi bi-exclamation-triangle-fill pl-text-warning ms-2"
+                      title="Lizenzierte und physische Sockets weichen ab"
+                    />
+                  ) : null}
+                </Zeile>
+                <Zeile bezeichnung="Uptime">
+                  {formatUptime(host.uptimeSekunden === null ? null : Number(host.uptimeSekunden))}
                 </Zeile>
-                <Zeile bezeichnung="Uptime">{formatUptime(host.uptimeSekunden)}</Zeile>
                 <Zeile bezeichnung="Paket-Updates">{formatZahl(host.paketUpdates)}</Zeile>
-                <Zeile bezeichnung="Agent-Version">{host.agentVersion}</Zeile>
+                <Zeile bezeichnung="Agent-Version">{host.agentVersion ?? "–"}</Zeile>
-                <Zeile bezeichnung="Letzte Meldung">{formatDatumZeit(host.letzterReport)}</Zeile>
+                <Zeile bezeichnung="Erstmals gesehen">{formatDatum(host.erstmalsGesehenAm)}</Zeile>
-                <div className="d-grid gap-2 mt-3">
+                <Zeile bezeichnung="Letzte Meldung">{formatDatumZeit(host.letzterReportAm)}</Zeile>
-                  <span className="btn btn-outline-secondary disabled">Kunde ändern (ab #006)</span>
+
+                <form action={hostKundeSetzen} className="mt-3">
+                  <input type="hidden" name="hostId" value={host.id} />
+                  <label className="form-label small" htmlFor="kundeId">
+                    Kunde ändern
+                  </label>
+                  <div className="input-group input-group-sm">
+                    <select
+                      id="kundeId"
+                      name="kundeId"
+                      className="form-select"
+                      defaultValue={host.kundeId ?? ""}
+                    >
+                      <option value="">– nicht zugeordnet –</option>
+                      {kunden.map((kunde) => (
+                        <option key={kunde.id} value={kunde.id}>
+                          {kunde.name}
+                        </option>
+                      ))}
+                    </select>
+                    <button type="submit" className="btn btn-outline-primary">
+                      Setzen
+                    </button>
                   </div>
+                </form>
               </Card>
             </div>
 
@@ -141,69 +169,117 @@ export default async function HostDetailSeite({ params }: { params: Promise<{ id
                     inhalt: (
                       <>
                         <Zeile bezeichnung="Subscription-Key">
-                          <CopyableCode wert={host.subscription.key} />
+                          <CopyableCode wert={host.subKey} />
                         </Zeile>
                         <Zeile bezeichnung="Status">
-                          <StatusBadge status={host.subscription.status} />
+                          <StatusBadge status={host.subStatus} />
                         </Zeile>
-                        <Zeile bezeichnung="Produktname">{host.subscription.produktname ?? "–"}</Zeile>
+                        <Zeile bezeichnung="Produktname">{host.subProduktname ?? "–"}</Zeile>
-                        <Zeile bezeichnung="Level">{host.subscription.level ?? "–"}</Zeile>
+                        <Zeile bezeichnung="Level">{host.subLevel ?? "–"}</Zeile>
-                        <Zeile bezeichnung="Registriert am">{formatDatum(host.subscription.regdate)}</Zeile>
+                        <Zeile bezeichnung="Registriert am">{formatDatum(host.subRegdate)}</Zeile>
                         <Zeile bezeichnung="Läuft ab am">
-                          <AblaufBadge datum={host.subscription.nextduedate} heute={HEUTE} />
+                          <AblaufBadge datum={host.subNextduedate?.toISOString() ?? null} heute={jetzt} />
                         </Zeile>
                         <Zeile bezeichnung="Letzte Prüfung durch Proxmox">
-                          {formatDatumZeit(host.subscription.checktime)}
+                          {formatDatumZeit(host.subChecktime)}
                         </Zeile>
                         <div className="mt-3">
-                          {host.tags.map((tag) => (
+                          {host.tags.length === 0 ? (
-                            <span key={tag} className="badge pl-bg-neutral me-1">
+                            <span className="text-body-secondary small">Keine Tags</span>
-                              {tag}
+                          ) : (
+                            host.tags.map((tag) => (
+                              <span key={tag.id} className="badge pl-bg-neutral me-1">
+                                {tag.name}
                               </span>
-                          ))}
+                            ))
+                          )}
                         </div>
                       </>
                     ),
                   },
                   {
-                    id: "keys",
+                    id: "historie",
                     titel: "Subscription-Historie",
                     icon: "bi-key",
                     inhalt: (
-                      <table className="table table-striped align-middle mb-0">
+                      <>
+                        <h3 className="h6">Keys</h3>
+                        <table className="table table-striped align-middle mb-4">
                           <thead>
                             <tr>
                               <th scope="col">Key</th>
-                            <th scope="col">Erste Laufzeit</th>
+                              <th scope="col">Erstmals gemeldet</th>
-                            <th scope="col">Letzte Laufzeit</th>
+                              <th scope="col">Zuletzt gemeldet</th>
                             </tr>
                           </thead>
                           <tbody>
-                          {keys.map((key) => {
+                            {host.keyHistorie.map((eintrag) => (
-                            const zugehoerig = laufzeiten.filter((l) => l.key === key);
+                              <tr key={eintrag.id}>
-                            return (
-                              <tr key={key}>
                                 <td>
-                                  <CopyableCode wert={key} />
+                                  <CopyableCode wert={eintrag.key} />
                                 </td>
-                                <td>{formatDatum(zugehoerig[zugehoerig.length - 1]?.start)}</td>
+                                <td>{formatDatum(eintrag.ersteMeldung)}</td>
-                                <td>{formatDatum(zugehoerig[0]?.ende)}</td>
+                                <td>{formatDatum(eintrag.letzteMeldung)}</td>
                               </tr>
-                            );
+                            ))}
-                          })}
+                            {host.keyHistorie.length === 0 ? (
+                              <tr>
+                                <td colSpan={3} className="text-body-secondary">
+                                  Noch kein Key gemeldet.
+                                </td>
+                              </tr>
+                            ) : null}
                           </tbody>
                         </table>
+
+                        <h3 className="h6">Server-IDs</h3>
+                        <table className="table table-striped align-middle mb-0">
+                          <thead>
+                            <tr>
+                              <th scope="col">Server-ID</th>
+                              <th scope="col">Erstmals gemeldet</th>
+                              <th scope="col">Zuletzt gemeldet</th>
+                            </tr>
+                          </thead>
+                          <tbody>
+                            {host.serverIdHistorie.map((eintrag) => (
+                              <tr key={eintrag.id}>
+                                <td>
+                                  <CopyableCode wert={eintrag.serverId} />
+                                </td>
+                                <td>{formatDatum(eintrag.ersteMeldung)}</td>
+                                <td>{formatDatum(eintrag.letzteMeldung)}</td>
+                              </tr>
+                            ))}
+                            {host.serverIdHistorie.length === 0 ? (
+                              <tr>
+                                <td colSpan={3} className="text-body-secondary">
+                                  Noch keine Server-ID gemeldet.
+                                </td>
+                              </tr>
+                            ) : null}
+                          </tbody>
+                        </table>
+                        {host.serverIdHistorie.length > 1 ? (
+                          <p className="small pl-text-warning mt-2 mb-0">
+                            Mehrere Server-IDs bedeuten Hardwaretausch oder Neuinstallation – der Key muss
+                            dann bei Proxmox neu zugewiesen werden.
+                          </p>
+                        ) : null}
+                      </>
                     ),
                   },
                   {
                     id: "reports",
-                    titel: "Reports",
+                    titel: `Reports (${host.reports.length})`,
                     icon: "bi-clock-history",
                     inhalt: (
+                      <div className="table-responsive">
                         <table className="table table-striped align-middle mb-0">
                           <thead>
                             <tr>
-                            <th scope="col">Zeitpunkt</th>
+                              <th scope="col">Erhoben</th>
+                              <th scope="col">Empfangen</th>
                               <th scope="col">Status</th>
                               <th scope="col">Key</th>
                               <th scope="col">Ablauf</th>
@@ -212,22 +288,31 @@ export default async function HostDetailSeite({ params }: { params: Promise<{ id
                             </tr>
                           </thead>
                           <tbody>
-                          {reports.map((report) => (
+                            {host.reports.map((report) => (
                               <tr key={report.id}>
-                              <td>{formatDatumZeit(report.zeitpunkt)}</td>
+                                <td>{formatDatumZeit(report.erhobenAm)}</td>
-                              <td>
+                                <td className="small text-body-secondary">
-                                <StatusBadge status={report.status} />
+                                  {formatDatumZeit(report.empfangenAm)}
                                 </td>
                                 <td>
-                                <span className="pl-mono">{report.key ?? "–"}</span>
+                                  <StatusBadge status={report.subStatus} />
                                 </td>
-                              <td>{formatDatum(report.nextduedate)}</td>
+                                <td className="pl-mono">{report.subKey ?? "–"}</td>
+                                <td>{formatDatum(report.subNextduedate)}</td>
                                 <td>{formatZahl(report.paketUpdates)}</td>
-                              <td>{report.agentVersion}</td>
+                                <td>{report.agentVersion ?? "–"}</td>
                               </tr>
                             ))}
+                            {host.reports.length === 0 ? (
+                              <tr>
+                                <td colSpan={7} className="text-body-secondary">
+                                  Noch kein Report eingegangen.
+                                </td>
+                              </tr>
+                            ) : null}
                           </tbody>
                         </table>
+                      </div>
                     ),
                   },
                   {
@@ -235,6 +320,7 @@ export default async function HostDetailSeite({ params }: { params: Promise<{ id
                     titel: "Rechnungen",
                     icon: "bi-receipt",
                     inhalt: (
+                      <div className="table-responsive">
                         <table className="table table-striped align-middle mb-0">
                           <thead>
                             <tr>
@@ -247,57 +333,128 @@ export default async function HostDetailSeite({ params }: { params: Promise<{ id
                             </tr>
                           </thead>
                           <tbody>
-                          {laufzeiten.map((laufzeit) => (
+                            {host.laufzeiten.map((laufzeit) => {
+                              const einkauf = laufzeit.proxmoxPosition
+                                ? Number(laufzeit.proxmoxPosition.nettoBetrag)
+                                : null;
+                              const verkauf = laufzeit.kundenPosition
+                                ? Number(laufzeit.kundenPosition.nettoBetrag)
+                                : null;
+                              return (
                                 <tr key={laufzeit.id}>
                                   <td>
                                     {formatDatum(laufzeit.start)} – {formatDatum(laufzeit.ende)}
-                                {laufzeit.vorschlag ? (
+                                    {laufzeit.status === "VORSCHLAG" ? (
                                       <span className="badge pl-bg-info ms-2">Vorschlag</span>
                                     ) : null}
                                   </td>
                                   <td>
-                                <CopyableCode wert={laufzeit.einkauf?.nummer ?? null} />
+                                    <CopyableCode wert={laufzeit.proxmoxPosition?.rechnung.nummer ?? null} />
                                     <div>
                                       <EinkaufBadge
-                                    bezahlt={laufzeit.einkauf ? laufzeit.einkauf.bezahlt : null}
+                                        bezahlt={
+                                          laufzeit.proxmoxPosition
+                                            ? laufzeit.proxmoxPosition.rechnung.bezahlt
+                                            : null
+                                        }
                                       />
                                     </div>
                                   </td>
-                              <td>{formatEuro(laufzeit.einkauf?.nettoBetrag)}</td>
+                                  <td>{formatEuro(einkauf)}</td>
                                   <td>
-                                <CopyableCode wert={laufzeit.verkauf?.nummer ?? null} />
+                                    <CopyableCode wert={laufzeit.kundenPosition?.rechnung.nummer ?? null} />
                                     <div>
                                       <VerkaufBadge
-                                    erstellt={laufzeit.verkauf?.erstellt ?? false}
+                                        erstellt={laufzeit.kundenPosition?.rechnung.erstellt ?? false}
-                                    bezahlt={laufzeit.verkauf?.bezahlt ?? false}
+                                        bezahlt={laufzeit.kundenPosition?.rechnung.bezahlt ?? false}
                                       />
                                     </div>
                                   </td>
-                              <td>{formatEuro(laufzeit.verkauf?.nettoBetrag)}</td>
+                                  <td>{formatEuro(verkauf)}</td>
                                   <td>
-                                {laufzeit.einkauf && laufzeit.verkauf?.nettoBetrag
+                                    {einkauf !== null && verkauf !== null
-                                  ? formatEuro(
+                                      ? formatEuro(verkauf - einkauf)
-                                      (laufzeit.verkauf.nettoBetrag ?? 0) -
-                                        (laufzeit.einkauf.nettoBetrag ?? 0),
-                                    )
                                       : "–"}
                                   </td>
                                 </tr>
-                          ))}
+                              );
+                            })}
+                            {host.laufzeiten.length === 0 ? (
+                              <tr>
+                                <td colSpan={6} className="text-body-secondary">
+                                  Noch keine Laufzeit erfasst.
+                                </td>
+                              </tr>
+                            ) : null}
                           </tbody>
                         </table>
+                      </div>
                     ),
                   },
                   {
                     id: "notizen",
-                    titel: "Notizen",
+                    titel: "Notizen und Tags",
                     icon: "bi-journal-text",
                     inhalt: (
-                      <p className="mb-0">
+                      <HostNotizen
-                        {host.notizen ?? (
+                        hostId={host.id}
-                          <span className="text-body-secondary">Keine Notizen hinterlegt.</span>
+                        notizen={host.notizen}
+                        tags={host.tags.map((tag) => tag.name)}
+                      />
+                    ),
+                  },
+                  {
+                    id: "tokens",
+                    titel: "Tokens",
+                    icon: "bi-key-fill",
+                    inhalt: (
+                      <table className="table table-striped align-middle mb-0">
+                        <thead>
+                          <tr>
+                            <th scope="col">Anfang</th>
+                            <th scope="col">Erstellt</th>
+                            <th scope="col">Zuletzt benutzt</th>
+                            <th scope="col">Zustand</th>
+                            <th scope="col" className="text-end">
+                              Aktion
+                            </th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          {host.tokens.map((token) => (
+                            <tr key={token.id}>
+                              <td className="pl-mono">{token.praefix}…</td>
+                              <td>{formatDatum(token.erstelltAm)}</td>
+                              <td>{formatDatumZeit(token.letzteNutzungAm)}</td>
+                              <td>
+                                {token.widerrufenAm ? (
+                                  <Badge farbe="neutral">Widerrufen</Badge>
+                                ) : (
+                                  <Badge farbe="success">Aktiv</Badge>
                                 )}
-                      </p>
+                              </td>
+                              <td className="text-end">
+                                {token.widerrufenAm ? null : (
+                                  <form action={hostTokenWiderrufen}>
+                                    <input type="hidden" name="id" value={token.id} />
+                                    <input type="hidden" name="hostId" value={host.id} />
+                                    <button type="submit" className="btn btn-sm btn-outline-danger">
+                                      Widerrufen
+                                    </button>
+                                  </form>
+                                )}
+                              </td>
+                            </tr>
+                          ))}
+                          {host.tokens.length === 0 ? (
+                            <tr>
+                              <td colSpan={5} className="text-body-secondary">
+                                Kein Token vorhanden – dieser Host stammt aus den Demo-Daten.
+                              </td>
+                            </tr>
+                          ) : null}
+                        </tbody>
+                      </table>
                     ),
                   },
                 ]}

src/app/(dashboard)/hosts/export/route.ts

@@ -0,0 +1,69 @@
+import { PRODUKT_TEXT, STATUS_TEXT, statusAusDatenbank } from "@/lib/anzeige";
+import { csvAntwort, csvDatei } from "@/lib/csv";
+import { hostListe, type HostFilter } from "@/server/queries/hostliste";
+
+export const dynamic = "force-dynamic";
+
+/** CSV-Export der Host-Tabelle; übernimmt die Filter aus der Adresse. */
+export async function GET(request: Request) {
+  const parameter = new URL(request.url).searchParams;
+  const filter: HostFilter = {
+    q: parameter.get("q") ?? undefined,
+    kunde: parameter.get("kunde") ?? undefined,
+    status: parameter.get("status") ?? undefined,
+    produkt: parameter.get("produkt") ?? undefined,
+    ablauf: (parameter.get("ablauf") as HostFilter["ablauf"]) ?? undefined,
+    rechnung: (parameter.get("rechnung") as HostFilter["rechnung"]) ?? undefined,
+    sortierung: parameter.get("sortierung") ?? undefined,
+    // Der Export enthält alle Treffer, nicht nur die aktuelle Seite.
+    seite: 1,
+  };
+
+  const { gesamt } = await hostListe({ ...filter }, new Date());
+  const alle = [];
+  for (let seite = 1; alle.length < gesamt; seite++) {
+    const teil = await hostListe({ ...filter, seite }, new Date());
+    if (teil.hosts.length === 0) break;
+    alle.push(...teil.hosts);
+  }
+
+  const inhalt = csvDatei(
+    [
+      "Hostname",
+      "FQDN",
+      "Kunde",
+      "Standort",
+      "Produkt",
+      "Version",
+      "Status",
+      "Subscription-Key",
+      "Server-ID",
+      "Sockets lizenziert",
+      "Sockets physisch",
+      "Ablauf",
+      "Letzte Meldung",
+      "IP-Adressen",
+      "Agent-Version",
+    ],
+    alle.map((host) => [
+      host.hostname,
+      host.fqdn,
+      host.kunde?.name ?? "Nicht zugeordnet",
+      host.standort?.name ?? "",
+      PRODUKT_TEXT[host.produkt],
+      host.produktVersion,
+      STATUS_TEXT[statusAusDatenbank(host.subStatus)],
+      host.subKey,
+      host.serverId,
+      host.subLizenzierteSockets,
+      host.sockets,
+      host.subNextduedate,
+      host.letzterReportAm,
+      host.ips.join(", "),
+      host.agentVersion,
+    ]),
+  );
+
+  const datum = new Date().toISOString().slice(0, 10);
+  return csvAntwort(inhalt, `proxledger-hosts-${datum}.csv`);
+}

src/app/(dashboard)/hosts/page.tsx

@@ -1,23 +1,96 @@
 import Link from "next/link";
 import { ContentHeader } from "@/components/layout/ContentHeader";
+import { HostFilterLeiste } from "@/components/hosts/HostFilterLeiste";
 import { AblaufBadge, KeineMeldungBadge, StatusBadge } from "@/components/ui/Badges";
 import { Card } from "@/components/ui/Card";
 import { CopyableCode } from "@/components/ui/CopyableCode";
-import { HEUTE, hosts } from "@/mock/data";
+import { PRODUKT_TEXT } from "@/lib/anzeige";
-import { PRODUKT_NAME, getKunde, hostMeldetNicht, suche } from "@/mock/queries";
+import { formatDatumZeit } from "@/lib/format";
+import { filterOptionen, hostListe, type HostFilter } from "@/server/queries/hostliste";
 
 export const metadata = { title: "Hosts" };
 
-export default async function HostsSeite({
+type SuchParameter = Promise<Record<string, string | string[] | undefined>>;
-  searchParams,
-}: {
-  searchParams: Promise<{ q?: string; status?: string; kunde?: string }>;
-}) {
-  const { q, status, kunde } = await searchParams;
 
-  let liste = q ? suche(q).hosts : hosts;
+function einzeln(wert: string | string[] | undefined): string | undefined {
-  if (status) liste = liste.filter((h) => h.subscription.status === status);
+  const text = Array.isArray(wert) ? wert[0] : wert;
-  if (kunde) liste = liste.filter((h) => h.kundeId === kunde);
+  return text && text.length > 0 ? text : undefined;
+}
+
+/** Baut eine Adresse mit geänderten Parametern – für Sortierung, Blättern und Export. */
+function mitParametern(
+  basis: Record<string, string | undefined>,
+  aenderung: Record<string, string | undefined> = {},
+  pfad = "/hosts",
+) {
+  const params = new URLSearchParams();
+  for (const [schluessel, wert] of Object.entries({ ...basis, ...aenderung })) {
+    if (wert) params.set(schluessel, wert);
+  }
+  const text = params.toString();
+  return text ? `${pfad}?${text}` : pfad;
+}
+
+/** Spaltenkopf, der beim Klick die Sortierung umschaltet. */
+function SortierKopf({
+  titel,
+  feld,
+  basis,
+  sortierung,
+}: {
+  titel: string;
+  feld: string;
+  basis: Record<string, string | undefined>;
+  sortierung: string | undefined;
+}) {
+  const aktiv = (sortierung ?? "hostname").startsWith(feld);
+  const absteigend = sortierung === `${feld}-ab`;
+  return (
+    <th scope="col">
+      <Link
+        href={mitParametern(basis, { sortierung: absteigend ? feld : `${feld}-ab`, seite: undefined })}
+        className="text-decoration-none text-body d-inline-flex align-items-center gap-1"
+      >
+        {titel}
+        {aktiv ? (
+          <i
+            className={`bi ${absteigend ? "bi-caret-down-fill" : "bi-caret-up-fill"} small`}
+            aria-hidden="true"
+          />
+        ) : null}
+      </Link>
+    </th>
+  );
+}
+
+export default async function HostsSeite({ searchParams }: { searchParams: SuchParameter }) {
+  const roh = await searchParams;
+  const filter: HostFilter = {
+    q: einzeln(roh.q),
+    kunde: einzeln(roh.kunde),
+    status: einzeln(roh.status),
+    produkt: einzeln(roh.produkt),
+    ablauf: einzeln(roh.ablauf) as HostFilter["ablauf"],
+    rechnung: einzeln(roh.rechnung) as HostFilter["rechnung"],
+    sortierung: einzeln(roh.sortierung),
+    seite: Number(einzeln(roh.seite) ?? 1),
+  };
+
+  const jetzt = new Date();
+  const [{ hosts, gesamt, seite, seiten }, optionen] = await Promise.all([
+    hostListe(filter, jetzt),
+    filterOptionen(),
+  ]);
+
+  const basis: Record<string, string | undefined> = {
+    q: filter.q,
+    kunde: filter.kunde,
+    status: filter.status,
+    produkt: filter.produkt,
+    ablauf: filter.ablauf,
+    rechnung: filter.rechnung,
+    sortierung: filter.sortierung,
+  };
 
   return (
     <>
@@ -26,7 +99,7 @@ export default async function HostsSeite({
       <div className="app-content">
         <div className="container-fluid">
           <Card
-            titel={`${liste.length} von ${hosts.length} Hosts`}
+            titel={`${gesamt} Host${gesamt === 1 ? "" : "s"}${gesamt !== hosts.length ? ` · Seite ${seite} von ${seiten}` : ""}`}
             rahmen="primary"
             tabelle
             werkzeuge={
@@ -34,106 +107,120 @@ export default async function HostsSeite({
                 <Link href="/hosts/nicht-zugeordnet" className="btn btn-sm btn-outline-primary">
                   Nicht zugeordnete
                 </Link>
-                <span className="btn btn-sm btn-outline-secondary disabled">CSV-Export (ab #007)</span>
+                <a
+                  href={mitParametern(basis, {}, "/hosts/export")}
+                  className="btn btn-sm btn-outline-secondary"
+                >
+                  <i className="bi bi-filetype-csv me-1" aria-hidden="true" />
+                  CSV
+                </a>
               </>
             }
           >
-            <form className="p-3 border-bottom row g-2" role="search">
+            <HostFilterLeiste kunden={optionen.kunden} werte={basis} />
-              <div className="col-md-5">
-                <input
-                  type="search"
-                  name="q"
-                  defaultValue={q ?? ""}
-                  className="form-control"
-                  placeholder="Hostname, Key, Server-ID oder IP …"
-                  aria-label="Hosts durchsuchen"
-                />
-              </div>
-              <div className="col-md-3">
-                <select name="status" defaultValue={status ?? ""} className="form-select" aria-label="Status">
-                  <option value="">Alle Status</option>
-                  <option value="active">Aktiv</option>
-                  <option value="expired">Abgelaufen</option>
-                  <option value="notfound">Keine Subscription</option>
-                </select>
-              </div>
-              <div className="col-md-2">
-                <button type="submit" className="btn btn-primary w-100">
-                  Filtern
-                </button>
-              </div>
-            </form>
 
             <div className="table-responsive">
               <table className="table table-striped align-middle">
                 <thead>
                   <tr>
-                    <th scope="col">Host</th>
+                    <SortierKopf titel="Host" feld="hostname" basis={basis} sortierung={filter.sortierung} />
-                    <th scope="col">Kunde</th>
+                    <SortierKopf titel="Kunde" feld="kunde" basis={basis} sortierung={filter.sortierung} />
                     <th scope="col">Produkt</th>
-                    <th scope="col">Status</th>
+                    <SortierKopf titel="Status" feld="status" basis={basis} sortierung={filter.sortierung} />
                     <th scope="col">Key</th>
-                    <th scope="col">Ablauf</th>
+                    <SortierKopf titel="Ablauf" feld="ablauf" basis={basis} sortierung={filter.sortierung} />
                     <th scope="col">Sockets</th>
+                    <SortierKopf
+                      titel="Letzte Meldung"
+                      feld="meldung"
+                      basis={basis}
+                      sortierung={filter.sortierung}
+                    />
                   </tr>
                 </thead>
                 <tbody>
-                  {liste.map((host) => {
+                  {hosts.map((host) => (
-                    const kundeDesHosts = getKunde(host.kundeId);
-                    const socketAbweichung =
-                      host.subscription.lizenzierteSockets !== null &&
-                      host.sockets !== null &&
-                      host.subscription.lizenzierteSockets !== host.sockets;
-                    return (
                     <tr key={host.id}>
                       <td>
                         <Link href={`/hosts/${host.id}`} className="fw-semibold text-decoration-none">
                           {host.hostname}
                         </Link>
-                          {hostMeldetNicht(host) ? <KeineMeldungBadge /> : null}
+                        {host.meldetNicht ? <KeineMeldungBadge /> : null}
-                          <div className="small text-body-secondary">{host.ips.join(", ")}</div>
+                        <div className="small text-body-secondary">{host.ips.join(", ") || "–"}</div>
                       </td>
                       <td>
-                          {kundeDesHosts ? (
+                        {host.kunde ? (
-                            <Link href={`/kunden/${kundeDesHosts.id}`} className="text-decoration-none">
+                          <Link href={`/kunden/${host.kunde.id}`} className="text-decoration-none">
-                              {kundeDesHosts.name}
+                            {host.kunde.name}
                           </Link>
                         ) : (
-                            <span className="badge pl-bg-neutral">Nicht zugeordnet</span>
+                          <Link
+                            href="/hosts/nicht-zugeordnet"
+                            className="badge pl-bg-neutral text-decoration-none"
+                          >
+                            Nicht zugeordnet
+                          </Link>
                         )}
+                        {host.standort ? (
+                          <div className="small text-body-secondary">{host.standort.name}</div>
+                        ) : null}
                       </td>
-                        <td>{PRODUKT_NAME[host.produkt]}</td>
+                      <td>{PRODUKT_TEXT[host.produkt]}</td>
                       <td>
-                          <StatusBadge status={host.subscription.status} />
+                        <StatusBadge status={host.subStatus} />
                       </td>
                       <td>
-                          <CopyableCode wert={host.subscription.key} />
+                        <CopyableCode wert={host.subKey} />
                       </td>
                       <td>
-                          <AblaufBadge datum={host.subscription.nextduedate} heute={HEUTE} />
+                        <AblaufBadge datum={host.subNextduedate?.toISOString() ?? null} heute={jetzt} />
                       </td>
                       <td>
-                          {host.subscription.lizenzierteSockets ?? "–"} / {host.sockets ?? "–"}
+                        {host.subLizenzierteSockets ?? "–"} / {host.sockets ?? "–"}
-                          {socketAbweichung ? (
+                        {host.socketAbweichung ? (
                           <i
                             className="bi bi-exclamation-triangle-fill pl-text-warning ms-2"
                             title="Lizenzierte und physische Sockets weichen ab"
                           />
                         ) : null}
                       </td>
+                      <td className="small">{formatDatumZeit(host.letzterReportAm)}</td>
                     </tr>
-                    );
+                  ))}
-                  })}
+                  {hosts.length === 0 ? (
-                  {liste.length === 0 ? (
                     <tr>
-                      <td colSpan={7} className="text-center text-body-secondary py-4">
+                      <td colSpan={8} className="text-center text-body-secondary py-4">
-                        Keine Hosts gefunden.
+                        Keine Hosts gefunden. <Link href="/hosts">Filter zurücksetzen</Link>
                       </td>
                     </tr>
                   ) : null}
                 </tbody>
               </table>
             </div>
+
+            {seiten > 1 ? (
+              <nav className="p-3 border-top" aria-label="Seiten">
+                <ul className="pagination pagination-sm mb-0">
+                  <li className={`page-item ${seite <= 1 ? "disabled" : ""}`}>
+                    <Link className="page-link" href={mitParametern(basis, { seite: String(seite - 1) })}>
+                      Zurück
+                    </Link>
+                  </li>
+                  {Array.from({ length: seiten }, (_, i) => i + 1).map((nummer) => (
+                    <li key={nummer} className={`page-item ${nummer === seite ? "active" : ""}`}>
+                      <Link className="page-link" href={mitParametern(basis, { seite: String(nummer) })}>
+                        {nummer}
+                      </Link>
+                    </li>
+                  ))}
+                  <li className={`page-item ${seite >= seiten ? "disabled" : ""}`}>
+                    <Link className="page-link" href={mitParametern(basis, { seite: String(seite + 1) })}>
+                      Weiter
+                    </Link>
+                  </li>
+                </ul>
+              </nav>
+            ) : null}
           </Card>
         </div>
       </div>

src/app/(dashboard)/page.tsx

@@ -39,6 +39,7 @@ export default async function DashboardSeite() {
       dringlichkeit: aufgabe.dringlichkeit,
       badgeText: aufgabe.badgeText,
       href: aufgabe.href,
+      aktion: aufgabe.aktion,
     })),
     ...ohneKunde.map((host) => ({
       id: `zuweisen-${host.id}`,

src/app/(dashboard)/rechnungen/[id]/page.tsx

@@ -0,0 +1,197 @@
+import Link from "next/link";
+import { notFound } from "next/navigation";
+import { ContentHeader } from "@/components/layout/ContentHeader";
+import { KundenrechnungFormular, ProxmoxRechnungFormular } from "@/components/rechnungen/RechnungsFormulare";
+import { Badge, EinkaufBadge, VerkaufBadge } from "@/components/ui/Badges";
+import { Callout } from "@/components/ui/Callout";
+import { Card } from "@/components/ui/Card";
+import { CopyableCode } from "@/components/ui/CopyableCode";
+import { PRODUKT_TEXT } from "@/lib/anzeige";
+import { formatDatum, formatEuro } from "@/lib/format";
+import { laufzeitBestaetigenAktion, laufzeitVerwerfenAktion } from "@/server/actions/rechnungen";
+import { laufzeitDetail } from "@/server/queries/rechnungen";
+
+export async function generateMetadata({ params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params;
+  const laufzeit = await laufzeitDetail(id);
+  return { title: laufzeit ? `Laufzeit ${laufzeit.host.hostname}` : "Laufzeit" };
+}
+
+export default async function LaufzeitSeite({ params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params;
+  const laufzeit = await laufzeitDetail(id);
+  if (!laufzeit) notFound();
+
+  const einkauf = laufzeit.proxmoxPosition?.rechnung ?? null;
+  const verkauf = laufzeit.kundenPosition?.rechnung ?? null;
+  const einkaufBetrag = laufzeit.proxmoxPosition ? Number(laufzeit.proxmoxPosition.nettoBetrag) : null;
+  const verkaufBetrag = laufzeit.kundenPosition ? Number(laufzeit.kundenPosition.nettoBetrag) : null;
+  const marge = einkaufBetrag !== null && verkaufBetrag !== null ? verkaufBetrag - einkaufBetrag : null;
+
+  const zeitraum = `${formatDatum(laufzeit.start)} – ${formatDatum(laufzeit.ende)}`;
+
+  return (
+    <>
+      <ContentHeader
+        titel={`Laufzeit ${zeitraum}`}
+        brotkrumen={[
+          { titel: "Rechnungen", href: "/rechnungen" },
+          { titel: laufzeit.host.hostname, href: `/hosts/${laufzeit.host.id}` },
+          { titel: zeitraum },
+        ]}
+        aktion={laufzeit.status === "VORSCHLAG" ? <Badge farbe="info">Vorschlag</Badge> : null}
+      />
+
+      <div className="app-content">
+        <div className="container-fluid">
+          {laufzeit.status === "VORSCHLAG" ? (
+            <Callout
+              titel="Vom Agent vorgeschlagen"
+              farbe="info"
+              aktion={
+                <div className="d-flex gap-2">
+                  <form action={laufzeitBestaetigenAktion}>
+                    <input type="hidden" name="laufzeitId" value={laufzeit.id} />
+                    <input type="hidden" name="hostId" value={laufzeit.host.id} />
+                    <button type="submit" className="btn btn-primary pl-touch-target">
+                      Bestätigen
+                    </button>
+                  </form>
+                  <form action={laufzeitVerwerfenAktion}>
+                    <input type="hidden" name="laufzeitId" value={laufzeit.id} />
+                    <input type="hidden" name="hostId" value={laufzeit.host.id} />
+                    <button type="submit" className="btn btn-outline-danger pl-touch-target">
+                      Verwerfen
+                    </button>
+                  </form>
+                </div>
+              }
+            >
+              Der Host hat ein neues Ablaufdatum gemeldet. Mit dem Erfassen einer Proxmox-Rechnung gilt die
+              Laufzeit automatisch als bestätigt.
+            </Callout>
+          ) : null}
+
+          <div className="row">
+            <div className="col-lg-4">
+              <Card titel="Laufzeit" rahmen="primary">
+                <dl className="row mb-0">
+                  <dt className="col-5 fw-normal text-body-secondary">Host</dt>
+                  <dd className="col-7">
+                    <Link href={`/hosts/${laufzeit.host.id}`}>{laufzeit.host.hostname}</Link>
+                  </dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Kunde</dt>
+                  <dd className="col-7">
+                    {laufzeit.host.kunde ? (
+                      <Link href={`/kunden/${laufzeit.host.kunde.id}`}>{laufzeit.host.kunde.name}</Link>
+                    ) : (
+                      <span className="badge pl-bg-neutral">Nicht zugeordnet</span>
+                    )}
+                  </dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Produkt</dt>
+                  <dd className="col-7">{PRODUKT_TEXT[laufzeit.host.produkt]}</dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Key</dt>
+                  <dd className="col-7">
+                    <CopyableCode wert={laufzeit.key} />
+                  </dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Beginn</dt>
+                  <dd className="col-7">{formatDatum(laufzeit.start)}</dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Ende</dt>
+                  <dd className="col-7">{formatDatum(laufzeit.ende)}</dd>
+                </dl>
+                <hr />
+                <dl className="row mb-0">
+                  <dt className="col-5 fw-normal text-body-secondary">Einkauf netto</dt>
+                  <dd className="col-7">{formatEuro(einkaufBetrag)}</dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Verkauf netto</dt>
+                  <dd className="col-7">{formatEuro(verkaufBetrag)}</dd>
+                  <dt className="col-5 fw-normal text-body-secondary">Marge</dt>
+                  <dd className={`col-7 ${(marge ?? 0) >= 0 ? "pl-text-success" : "pl-text-danger"}`}>
+                    {marge === null ? "–" : formatEuro(marge)}
+                  </dd>
+                </dl>
+              </Card>
+
+              {einkauf && einkauf.positionen.length > 1 ? (
+                <Card titel="Sammelrechnung" rahmen="info">
+                  <p className="small">
+                    Die Proxmox-Rechnung <span className="pl-mono">{einkauf.nummer}</span> deckt mehrere
+                    Laufzeiten ab:
+                  </p>
+                  <ul className="list-unstyled mb-0 small">
+                    {einkauf.positionen.map((position) => (
+                      <li key={position.id} className="mb-1">
+                        {position.laufzeit ? (
+                          <Link href={`/rechnungen/${position.laufzeit.id}`}>
+                            {position.laufzeit.host.hostname}
+                          </Link>
+                        ) : (
+                          position.bezeichnung
+                        )}{" "}
+                        · {formatEuro(Number(position.nettoBetrag))}
+                      </li>
+                    ))}
+                  </ul>
+                </Card>
+              ) : null}
+            </div>
+
+            <div className="col-lg-8">
+              <Card
+                titel="Proxmox-Rechnung (Einkauf)"
+                rahmen={einkauf?.bezahlt ? "info" : "danger"}
+                werkzeuge={<EinkaufBadge bezahlt={einkauf ? einkauf.bezahlt : null} />}
+              >
+                <ProxmoxRechnungFormular
+                  laufzeitId={laufzeit.id}
+                  hostId={laufzeit.host.id}
+                  werte={{
+                    nummer: einkauf?.nummer ?? null,
+                    datum: einkauf?.datum.toISOString() ?? null,
+                    faelligAm: einkauf?.faelligAm?.toISOString() ?? null,
+                    nettoBetrag: einkaufBetrag,
+                    ustSatz: Number(einkauf?.ustSatz ?? 19),
+                    rabatt:
+                      einkauf?.rabatt === null || einkauf?.rabatt === undefined
+                        ? null
+                        : Number(einkauf.rabatt),
+                    zahlungsart: einkauf?.zahlungsart ?? null,
+                    bezahlt: einkauf?.bezahlt ?? false,
+                    bezahltAm: einkauf?.bezahltAm?.toISOString() ?? null,
+                    anhangId: einkauf?.anhangId ?? null,
+                    anhangName: einkauf?.anhang?.dateiname ?? null,
+                  }}
+                />
+              </Card>
+
+              <Card
+                titel="Kundenrechnung (Verkauf)"
+                rahmen={verkauf?.erstellt ? "info" : "warning"}
+                werkzeuge={
+                  <VerkaufBadge erstellt={verkauf?.erstellt ?? false} bezahlt={verkauf?.bezahlt ?? false} />
+                }
+              >
+                <KundenrechnungFormular
+                  laufzeitId={laufzeit.id}
+                  hostId={laufzeit.host.id}
+                  kundeVorhanden={Boolean(laufzeit.host.kunde)}
+                  werte={{
+                    erstellt: verkauf?.erstellt ?? false,
+                    nummer: verkauf?.nummer ?? null,
+                    datum: verkauf?.datum?.toISOString() ?? null,
+                    nettoBetrag: verkaufBetrag,
+                    ustSatz: Number(verkauf?.ustSatz ?? 19),
+                    bezahlt: verkauf?.bezahlt ?? false,
+                    bezahltAm: verkauf?.bezahltAm?.toISOString() ?? null,
+                    anhangId: verkauf?.anhangId ?? null,
+                    anhangName: verkauf?.anhang?.dateiname ?? null,
+                  }}
+                />
+              </Card>
+            </div>
+          </div>
+        </div>
+      </div>
+    </>
+  );
+}

src/app/(dashboard)/rechnungen/page.tsx

@@ -1,26 +1,55 @@
 import Link from "next/link";
 import { ContentHeader } from "@/components/layout/ContentHeader";
+import { StatusHaken } from "@/components/rechnungen/StatusHaken";
+import { Badge } from "@/components/ui/Badges";
+import { Callout } from "@/components/ui/Callout";
 import { Card } from "@/components/ui/Card";
 import { CopyableCode } from "@/components/ui/CopyableCode";
-import { formatDatum, formatEuro } from "@/lib/format";
+import { InfoBox } from "@/components/ui/SmallBox";
-import { hosts, laufzeiten } from "@/mock/data";
+import { prisma } from "@/lib/db";
-import { getKunde, istAbgeschlossen } from "@/mock/queries";
+import { formatDatum, formatEuro, tageBis } from "@/lib/format";
+import {
+  anzahlVorschlaege,
+  laufzeitJahre,
+  rechnungsListe,
+  type RechnungsFilter,
+} from "@/server/queries/rechnungen";
 
 export const metadata = { title: "Rechnungen" };
 
-export default async function RechnungenSeite({
+type SuchParameter = Promise<Record<string, string | string[] | undefined>>;
-  searchParams,
+
-}: {
+function einzeln(wert: string | string[] | undefined): string | undefined {
-  searchParams: Promise<{ filter?: string }>;
+  const text = Array.isArray(wert) ? wert[0] : wert;
-}) {
+  return text && text.length > 0 ? text : undefined;
-  const { filter = "offen" } = await searchParams;
+}
-  const alle = laufzeiten.filter((l) => !l.vorschlag);
+
-  const liste =
+export default async function RechnungenSeite({ searchParams }: { searchParams: SuchParameter }) {
-    filter === "erledigt"
+  const roh = await searchParams;
-      ? alle.filter(istAbgeschlossen)
+  const filter: RechnungsFilter = {
-      : filter === "alle"
+    status: (einzeln(roh.status) as RechnungsFilter["status"]) ?? "offen",
-        ? alle
+    kunde: einzeln(roh.kunde),
-        : alle.filter((l) => !istAbgeschlossen(l));
+    jahr: einzeln(roh.jahr),
+    q: einzeln(roh.q),
+  };
+
+  const [{ zeilen, summen }, jahre, kunden, vorschlaege] = await Promise.all([
+    rechnungsListe(filter),
+    laufzeitJahre(),
+    prisma.kunde.findMany({ orderBy: { name: "asc" }, select: { id: true, name: true } }),
+    anzahlVorschlaege(),
+  ]);
+
+  const heute = new Date();
+
+  function adresse(aenderung: Record<string, string | undefined>) {
+    const params = new URLSearchParams();
+    for (const [schluessel, wert] of Object.entries({ ...filter, ...aenderung })) {
+      if (wert) params.set(schluessel, String(wert));
+    }
+    const text = params.toString();
+    return text ? `/rechnungen?${text}` : "/rechnungen";
+  }
 
   return (
     <>
@@ -28,21 +57,73 @@ export default async function RechnungenSeite({
 
       <div className="app-content">
         <div className="container-fluid">
+          {vorschlaege > 0 && filter.status !== "vorschlaege" ? (
+            <Callout
+              titel={`${vorschlaege} vorgeschlagene Laufzeit${vorschlaege === 1 ? "" : "en"}`}
+              farbe="info"
+              aktion={
+                <Link href={adresse({ status: "vorschlaege" })} className="btn btn-primary pl-touch-target">
+                  Ansehen
+                </Link>
+              }
+            >
+              Die Agents haben neue Ablaufdaten gemeldet. Bestätige die Laufzeit und trage die Rechnungsdaten
+              ein.
+            </Callout>
+          ) : null}
+
+          <p className="small text-body-secondary mb-2">
+            Summen beziehen sich auf die aktuelle Auswahl ({zeilen.length} Laufzeiten).
+          </p>
+
+          <div className="row">
+            <div className="col-6 col-lg-3">
+              <InfoBox
+                text="Einkauf netto"
+                wert={formatEuro(summen.einkauf)}
+                icon="bi-cart"
+                farbe="neutral"
+              />
+            </div>
+            <div className="col-6 col-lg-3">
+              <InfoBox
+                text="Verkauf netto"
+                wert={formatEuro(summen.verkauf)}
+                icon="bi-receipt"
+                farbe="primary"
+              />
+            </div>
+            <div className="col-6 col-lg-3">
+              <InfoBox
+                text="Marge"
+                wert={formatEuro(summen.marge)}
+                icon="bi-graph-up-arrow"
+                farbe="success"
+              />
+            </div>
+            <div className="col-6 col-lg-3">
+              <InfoBox text="Laufzeiten" wert={String(zeilen.length)} icon="bi-calendar-range" farbe="info" />
+            </div>
+          </div>
+
           <Card
-            titel={`${liste.length} Laufzeiten`}
+            titel="Laufzeiten und Rechnungen"
             rahmen="primary"
             tabelle
             werkzeuge={
               <div className="btn-group btn-group-sm" role="group" aria-label="Filter">
-                {[
+                {(
+                  [
                     ["offen", "Offen"],
                     ["erledigt", "Erledigt"],
                     ["alle", "Alle"],
-                ].map(([wert, text]) => (
+                    ["vorschlaege", `Vorschläge${vorschlaege ? ` (${vorschlaege})` : ""}`],
+                  ] as const
+                ).map(([wert, text]) => (
                   <Link
                     key={wert}
-                    href={`/rechnungen?filter=${wert}`}
+                    href={adresse({ status: wert })}
-                    className={`btn ${filter === wert ? "btn-primary" : "btn-outline-primary"}`}
+                    className={`btn ${filter.status === wert ? "btn-primary" : "btn-outline-primary"}`}
                   >
                     {text}
                   </Link>
@@ -50,6 +131,55 @@ export default async function RechnungenSeite({
               </div>
             }
           >
+            <form className="row g-2 p-3 border-bottom" role="search">
+              <input type="hidden" name="status" value={filter.status} />
+              <div className="col-md-4">
+                <input
+                  name="q"
+                  type="search"
+                  defaultValue={filter.q ?? ""}
+                  className="form-control"
+                  placeholder="Rechnungsnummer, Key oder Host …"
+                  aria-label="Suche"
+                />
+              </div>
+              <div className="col-6 col-md-3">
+                <select
+                  name="kunde"
+                  defaultValue={filter.kunde ?? ""}
+                  className="form-select"
+                  aria-label="Kunde"
+                >
+                  <option value="">Alle Kunden</option>
+                  {kunden.map((kunde) => (
+                    <option key={kunde.id} value={kunde.id}>
+                      {kunde.name}
+                    </option>
+                  ))}
+                </select>
+              </div>
+              <div className="col-6 col-md-2">
+                <select
+                  name="jahr"
+                  defaultValue={filter.jahr ?? ""}
+                  className="form-select"
+                  aria-label="Jahr"
+                >
+                  <option value="">Alle Jahre</option>
+                  {jahre.map((jahr) => (
+                    <option key={jahr} value={jahr}>
+                      {jahr}
+                    </option>
+                  ))}
+                </select>
+              </div>
+              <div className="col-md-2">
+                <button type="submit" className="btn btn-primary w-100">
+                  Filtern
+                </button>
+              </div>
+            </form>
+
             <div className="table-responsive">
               <table className="table table-striped align-middle">
                 <thead>
@@ -60,76 +190,106 @@ export default async function RechnungenSeite({
                     <th scope="col">Proxmox-Rechnung</th>
                     <th scope="col">Netto</th>
                     <th scope="col" className="text-center">
-                      Proxmox bezahlt
+                      Bezahlt
                     </th>
                     <th scope="col">Kundenrechnung</th>
                     <th scope="col">Netto</th>
                     <th scope="col" className="text-center">
-                      Kundenrechnung erstellt
+                      Erstellt
+                    </th>
+                    <th scope="col" className="text-center">
+                      Bezahlt
                     </th>
                     <th scope="col">Marge</th>
                   </tr>
                 </thead>
                 <tbody>
-                  {liste.map((laufzeit) => {
+                  {zeilen.map((zeile) => {
-                    const host = hosts.find((h) => h.id === laufzeit.hostId);
+                    const faelligIn = tageBis(zeile.einkaufFaelligAm, heute);
-                    const kunde = getKunde(host?.kundeId ?? null);
-                    const marge = (laufzeit.verkauf?.nettoBetrag ?? 0) - (laufzeit.einkauf?.nettoBetrag ?? 0);
                     return (
-                      <tr key={laufzeit.id}>
+                      <tr key={zeile.id}>
                         <td>
-                          {kunde ? (
+                          {zeile.kunde ? (
-                            <Link href={`/kunden/${kunde.id}`} className="text-decoration-none">
+                            <Link href={`/kunden/${zeile.kunde.id}`} className="text-decoration-none">
-                              {kunde.name}
+                              {zeile.kunde.name}
                             </Link>
                           ) : (
                             <span className="badge pl-bg-neutral">Nicht zugeordnet</span>
                           )}
                         </td>
                         <td>
-                          <Link href={`/hosts/${laufzeit.hostId}`} className="text-decoration-none">
+                          <Link href={`/hosts/${zeile.hostId}`} className="text-decoration-none">
-                            {host?.hostname}
+                            {zeile.hostname}
                           </Link>
                         </td>
                         <td>
-                          {formatDatum(laufzeit.start)} – {formatDatum(laufzeit.ende)}
+                          <Link href={`/rechnungen/${zeile.id}`} className="text-decoration-none">
+                            {formatDatum(zeile.start)} – {formatDatum(zeile.ende)}
+                          </Link>
+                          {zeile.vorschlag ? <Badge farbe="info">Vorschlag</Badge> : null}
                         </td>
                         <td>
-                          <CopyableCode wert={laufzeit.einkauf?.nummer ?? null} />
+                          <CopyableCode wert={zeile.einkaufNummer} />
+                          {zeile.einkaufBezahlt === false && faelligIn !== null && faelligIn <= 7 ? (
+                            <div className="small pl-text-danger">
+                              fällig {formatDatum(zeile.einkaufFaelligAm)}
+                            </div>
+                          ) : null}
                         </td>
-                        <td>{formatEuro(laufzeit.einkauf?.nettoBetrag)}</td>
+                        <td>{formatEuro(zeile.einkaufBetrag)}</td>
                         <td className="text-center">
-                          <input
+                          <StatusHaken
-                            type="checkbox"
+                            laufzeitId={zeile.id}
-                            className="form-check-input pl-touch-target"
+                            hostId={zeile.hostId}
-                            defaultChecked={laufzeit.einkauf?.bezahlt ?? false}
+                            feld="einkaufBezahlt"
-                            aria-label="Proxmox-Rechnung bezahlt"
+                            wert={zeile.einkaufBezahlt === true}
+                            deaktiviert={zeile.einkaufBezahlt === null}
+                            titel="Proxmox-Rechnung bezahlt"
                           />
                         </td>
                         <td>
-                          <CopyableCode wert={laufzeit.verkauf?.nummer ?? null} />
+                          <CopyableCode wert={zeile.verkaufNummer} />
                         </td>
-                        <td>{formatEuro(laufzeit.verkauf?.nettoBetrag)}</td>
+                        <td>{formatEuro(zeile.verkaufBetrag)}</td>
                         <td className="text-center">
-                          <input
+                          <StatusHaken
-                            type="checkbox"
+                            laufzeitId={zeile.id}
-                            className="form-check-input pl-touch-target"
+                            hostId={zeile.hostId}
-                            defaultChecked={laufzeit.verkauf?.erstellt ?? false}
+                            feld="verkaufErstellt"
-                            aria-label="Kundenrechnung erstellt"
+                            wert={zeile.verkaufErstellt}
+                            titel="Kundenrechnung erstellt"
                           />
                         </td>
-                        <td className={marge >= 0 ? "pl-text-success" : "pl-text-danger"}>
+                        <td className="text-center">
-                          {laufzeit.verkauf?.nettoBetrag ? formatEuro(marge) : "–"}
+                          <StatusHaken
+                            laufzeitId={zeile.id}
+                            hostId={zeile.hostId}
+                            feld="verkaufBezahlt"
+                            wert={zeile.verkaufBezahlt}
+                            deaktiviert={!zeile.verkaufErstellt}
+                            titel="Kundenrechnung vom Kunden bezahlt"
+                          />
+                        </td>
+                        <td className={(zeile.marge ?? 0) >= 0 ? "pl-text-success" : "pl-text-danger"}>
+                          {zeile.marge === null ? "–" : formatEuro(zeile.marge)}
                         </td>
                       </tr>
                     );
                   })}
+                  {zeilen.length === 0 ? (
+                    <tr>
+                      <td colSpan={11} className="text-center text-body-secondary py-4">
+                        Nichts gefunden. <Link href="/rechnungen?status=alle">Alle anzeigen</Link>
+                      </td>
+                    </tr>
+                  ) : null}
                 </tbody>
               </table>
             </div>
           </Card>
+
           <p className="small text-body-secondary">
-            Im Prototyp sind die Häkchen noch ohne Wirkung. Ab #008 setzen sie den Status direkt.
+            Die Häkchen wirken sofort. Für Rechnungsnummer, Beträge und PDF die Laufzeit öffnen.
           </p>
         </div>
       </div>

src/app/anhang/[id]/route.ts

@@ -0,0 +1,26 @@
+import { readFile } from "node:fs/promises";
+import { prisma } from "@/lib/db";
+import { anhangPfad } from "@/lib/uploads";
+
+export const dynamic = "force-dynamic";
+
+/** Liefert ein hinterlegtes Rechnungs-PDF aus. */
+export async function GET(_request: Request, { params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params;
+  const anhang = await prisma.anhang.findUnique({ where: { id } });
+  if (!anhang) return new Response("Nicht gefunden", { status: 404 });
+
+  try {
+    const inhalt = await readFile(anhangPfad(anhang.pfad));
+    return new Response(new Uint8Array(inhalt), {
+      headers: {
+        "Content-Type": anhang.mimeTyp,
+        "Content-Disposition": `inline; filename="${encodeURIComponent(anhang.dateiname)}"`,
+        "Content-Length": String(inhalt.length),
+        "Cache-Control": "private, no-store",
+      },
+    });
+  } catch {
+    return new Response("Datei fehlt auf der Platte", { status: 410 });
+  }
+}

src/components/hosts/HostFilterLeiste.tsx

@@ -0,0 +1,146 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+
+/**
+ * Filterleiste der Host-Tabelle. Alle Filter stehen in der Adresse, damit sich eine
+ * gefilterte Liste teilen lässt und der Zurück-Knopf funktioniert.
+ */
+export function HostFilterLeiste({
+  kunden,
+  werte,
+}: {
+  kunden: { id: string; name: string }[];
+  werte: Record<string, string | undefined>;
+}) {
+  const router = useRouter();
+  const pathname = usePathname();
+  const parameter = useSearchParams();
+
+  function setzen(schluessel: string, wert: string) {
+    const neu = new URLSearchParams(parameter.toString());
+    if (wert) neu.set(schluessel, wert);
+    else neu.delete(schluessel);
+    neu.delete("seite");
+    router.push(`${pathname}?${neu.toString()}`);
+  }
+
+  const aktiveFilter = ["kunde", "status", "produkt", "ablauf", "rechnung", "q"].filter(
+    (schluessel) => werte[schluessel],
+  ).length;
+
+  return (
+    <form
+      className="row g-2 p-3 border-bottom"
+      role="search"
+      onSubmit={(e) => {
+        e.preventDefault();
+        const eingabe = new FormData(e.currentTarget).get("q")?.toString() ?? "";
+        setzen("q", eingabe);
+      }}
+    >
+      <div className="col-md-4">
+        <label className="visually-hidden" htmlFor="q">
+          Suche
+        </label>
+        <div className="input-group">
+          <input
+            id="q"
+            name="q"
+            type="search"
+            defaultValue={werte.q ?? ""}
+            className="form-control"
+            placeholder="Hostname, Key, Server-ID, IP oder Rechnungsnummer …"
+          />
+          <button type="submit" className="btn btn-primary" aria-label="Suchen">
+            <i className="bi bi-search" aria-hidden="true" />
+          </button>
+        </div>
+      </div>
+
+      <div className="col-6 col-md-2">
+        <select
+          className="form-select"
+          aria-label="Kunde"
+          value={werte.kunde ?? ""}
+          onChange={(e) => setzen("kunde", e.target.value)}
+        >
+          <option value="">Alle Kunden</option>
+          <option value="ohne">Nicht zugeordnet</option>
+          {kunden.map((kunde) => (
+            <option key={kunde.id} value={kunde.id}>
+              {kunde.name}
+            </option>
+          ))}
+        </select>
+      </div>
+
+      <div className="col-6 col-md-2">
+        <select
+          className="form-select"
+          aria-label="Status"
+          value={werte.status ?? ""}
+          onChange={(e) => setzen("status", e.target.value)}
+        >
+          <option value="">Alle Status</option>
+          <option value="ACTIVE">Aktiv</option>
+          <option value="EXPIRED">Abgelaufen</option>
+          <option value="NOTFOUND">Keine Subscription</option>
+          <option value="INVALID">Ungültig</option>
+          <option value="SUSPENDED">Ausgesetzt</option>
+          <option value="UNKNOWN">Unbekannt</option>
+          <option value="keine-meldung">Meldet sich nicht</option>
+        </select>
+      </div>
+
+      <div className="col-6 col-md-2">
+        <select
+          className="form-select"
+          aria-label="Produkt"
+          value={werte.produkt ?? ""}
+          onChange={(e) => setzen("produkt", e.target.value)}
+        >
+          <option value="">Alle Produkte</option>
+          <option value="PVE">Proxmox VE</option>
+          <option value="PBS">Backup Server</option>
+          <option value="PMG">Mail Gateway</option>
+        </select>
+      </div>
+
+      <div className="col-6 col-md-2">
+        <select
+          className="form-select"
+          aria-label="Ablauf"
+          value={werte.ablauf ?? ""}
+          onChange={(e) => setzen("ablauf", e.target.value)}
+        >
+          <option value="">Jeder Ablauf</option>
+          <option value="14">Läuft in 14 Tagen ab</option>
+          <option value="30">Läuft in 30 Tagen ab</option>
+          <option value="abgelaufen">Abgelaufen</option>
+        </select>
+      </div>
+
+      <div className="col-12 d-flex align-items-center gap-3">
+        <div className="form-check">
+          <input
+            className="form-check-input"
+            type="checkbox"
+            id="rechnung"
+            checked={werte.rechnung === "offen"}
+            onChange={(e) => setzen("rechnung", e.target.checked ? "offen" : "")}
+          />
+          <label className="form-check-label small" htmlFor="rechnung">
+            nur mit offenen Rechnungspunkten
+          </label>
+        </div>
+        {aktiveFilter > 0 ? (
+          <Link href="/hosts" className="small">
+            Filter zurücksetzen ({aktiveFilter})
+          </Link>
+        ) : null}
+      </div>
+    </form>
+  );
+}

src/components/hosts/HostNotizen.tsx

@@ -0,0 +1,60 @@
+"use client";
+
+import { useActionState } from "react";
+import { hostNotizenSpeichern } from "@/server/actions/host-detail";
+import type { AktionsErgebnis } from "@/server/actions/kunden";
+
+const LEER: AktionsErgebnis = {};
+
+export function HostNotizen({
+  hostId,
+  notizen,
+  tags,
+}: {
+  hostId: string;
+  notizen: string | null;
+  tags: string[];
+}) {
+  const [ergebnis, aktion, laeuft] = useActionState(hostNotizenSpeichern, LEER);
+
+  return (
+    <form action={aktion}>
+      <input type="hidden" name="hostId" value={hostId} />
+
+      {ergebnis.erfolg ? <div className="alert alert-success py-2">{ergebnis.erfolg}</div> : null}
+      {ergebnis.fehler ? <div className="alert alert-danger py-2">{ergebnis.fehler}</div> : null}
+
+      <div className="mb-3">
+        <label className="form-label" htmlFor="notizen">
+          Notizen
+        </label>
+        <textarea
+          id="notizen"
+          name="notizen"
+          rows={5}
+          className="form-control"
+          defaultValue={notizen ?? ""}
+          placeholder="z. B. Verlängerung mit Kundin besprochen"
+        />
+      </div>
+
+      <div className="mb-3">
+        <label className="form-label" htmlFor="tags">
+          Tags
+        </label>
+        <input
+          id="tags"
+          name="tags"
+          className="form-control"
+          defaultValue={tags.join(", ")}
+          placeholder="produktiv, cluster, backup"
+        />
+        <div className="form-text">Mehrere Tags mit Komma trennen.</div>
+      </div>
+
+      <button type="submit" className="btn btn-primary pl-touch-target" disabled={laeuft}>
+        {laeuft ? "Speichert …" : "Speichern"}
+      </button>
+    </form>
+  );
+}

src/components/rechnungen/RechnungsFormulare.tsx

@@ -0,0 +1,345 @@
+"use client";
+
+import { useActionState } from "react";
+import { kundenrechnungSpeichern, proxmoxRechnungSpeichern } from "@/server/actions/rechnungen";
+import type { AktionsErgebnis } from "@/server/actions/kunden";
+
+const LEER: AktionsErgebnis = {};
+
+function isoDatum(wert: string | null | undefined) {
+  return wert ? wert.slice(0, 10) : "";
+}
+
+function Meldung({ ergebnis }: { ergebnis: AktionsErgebnis }) {
+  if (ergebnis.fehler) return <div className="alert alert-danger py-2">{ergebnis.fehler}</div>;
+  if (ergebnis.erfolg) return <div className="alert alert-success py-2">{ergebnis.erfolg}</div>;
+  return null;
+}
+
+export interface ProxmoxWerte {
+  nummer: string | null;
+  datum: string | null;
+  faelligAm: string | null;
+  nettoBetrag: number | null;
+  ustSatz: number;
+  rabatt: number | null;
+  zahlungsart: string | null;
+  bezahlt: boolean;
+  bezahltAm: string | null;
+  anhangId: string | null;
+  anhangName: string | null;
+}
+
+/** Proxmox-Rechnung (Einkauf). Gleiche Rechnungsnummer heißt: Position an derselben Rechnung. */
+export function ProxmoxRechnungFormular({
+  laufzeitId,
+  hostId,
+  werte,
+}: {
+  laufzeitId: string;
+  hostId: string;
+  werte: ProxmoxWerte;
+}) {
+  const [ergebnis, aktion, laeuft] = useActionState(proxmoxRechnungSpeichern, LEER);
+
+  return (
+    <form action={aktion}>
+      <input type="hidden" name="laufzeitId" value={laufzeitId} />
+      <input type="hidden" name="hostId" value={hostId} />
+      <Meldung ergebnis={ergebnis} />
+
+      <div className="row g-3">
+        <div className="col-md-6">
+          <label className="form-label" htmlFor="px-nummer">
+            Rechnungsnummer *
+          </label>
+          <input
+            id="px-nummer"
+            name="nummer"
+            className="form-control pl-mono"
+            defaultValue={werte.nummer ?? ""}
+            placeholder="PX-2026-14790"
+            required
+          />
+          <div className="form-text">
+            Eine bereits vorhandene Nummer ergänzt die Sammelrechnung um diese Laufzeit.
+          </div>
+        </div>
+        <div className="col-md-3">
+          <label className="form-label" htmlFor="px-datum">
+            Rechnungsdatum *
+          </label>
+          <input
+            id="px-datum"
+            name="datum"
+            type="date"
+            className="form-control"
+            defaultValue={isoDatum(werte.datum)}
+            required
+          />
+        </div>
+        <div className="col-md-3">
+          <label className="form-label" htmlFor="px-faellig">
+            Fällig am
+          </label>
+          <input
+            id="px-faellig"
+            name="faelligAm"
+            type="date"
+            className="form-control"
+            defaultValue={isoDatum(werte.faelligAm)}
+          />
+        </div>
+
+        <div className="col-md-3">
+          <label className="form-label" htmlFor="px-netto">
+            Netto (€) *
+          </label>
+          <input
+            id="px-netto"
+            name="nettoBetrag"
+            className="form-control"
+            inputMode="decimal"
+            defaultValue={werte.nettoBetrag ?? ""}
+            required
+          />
+        </div>
+        <div className="col-md-2">
+          <label className="form-label" htmlFor="px-ust">
+            USt (%)
+          </label>
+          <input
+            id="px-ust"
+            name="ustSatz"
+            className="form-control"
+            inputMode="decimal"
+            defaultValue={werte.ustSatz}
+          />
+        </div>
+        <div className="col-md-3">
+          <label className="form-label" htmlFor="px-rabatt">
+            Rabatt (€)
+          </label>
+          <input
+            id="px-rabatt"
+            name="rabatt"
+            className="form-control"
+            inputMode="decimal"
+            defaultValue={werte.rabatt ?? ""}
+          />
+        </div>
+        <div className="col-md-4">
+          <label className="form-label" htmlFor="px-zahlungsart">
+            Zahlungsart
+          </label>
+          <input
+            id="px-zahlungsart"
+            name="zahlungsart"
+            className="form-control"
+            defaultValue={werte.zahlungsart ?? ""}
+            placeholder="Überweisung"
+          />
+        </div>
+
+        <div className="col-md-4 d-flex align-items-end">
+          <div className="form-check">
+            <input
+              className="form-check-input"
+              type="checkbox"
+              id="px-bezahlt"
+              name="bezahlt"
+              defaultChecked={werte.bezahlt}
+            />
+            <label className="form-check-label" htmlFor="px-bezahlt">
+              bezahlt
+            </label>
+          </div>
+        </div>
+        <div className="col-md-4">
+          <label className="form-label" htmlFor="px-bezahltAm">
+            Bezahlt am
+          </label>
+          <input
+            id="px-bezahltAm"
+            name="bezahltAm"
+            type="date"
+            className="form-control"
+            defaultValue={isoDatum(werte.bezahltAm)}
+          />
+        </div>
+        <div className="col-md-4">
+          <label className="form-label" htmlFor="px-pdf">
+            PDF (max. 10 MB)
+          </label>
+          <input id="px-pdf" name="pdf" type="file" accept="application/pdf" className="form-control" />
+          {werte.anhangId ? (
+            <div className="form-text">
+              Hinterlegt:{" "}
+              <a href={`/anhang/${werte.anhangId}`} target="_blank" rel="noreferrer">
+                {werte.anhangName ?? "PDF ansehen"}
+              </a>
+            </div>
+          ) : null}
+        </div>
+      </div>
+
+      <button type="submit" className="btn btn-primary mt-3 pl-touch-target" disabled={laeuft}>
+        {laeuft ? "Speichert …" : "Proxmox-Rechnung speichern"}
+      </button>
+    </form>
+  );
+}
+
+export interface KundenWerte {
+  erstellt: boolean;
+  nummer: string | null;
+  datum: string | null;
+  nettoBetrag: number | null;
+  ustSatz: number;
+  bezahlt: boolean;
+  bezahltAm: string | null;
+  anhangId: string | null;
+  anhangName: string | null;
+}
+
+/** Kundenrechnung (Verkauf). */
+export function KundenrechnungFormular({
+  laufzeitId,
+  hostId,
+  werte,
+  kundeVorhanden,
+}: {
+  laufzeitId: string;
+  hostId: string;
+  werte: KundenWerte;
+  kundeVorhanden: boolean;
+}) {
+  const [ergebnis, aktion, laeuft] = useActionState(kundenrechnungSpeichern, LEER);
+
+  if (!kundeVorhanden) {
+    return (
+      <p className="mb-0 text-body-secondary">
+        Dieser Host ist keinem Kunden zugewiesen. Ohne Kunde lässt sich keine Kundenrechnung erfassen.
+      </p>
+    );
+  }
+
+  return (
+    <form action={aktion}>
+      <input type="hidden" name="laufzeitId" value={laufzeitId} />
+      <input type="hidden" name="hostId" value={hostId} />
+      <Meldung ergebnis={ergebnis} />
+
+      <div className="row g-3">
+        <div className="col-md-4 d-flex align-items-end">
+          <div className="form-check">
+            <input
+              className="form-check-input"
+              type="checkbox"
+              id="kr-erstellt"
+              name="erstellt"
+              defaultChecked={werte.erstellt}
+            />
+            <label className="form-check-label" htmlFor="kr-erstellt">
+              Rechnung ist erstellt
+            </label>
+          </div>
+        </div>
+        <div className="col-md-4">
+          <label className="form-label" htmlFor="kr-nummer">
+            Rechnungsnummer
+          </label>
+          <input
+            id="kr-nummer"
+            name="nummer"
+            className="form-control pl-mono"
+            defaultValue={werte.nummer ?? ""}
+            placeholder="RE-2026-0412"
+          />
+          <div className="form-text">Gleiche Nummer = eine Rechnung über mehrere Laufzeiten.</div>
+        </div>
+        <div className="col-md-4">
+          <label className="form-label" htmlFor="kr-datum">
+            Rechnungsdatum
+          </label>
+          <input
+            id="kr-datum"
+            name="datum"
+            type="date"
+            className="form-control"
+            defaultValue={isoDatum(werte.datum)}
+          />
+        </div>
+
+        <div className="col-md-4">
+          <label className="form-label" htmlFor="kr-netto">
+            Netto (€)
+          </label>
+          <input
+            id="kr-netto"
+            name="nettoBetrag"
+            className="form-control"
+            inputMode="decimal"
+            defaultValue={werte.nettoBetrag ?? ""}
+          />
+        </div>
+        <div className="col-md-2">
+          <label className="form-label" htmlFor="kr-ust">
+            USt (%)
+          </label>
+          <input
+            id="kr-ust"
+            name="ustSatz"
+            className="form-control"
+            inputMode="decimal"
+            defaultValue={werte.ustSatz}
+          />
+        </div>
+        <div className="col-md-3 d-flex align-items-end">
+          <div className="form-check">
+            <input
+              className="form-check-input"
+              type="checkbox"
+              id="kr-bezahlt"
+              name="bezahlt"
+              defaultChecked={werte.bezahlt}
+            />
+            <label className="form-check-label" htmlFor="kr-bezahlt">
+              vom Kunden bezahlt
+            </label>
+          </div>
+        </div>
+        <div className="col-md-3">
+          <label className="form-label" htmlFor="kr-bezahltAm">
+            Bezahlt am
+          </label>
+          <input
+            id="kr-bezahltAm"
+            name="bezahltAm"
+            type="date"
+            className="form-control"
+            defaultValue={isoDatum(werte.bezahltAm)}
+          />
+        </div>
+        <div className="col-md-6">
+          <label className="form-label" htmlFor="kr-pdf">
+            PDF (max. 10 MB)
+          </label>
+          <input id="kr-pdf" name="pdf" type="file" accept="application/pdf" className="form-control" />
+          {werte.anhangId ? (
+            <div className="form-text">
+              Hinterlegt:{" "}
+              <a href={`/anhang/${werte.anhangId}`} target="_blank" rel="noreferrer">
+                {werte.anhangName ?? "PDF ansehen"}
+              </a>
+            </div>
+          ) : null}
+        </div>
+      </div>
+
+      <button type="submit" className="btn btn-primary mt-3 pl-touch-target" disabled={laeuft}>
+        {laeuft ? "Speichert …" : "Kundenrechnung speichern"}
+      </button>
+    </form>
+  );
+}

src/components/rechnungen/StatusHaken.tsx

@@ -0,0 +1,60 @@
+"use client";
+
+import { useTransition } from "react";
+import { statusUmschalten } from "@/server/actions/rechnungen";
+
+/**
+ * Häkchen, das den Rechnungsstatus direkt in der Tabelle setzt.
+ * Ohne erfasste Rechnung bleibt es deaktiviert – außer bei „Kundenrechnung erstellt“,
+ * denn dort legt das Häkchen eine Rechnung ohne Nummer an, die später ergänzt wird.
+ */
+export function StatusHaken({
+  laufzeitId,
+  hostId,
+  feld,
+  wert,
+  deaktiviert = false,
+  titel,
+}: {
+  laufzeitId: string;
+  hostId: string;
+  feld: "einkaufBezahlt" | "verkaufErstellt" | "verkaufBezahlt";
+  wert: boolean;
+  deaktiviert?: boolean;
+  titel: string;
+}) {
+  const [laeuft, starte] = useTransition();
+
+  function umschalten(neu: boolean) {
+    const daten = new FormData();
+    daten.set("laufzeitId", laufzeitId);
+    daten.set("hostId", hostId);
+    daten.set("feld", feld);
+    daten.set("wert", String(neu));
+    starte(async () => {
+      await statusUmschalten(daten);
+    });
+  }
+
+  return (
+    <span className="d-inline-flex align-items-center justify-content-center">
+      {laeuft ? (
+        <span
+          className="spinner-border spinner-border-sm text-body-secondary"
+          role="status"
+          aria-hidden="true"
+        />
+      ) : (
+        <input
+          type="checkbox"
+          className="form-check-input pl-touch-target"
+          checked={wert}
+          disabled={deaktiviert}
+          onChange={(e) => umschalten(e.target.checked)}
+          aria-label={titel}
+          title={deaktiviert ? "Erst eine Rechnung erfassen" : titel}
+        />
+      )}
+    </span>
+  );
+}

src/components/ui/TodoList.tsx

@@ -1,7 +1,8 @@
 "use client";
 
 import Link from "next/link";
-import { useState } from "react";
+import { useState, useTransition } from "react";
+import { statusUmschalten } from "@/server/actions/rechnungen";
 import { Badge } from "./Badges";
 import type { Farbton } from "./SmallBox";
 
@@ -12,6 +13,12 @@ export interface Aufgabe {
   dringlichkeit: "gefahr" | "warnung" | "info";
   badgeText: string;
   href: string;
+  /** Gesetzt, wenn das Abhaken direkt einen Rechnungsstatus setzt. */
+  aktion?: {
+    laufzeitId: string;
+    hostId: string;
+    feld: "einkaufBezahlt" | "verkaufErstellt";
+  };
 }
 
 const BADGE_FARBE: Record<Aufgabe["dringlichkeit"], Farbton> = {
@@ -21,14 +28,30 @@ const BADGE_FARBE: Record<Aufgabe["dringlichkeit"], Farbton> = {
 };
 
 /**
- * Aufgabenliste im AdminLTE-Todo-Stil. Im Prototyp merkt sich das Abhaken den Zustand nur lokal;
+ * Aufgabenliste im AdminLTE-Todo-Stil. Aufgaben mit `aktion` setzen beim Abhaken den
- * ab #008 setzt es den Rechnungsstatus in der Datenbank.
+ * Rechnungsstatus in der Datenbank; die übrigen sind Merkposten und verschwinden erst,
+ * wenn die Ursache behoben ist (z. B. ein Host einem Kunden zugewiesen wurde).
  */
 export function TodoList({ aufgaben }: { aufgaben: Aufgabe[] }) {
-  const [erledigt, setErledigt] = useState<string[]>([]);
+  const [oertlichErledigt, setOertlichErledigt] = useState<string[]>([]);
+  const [laeuft, starte] = useTransition();
 
-  function umschalten(id: string) {
+  function umschalten(aufgabe: Aufgabe) {
-    setErledigt((alt) => (alt.includes(id) ? alt.filter((x) => x !== id) : [...alt, id]));
+    if (!aufgabe.aktion) {
+      setOertlichErledigt((alt) =>
+        alt.includes(aufgabe.id) ? alt.filter((x) => x !== aufgabe.id) : [...alt, aufgabe.id],
+      );
+      return;
+    }
+
+    const daten = new FormData();
+    daten.set("laufzeitId", aufgabe.aktion.laufzeitId);
+    daten.set("hostId", aufgabe.aktion.hostId);
+    daten.set("feld", aufgabe.aktion.feld);
+    daten.set("wert", "true");
+    starte(async () => {
+      await statusUmschalten(daten);
+    });
   }
 
   if (aufgaben.length === 0) {
@@ -38,7 +61,7 @@ export function TodoList({ aufgaben }: { aufgaben: Aufgabe[] }) {
   return (
     <ul className="pl-todo-list">
       {aufgaben.map((aufgabe) => {
-        const istErledigt = erledigt.includes(aufgabe.id);
+        const istErledigt = oertlichErledigt.includes(aufgabe.id);
         return (
           <li
             key={aufgabe.id}
@@ -48,8 +71,12 @@ export function TodoList({ aufgaben }: { aufgaben: Aufgabe[] }) {
               type="checkbox"
               className="form-check-input mt-1 pl-touch-target"
               checked={istErledigt}
-              onChange={() => umschalten(aufgabe.id)}
+              disabled={laeuft}
-              aria-label={`${aufgabe.titel} erledigt`}
+              onChange={() => umschalten(aufgabe)}
+              aria-label={
+                aufgabe.aktion ? `${aufgabe.titel} als erledigt eintragen` : `${aufgabe.titel} abhaken`
+              }
+              title={aufgabe.aktion ? "Setzt den Rechnungsstatus" : "Nur zur eigenen Übersicht"}
             />
             <div className="flex-grow-1 pl-todo-text">
               <Link href={aufgabe.href} className="fw-semibold text-decoration-none">

src/lib/csv.ts

@@ -0,0 +1,41 @@
+/** CSV für deutsche Tabellenkalkulationen: Semikolon, UTF-8 mit BOM, Komma als Dezimaltrennzeichen. */
+
+const datumFormat = new Intl.DateTimeFormat("de-DE", {
+  timeZone: "Europe/Berlin",
+  day: "2-digit",
+  month: "2-digit",
+  year: "numeric",
+});
+
+export function csvZelle(wert: string | number | Date | null | undefined): string {
+  if (wert === null || wert === undefined) return "";
+  if (wert instanceof Date) return datumFormat.format(wert);
+  if (typeof wert === "number") {
+    // Ganze Zahlen (z. B. Sockets) ohne Nachkommastellen, Beträge mit zwei.
+    return Number.isInteger(wert)
+      ? wert.toLocaleString("de-DE")
+      : wert.toLocaleString("de-DE", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+  }
+
+  const text = String(wert);
+  return /[";\n]/.test(text) ? `"${text.replaceAll('"', '""')}"` : text;
+}
+
+export function csvDatei(
+  kopfzeile: string[],
+  zeilen: (string | number | Date | null | undefined)[][],
+): string {
+  const inhalt = [kopfzeile, ...zeilen].map((zeile) => zeile.map(csvZelle).join(";")).join("\r\n");
+  // Das BOM sorgt dafür, dass Excel die Umlaute richtig liest.
+  return `\uFEFF${inhalt}\r\n`;
+}
+
+export function csvAntwort(inhalt: string, dateiname: string): Response {
+  return new Response(inhalt, {
+    headers: {
+      "Content-Type": "text/csv; charset=utf-8",
+      "Content-Disposition": `attachment; filename="${dateiname}"`,
+      "Cache-Control": "no-store",
+    },
+  });
+}

src/lib/uploads.ts

@@ -0,0 +1,53 @@
+import { createHash } from "node:crypto";
+import { mkdir, writeFile } from "node:fs/promises";
+import path from "node:path";
+import { prisma } from "./db";
+
+/** Rechnungs-PDFs liegen auf der Platte, nur die Metadaten in der Datenbank. */
+export const UPLOAD_VERZEICHNIS = process.env.UPLOAD_DIR ?? path.join(process.cwd(), "data", "uploads");
+export const MAX_GROESSE = 10 * 1024 * 1024;
+
+export class UploadFehler extends Error {}
+
+/**
+ * Nimmt ein PDF entgegen und legt es unter seiner Prüfsumme ab.
+ * Gleiche Datei zweimal hochgeladen heißt: derselbe Anhang, kein zweites Exemplar auf der Platte.
+ */
+export async function anhangSpeichern(datei: File): Promise<string> {
+  if (datei.size === 0) throw new UploadFehler("Die Datei ist leer.");
+  if (datei.size > MAX_GROESSE) {
+    throw new UploadFehler(`Die Datei ist größer als ${MAX_GROESSE / 1024 / 1024} MB.`);
+  }
+
+  const inhalt = Buffer.from(await datei.arrayBuffer());
+
+  // Nicht auf den gemeldeten Typ verlassen, sondern in die Datei sehen.
+  if (inhalt.subarray(0, 5).toString("latin1") !== "%PDF-") {
+    throw new UploadFehler("Nur PDF-Dateien sind erlaubt.");
+  }
+
+  const sha256 = createHash("sha256").update(inhalt).digest("hex");
+  const vorhanden = await prisma.anhang.findFirst({ where: { sha256 } });
+  if (vorhanden) return vorhanden.id;
+
+  await mkdir(UPLOAD_VERZEICHNIS, { recursive: true });
+  const dateiname = `${sha256}.pdf`;
+  await writeFile(path.join(UPLOAD_VERZEICHNIS, dateiname), inhalt, { mode: 0o640 });
+
+  const anhang = await prisma.anhang.create({
+    data: {
+      dateiname: datei.name || dateiname,
+      pfad: dateiname,
+      mimeTyp: "application/pdf",
+      groesse: inhalt.length,
+      sha256,
+    },
+  });
+
+  return anhang.id;
+}
+
+export function anhangPfad(pfad: string): string {
+  // Nur der Dateiname aus der Datenbank wird verwendet; Pfadangaben darin werden verworfen.
+  return path.join(UPLOAD_VERZEICHNIS, path.basename(pfad));
+}

src/server/actions/host-detail.ts

@@ -0,0 +1,61 @@
+"use server";
+
+import { revalidatePath } from "next/cache";
+import { prisma } from "@/lib/db";
+import { protokolliere } from "@/server/audit";
+import type { AktionsErgebnis } from "./kunden";
+
+/** Speichert Notizen und Tags eines Hosts. */
+export async function hostNotizenSpeichern(
+  _vorher: AktionsErgebnis,
+  formular: FormData,
+): Promise<AktionsErgebnis> {
+  const hostId = formular.get("hostId")?.toString();
+  if (!hostId) return { fehler: "Host nicht gefunden." };
+
+  const notizen = formular.get("notizen")?.toString().trim() || null;
+  const tags = (formular.get("tags")?.toString() ?? "")
+    .split(",")
+    .map((tag) => tag.trim().toLowerCase())
+    .filter(Boolean)
+    .slice(0, 12);
+
+  await prisma.host.update({
+    where: { id: hostId },
+    data: {
+      notizen,
+      tags: {
+        set: [],
+        connectOrCreate: tags.map((name) => ({ where: { name }, create: { name } })),
+      },
+    },
+  });
+
+  await protokolliere("host.notizen_geaendert", "Host", hostId, { notizen, tags });
+  revalidatePath(`/hosts/${hostId}`);
+
+  return { erfolg: "Gespeichert." };
+}
+
+/** Ordnet einen einzelnen Host einem Kunden zu (aus der Detailansicht heraus). */
+export async function hostKundeSetzen(formular: FormData) {
+  const hostId = formular.get("hostId")?.toString();
+  const kundeId = formular.get("kundeId")?.toString() || null;
+  const standortId = formular.get("standortId")?.toString() || null;
+  if (!hostId) return;
+
+  await prisma.host.update({ where: { id: hostId }, data: { kundeId, standortId } });
+  await protokolliere("host.zugewiesen", "Host", hostId, { kundeId, standortId });
+
+  if (kundeId) {
+    await prisma.alert.updateMany({
+      where: { regel: "host-ohne-kunde", hostId, erledigtAm: null },
+      data: { erledigtAm: new Date() },
+    });
+  }
+
+  revalidatePath(`/hosts/${hostId}`);
+  revalidatePath("/hosts");
+  revalidatePath("/hosts/nicht-zugeordnet");
+  revalidatePath("/");
+}

src/server/actions/rechnungen.ts

@@ -0,0 +1,168 @@
+"use server";
+
+import { revalidatePath } from "next/cache";
+import { anhangSpeichern, UploadFehler } from "@/lib/uploads";
+import {
+  einkaufBezahltSetzen,
+  kundenrechnungErfassen,
+  laufzeitAnlegen,
+  laufzeitBestaetigen,
+  laufzeitVerwerfen,
+  proxmoxRechnungErfassen,
+  RechnungsFehler,
+  verkaufBezahltSetzen,
+  verkaufErstelltSetzen,
+} from "@/server/services/rechnungen";
+import type { AktionsErgebnis } from "./kunden";
+
+function datum(wert: FormDataEntryValue | null): Date | null {
+  const text = wert?.toString().trim();
+  return text ? new Date(`${text}T00:00:00Z`) : null;
+}
+
+function betrag(wert: FormDataEntryValue | null): number | null {
+  const text = wert?.toString().trim().replace(",", ".");
+  if (!text) return null;
+  const zahl = Number(text);
+  return Number.isFinite(zahl) ? zahl : null;
+}
+
+function seitenNeuLaden(hostId?: string | null) {
+  revalidatePath("/rechnungen");
+  revalidatePath("/");
+  revalidatePath("/kunden");
+  if (hostId) revalidatePath(`/hosts/${hostId}`);
+}
+
+/** Wandelt Fehler aus der Fachlogik in eine Rückmeldung für das Formular. */
+async function ausfuehren(arbeit: () => Promise<string | void>): Promise<AktionsErgebnis> {
+  try {
+    const meldung = await arbeit();
+    return { erfolg: meldung || "Gespeichert." };
+  } catch (fehler) {
+    if (fehler instanceof RechnungsFehler || fehler instanceof UploadFehler) {
+      return { fehler: fehler.message };
+    }
+    throw fehler;
+  }
+}
+
+export async function laufzeitBestaetigenAktion(formular: FormData) {
+  const id = formular.get("laufzeitId")?.toString();
+  if (!id) return;
+  await laufzeitBestaetigen(id);
+  seitenNeuLaden(formular.get("hostId")?.toString());
+}
+
+export async function laufzeitVerwerfenAktion(formular: FormData) {
+  const id = formular.get("laufzeitId")?.toString();
+  if (!id) return;
+  await laufzeitVerwerfen(id);
+  seitenNeuLaden(formular.get("hostId")?.toString());
+}
+
+/** Häkchen aus der Rechnungstabelle. */
+export async function statusUmschalten(formular: FormData): Promise<void> {
+  const laufzeitId = formular.get("laufzeitId")?.toString();
+  const feld = formular.get("feld")?.toString();
+  const wert = formular.get("wert")?.toString() === "true";
+  if (!laufzeitId || !feld) return;
+
+  try {
+    if (feld === "einkaufBezahlt") await einkaufBezahltSetzen(laufzeitId, wert);
+    if (feld === "verkaufErstellt") await verkaufErstelltSetzen(laufzeitId, wert);
+    if (feld === "verkaufBezahlt") await verkaufBezahltSetzen(laufzeitId, wert);
+  } catch (fehler) {
+    if (!(fehler instanceof RechnungsFehler)) throw fehler;
+    // Fehlt die Rechnung, bleibt der Status unverändert; die Tabelle zeigt weiterhin „Fehlt“.
+  }
+
+  seitenNeuLaden(formular.get("hostId")?.toString());
+}
+
+export async function proxmoxRechnungSpeichern(
+  _vorher: AktionsErgebnis,
+  formular: FormData,
+): Promise<AktionsErgebnis> {
+  const laufzeitId = formular.get("laufzeitId")?.toString();
+  if (!laufzeitId) return { fehler: "Laufzeit fehlt." };
+
+  return ausfuehren(async () => {
+    const pdf = formular.get("pdf");
+    const anhangId = pdf instanceof File && pdf.size > 0 ? await anhangSpeichern(pdf) : null;
+    const rechnungsdatum = datum(formular.get("datum"));
+
+    if (!rechnungsdatum) throw new RechnungsFehler("Bitte ein Rechnungsdatum angeben.");
+    const netto = betrag(formular.get("nettoBetrag"));
+    if (netto === null) throw new RechnungsFehler("Bitte einen Nettobetrag angeben.");
+
+    const ergebnis = await proxmoxRechnungErfassen(laufzeitId, {
+      nummer: formular.get("nummer")?.toString() ?? "",
+      datum: rechnungsdatum,
+      faelligAm: datum(formular.get("faelligAm")),
+      nettoBetrag: netto,
+      ustSatz: betrag(formular.get("ustSatz")) ?? 19,
+      rabatt: betrag(formular.get("rabatt")),
+      zahlungsart: formular.get("zahlungsart")?.toString().trim() || null,
+      bezahlt: formular.get("bezahlt") === "on",
+      bezahltAm: datum(formular.get("bezahltAm")),
+      anhangId,
+      notizen: formular.get("notizen")?.toString().trim() || null,
+    });
+
+    seitenNeuLaden(formular.get("hostId")?.toString());
+    return ergebnis.sammelrechnung
+      ? "Gespeichert – die Laufzeit hängt jetzt als weitere Position an dieser Sammelrechnung."
+      : "Proxmox-Rechnung gespeichert.";
+  });
+}
+
+export async function kundenrechnungSpeichern(
+  _vorher: AktionsErgebnis,
+  formular: FormData,
+): Promise<AktionsErgebnis> {
+  const laufzeitId = formular.get("laufzeitId")?.toString();
+  if (!laufzeitId) return { fehler: "Laufzeit fehlt." };
+
+  return ausfuehren(async () => {
+    const pdf = formular.get("pdf");
+    const anhangId = pdf instanceof File && pdf.size > 0 ? await anhangSpeichern(pdf) : null;
+
+    const ergebnis = await kundenrechnungErfassen(laufzeitId, {
+      erstellt: formular.get("erstellt") === "on",
+      nummer: formular.get("nummer")?.toString().trim() || null,
+      datum: datum(formular.get("datum")),
+      nettoBetrag: betrag(formular.get("nettoBetrag")),
+      ustSatz: betrag(formular.get("ustSatz")) ?? 19,
+      bezahlt: formular.get("bezahlt") === "on",
+      bezahltAm: datum(formular.get("bezahltAm")),
+      anhangId,
+      notizen: formular.get("notizen")?.toString().trim() || null,
+    });
+
+    seitenNeuLaden(formular.get("hostId")?.toString());
+    return ergebnis.sammelrechnung
+      ? "Gespeichert – die Laufzeit hängt jetzt als weitere Position an dieser Sammelrechnung."
+      : "Kundenrechnung gespeichert.";
+  });
+}
+
+export async function laufzeitAnlegenAktion(
+  _vorher: AktionsErgebnis,
+  formular: FormData,
+): Promise<AktionsErgebnis> {
+  const hostId = formular.get("hostId")?.toString();
+  const key = formular.get("key")?.toString().trim();
+  const start = datum(formular.get("start"));
+  const ende = datum(formular.get("ende"));
+
+  if (!hostId || !key || !start || !ende) {
+    return { fehler: "Bitte Host, Key, Beginn und Ende angeben." };
+  }
+
+  return ausfuehren(async () => {
+    await laufzeitAnlegen({ hostId, key, start, ende, notizen: null });
+    seitenNeuLaden(hostId);
+    return "Laufzeit angelegt.";
+  });
+}

src/server/queries/dashboard.ts

@@ -66,7 +66,19 @@ export async function offeneAufgaben() {
     },
   });
 
-  const aufgaben = [];
+  const aufgaben: {
+    id: string;
+    titel: string;
+    detail: string;
+    betrag: number | null;
+    faelligAm: Date | null;
+    dringlichkeit: "gefahr" | "warnung";
+    badgeText: string;
+    href: string;
+    start: Date;
+    ende: Date;
+    aktion: { laufzeitId: string; hostId: string; feld: "einkaufBezahlt" | "verkaufErstellt" };
+  }[] = [];
   for (const laufzeit of laufzeiten) {
     const basis = `${laufzeit.host.hostname} · ${laufzeit.host.kunde?.name ?? "Nicht zugeordnet"}`;
     const einkauf = laufzeit.proxmoxPosition?.rechnung;
@@ -80,9 +92,10 @@ export async function offeneAufgaben() {
         faelligAm: einkauf.faelligAm,
         dringlichkeit: "gefahr" as const,
         badgeText: "Einkauf",
-        href: `/hosts/${laufzeit.hostId}`,
+        href: `/rechnungen/${laufzeit.id}`,
         start: laufzeit.start,
         ende: laufzeit.ende,
+        aktion: { laufzeitId: laufzeit.id, hostId: laufzeit.hostId, feld: "einkaufBezahlt" as const },
       });
     }
 
@@ -95,9 +108,10 @@ export async function offeneAufgaben() {
         faelligAm: null,
         dringlichkeit: "warnung" as const,
         badgeText: "Verkauf",
-        href: "/rechnungen",
+        href: `/rechnungen/${laufzeit.id}`,
         start: laufzeit.start,
         ende: laufzeit.ende,
+        aktion: { laufzeitId: laufzeit.id, hostId: laufzeit.hostId, feld: "verkaufErstellt" as const },
       });
     }
   }

src/server/queries/hostliste.ts

@@ -0,0 +1,169 @@
+import type { Prisma } from "@/generated/prisma/client";
+import { prisma } from "@/lib/db";
+import { meldungsGrenze } from "./hosts";
+
+export interface HostFilter {
+  q?: string;
+  kunde?: string;
+  status?: string;
+  produkt?: string;
+  ablauf?: "30" | "14" | "abgelaufen";
+  rechnung?: "offen";
+  sortierung?: string;
+  seite?: number;
+}
+
+export const SEITENGROESSE = 25;
+
+/** Baut die Where-Bedingung aus den Filtern der Host-Tabelle. */
+function bedingung(filter: HostFilter, jetzt: Date): Prisma.HostWhereInput {
+  const und: Prisma.HostWhereInput[] = [];
+
+  if (filter.q && filter.q.trim().length > 0) {
+    const suche = filter.q.trim();
+    und.push({
+      OR: [
+        { hostname: { contains: suche, mode: "insensitive" } },
+        { fqdn: { contains: suche, mode: "insensitive" } },
+        { serverId: { contains: suche, mode: "insensitive" } },
+        { subKey: { contains: suche, mode: "insensitive" } },
+        { ips: { has: suche } },
+        { kunde: { name: { contains: suche, mode: "insensitive" } } },
+        // Suche nach einer Proxmox-Rechnungsnummer führt ebenfalls zum Host.
+        {
+          laufzeiten: {
+            some: {
+              OR: [
+                { proxmoxPosition: { rechnung: { nummer: { contains: suche, mode: "insensitive" } } } },
+                { kundenPosition: { rechnung: { nummer: { contains: suche, mode: "insensitive" } } } },
+              ],
+            },
+          },
+        },
+      ],
+    });
+  }
+
+  if (filter.kunde === "ohne") und.push({ kundeId: null });
+  else if (filter.kunde) und.push({ kundeId: filter.kunde });
+
+  if (filter.status === "keine-meldung") {
+    und.push({
+      OR: [{ letzterReportAm: null }, { letzterReportAm: { lt: meldungsGrenze(jetzt) } }],
+    });
+  } else if (filter.status) {
+    und.push({ subStatus: filter.status as Prisma.EnumSubscriptionStatusFilter["equals"] });
+  }
+
+  if (filter.produkt) und.push({ produkt: filter.produkt as Prisma.EnumProduktFilter["equals"] });
+
+  if (filter.ablauf === "30") {
+    und.push({ subNextduedate: { gte: jetzt, lte: new Date(jetzt.getTime() + 30 * 86_400_000) } });
+  } else if (filter.ablauf === "14") {
+    und.push({ subNextduedate: { gte: jetzt, lte: new Date(jetzt.getTime() + 14 * 86_400_000) } });
+  } else if (filter.ablauf === "abgelaufen") {
+    und.push({ subNextduedate: { lt: jetzt } });
+  }
+
+  if (filter.rechnung === "offen") {
+    und.push({
+      laufzeiten: {
+        some: {
+          status: "BESTAETIGT",
+          OR: [
+            { proxmoxPosition: { rechnung: { bezahlt: false } } },
+            { kundenPosition: null },
+            { kundenPosition: { rechnung: { erstellt: false } } },
+          ],
+        },
+      },
+    });
+  }
+
+  return und.length > 0 ? { AND: und } : {};
+}
+
+// Hosts ohne Ablaufdatum bzw. ohne Meldung stehen immer am Ende, egal in welche Richtung sortiert wird.
+const SORTIERUNGEN: Record<string, Prisma.HostOrderByWithRelationInput> = {
+  hostname: { hostname: "asc" },
+  "hostname-ab": { hostname: "desc" },
+  ablauf: { subNextduedate: { sort: "asc", nulls: "last" } },
+  "ablauf-ab": { subNextduedate: { sort: "desc", nulls: "last" } },
+  kunde: { kunde: { name: "asc" } },
+  "kunde-ab": { kunde: { name: "desc" } },
+  status: { subStatus: "asc" },
+  "status-ab": { subStatus: "desc" },
+  meldung: { letzterReportAm: { sort: "desc", nulls: "last" } },
+  "meldung-ab": { letzterReportAm: { sort: "asc", nulls: "last" } },
+};
+
+export async function hostListe(filter: HostFilter, jetzt: Date = new Date()) {
+  const where = bedingung(filter, jetzt);
+  const seite = Math.max(1, filter.seite ?? 1);
+  const orderBy = SORTIERUNGEN[filter.sortierung ?? "hostname"] ?? SORTIERUNGEN.hostname;
+
+  const [gesamt, hosts] = await Promise.all([
+    prisma.host.count({ where }),
+    prisma.host.findMany({
+      where,
+      orderBy,
+      skip: (seite - 1) * SEITENGROESSE,
+      take: SEITENGROESSE,
+      include: {
+        kunde: { select: { id: true, name: true } },
+        standort: { select: { name: true } },
+      },
+    }),
+  ]);
+
+  const grenze = meldungsGrenze(jetzt);
+
+  return {
+    gesamt,
+    seite,
+    seiten: Math.max(1, Math.ceil(gesamt / SEITENGROESSE)),
+    hosts: hosts.map((host) => ({
+      ...host,
+      meldetNicht: !host.letzterReportAm || host.letzterReportAm < grenze,
+      socketAbweichung:
+        host.subLizenzierteSockets !== null &&
+        host.sockets !== null &&
+        host.subLizenzierteSockets !== host.sockets,
+    })),
+  };
+}
+
+/** Alle Daten der Host-Detailansicht in einem Rutsch. */
+export async function hostMitDetails(id: string) {
+  return prisma.host.findUnique({
+    where: { id },
+    include: {
+      kunde: { select: { id: true, name: true } },
+      standort: { select: { id: true, name: true, ort: true } },
+      tags: true,
+      alerts: { where: { erledigtAm: null }, orderBy: { geoeffnetAm: "desc" } },
+      keyHistorie: { orderBy: { letzteMeldung: "desc" } },
+      serverIdHistorie: { orderBy: { letzteMeldung: "desc" } },
+      tokens: { orderBy: { erstelltAm: "desc" } },
+      reports: { orderBy: { erhobenAm: "desc" }, take: 30 },
+      laufzeiten: {
+        orderBy: { start: "desc" },
+        include: {
+          proxmoxPosition: { include: { rechnung: true } },
+          kundenPosition: { include: { rechnung: true } },
+        },
+      },
+    },
+  });
+}
+
+export type HostDetail = NonNullable<Awaited<ReturnType<typeof hostMitDetails>>>;
+
+/** Auswahllisten für die Filterleiste. */
+export async function filterOptionen() {
+  const kunden = await prisma.kunde.findMany({
+    orderBy: { name: "asc" },
+    select: { id: true, name: true },
+  });
+  return { kunden };
+}

src/server/queries/rechnungen.ts

@@ -0,0 +1,152 @@
+import type { Prisma } from "@/generated/prisma/client";
+import { prisma } from "@/lib/db";
+
+export interface RechnungsFilter {
+  status?: "offen" | "erledigt" | "alle" | "vorschlaege";
+  kunde?: string;
+  jahr?: string;
+  q?: string;
+}
+
+function bedingung(filter: RechnungsFilter): Prisma.LaufzeitWhereInput {
+  const und: Prisma.LaufzeitWhereInput[] = [];
+
+  if (filter.status === "vorschlaege") {
+    und.push({ status: "VORSCHLAG" });
+  } else {
+    und.push({ status: "BESTAETIGT" });
+  }
+
+  if (filter.status === "offen") {
+    und.push({
+      OR: [
+        { proxmoxPosition: null },
+        { proxmoxPosition: { rechnung: { bezahlt: false } } },
+        { kundenPosition: null },
+        { kundenPosition: { rechnung: { erstellt: false } } },
+      ],
+    });
+  }
+
+  if (filter.status === "erledigt") {
+    und.push({ proxmoxPosition: { rechnung: { bezahlt: true } } });
+    und.push({ kundenPosition: { rechnung: { erstellt: true } } });
+  }
+
+  if (filter.kunde) und.push({ host: { kundeId: filter.kunde } });
+
+  if (filter.jahr) {
+    const jahr = Number(filter.jahr);
+    und.push({
+      start: { gte: new Date(Date.UTC(jahr, 0, 1)), lt: new Date(Date.UTC(jahr + 1, 0, 1)) },
+    });
+  }
+
+  if (filter.q?.trim()) {
+    const suche = filter.q.trim();
+    und.push({
+      OR: [
+        { key: { contains: suche, mode: "insensitive" } },
+        { host: { hostname: { contains: suche, mode: "insensitive" } } },
+        { proxmoxPosition: { rechnung: { nummer: { contains: suche, mode: "insensitive" } } } },
+        { kundenPosition: { rechnung: { nummer: { contains: suche, mode: "insensitive" } } } },
+      ],
+    });
+  }
+
+  return { AND: und };
+}
+
+export async function rechnungsListe(filter: RechnungsFilter) {
+  const laufzeiten = await prisma.laufzeit.findMany({
+    where: bedingung(filter),
+    orderBy: [{ start: "desc" }],
+    include: {
+      host: { select: { id: true, hostname: true, kunde: { select: { id: true, name: true } } } },
+      proxmoxPosition: { include: { rechnung: true } },
+      kundenPosition: { include: { rechnung: true } },
+    },
+  });
+
+  const zeilen = laufzeiten.map((laufzeit) => {
+    const einkauf = laufzeit.proxmoxPosition ? Number(laufzeit.proxmoxPosition.nettoBetrag) : null;
+    const verkauf = laufzeit.kundenPosition ? Number(laufzeit.kundenPosition.nettoBetrag) : null;
+
+    return {
+      id: laufzeit.id,
+      hostId: laufzeit.host.id,
+      hostname: laufzeit.host.hostname,
+      kunde: laufzeit.host.kunde,
+      key: laufzeit.key,
+      start: laufzeit.start,
+      ende: laufzeit.ende,
+      vorschlag: laufzeit.status === "VORSCHLAG",
+      einkaufNummer: laufzeit.proxmoxPosition?.rechnung.nummer ?? null,
+      einkaufBetrag: einkauf,
+      einkaufBezahlt: laufzeit.proxmoxPosition ? laufzeit.proxmoxPosition.rechnung.bezahlt : null,
+      einkaufFaelligAm: laufzeit.proxmoxPosition?.rechnung.faelligAm ?? null,
+      verkaufNummer: laufzeit.kundenPosition?.rechnung.nummer ?? null,
+      verkaufBetrag: verkauf,
+      verkaufErstellt: laufzeit.kundenPosition?.rechnung.erstellt ?? false,
+      verkaufBezahlt: laufzeit.kundenPosition?.rechnung.bezahlt ?? false,
+      marge: einkauf !== null && verkauf !== null ? verkauf - einkauf : null,
+    };
+  });
+
+  const summen = zeilen.reduce(
+    (summe, zeile) => ({
+      einkauf: summe.einkauf + (zeile.einkaufBetrag ?? 0),
+      verkauf: summe.verkauf + (zeile.verkaufBetrag ?? 0),
+    }),
+    { einkauf: 0, verkauf: 0 },
+  );
+
+  return {
+    zeilen,
+    summen: { ...summen, marge: summen.verkauf - summen.einkauf },
+  };
+}
+
+export type RechnungsZeile = Awaited<ReturnType<typeof rechnungsListe>>["zeilen"][number];
+
+/** Jahre, für die Laufzeiten vorliegen – für den Zeitraum-Filter. */
+export async function laufzeitJahre(): Promise<string[]> {
+  const laufzeiten = await prisma.laufzeit.findMany({ select: { start: true } });
+  return [...new Set(laufzeiten.map((l) => String(l.start.getUTCFullYear())))].sort((a, b) =>
+    b.localeCompare(a),
+  );
+}
+
+export async function laufzeitDetail(id: string) {
+  return prisma.laufzeit.findUnique({
+    where: { id },
+    include: {
+      host: {
+        select: {
+          id: true,
+          hostname: true,
+          produkt: true,
+          kunde: { select: { id: true, name: true } },
+        },
+      },
+      proxmoxPosition: {
+        include: {
+          rechnung: {
+            include: { anhang: true, positionen: { include: { laufzeit: { include: { host: true } } } } },
+          },
+        },
+      },
+      kundenPosition: {
+        include: {
+          rechnung: {
+            include: { anhang: true, positionen: { include: { laufzeit: { include: { host: true } } } } },
+          },
+        },
+      },
+    },
+  });
+}
+
+export async function anzahlVorschlaege() {
+  return prisma.laufzeit.count({ where: { status: "VORSCHLAG" } });
+}

src/server/services/rechnungen.ts

@@ -0,0 +1,312 @@
+import { prisma } from "@/lib/db";
+import { protokolliere } from "@/server/audit";
+
+export class RechnungsFehler extends Error {}
+
+export interface ProxmoxRechnungEingabe {
+  nummer: string;
+  datum: Date;
+  faelligAm: Date | null;
+  nettoBetrag: number;
+  ustSatz?: number;
+  rabatt?: number | null;
+  zahlungsart?: string | null;
+  bezahlt: boolean;
+  bezahltAm?: Date | null;
+  anhangId?: string | null;
+  notizen?: string | null;
+}
+
+export interface KundenrechnungEingabe {
+  erstellt: boolean;
+  nummer?: string | null;
+  datum?: Date | null;
+  nettoBetrag?: number | null;
+  ustSatz?: number;
+  bezahlt: boolean;
+  bezahltAm?: Date | null;
+  anhangId?: string | null;
+  notizen?: string | null;
+}
+
+/** Bestätigt einen vom Agent vorgeschlagenen Lizenzzeitraum. */
+export async function laufzeitBestaetigen(id: string) {
+  const laufzeit = await prisma.laufzeit.update({
+    where: { id },
+    data: { status: "BESTAETIGT" },
+  });
+  await protokolliere("laufzeit.bestaetigt", "Laufzeit", id, {
+    start: laufzeit.start,
+    ende: laufzeit.ende,
+  });
+  return laufzeit;
+}
+
+/** Verwirft einen Vorschlag; bereits bestätigte Laufzeiten bleiben unangetastet. */
+export async function laufzeitVerwerfen(id: string) {
+  const laufzeit = await prisma.laufzeit.findUnique({ where: { id } });
+  if (!laufzeit) throw new RechnungsFehler("Laufzeit nicht gefunden.");
+  if (laufzeit.status !== "VORSCHLAG") {
+    throw new RechnungsFehler("Nur Vorschläge können verworfen werden.");
+  }
+
+  await prisma.laufzeit.delete({ where: { id } });
+  await protokolliere("laufzeit.verworfen", "Laufzeit", id, { start: laufzeit.start });
+}
+
+/**
+ * Erfasst die Proxmox-Rechnung zu einer Laufzeit.
+ * Gibt es die Rechnungsnummer schon, wird eine weitere Position angehängt – so entsteht aus mehreren
+ * Laufzeiten eine Sammelrechnung, ohne dass die Nummer doppelt vergeben wird.
+ */
+export async function proxmoxRechnungErfassen(laufzeitId: string, eingabe: ProxmoxRechnungEingabe) {
+  const laufzeit = await prisma.laufzeit.findUnique({
+    where: { id: laufzeitId },
+    include: { proxmoxPosition: true, host: { select: { hostname: true } } },
+  });
+  if (!laufzeit) throw new RechnungsFehler("Laufzeit nicht gefunden.");
+  if (!eingabe.nummer.trim()) throw new RechnungsFehler("Bitte eine Rechnungsnummer angeben.");
+
+  const nummer = eingabe.nummer.trim();
+  const bezeichnung = `${laufzeit.key} · ${laufzeit.host.hostname} · ${laufzeit.start.toISOString().slice(0, 10)} bis ${laufzeit.ende.toISOString().slice(0, 10)}`;
+
+  return prisma.$transaction(async (tx) => {
+    const vorhanden = await tx.proxmoxRechnung.findUnique({ where: { nummer } });
+
+    const rechnung = vorhanden
+      ? await tx.proxmoxRechnung.update({
+          where: { id: vorhanden.id },
+          data: {
+            datum: eingabe.datum,
+            faelligAm: eingabe.faelligAm,
+            ustSatz: eingabe.ustSatz ?? 19,
+            rabatt: eingabe.rabatt ?? null,
+            zahlungsart: eingabe.zahlungsart ?? null,
+            bezahlt: eingabe.bezahlt,
+            bezahltAm: eingabe.bezahlt ? (eingabe.bezahltAm ?? new Date()) : null,
+            anhangId: eingabe.anhangId ?? vorhanden.anhangId,
+            notizen: eingabe.notizen ?? vorhanden.notizen,
+          },
+        })
+      : await tx.proxmoxRechnung.create({
+          data: {
+            nummer,
+            datum: eingabe.datum,
+            faelligAm: eingabe.faelligAm,
+            nettoBetrag: eingabe.nettoBetrag,
+            ustSatz: eingabe.ustSatz ?? 19,
+            rabatt: eingabe.rabatt ?? null,
+            zahlungsart: eingabe.zahlungsart ?? null,
+            bezahlt: eingabe.bezahlt,
+            bezahltAm: eingabe.bezahlt ? (eingabe.bezahltAm ?? new Date()) : null,
+            anhangId: eingabe.anhangId ?? null,
+            notizen: eingabe.notizen ?? null,
+          },
+        });
+
+    const position = laufzeit.proxmoxPosition
+      ? await tx.proxmoxRechnungPosition.update({
+          where: { id: laufzeit.proxmoxPosition.id },
+          data: { rechnungId: rechnung.id, bezeichnung, nettoBetrag: eingabe.nettoBetrag },
+        })
+      : await tx.proxmoxRechnungPosition.create({
+          data: { rechnungId: rechnung.id, bezeichnung, nettoBetrag: eingabe.nettoBetrag },
+        });
+
+    await tx.laufzeit.update({
+      where: { id: laufzeitId },
+      data: { proxmoxPositionId: position.id, status: "BESTAETIGT" },
+    });
+
+    // Der Rechnungsbetrag ist immer die Summe der Positionen.
+    const positionen = await tx.proxmoxRechnungPosition.findMany({ where: { rechnungId: rechnung.id } });
+    const summe = positionen.reduce((s, p) => s + Number(p.nettoBetrag), 0);
+    await tx.proxmoxRechnung.update({ where: { id: rechnung.id }, data: { nettoBetrag: summe } });
+
+    await protokolliere("proxmox_rechnung.erfasst", "ProxmoxRechnung", rechnung.id, {
+      nummer,
+      laufzeitId,
+      nettoBetrag: eingabe.nettoBetrag,
+      positionen: positionen.length,
+    });
+
+    return { rechnungId: rechnung.id, positionId: position.id, sammelrechnung: positionen.length > 1 };
+  });
+}
+
+/** Erfasst die Kundenrechnung zu einer Laufzeit; gleiche Nummer bedeutet auch hier Sammelrechnung. */
+export async function kundenrechnungErfassen(laufzeitId: string, eingabe: KundenrechnungEingabe) {
+  const laufzeit = await prisma.laufzeit.findUnique({
+    where: { id: laufzeitId },
+    include: { kundenPosition: true, host: { select: { hostname: true, kundeId: true } } },
+  });
+  if (!laufzeit) throw new RechnungsFehler("Laufzeit nicht gefunden.");
+  const kundeId = laufzeit.host.kundeId;
+  if (!kundeId) {
+    throw new RechnungsFehler("Der Host ist keinem Kunden zugewiesen – ohne Kunde keine Kundenrechnung.");
+  }
+
+  const nummer = eingabe.nummer?.trim() || null;
+  const bezeichnung = `${laufzeit.key} · ${laufzeit.host.hostname} · ${laufzeit.start.toISOString().slice(0, 10)} bis ${laufzeit.ende.toISOString().slice(0, 10)}`;
+  const betrag = eingabe.nettoBetrag ?? 0;
+
+  return prisma.$transaction(async (tx) => {
+    const vorhanden = nummer ? await tx.kundenrechnung.findUnique({ where: { nummer } }) : null;
+    if (vorhanden && vorhanden.kundeId !== kundeId) {
+      throw new RechnungsFehler("Diese Rechnungsnummer gehört bereits zu einem anderen Kunden.");
+    }
+
+    const daten = {
+      erstellt: eingabe.erstellt,
+      nummer,
+      datum: eingabe.datum ?? null,
+      ustSatz: eingabe.ustSatz ?? 19,
+      bezahlt: eingabe.bezahlt,
+      bezahltAm: eingabe.bezahlt ? (eingabe.bezahltAm ?? new Date()) : null,
+      anhangId: eingabe.anhangId ?? null,
+      notizen: eingabe.notizen ?? null,
+    };
+
+    // Welche Rechnung ist gemeint? Zuerst die über die Nummer gefundene, sonst die bisher verknüpfte.
+    const zielRechnungId = vorhanden?.id ?? laufzeit.kundenPosition?.rechnungId ?? null;
+
+    const rechnung = zielRechnungId
+      ? await tx.kundenrechnung.update({ where: { id: zielRechnungId }, data: daten })
+      : await tx.kundenrechnung.create({
+          data: { ...daten, kundeId, nettoBetrag: betrag },
+        });
+
+    const position = laufzeit.kundenPosition
+      ? await tx.kundenrechnungPosition.update({
+          where: { id: laufzeit.kundenPosition.id },
+          data: { rechnungId: rechnung.id, bezeichnung, nettoBetrag: betrag },
+        })
+      : await tx.kundenrechnungPosition.create({
+          data: { rechnungId: rechnung.id, bezeichnung, nettoBetrag: betrag },
+        });
+
+    await tx.laufzeit.update({ where: { id: laufzeitId }, data: { kundenPositionId: position.id } });
+
+    const positionen = await tx.kundenrechnungPosition.findMany({ where: { rechnungId: rechnung.id } });
+    const summe = positionen.reduce((s, p) => s + Number(p.nettoBetrag), 0);
+    await tx.kundenrechnung.update({ where: { id: rechnung.id }, data: { nettoBetrag: summe } });
+
+    await protokolliere("kundenrechnung.erfasst", "Kundenrechnung", rechnung.id, {
+      nummer,
+      laufzeitId,
+      nettoBetrag: betrag,
+      positionen: positionen.length,
+    });
+
+    return { rechnungId: rechnung.id, positionId: position.id, sammelrechnung: positionen.length > 1 };
+  });
+}
+
+/** Häkchen „Proxmox bezahlt“ direkt aus der Tabelle. */
+export async function einkaufBezahltSetzen(laufzeitId: string, bezahlt: boolean) {
+  const laufzeit = await prisma.laufzeit.findUnique({
+    where: { id: laufzeitId },
+    include: { proxmoxPosition: true },
+  });
+  if (!laufzeit?.proxmoxPosition) {
+    throw new RechnungsFehler("Für diese Laufzeit ist noch keine Proxmox-Rechnung erfasst.");
+  }
+
+  await prisma.proxmoxRechnung.update({
+    where: { id: laufzeit.proxmoxPosition.rechnungId },
+    data: { bezahlt, bezahltAm: bezahlt ? new Date() : null },
+  });
+
+  await protokolliere(
+    "proxmox_rechnung.bezahlt_gesetzt",
+    "ProxmoxRechnung",
+    laufzeit.proxmoxPosition.rechnungId,
+    {
+      bezahlt,
+      laufzeitId,
+    },
+  );
+}
+
+/**
+ * Häkchen „Kundenrechnung erstellt“ direkt aus der Tabelle.
+ * Fehlt die Rechnung noch, entsteht eine ohne Nummer – sie lässt sich später vervollständigen.
+ */
+export async function verkaufErstelltSetzen(laufzeitId: string, erstellt: boolean) {
+  const laufzeit = await prisma.laufzeit.findUnique({
+    where: { id: laufzeitId },
+    include: { kundenPosition: true, host: { select: { hostname: true, kundeId: true } } },
+  });
+  if (!laufzeit) throw new RechnungsFehler("Laufzeit nicht gefunden.");
+
+  if (laufzeit.kundenPosition) {
+    await prisma.kundenrechnung.update({
+      where: { id: laufzeit.kundenPosition.rechnungId },
+      data: { erstellt },
+    });
+    await protokolliere(
+      "kundenrechnung.erstellt_gesetzt",
+      "Kundenrechnung",
+      laufzeit.kundenPosition.rechnungId,
+      {
+        erstellt,
+        laufzeitId,
+      },
+    );
+    return;
+  }
+
+  if (!erstellt) return;
+  await kundenrechnungErfassen(laufzeitId, { erstellt: true, bezahlt: false, nettoBetrag: 0 });
+}
+
+/** Häkchen „Kundenrechnung bezahlt“. */
+export async function verkaufBezahltSetzen(laufzeitId: string, bezahlt: boolean) {
+  const laufzeit = await prisma.laufzeit.findUnique({
+    where: { id: laufzeitId },
+    include: { kundenPosition: true },
+  });
+  if (!laufzeit?.kundenPosition) {
+    throw new RechnungsFehler("Für diese Laufzeit ist noch keine Kundenrechnung erfasst.");
+  }
+
+  await prisma.kundenrechnung.update({
+    where: { id: laufzeit.kundenPosition.rechnungId },
+    data: { bezahlt, bezahltAm: bezahlt ? new Date() : null },
+  });
+
+  await protokolliere(
+    "kundenrechnung.bezahlt_gesetzt",
+    "Kundenrechnung",
+    laufzeit.kundenPosition.rechnungId,
+    {
+      bezahlt,
+      laufzeitId,
+    },
+  );
+}
+
+/** Legt eine Laufzeit von Hand an – etwa für Käufe, die der Agent noch nicht gemeldet hat. */
+export async function laufzeitAnlegen(daten: {
+  hostId: string;
+  key: string;
+  start: Date;
+  ende: Date;
+  notizen?: string | null;
+}) {
+  const vorhanden = await prisma.laufzeit.findUnique({
+    where: { hostId_start: { hostId: daten.hostId, start: daten.start } },
+  });
+  if (vorhanden) {
+    throw new RechnungsFehler("Für dieses Startdatum gibt es bereits eine Laufzeit.");
+  }
+  if (daten.ende <= daten.start) {
+    throw new RechnungsFehler("Das Ende muss nach dem Beginn liegen.");
+  }
+
+  const laufzeit = await prisma.laufzeit.create({
+    data: { ...daten, status: "BESTAETIGT" },
+  });
+  await protokolliere("laufzeit.angelegt", "Laufzeit", laufzeit.id, daten);
+  return laufzeit;
+}

tests/csv.test.ts

@@ -0,0 +1,24 @@
+import { describe, expect, it } from "vitest";
+import { csvDatei, csvZelle } from "@/lib/csv";
+
+describe("CSV-Export", () => {
+  it("formatiert Werte deutsch", () => {
+    expect(csvZelle(new Date("2027-03-02T00:00:00Z"))).toBe("02.03.2027");
+    expect(csvZelle(1)).toBe("1");
+    expect(csvZelle(1234.5)).toBe("1.234,50");
+    expect(csvZelle(null)).toBe("");
+    expect(csvZelle(undefined)).toBe("");
+  });
+
+  it("maskiert Semikolon, Anführungszeichen und Zeilenumbrüche", () => {
+    expect(csvZelle("Firma; GmbH")).toBe('"Firma; GmbH"');
+    expect(csvZelle('Er sagte "hallo"')).toBe('"Er sagte ""hallo"""');
+    expect(csvZelle("Zeile1\nZeile2")).toBe('"Zeile1\nZeile2"');
+  });
+
+  it("schreibt BOM und Zeilenenden für Excel", () => {
+    const datei = csvDatei(["A", "B"], [["x", 2]]);
+    expect(datei.startsWith("")).toBe(true);
+    expect(datei).toContain("A;B\r\nx;2\r\n");
+  });
+});

tests/hostliste.test.ts

@@ -0,0 +1,164 @@
+import { afterAll, beforeEach, describe, expect, it } from "vitest";
+import { hostListe } from "@/server/queries/hostliste";
+import { datenbankLeeren, datenbankVerfuegbar, testPrisma } from "./helpers/db";
+
+const JETZT = new Date("2026-09-17T12:00:00Z");
+
+async function beispielDaten() {
+  const kunde = await testPrisma.kunde.create({
+    data: { name: "Brandl Elektrotechnik GmbH", kundennummer: "K-1001" },
+  });
+  const anderer = await testPrisma.kunde.create({
+    data: { name: "Huber Logistik AG", kundennummer: "K-1002" },
+  });
+
+  const brandl = await testPrisma.host.create({
+    data: {
+      agentId: "agent-brandl",
+      hostname: "pve-brandl-01",
+      fqdn: "pve-brandl-01.brandl.local",
+      produkt: "PVE",
+      kundeId: kunde.id,
+      serverId: "A1B2C3D4E5F60718",
+      subKey: "pve1c-a6bd21fcb6",
+      subStatus: "ACTIVE",
+      subNextduedate: new Date("2026-09-24"),
+      subLizenzierteSockets: 1,
+      sockets: 1,
+      ips: ["192.168.10.11"],
+      letzterReportAm: new Date("2026-09-17T03:00:00Z"),
+    },
+  });
+
+  await testPrisma.host.create({
+    data: {
+      agentId: "agent-huber",
+      hostname: "pve-huber-01",
+      produkt: "PVE",
+      kundeId: anderer.id,
+      subKey: "pve1c-77c0ea1b93",
+      subStatus: "ACTIVE",
+      subNextduedate: new Date("2026-12-01"),
+      subLizenzierteSockets: 1,
+      sockets: 2,
+      ips: ["10.8.0.5"],
+      letzterReportAm: new Date("2026-09-17T02:00:00Z"),
+    },
+  });
+
+  await testPrisma.host.create({
+    data: {
+      agentId: "agent-pbs",
+      hostname: "pbs-backup",
+      produkt: "PBS",
+      subStatus: "NOTFOUND",
+      letzterReportAm: new Date("2026-09-10T02:00:00Z"),
+    },
+  });
+
+  const rechnung = await testPrisma.proxmoxRechnung.create({
+    data: {
+      nummer: "PX-2026-14790",
+      datum: new Date("2026-09-10"),
+      nettoBetrag: 115,
+      bezahlt: false,
+      positionen: { create: [{ bezeichnung: "pve1c-a6bd21fcb6", nettoBetrag: 115 }] },
+    },
+    include: { positionen: true },
+  });
+
+  await testPrisma.laufzeit.create({
+    data: {
+      hostId: brandl.id,
+      key: "pve1c-a6bd21fcb6",
+      start: new Date("2026-09-24"),
+      ende: new Date("2027-09-23"),
+      status: "BESTAETIGT",
+      proxmoxPositionId: rechnung.positionen[0].id,
+    },
+  });
+
+  return { kunde, anderer, brandl };
+}
+
+describe.runIf(datenbankVerfuegbar)("Host-Tabelle", () => {
+  beforeEach(async () => {
+    await datenbankLeeren();
+    await beispielDaten();
+  });
+
+  afterAll(async () => {
+    await testPrisma.$disconnect();
+  });
+
+  it("findet einen Host über seinen Subscription-Key", async () => {
+    const { hosts, gesamt } = await hostListe({ q: "pve1c-a6bd21fcb6" }, JETZT);
+    expect(gesamt).toBe(1);
+    expect(hosts[0].hostname).toBe("pve-brandl-01");
+    expect(hosts[0].kunde?.name).toBe("Brandl Elektrotechnik GmbH");
+  });
+
+  it("findet Hosts über Server-ID, IP, FQDN und Kundenname", async () => {
+    for (const suche of ["A1B2C3D4E5F60718", "192.168.10.11", "brandl.local", "Brandl Elektro"]) {
+      const { hosts } = await hostListe({ q: suche }, JETZT);
+      expect(hosts.map((h) => h.hostname), `Suche nach ${suche}`).toContain("pve-brandl-01");
+    }
+  });
+
+  it("findet den Host über die Proxmox-Rechnungsnummer", async () => {
+    const { hosts, gesamt } = await hostListe({ q: "PX-2026-14790" }, JETZT);
+    expect(gesamt).toBe(1);
+    expect(hosts[0].hostname).toBe("pve-brandl-01");
+  });
+
+  it("ignoriert Groß- und Kleinschreibung", async () => {
+    const { gesamt } = await hostListe({ q: "PVE-BRANDL-01" }, JETZT);
+    expect(gesamt).toBe(1);
+  });
+
+  it("filtert nach Kunde, Status und Produkt", async () => {
+    const { kunde } = { kunde: await testPrisma.kunde.findFirstOrThrow({ where: { kundennummer: "K-1001" } }) };
+
+    expect((await hostListe({ kunde: kunde.id }, JETZT)).gesamt).toBe(1);
+    expect((await hostListe({ kunde: "ohne" }, JETZT)).gesamt).toBe(1);
+    expect((await hostListe({ status: "ACTIVE" }, JETZT)).gesamt).toBe(2);
+    expect((await hostListe({ status: "NOTFOUND" }, JETZT)).gesamt).toBe(1);
+    expect((await hostListe({ produkt: "PBS" }, JETZT)).gesamt).toBe(1);
+  });
+
+  it("filtert nach Hosts, die sich länger als 48 Stunden nicht gemeldet haben", async () => {
+    const { hosts } = await hostListe({ status: "keine-meldung" }, JETZT);
+    expect(hosts.map((h) => h.hostname)).toEqual(["pbs-backup"]);
+    expect(hosts[0].meldetNicht).toBe(true);
+  });
+
+  it("filtert nach baldigem Ablauf", async () => {
+    expect((await hostListe({ ablauf: "14" }, JETZT)).gesamt).toBe(1);
+    expect((await hostListe({ ablauf: "30" }, JETZT)).gesamt).toBe(1);
+    expect((await hostListe({ ablauf: "abgelaufen" }, JETZT)).gesamt).toBe(0);
+  });
+
+  it("filtert nach offenen Rechnungspunkten", async () => {
+    const { hosts } = await hostListe({ rechnung: "offen" }, JETZT);
+    expect(hosts.map((h) => h.hostname)).toEqual(["pve-brandl-01"]);
+  });
+
+  it("erkennt abweichende Sockets", async () => {
+    const { hosts } = await hostListe({ q: "pve-huber-01" }, JETZT);
+    expect(hosts[0].socketAbweichung).toBe(true);
+  });
+
+  it("sortiert nach Ablaufdatum in beide Richtungen", async () => {
+    const aufsteigend = await hostListe({ sortierung: "ablauf" }, JETZT);
+    expect(aufsteigend.hosts[0].hostname).toBe("pve-brandl-01");
+
+    const absteigend = await hostListe({ sortierung: "ablauf-ab" }, JETZT);
+    expect(absteigend.hosts[0].subNextduedate).not.toBeNull();
+    expect(absteigend.hosts[0].hostname).toBe("pve-huber-01");
+  });
+
+  it("kombiniert mehrere Filter", async () => {
+    const { gesamt } = await hostListe({ status: "ACTIVE", produkt: "PVE", ablauf: "30" }, JETZT);
+    expect(gesamt).toBe(1);
+  });
+});

tests/rechnungen.test.ts

@@ -0,0 +1,316 @@
+import { afterAll, beforeEach, describe, expect, it } from "vitest";
+import {
+  einkaufBezahltSetzen,
+  kundenrechnungErfassen,
+  laufzeitAnlegen,
+  laufzeitBestaetigen,
+  laufzeitVerwerfen,
+  proxmoxRechnungErfassen,
+  RechnungsFehler,
+  verkaufBezahltSetzen,
+  verkaufErstelltSetzen,
+} from "@/server/services/rechnungen";
+import { datenbankLeeren, datenbankVerfuegbar, testPrisma } from "./helpers/db";
+
+async function aufbau() {
+  const kunde = await testPrisma.kunde.create({
+    data: { name: "Brandl Elektrotechnik GmbH", kundennummer: "K-1001" },
+  });
+
+  const hostA = await testPrisma.host.create({
+    data: { agentId: "a-1", hostname: "pve-01", produkt: "PVE", kundeId: kunde.id },
+  });
+  const hostB = await testPrisma.host.create({
+    data: { agentId: "a-2", hostname: "pve-02", produkt: "PVE", kundeId: kunde.id },
+  });
+
+  const laufzeitA = await testPrisma.laufzeit.create({
+    data: {
+      hostId: hostA.id,
+      key: "pve1c-aaaa",
+      start: new Date("2026-09-24"),
+      ende: new Date("2027-09-23"),
+      status: "VORSCHLAG",
+    },
+  });
+  const laufzeitB = await testPrisma.laufzeit.create({
+    data: {
+      hostId: hostB.id,
+      key: "pve2c-bbbb",
+      start: new Date("2026-10-08"),
+      ende: new Date("2027-10-07"),
+      status: "VORSCHLAG",
+    },
+  });
+
+  return { kunde, hostA, hostB, laufzeitA, laufzeitB };
+}
+
+const EINKAUF = {
+  nummer: "PX-2026-14790",
+  datum: new Date("2026-09-10"),
+  faelligAm: new Date("2026-09-24"),
+  nettoBetrag: 115,
+  bezahlt: false,
+};
+
+describe.runIf(datenbankVerfuegbar)("Laufzeiten und Rechnungen", () => {
+  beforeEach(async () => {
+    await datenbankLeeren();
+  });
+
+  afterAll(async () => {
+    await testPrisma.$disconnect();
+  });
+
+  describe("Laufzeiten", () => {
+    it("bestätigt einen Vorschlag", async () => {
+      const { laufzeitA } = await aufbau();
+      await laufzeitBestaetigen(laufzeitA.id);
+
+      const danach = await testPrisma.laufzeit.findUniqueOrThrow({ where: { id: laufzeitA.id } });
+      expect(danach.status).toBe("BESTAETIGT");
+    });
+
+    it("verwirft einen Vorschlag, aber keine bestätigte Laufzeit", async () => {
+      const { laufzeitA, laufzeitB } = await aufbau();
+
+      await laufzeitVerwerfen(laufzeitA.id);
+      expect(await testPrisma.laufzeit.findUnique({ where: { id: laufzeitA.id } })).toBeNull();
+
+      await laufzeitBestaetigen(laufzeitB.id);
+      await expect(laufzeitVerwerfen(laufzeitB.id)).rejects.toThrow(RechnungsFehler);
+    });
+
+    it("legt eine Laufzeit von Hand an und verhindert doppelte Startdaten", async () => {
+      const { hostA } = await aufbau();
+
+      const daten = {
+        hostId: hostA.id,
+        key: "pve1c-manuell",
+        start: new Date("2028-01-01"),
+        ende: new Date("2028-12-31"),
+      };
+      await laufzeitAnlegen(daten);
+      await expect(laufzeitAnlegen(daten)).rejects.toThrow(RechnungsFehler);
+      await expect(
+        laufzeitAnlegen({ ...daten, start: new Date("2029-01-01"), ende: new Date("2028-12-31") }),
+      ).rejects.toThrow(RechnungsFehler);
+    });
+  });
+
+  describe("Proxmox-Rechnung", () => {
+    it("erfasst eine Rechnung und bestätigt die Laufzeit dabei", async () => {
+      const { laufzeitA } = await aufbau();
+      const ergebnis = await proxmoxRechnungErfassen(laufzeitA.id, EINKAUF);
+
+      expect(ergebnis.sammelrechnung).toBe(false);
+
+      const laufzeit = await testPrisma.laufzeit.findUniqueOrThrow({
+        where: { id: laufzeitA.id },
+        include: { proxmoxPosition: { include: { rechnung: true } } },
+      });
+      expect(laufzeit.status).toBe("BESTAETIGT");
+      expect(laufzeit.proxmoxPosition?.rechnung.nummer).toBe("PX-2026-14790");
+      expect(Number(laufzeit.proxmoxPosition?.nettoBetrag)).toBe(115);
+      expect(laufzeit.proxmoxPosition?.rechnung.faelligAm?.toISOString().slice(0, 10)).toBe("2026-09-24");
+    });
+
+    it("hängt eine zweite Laufzeit an dieselbe Rechnungsnummer an (Sammelrechnung)", async () => {
+      const { laufzeitA, laufzeitB } = await aufbau();
+
+      await proxmoxRechnungErfassen(laufzeitA.id, EINKAUF);
+      const zweite = await proxmoxRechnungErfassen(laufzeitB.id, { ...EINKAUF, nettoBetrag: 220 });
+
+      expect(zweite.sammelrechnung).toBe(true);
+      expect(await testPrisma.proxmoxRechnung.count()).toBe(1);
+
+      const rechnung = await testPrisma.proxmoxRechnung.findUniqueOrThrow({
+        where: { nummer: "PX-2026-14790" },
+        include: { positionen: true },
+      });
+      expect(rechnung.positionen).toHaveLength(2);
+      // Der Rechnungsbetrag ist die Summe der Positionen.
+      expect(Number(rechnung.nettoBetrag)).toBe(335);
+    });
+
+    it("ändert eine bereits erfasste Rechnung, statt eine zweite Position anzulegen", async () => {
+      const { laufzeitA } = await aufbau();
+      await proxmoxRechnungErfassen(laufzeitA.id, EINKAUF);
+      await proxmoxRechnungErfassen(laufzeitA.id, { ...EINKAUF, nettoBetrag: 130, bezahlt: true });
+
+      const rechnung = await testPrisma.proxmoxRechnung.findUniqueOrThrow({
+        where: { nummer: "PX-2026-14790" },
+        include: { positionen: true },
+      });
+      expect(rechnung.positionen).toHaveLength(1);
+      expect(Number(rechnung.nettoBetrag)).toBe(130);
+      expect(rechnung.bezahlt).toBe(true);
+      expect(rechnung.bezahltAm).not.toBeNull();
+    });
+
+    it("verlangt eine Rechnungsnummer", async () => {
+      const { laufzeitA } = await aufbau();
+      await expect(proxmoxRechnungErfassen(laufzeitA.id, { ...EINKAUF, nummer: "  " })).rejects.toThrow(
+        RechnungsFehler,
+      );
+    });
+  });
+
+  describe("Kundenrechnung", () => {
+    it("erfasst eine Kundenrechnung mit Position", async () => {
+      const { laufzeitA, kunde } = await aufbau();
+      await kundenrechnungErfassen(laufzeitA.id, {
+        erstellt: true,
+        nummer: "RE-2026-0001",
+        datum: new Date("2026-10-01"),
+        nettoBetrag: 165,
+        bezahlt: false,
+      });
+
+      const rechnung = await testPrisma.kundenrechnung.findUniqueOrThrow({
+        where: { nummer: "RE-2026-0001" },
+        include: { positionen: true },
+      });
+      expect(rechnung.kundeId).toBe(kunde.id);
+      expect(rechnung.erstellt).toBe(true);
+      expect(Number(rechnung.nettoBetrag)).toBe(165);
+      expect(rechnung.positionen).toHaveLength(1);
+    });
+
+    it("fasst mehrere Laufzeiten desselben Kunden zu einer Rechnung zusammen", async () => {
+      const { laufzeitA, laufzeitB } = await aufbau();
+
+      await kundenrechnungErfassen(laufzeitA.id, {
+        erstellt: true,
+        nummer: "RE-2026-0002",
+        nettoBetrag: 165,
+        bezahlt: false,
+      });
+      const zweite = await kundenrechnungErfassen(laufzeitB.id, {
+        erstellt: true,
+        nummer: "RE-2026-0002",
+        nettoBetrag: 320,
+        bezahlt: false,
+      });
+
+      expect(zweite.sammelrechnung).toBe(true);
+      const rechnung = await testPrisma.kundenrechnung.findUniqueOrThrow({
+        where: { nummer: "RE-2026-0002" },
+        include: { positionen: true },
+      });
+      expect(rechnung.positionen).toHaveLength(2);
+      expect(Number(rechnung.nettoBetrag)).toBe(485);
+    });
+
+    it("weist eine Rechnungsnummer ab, die einem anderen Kunden gehört", async () => {
+      const { laufzeitA } = await aufbau();
+      const fremderKunde = await testPrisma.kunde.create({
+        data: { name: "Huber Logistik AG", kundennummer: "K-1002" },
+      });
+      const fremderHost = await testPrisma.host.create({
+        data: { agentId: "a-3", hostname: "pve-huber", produkt: "PVE", kundeId: fremderKunde.id },
+      });
+      const fremdeLaufzeit = await testPrisma.laufzeit.create({
+        data: {
+          hostId: fremderHost.id,
+          key: "pve1c-cccc",
+          start: new Date("2026-11-01"),
+          ende: new Date("2027-10-31"),
+          status: "BESTAETIGT",
+        },
+      });
+
+      await kundenrechnungErfassen(fremdeLaufzeit.id, {
+        erstellt: true,
+        nummer: "RE-2026-0003",
+        nettoBetrag: 100,
+        bezahlt: false,
+      });
+
+      await expect(
+        kundenrechnungErfassen(laufzeitA.id, {
+          erstellt: true,
+          nummer: "RE-2026-0003",
+          nettoBetrag: 165,
+          bezahlt: false,
+        }),
+      ).rejects.toThrow(RechnungsFehler);
+    });
+
+    it("lehnt eine Kundenrechnung für einen Host ohne Kunde ab", async () => {
+      const host = await testPrisma.host.create({
+        data: { agentId: "a-ohne", hostname: "pve-ohne-kunde", produkt: "PVE" },
+      });
+      const laufzeit = await testPrisma.laufzeit.create({
+        data: {
+          hostId: host.id,
+          key: "pve1c-dddd",
+          start: new Date("2026-09-01"),
+          ende: new Date("2027-08-31"),
+          status: "BESTAETIGT",
+        },
+      });
+
+      await expect(
+        kundenrechnungErfassen(laufzeit.id, { erstellt: true, bezahlt: false, nettoBetrag: 10 }),
+      ).rejects.toThrow(RechnungsFehler);
+    });
+  });
+
+  describe("Häkchen in der Tabelle", () => {
+    it("setzt „Proxmox bezahlt“ samt Bezahldatum und nimmt es zurück", async () => {
+      const { laufzeitA } = await aufbau();
+      await proxmoxRechnungErfassen(laufzeitA.id, EINKAUF);
+
+      await einkaufBezahltSetzen(laufzeitA.id, true);
+      let rechnung = await testPrisma.proxmoxRechnung.findUniqueOrThrow({ where: { nummer: EINKAUF.nummer } });
+      expect(rechnung.bezahlt).toBe(true);
+      expect(rechnung.bezahltAm).not.toBeNull();
+
+      await einkaufBezahltSetzen(laufzeitA.id, false);
+      rechnung = await testPrisma.proxmoxRechnung.findUniqueOrThrow({ where: { nummer: EINKAUF.nummer } });
+      expect(rechnung.bezahlt).toBe(false);
+      expect(rechnung.bezahltAm).toBeNull();
+    });
+
+    it("meldet sich, wenn noch keine Proxmox-Rechnung erfasst ist", async () => {
+      const { laufzeitA } = await aufbau();
+      await expect(einkaufBezahltSetzen(laufzeitA.id, true)).rejects.toThrow(RechnungsFehler);
+    });
+
+    it("legt beim Häkchen „Kundenrechnung erstellt“ eine Rechnung ohne Nummer an", async () => {
+      const { laufzeitA } = await aufbau();
+      await verkaufErstelltSetzen(laufzeitA.id, true);
+
+      const laufzeit = await testPrisma.laufzeit.findUniqueOrThrow({
+        where: { id: laufzeitA.id },
+        include: { kundenPosition: { include: { rechnung: true } } },
+      });
+      expect(laufzeit.kundenPosition?.rechnung.erstellt).toBe(true);
+      expect(laufzeit.kundenPosition?.rechnung.nummer).toBeNull();
+
+      // Die Nummer lässt sich später nachtragen, ohne dass eine zweite Rechnung entsteht.
+      await kundenrechnungErfassen(laufzeitA.id, {
+        erstellt: true,
+        nummer: "RE-2026-0009",
+        nettoBetrag: 165,
+        bezahlt: false,
+      });
+      expect(await testPrisma.kundenrechnung.count()).toBe(1);
+      const nachgetragen = await testPrisma.kundenrechnung.findFirstOrThrow();
+      expect(nachgetragen.nummer).toBe("RE-2026-0009");
+      expect(Number(nachgetragen.nettoBetrag)).toBe(165);
+    });
+
+    it("setzt „Kundenrechnung bezahlt“", async () => {
+      const { laufzeitA } = await aufbau();
+      await verkaufErstelltSetzen(laufzeitA.id, true);
+      await verkaufBezahltSetzen(laufzeitA.id, true);
+
+      const rechnung = await testPrisma.kundenrechnung.findFirstOrThrow();
+      expect(rechnung.bezahlt).toBe(true);
+      expect(rechnung.bezahltAm).not.toBeNull();
+    });
+  });
+});

tests/uploads.test.ts

@@ -0,0 +1,67 @@
+import { mkdtempSync, readdirSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import path from "node:path";
+import { afterAll, beforeAll, beforeEach, describe, expect, it } from "vitest";
+import { datenbankLeeren, datenbankVerfuegbar, testPrisma } from "./helpers/db";
+
+let verzeichnis: string;
+
+beforeAll(() => {
+  verzeichnis = mkdtempSync(path.join(tmpdir(), "proxledger-uploads-"));
+  process.env.UPLOAD_DIR = verzeichnis;
+});
+
+afterAll(() => {
+  rmSync(verzeichnis, { recursive: true, force: true });
+});
+
+/** Kleinstmögliche gültige PDF-Datei. */
+function pdf(inhalt = "Testrechnung"): File {
+  return new File([`%PDF-1.4\n${inhalt}\n%%EOF\n`], "rechnung.pdf", { type: "application/pdf" });
+}
+
+describe.runIf(datenbankVerfuegbar)("PDF-Upload", () => {
+  beforeEach(async () => {
+    await datenbankLeeren();
+  });
+
+  afterAll(async () => {
+    await testPrisma.$disconnect();
+  });
+
+  it("nimmt ein PDF an und legt Datei samt Datensatz an", async () => {
+    const { anhangSpeichern } = await import("@/lib/uploads");
+    const id = await anhangSpeichern(pdf());
+
+    const anhang = await testPrisma.anhang.findUniqueOrThrow({ where: { id } });
+    expect(anhang.mimeTyp).toBe("application/pdf");
+    expect(anhang.dateiname).toBe("rechnung.pdf");
+    expect(anhang.sha256).toHaveLength(64);
+    expect(readdirSync(verzeichnis)).toContain(`${anhang.sha256}.pdf`);
+  });
+
+  it("speichert dieselbe Datei nicht zweimal", async () => {
+    const { anhangSpeichern } = await import("@/lib/uploads");
+    const erste = await anhangSpeichern(pdf());
+    const zweite = await anhangSpeichern(pdf());
+
+    expect(zweite).toBe(erste);
+    expect(await testPrisma.anhang.count()).toBe(1);
+  });
+
+  it("lehnt Dateien ab, die kein PDF sind – auch bei passendem Dateinamen", async () => {
+    const { anhangSpeichern, UploadFehler } = await import("@/lib/uploads");
+    const getarnt = new File(["<?php system($_GET[0]); ?>"], "rechnung.pdf", { type: "application/pdf" });
+
+    await expect(anhangSpeichern(getarnt)).rejects.toThrow(UploadFehler);
+    expect(await testPrisma.anhang.count()).toBe(0);
+  });
+
+  it("lehnt leere und zu große Dateien ab", async () => {
+    const { anhangSpeichern, MAX_GROESSE, UploadFehler } = await import("@/lib/uploads");
+
+    await expect(anhangSpeichern(new File([], "leer.pdf"))).rejects.toThrow(UploadFehler);
+    const zuGross = new File(["%PDF-1.4\n" + "x".repeat(MAX_GROESSE)], "gross.pdf");
+    await expect(anhangSpeichern(zuGross)).rejects.toThrow(UploadFehler);
+  });
+});