Merge branch 'phase/010-export'

feat(export): CSV- und PDF-Ausgaben fuer Hosts, Kunden und Rechnungen (#010 )
PDFs entstehen serverseitig mit @react-pdf/renderer, mit einfarbigem Logo, wiederholtem Spaltenkopf und Summenzeile. Alle Exporte uebernehmen die Filter der jeweiligen Ansicht. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-09-17 22:12:58 +02:00 · 2026-09-17 22:12:58 +02:00 · 2026-09-17 21:57:09 +02:00 · 2026-09-17 21:57:09 +02:00
18 changed files with 1352 additions and 118 deletions
@@ -17,6 +17,17 @@ und dieses Projekt folgt [Semantic Versioning](https://semver.org/lang/de/).

 ### Sicherheit

+## [0.6.0] – 2026-09-17
+
+### Hinzugefügt
+- Jahresbahn mit zwölf Monaten, Heute-Linie und Gruppierung nach Kunde, aus echten Daten (#009)
+- Ablauf-Kalender für die nächsten 90 Tage samt Rechnungsstatus und eine Übersicht bereits abgelaufener Subscriptions (#009)
+- CSV-Export für Kundenübersicht und Rechnungsliste, PDF-Export für Hosts, Kunden und Rechnungen (#010)
+- Kundenunterlage als PDF: Hosts, Laufzeiten, Summen pro Jahr und Marge eines Kunden (#010)
+
+### Geändert
+- Die Oberfläche arbeitet vollständig mit der Datenbank; Beispieldaten dienen nur noch dem Seed (#009)
+
 ## [0.5.0] – 2026-09-17

 ### Hinzugefügt
@@ -2,7 +2,7 @@

 ## Zeitübersicht

-**Gesamt:** 3 h 23 min
+**Gesamt:** 3 h 58 min

 | Issue | Zeit |
 |---|---|
@@ -15,6 +15,8 @@
 | #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 |
+| #009 Jahresbahn und Ablauf-Kalender | 0 h 15 min |
+| #010 Export CSV und PDF | 0 h 20 min |

 | Meilenstein | Zeit |
 |---|---|
@@ -25,12 +27,13 @@
 | v0.4.1 | 0 h 10 min | **abgeschlossen**
 | v0.4.2 | 0 h 10 min | **abgeschlossen**
 | v0.5.0 | 0 h 35 min | **abgeschlossen**
+| v0.6.0 | 0 h 35 min | **abgeschlossen**

 ---

 ## 2026-09-17 · Sitzung 1 · 19:36–laufend
 **Issue:** #001–#007 (Meilensteine v0.1.0 bis v0.4.0)
-**Version:** 0.5.0
+**Version:** 0.6.0

 ### Erledigt
 - Auftrag gelesen, Rückfragen gestellt
@@ -56,6 +59,9 @@
 - 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
+- #009 abgeschlossen: Jahresbahn und Ablauf-Kalender (90 Tage) aus der Datenbank, dazu eine Karte für bereits abgelaufene Subscriptions; die Oberfläche nutzt keine Beispieldaten mehr
+- #010 abgeschlossen: CSV- und PDF-Export für Hosts, Kunden, einzelne Kundenunterlage und Rechnungsliste; PDFs serverseitig ohne Browser
+- Meilenstein v0.6.0 abgeschlossen

 ### 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.
@@ -84,4 +90,4 @@
 - Offen: Rolle „readonly“ zusätzlich zu Admin? (vorläufig vorgesehen)

 ### Nächster Schritt
- #009 Kundenübersicht, Ablauf-Kalender und Jahresbahn auf Datenbankbasis
+- #011 Warnregeln mit Worker und konfigurierbaren Schwellwerten
@@ -45,6 +45,18 @@ 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.

+## Exporte
+
+| Ansicht | CSV | PDF |
+|---|---|---|
+| Hosts | `/hosts/export` | `/hosts/export?format=pdf` |
+| Kunden | `/kunden/export` | `/kunden/export?format=pdf` |
+| Einzelner Kunde | – | `/kunden/<id>/export` (Anlage für Kundenunterlagen) |
+| Rechnungen | `/rechnungen/export` | `/rechnungen/export?format=pdf` |
+
+Alle Exporte übernehmen die Filter der jeweiligen Ansicht. CSV kommt als UTF-8 mit BOM und Semikolon,
+öffnet sich also ohne Umwege in Excel.
+
 ## Issues nach Gitea übertragen

 Die Issues werden als Markdown-Dateien in `docs/issues/` gepflegt – sie liegen damit im Repo und wandern mit
@@ -1,25 +1,31 @@
 # #009 Kundenübersicht, Dashboard und Jahresbahn
-**Status:** offen
+**Status:** erledigt
 **Meilenstein:** v0.6.0
 **Labels:** ui
-**Geschätzt:** 8 h   **Tatsächlich:** –
+**Geschätzt:** 8 h   **Tatsächlich:** 0 h 15 min

 ## Ziel
 Überblick über Kunden, Kennzahlen und anstehende Abläufe mit Echtdaten.

 ## Aufgaben
- [ ] Kundenübersicht: Anzahl Hosts, aktive Subscriptions, nächster Ablauf, offene Warnungen, Rechnungs-Ampel
- [ ] Kunden-Detail mit Echtdaten (Info-Boxen, Hosts, Laufzeiten, Summen pro Jahr)
- [ ] Dashboard mit Echtdaten: Small Boxes (inkl. „Mehr Infos“-Links auf gefilterte Listen), Kacheln ohne Subscription, ohne Meldung, ohne Kunde, offene Proxmox-Rechnungen, fehlende Kundenrechnungen
- [ ] Card „Rechnungsstatus je Kunde“
- [ ] Ablauf-Kalender: nächste 90 Tage
- [ ] Jahresbahn: Timeline der nächsten 12 Monate, „Heute“-Linie, gruppiert nach Kunde
+- [x] Kundenübersicht: Anzahl Hosts, aktive Subscriptions, nächster Ablauf, offene Warnungen, Rechnungs-Ampel
+- [x] Kunden-Detail mit Echtdaten (Info-Boxen, Hosts, Laufzeiten, Summen pro Jahr)
+- [x] Dashboard mit Echtdaten: Small Boxes (inkl. „Mehr Infos“-Links auf gefilterte Listen), Kacheln ohne Subscription, ohne Meldung, ohne Kunde, offene Proxmox-Rechnungen, fehlende Kundenrechnungen
+- [x] Card „Rechnungsstatus je Kunde“
+- [x] Ablauf-Kalender: nächste 90 Tage
+- [x] Jahresbahn: Timeline der nächsten 12 Monate, „Heute“-Linie, gruppiert nach Kunde

 ## Akzeptanzkriterien
- [ ] Kennzahlen stimmen mit den gefilterten Listen überein
- [ ] Jahresbahn mobil horizontal scrollbar
+- [x] Kennzahlen stimmen mit den gefilterten Listen überein
+- [x] Jahresbahn mobil horizontal scrollbar

 ## Abhängigkeiten
 #008

 ## Notizen / Entscheidungen
+- Kundenübersicht, Kunden-Detail und Dashboard liefen bereits seit #006 auf der Datenbank; hier kamen
+  Jahresbahn und Ablauf-Kalender dazu.
+- Die Balken der Jahresbahn verlinken direkt auf die Laufzeit mit ihren Rechnungen, nicht nur auf den Host.
+- Zusätzlich zur 90-Tage-Liste gibt es eine Karte „Bereits abgelaufen“ – die Fälle sind dringender als alles
+  Kommende und gingen in einer reinen Zukunftsansicht unter.
+- Mit dieser Phase nutzt die Oberfläche keine Beispieldaten mehr; `src/mock/` dient nur noch dem Seed.
@@ -1,22 +1,28 @@
 # #010 Export CSV und PDF
-**Status:** offen
+**Status:** erledigt
 **Meilenstein:** v0.6.0
 **Labels:** export
-**Geschätzt:** 5 h   **Tatsächlich:** –
+**Geschätzt:** 5 h   **Tatsächlich:** 0 h 20 min

 ## Ziel
 Daten für Kundenunterlagen und Buchhaltung exportieren.

 ## Aufgaben
- [ ] CSV (UTF-8 mit BOM, Semikolon, deutsches Zahlenformat): Host-Liste, Kundenübersicht, Rechnungsliste pro Jahr
- [ ] PDF mit einfarbigem Logo: Host-Liste, Kundenübersicht (Anlage für einen Kunden), Rechnungsliste pro Jahr mit Summen
- [ ] Export berücksichtigt aktive Filter
+- [x] CSV (UTF-8 mit BOM, Semikolon, deutsches Zahlenformat): Host-Liste, Kundenübersicht, Rechnungsliste pro Jahr
+- [x] PDF mit einfarbigem Logo: Host-Liste, Kundenübersicht (Anlage für einen Kunden), Rechnungsliste pro Jahr mit Summen
+- [x] Export berücksichtigt aktive Filter

 ## Akzeptanzkriterien
- [ ] CSV öffnet sich in Excel ohne Umlautfehler
- [ ] PDF-Summen entsprechen der Rechnungsübersicht
+- [x] CSV öffnet sich in Excel ohne Umlautfehler
+- [x] PDF-Summen entsprechen der Rechnungsübersicht

 ## Abhängigkeiten
 #009

 ## Notizen / Entscheidungen
+- PDFs entstehen serverseitig mit `@react-pdf/renderer` – kein Chromium im Container nötig.
+- Gemeinsames Grundgerüst (`src/server/pdf/dokument.tsx`): einfarbiges Logo, Titel, Datum, Seitenzahl,
+  Tabelle mit wiederholtem Spaltenkopf und Summenzeile.
+- Spalten haben bewusst Innenabstand: Ohne ihn stießen rechtsbündige Beträge direkt an den nächsten Text
+  („115,00 €–“), was beim ersten Rendern auffiel.
+- Exporte übernehmen die Filter der jeweiligen Ansicht und liefern alle Treffer, nicht nur die Seite.
@@ -12,9 +12,9 @@ Details und Architektur: [../architektur.md](../architektur.md). Zeiten werden a
 | [#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 | erledigt | v0.4.0 | 8 h | 0 h 25 min |
 | [#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 | 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 | – |
+| [#009](009-kundenuebersicht-dashboard-jahresbahn.md) | Kundenübersicht, Dashboard und Jahresbahn | erledigt | v0.6.0 | 8 h | 0 h 15 min |
+| [#010](010-export.md) | Export CSV und PDF | erledigt | v0.6.0 | 5 h | 0 h 20 min |
+| [#011](011-warnregeln.md) | Warnregeln | in Arbeit | v0.7.0 | 8 h | – |
 | [#012](012-benachrichtigungen.md) | Benachrichtigungen | offen | v0.8.0 | 6 h | – |
 | [#013](013-authentifizierung.md) | Authentifizierung und Audit-Log | offen | v0.9.0 | 6 h | – |
 | [#014](014-deployment.md) | Deployment und Dokumentation | offen | v0.10.0 | 8 h | – |
@@ -24,4 +24,4 @@ Details und Architektur: [../architektur.md](../architektur.md). Zeiten werden a
 | [#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** |
+| | **Summe** | | | **114 h** | **3 h 58 min** |
@@ -1,16 +1,18 @@
 {
  "name": "proxledger",
-  "version": "0.1.0-dev",
+  "version": "0.6.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "proxledger",
-      "version": "0.1.0-dev",
+      "version": "0.6.0",
+      "hasInstallScript": true,
      "dependencies": {
        "@node-rs/argon2": "^2.2.1",
        "@prisma/adapter-pg": "^7.10.0",
        "@prisma/client": "^7.10.0",
+        "@react-pdf/renderer": "^4.9.0",
        "admin-lte": "^4.9.1",
        "bootstrap": "^5.3.8",
        "bootstrap-icons": "^1.13.1",
@@ -229,6 +231,15 @@
        "node": ">=6.0.0"
      }
    },
+    "node_modules/@babel/runtime": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.7.tgz",
+      "integrity": "sha512-Nq8OhGWiZIZGV6hLHoyAKLLcJihP/xFeBMGJoUrxTX2psI8dCifzLhZISFb+VWS3wFMRDmCGw5R+dOySCqPLhw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
    "node_modules/@babel/template": {
      "version": "7.29.7",
      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.29.7.tgz",
@@ -1802,6 +1813,30 @@
        "node": ">= 10"
      }
    },
+    "node_modules/@noble/ciphers": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@noble/ciphers/-/ciphers-1.3.0.tgz",
+      "integrity": "sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw==",
+      "license": "MIT",
+      "engines": {
+        "node": "^14.21.3 || >=16"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/@noble/hashes": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
+      "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
+      "license": "MIT",
+      "engines": {
+        "node": "^14.21.3 || >=16"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
    "node_modules/@node-rs/argon2": {
      "version": "2.2.1",
      "resolved": "https://registry.npmjs.org/@node-rs/argon2/-/argon2-2.2.1.tgz",
@@ -2511,6 +2546,181 @@
        }
      }
    },
+    "node_modules/@react-pdf/fns": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@react-pdf/fns/-/fns-3.1.3.tgz",
+      "integrity": "sha512-0I7pApDr1/RLAKbizuLy/IHTEa93LSPy/bEwYniboC3Xqnp6Od8xFJKbKEzGw2wh/5zKFFwl00g4t9RwgIMc3w==",
+      "license": "MIT"
+    },
+    "node_modules/@react-pdf/font": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/@react-pdf/font/-/font-4.1.2.tgz",
+      "integrity": "sha512-RT/jiGWIRjIC9c4S9NiqhEyfuA6YL+DtWL3Rm+k+zQhfeHYvHwGzFxr7ZJzThIMrT8sIQy+mpvFvfYyitEei/Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/types": "^2.14.0",
+        "fontkit": "^2.0.2",
+        "is-url": "^1.2.4",
+        "pdfkit": "0.20.1"
+      }
+    },
+    "node_modules/@react-pdf/hyphenate": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/hyphenate/-/hyphenate-0.1.0.tgz",
+      "integrity": "sha512-CWulbuusHh2Lnos9ZffT3ZYfjCt332Yl8wjSyCKWbwhbTpe/VdFt53fM5elPp3HU3R6tzH6j3oYlLXDwC2WEHQ==",
+      "license": "MIT",
+      "dependencies": {
+        "hyphen": "~1.6.4"
+      }
+    },
+    "node_modules/@react-pdf/image": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@react-pdf/image/-/image-3.1.2.tgz",
+      "integrity": "sha512-89vlvZCCv1hPunFtyeS2rJTRL8h2yYmTI97AM4ppibS79zGsPFbqz/YrAunndcHB9uwGdn5S3+5k18mj0L2vkg==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/svg": "^1.1.1",
+        "jay-peg": "^1.1.1",
+        "png-js": "^2.0.0"
+      }
+    },
+    "node_modules/@react-pdf/layout": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/layout/-/layout-5.2.0.tgz",
+      "integrity": "sha512-Hzf9cShT1bKkr9tZ+A9qK/wHqUloOCgbNer72EquQS6QzqVGiDdtt6Wh9lQXwkd89U7yZolTLnFqP/dRdoRROw==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/fns": "3.1.3",
+        "@react-pdf/image": "^3.1.2",
+        "@react-pdf/paginate": "1.0.1",
+        "@react-pdf/primitives": "^4.4.0",
+        "@react-pdf/stylesheet": "^6.3.2",
+        "@react-pdf/textkit": "^7.0.1",
+        "@react-pdf/types": "^2.14.0",
+        "emoji-regex-xs": "^1.0.0",
+        "queue": "^6.0.1",
+        "yoga-layout": "^3.2.1"
+      }
+    },
+    "node_modules/@react-pdf/paginate": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@react-pdf/paginate/-/paginate-1.0.1.tgz",
+      "integrity": "sha512-JN6teDqkdpkcRhdGZqyrr7Y8flgTtyI8XS3yaBQLyiGjEBPbR9m/19cz2z3JkqYpApau5pEHZlLjwGqMurWysw==",
+      "license": "MIT"
+    },
+    "node_modules/@react-pdf/primitives": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/primitives/-/primitives-4.4.0.tgz",
+      "integrity": "sha512-BFpuhNH6ffSFjTTMnpdUoZxWoXdhPmFDdrSVBl0i/zMR4yDTEfYOW3AcfjjmNIOpm9+LnIXbgELLklQJ+nD3oA==",
+      "license": "MIT"
+    },
+    "node_modules/@react-pdf/reconciler": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/reconciler/-/reconciler-2.0.0.tgz",
+      "integrity": "sha512-7zaPRujpbHSmCpIrZ+b9HSTJHthcVZzX0Wx7RzvQGsGBUbHP4p6s5itXrAIOuQuPvDepoHGNOvf6xUuMVvdoyw==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4.1.1",
+        "scheduler": "0.25.0-rc-603e6108-20241029"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/@react-pdf/reconciler/node_modules/scheduler": {
+      "version": "0.25.0-rc-603e6108-20241029",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0-rc-603e6108-20241029.tgz",
+      "integrity": "sha512-pFwF6H1XrSdYYNLfOcGlM28/j8CGLu8IvdrxqhjWULe2bPcKiKW4CV+OWqR/9fT52mywx65l7ysNkjLKBda7eA==",
+      "license": "MIT"
+    },
+    "node_modules/@react-pdf/render": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/render/-/render-4.7.0.tgz",
+      "integrity": "sha512-UEMgR7gBmCJiKpuu9alY6QeZVNB+7b4DGHc7Hi8QIl+5PfHvyq+TV70N7+ngZ6wN7hF3XSiWz7GDuYxPIx5eRw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.20.13",
+        "@react-pdf/fns": "3.1.3",
+        "@react-pdf/primitives": "^4.4.0",
+        "@react-pdf/textkit": "^7.0.1",
+        "@react-pdf/types": "^2.14.0",
+        "abs-svg-path": "^0.1.1",
+        "color-string": "^2.1.4",
+        "normalize-svg-path": "^1.1.0",
+        "parse-svg-path": "^0.1.2",
+        "svg-arc-to-cubic-bezier": "^3.2.0"
+      }
+    },
+    "node_modules/@react-pdf/renderer": {
+      "version": "4.9.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/renderer/-/renderer-4.9.0.tgz",
+      "integrity": "sha512-RAbARMwjcSYEpqpaWoWXz0uOGF1HjAl5hdJr889r5mgkPhF9xhX4CXSvcEbLTgFVj+KWbcar31MzcXYoANk/Ag==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.20.13",
+        "@react-pdf/fns": "3.1.3",
+        "@react-pdf/font": "^4.1.2",
+        "@react-pdf/layout": "^5.2.0",
+        "@react-pdf/primitives": "^4.4.0",
+        "@react-pdf/reconciler": "^2.0.0",
+        "@react-pdf/render": "^4.7.0",
+        "@react-pdf/types": "^2.14.0",
+        "events": "^3.3.0",
+        "object-assign": "^4.1.1",
+        "pdfkit": "0.20.1",
+        "prop-types": "^15.6.2",
+        "queue": "^6.0.1"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/@react-pdf/stylesheet": {
+      "version": "6.3.2",
+      "resolved": "https://registry.npmjs.org/@react-pdf/stylesheet/-/stylesheet-6.3.2.tgz",
+      "integrity": "sha512-UR247sNBx2k3RdL8JUCpUiyx39yQsUABagv3uAi91iMZCORE+fSCsOh7MOcEImmpms4GihydLGudbngI5g14PA==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/fns": "3.1.3",
+        "@react-pdf/types": "^2.14.0",
+        "color-string": "^2.1.4",
+        "hsl-to-hex": "^1.0.0",
+        "media-engine": "^2.0.0",
+        "postcss-value-parser": "^4.1.0"
+      }
+    },
+    "node_modules/@react-pdf/svg": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@react-pdf/svg/-/svg-1.1.1.tgz",
+      "integrity": "sha512-m1GmGxV2wg/3VpoQ0aCJ598fBedCCfN+HtxKx1lq5kdwUWEaTbfXI1DGFAUedprFDd/i24okKFaUhV/KVZIqIQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/primitives": "^4.4.0"
+      }
+    },
+    "node_modules/@react-pdf/textkit": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/@react-pdf/textkit/-/textkit-7.0.1.tgz",
+      "integrity": "sha512-ljY/YoEETIOR/+zxWdLLmKlupz8/nBsbmxglM3mDRco62UEzEPnIeMEzYVVVraovCAJC2t+50gKFNSV17FYxbw==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/fns": "3.1.3",
+        "@react-pdf/hyphenate": "^0.1.0",
+        "bidi-js": "^1.0.2",
+        "unicode-properties": "^1.4.1"
+      }
+    },
+    "node_modules/@react-pdf/types": {
+      "version": "2.14.0",
+      "resolved": "https://registry.npmjs.org/@react-pdf/types/-/types-2.14.0.tgz",
+      "integrity": "sha512-TYHpThdf2sz/d1g+CP9nWjYCJ8BYBUN5ORL6+60A85Js9S/YouK8OXzi+hDpYUSZJTOdYXdRxUNeG2oW8//Ulg==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-pdf/font": "^4.1.2",
+        "@react-pdf/primitives": "^4.4.0",
+        "@react-pdf/stylesheet": "^6.3.2"
+      }
+    },
    "node_modules/@rolldown/binding-android-arm-eabi": {
      "version": "1.2.9",
      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm-eabi/-/binding-android-arm-eabi-1.2.9.tgz",
@@ -3861,6 +4071,12 @@
        "url": "https://opencollective.com/vitest"
      }
    },
+    "node_modules/abs-svg-path": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/abs-svg-path/-/abs-svg-path-0.1.1.tgz",
+      "integrity": "sha512-d8XPSGjfyzlXC3Xx891DJRyZfqk5JU0BJrDQcsWomFIV1/BIzPW5HDH5iDdWpqWaav0YVIEzT1RHTwWr0FFshA==",
+      "license": "MIT"
+    },
    "node_modules/acorn": {
      "version": "8.18.0",
      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.18.0.tgz",
@@ -4186,6 +4402,26 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
    "node_modules/baseline-browser-mapping": {
      "version": "2.11.24",
      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.24.tgz",
@@ -4205,6 +4441,15 @@
      "devOptional": true,
      "license": "MIT"
    },
+    "node_modules/bidi-js": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.1.0.tgz",
+      "integrity": "sha512-fX1Onk0tdVPC7obPWB5EbJ1z7NVhLq4m2xZLq2YXBkxzMXIGRpNMU88n0EPgWseKl12J7zXs7qrDxPK4sRs2fg==",
+      "license": "MIT",
+      "dependencies": {
+        "require-from-string": "^2.0.2"
+      }
+    },
    "node_modules/bootstrap": {
      "version": "5.3.8",
      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.8.tgz",
@@ -4264,6 +4509,15 @@
        "node": ">=8"
      }
    },
+    "node_modules/brotli": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/brotli/-/brotli-1.3.3.tgz",
+      "integrity": "sha512-oTKjJdShmDuGW94SyyaoQvAjf30dZaHnjJ8uAF+u2/vGJkJbJPJAT1gDiOJP5v1Zb6f9KEyW/1HpuaWIXtGHPg==",
+      "license": "MIT",
+      "dependencies": {
+        "base64-js": "^1.1.2"
+      }
+    },
    "node_modules/browserslist": {
      "version": "4.29.0",
      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.29.0.tgz",
@@ -4463,6 +4717,15 @@
      "integrity": "sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==",
      "license": "MIT"
    },
+    "node_modules/clone": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
+      "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/color-convert": {
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -4483,6 +4746,27 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/color-string": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-2.1.4.tgz",
+      "integrity": "sha512-Bb6Cq8oq0IjDOe8wJmi4JeNn763Xs9cfrBcaylK1tPypWzyoy2G3l90v9k64kjphl/ZJjPIShFztenRomi8WTg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/color-string/node_modules/color-name": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.1.tgz",
+      "integrity": "sha512-p2FdgwVx1a9yWBHP2wI0VgShkDpgN4kZISkxdNipGBJWpa5G6b04OINlVWCyJj0JmfvcPrgqt95E9k8yvaOJFg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.20"
+      }
+    },
    "node_modules/concat-map": {
      "version": "0.0.1",
      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -4840,6 +5124,12 @@
        "node": ">=8"
      }
    },
+    "node_modules/dfa": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/dfa/-/dfa-1.2.0.tgz",
+      "integrity": "sha512-ED3jP8saaweFTjeGX8HQPjeC1YYyZs98jGNZx6IiBvxW7JG5v492kamAQB3m2wop07CvU/RQmzcKr6bgcC5D/Q==",
+      "license": "MIT"
+    },
    "node_modules/doctrine": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
@@ -4913,6 +5203,12 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/emoji-regex-xs": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex-xs/-/emoji-regex-xs-1.0.0.tgz",
+      "integrity": "sha512-LRlerrMYoIDrT6jgpeZ2YYl/L8EulRTt5hQcYjy5AInh7HWXKimpqx68aknBFpGL2+/IcogTcaydJEgaTmOpDg==",
+      "license": "MIT"
+    },
    "node_modules/empathic": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/empathic/-/empathic-2.0.0.tgz",
@@ -5640,6 +5936,15 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/events": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
+      "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8.x"
+      }
+    },
    "node_modules/expect-type": {
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.4.0.tgz",
@@ -5691,7 +5996,6 @@
      "version": "3.1.3",
      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-      "devOptional": true,
      "license": "MIT"
    },
    "node_modules/fast-glob": {
@@ -5775,6 +6079,12 @@
        "reusify": "^1.0.4"
      }
    },
+    "node_modules/fflate": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.3.tgz",
+      "integrity": "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA==",
+      "license": "MIT"
+    },
    "node_modules/file-entry-cache": {
      "version": "8.0.0",
      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
@@ -5854,6 +6164,23 @@
      "dev": true,
      "license": "ISC"
    },
+    "node_modules/fontkit": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/fontkit/-/fontkit-2.0.4.tgz",
+      "integrity": "sha512-syetQadaUEDNdxdugga9CpEYVaQIxOwk7GlwZWWZ19//qW4zE5bknOKeMBDYAASwnpaSHKJITRLMF9m1fp3s6g==",
+      "license": "MIT",
+      "dependencies": {
+        "@swc/helpers": "^0.5.12",
+        "brotli": "^1.3.2",
+        "clone": "^2.1.2",
+        "dfa": "^1.2.0",
+        "fast-deep-equal": "^3.1.3",
+        "restructure": "^3.0.0",
+        "tiny-inflate": "^1.0.3",
+        "unicode-properties": "^1.4.0",
+        "unicode-trie": "^2.0.0"
+      }
+    },
    "node_modules/for-each": {
      "version": "0.3.5",
      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
@@ -6251,6 +6578,27 @@
        "hermes-estree": "0.25.1"
      }
    },
+    "node_modules/hsl-to-hex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/hsl-to-hex/-/hsl-to-hex-1.0.0.tgz",
+      "integrity": "sha512-K6GVpucS5wFf44X0h2bLVRDsycgJmf9FF2elg+CrqD8GcFU8c6vYhgXn8NjUkFCwj+xDFb70qgLbTUm6sxwPmA==",
+      "license": "MIT",
+      "dependencies": {
+        "hsl-to-rgb-for-reals": "^1.1.0"
+      }
+    },
+    "node_modules/hsl-to-rgb-for-reals": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/hsl-to-rgb-for-reals/-/hsl-to-rgb-for-reals-1.1.1.tgz",
+      "integrity": "sha512-LgOWAkrN0rFaQpfdWBQlv/VhkOxb5AsBjk6NQVx4yEzWS923T07X0M1Y0VNko2H52HeSpZrZNNMJ0aFqsdVzQg==",
+      "license": "ISC"
+    },
+    "node_modules/hyphen": {
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/hyphen/-/hyphen-1.6.6.tgz",
+      "integrity": "sha512-XtqmnT+b9n5MX+MsqluFAVTIenbtC25iskW0Z+jLd+awfhA+ZbWKWQMIvLJccGoa2bM1R6juWJ27cZxIFOmkWw==",
+      "license": "ISC"
+    },
    "node_modules/iconv-lite": {
      "version": "0.7.3",
      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.3.tgz",
@@ -6305,6 +6653,12 @@
        "node": ">=0.8.19"
      }
    },
+    "node_modules/inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
+      "license": "ISC"
+    },
    "node_modules/internal-slot": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
@@ -6722,6 +7076,12 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/is-url": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz",
+      "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==",
+      "license": "MIT"
+    },
    "node_modules/is-weakmap": {
      "version": "2.0.2",
      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
@@ -6800,6 +7160,15 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/jay-peg": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/jay-peg/-/jay-peg-1.1.1.tgz",
+      "integrity": "sha512-D62KEuBxz/ip2gQKOEhk/mx14o7eiFRaU+VNNSP4MOiIkwb/D6B3G1Mfas7C/Fit8EsSV2/IWjZElx/Gs6A4ww==",
+      "license": "MIT",
+      "dependencies": {
+        "restructure": "^3.0.0"
+      }
+    },
    "node_modules/jiti": {
      "version": "2.7.0",
      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.7.0.tgz",
@@ -6814,7 +7183,6 @@
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true,
      "license": "MIT"
    },
    "node_modules/js-yaml": {
@@ -7232,6 +7600,25 @@
        "url": "https://opencollective.com/parcel"
      }
    },
+    "node_modules/linebreak": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/linebreak/-/linebreak-1.1.0.tgz",
+      "integrity": "sha512-MHp03UImeVhB7XZtjd0E4n6+3xr5Dq/9xI/5FptGk5FrbDR3zagPa2DS6U8ks/3HjbKWG9Q1M2ufOzxV2qLYSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "base64-js": "0.0.8",
+        "unicode-trie": "^2.0.0"
+      }
+    },
+    "node_modules/linebreak/node_modules/base64-js": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-0.0.8.tgz",
+      "integrity": "sha512-3XSA2cR/h/73EzlXXdU6YNycmYI7+kicTxks4eJg2g39biHR84slg2+des+p7iHYhbRg/udIS4TD53WabcOUkw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
    "node_modules/locate-path": {
      "version": "6.0.0",
      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -7273,7 +7660,6 @@
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "dev": true,
      "license": "MIT",
      "dependencies": {
        "js-tokens": "^3.0.0 || ^4.0.0"
@@ -7328,6 +7714,12 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/media-engine": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/media-engine/-/media-engine-2.0.0.tgz",
+      "integrity": "sha512-FqNmlXKYrp5d3g7xEOMJb+6gXZE0fTssdyIQqYR4LbkifbNbS0hDylhNDOh8r6tCgLboHd8+mwgH2njgSYDpnQ==",
+      "license": "MIT"
+    },
    "node_modules/merge2": {
      "version": "1.4.1",
      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -7539,11 +7931,19 @@
        "node": ">=18"
      }
    },
+    "node_modules/normalize-svg-path": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/normalize-svg-path/-/normalize-svg-path-1.1.0.tgz",
+      "integrity": "sha512-r9KHKG2UUeB5LoTouwDzBy2VxXlHsiM6fyLQvnJa0S5hrhzqElH/CH7TUGhT1fVvIYBIKf3OpY4YJ4CK+iaqHg==",
+      "license": "MIT",
+      "dependencies": {
+        "svg-arc-to-cubic-bezier": "^3.0.0"
+      }
+    },
    "node_modules/object-assign": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-      "dev": true,
      "license": "MIT",
      "engines": {
        "node": ">=0.10.0"
@@ -7752,6 +8152,12 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/pako": {
+      "version": "0.2.9",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
+      "integrity": "sha512-NUcwaKxUxWrZLpDG+z/xZaCgQITkA/Dv4V/T6bw7VON6l1Xz/VnrBqrYjZQ12TamKHzITTfOEIYUj48y2KXImA==",
+      "license": "MIT"
+    },
    "node_modules/parent-module": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -7765,6 +8171,12 @@
        "node": ">=6"
      }
    },
+    "node_modules/parse-svg-path": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/parse-svg-path/-/parse-svg-path-0.1.2.tgz",
+      "integrity": "sha512-JyPSBnkTJ0AI8GGJLfMXvKq42cj5c006fnLz6fXy6zfoVjJizi8BNTpu8on8ziI1cKy9d9DGNuY17Ce7wuejpQ==",
+      "license": "MIT"
+    },
    "node_modules/path-exists": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -7799,6 +8211,20 @@
      "devOptional": true,
      "license": "MIT"
    },
+    "node_modules/pdfkit": {
+      "version": "0.20.1",
+      "resolved": "https://registry.npmjs.org/pdfkit/-/pdfkit-0.20.1.tgz",
+      "integrity": "sha512-1rRXK6x5o8I/3dBrBzXfxibpHpkfCnIA7EBAES7pEpGFc/65inMLlA8SalGWpJfal7BGekxeLf6A30IOpQpc5Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@noble/ciphers": "^1.3.0",
+        "@noble/hashes": "^1.8.0",
+        "fflate": "^0.8.3",
+        "fontkit": "^2.0.4",
+        "linebreak": "^1.1.0",
+        "png-js": "^2.0.0"
+      }
+    },
    "node_modules/perfect-debounce": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/perfect-debounce/-/perfect-debounce-2.1.0.tgz",
@@ -7942,6 +8368,14 @@
      "devOptional": true,
      "license": "MIT"
    },
+    "node_modules/png-js": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/png-js/-/png-js-2.0.0.tgz",
+      "integrity": "sha512-GdzJuUMc6ZSpxFJWVxtOH1bzYHym+TOnveqUjb+VJIbZWbZzyiRGFiKhbiielfpYbgMlhHVhsJ0FTazfuRFkMA==",
+      "dependencies": {
+        "fflate": "^0.8.2"
+      }
+    },
    "node_modules/possible-typed-array-names": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
@@ -7980,6 +8414,12 @@
        "node": "^10 || ^12 || >=14"
      }
    },
+    "node_modules/postcss-value-parser": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
+      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
+      "license": "MIT"
+    },
    "node_modules/postgres": {
      "version": "3.4.7",
      "resolved": "https://registry.npmjs.org/postgres/-/postgres-3.4.7.tgz",
@@ -8097,7 +8537,6 @@
      "version": "15.8.1",
      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
      "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
-      "dev": true,
      "license": "MIT",
      "dependencies": {
        "loose-envify": "^1.4.0",
@@ -8151,6 +8590,15 @@
      ],
      "license": "MIT"
    },
+    "node_modules/queue": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/queue/-/queue-6.0.2.tgz",
+      "integrity": "sha512-iHZWu+q3IdFZFX36ro/lKBkSvfkztY5Y7HMiPlOUjhupPcG2JMfst2KKEpu5XndviX/3UhFbRngUPNKtgvtZiA==",
+      "license": "MIT",
+      "dependencies": {
+        "inherits": "~2.0.3"
+      }
+    },
    "node_modules/queue-microtask": {
      "version": "1.2.3",
      "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
@@ -8208,7 +8656,6 @@
      "version": "16.13.1",
      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "dev": true,
      "license": "MIT"
    },
    "node_modules/readdirp": {
@@ -8283,7 +8730,6 @@
      "version": "2.0.2",
      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
-      "devOptional": true,
      "license": "MIT",
      "engines": {
        "node": ">=0.10.0"
@@ -8333,6 +8779,12 @@
        "url": "https://github.com/privatenumber/resolve-pkg-maps?sponsor=1"
      }
    },
+    "node_modules/restructure": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/restructure/-/restructure-3.0.2.tgz",
+      "integrity": "sha512-gSfoiOEA0VPE6Tukkrr7I0RBdE0s7H1eFCDBk05l1KIQT1UIKNc5JZy6jdyW6eYH3aR3g5b3PuL77rq0hvwtAw==",
+      "license": "MIT"
+    },
    "node_modules/ret": {
      "version": "0.5.0",
      "resolved": "https://registry.npmjs.org/ret/-/ret-0.5.0.tgz",
@@ -9017,6 +9469,18 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/svg-arc-to-cubic-bezier": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/svg-arc-to-cubic-bezier/-/svg-arc-to-cubic-bezier-3.2.0.tgz",
+      "integrity": "sha512-djbJ/vZKZO+gPoSDThGNpKDO+o+bAeA4XQKovvkNCqnIS2t+S4qnLAGQhyyrulhCFRl1WWzAp0wUDV8PpTVU3g==",
+      "license": "ISC"
+    },
+    "node_modules/tiny-inflate": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz",
+      "integrity": "sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw==",
+      "license": "MIT"
+    },
    "node_modules/tinybench": {
      "version": "6.1.4",
      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-6.1.4.tgz",
@@ -9315,6 +9779,26 @@
      "integrity": "sha512-AsuCzffGHJybSaRrmr5eHr81mwJU3kjw6M+uprWvCXiNeN9SOGwQ3Jn8jb8m3Z6izVgknn1R0FTCEAP2QrLY/w==",
      "license": "MIT"
    },
+    "node_modules/unicode-properties": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/unicode-properties/-/unicode-properties-1.4.1.tgz",
+      "integrity": "sha512-CLjCCLQ6UuMxWnbIylkisbRj31qxHPAurvena/0iwSVbQ2G1VY5/HjV0IRabOEbDHlzZlRdCrD4NhB0JtU40Pg==",
+      "license": "MIT",
+      "dependencies": {
+        "base64-js": "^1.3.0",
+        "unicode-trie": "^2.0.0"
+      }
+    },
+    "node_modules/unicode-trie": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/unicode-trie/-/unicode-trie-2.0.0.tgz",
+      "integrity": "sha512-x7bc76x0bm4prf1VLg79uhAzKw8DVboClSN5VxJuQ+LKDOVEW9CdH+VY7SP+vX7xCYQqzzgQpFqz15zeLvAtZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "pako": "^0.2.5",
+        "tiny-inflate": "^1.0.0"
+      }
+    },
    "node_modules/unrs-resolver": {
      "version": "1.12.2",
      "resolved": "https://registry.npmjs.org/unrs-resolver/-/unrs-resolver-1.12.2.tgz",
@@ -9789,6 +10273,12 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/yoga-layout": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/yoga-layout/-/yoga-layout-3.2.1.tgz",
+      "integrity": "sha512-0LPOt3AxKqMdFBZA3HBAt/t/8vIKq7VaQYbuA8WxCgung+p9TVyKRYdpvCb80HcdTN2NkbIKbhNwKUfm3tQywQ==",
+      "license": "MIT"
+    },
    "node_modules/zeptomatch": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/zeptomatch/-/zeptomatch-2.1.0.tgz",
@@ -1,6 +1,6 @@
 {
  "name": "proxledger",
-  "version": "0.5.0",
+  "version": "0.6.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
@@ -24,6 +24,7 @@
    "@node-rs/argon2": "^2.2.1",
    "@prisma/adapter-pg": "^7.10.0",
    "@prisma/client": "^7.10.0",
+    "@react-pdf/renderer": "^4.9.0",
    "admin-lte": "^4.9.1",
    "bootstrap": "^5.3.8",
    "bootstrap-icons": "^1.13.1",
@@ -1,7 +1,11 @@
 import { PRODUKT_TEXT, STATUS_TEXT, statusAusDatenbank } from "@/lib/anzeige";
 import { csvAntwort, csvDatei } from "@/lib/csv";
+import { formatDatum } from "@/lib/format";
+import { Bericht, pdfAntwort, Tabelle } from "@/server/pdf/dokument";
 import { hostListe, type HostFilter } from "@/server/queries/hostliste";

+type ExportHost = Awaited<ReturnType<typeof hostListe>>["hosts"][number];
+
 export const dynamic = "force-dynamic";

 /** CSV-Export der Host-Tabelle; übernimmt die Filter aus der Adresse. */
@@ -20,13 +24,48 @@ export async function GET(request: Request) {
  };

  const { gesamt } = await hostListe({ ...filter }, new Date());
-  const alle = [];
+  const alle: ExportHost[] = [];
  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 datum = new Date().toISOString().slice(0, 10);
+
+  if (new URL(request.url).searchParams.get("format") === "pdf") {
+    return pdfAntwort(
+      Bericht({
+        titel: "Host-Liste",
+        untertitel: `${alle.length} Hosts`,
+        quer: true,
+        children: Tabelle({
+          spalten: [
+            { titel: "Host", breite: 18, wert: (h: ExportHost) => h.hostname },
+            { titel: "Kunde", breite: 18, wert: (h) => h.kunde?.name ?? "Nicht zugeordnet" },
+            { titel: "Produkt", breite: 15, wert: (h) => PRODUKT_TEXT[h.produkt] },
+            { titel: "Status", breite: 12, wert: (h) => STATUS_TEXT[statusAusDatenbank(h.subStatus)] },
+            { titel: "Key", breite: 15, wert: (h) => h.subKey ?? "–" },
+            {
+              titel: "Sockets",
+              breite: 8,
+              wert: (h) => `${h.subLizenzierteSockets ?? "–"} / ${h.sockets ?? "–"}`,
+              rechts: true,
+            },
+            {
+              titel: "Ablauf",
+              breite: 14,
+              wert: (h) => (h.subNextduedate ? formatDatum(h.subNextduedate) : "–"),
+              rechts: true,
+            },
+          ],
+          zeilen: alle,
+        }),
+      }),
+      `proxledger-hosts-${datum}.pdf`,
+    );
+  }
+
  const inhalt = csvDatei(
    [
      "Hostname",
@@ -64,6 +103,5 @@ export async function GET(request: Request) {
    ]),
  );

-  const datum = new Date().toISOString().slice(0, 10);
  return csvAntwort(inhalt, `proxledger-hosts-${datum}.csv`);
 }
@@ -1,26 +1,31 @@
 import Link from "next/link";
 import { ContentHeader } from "@/components/layout/ContentHeader";
+import { AblaufBadge, EinkaufBadge, VerkaufBadge } from "@/components/ui/Badges";
 import { Card } from "@/components/ui/Card";
-import { formatDatum, tageBis } from "@/lib/format";
-import { HEUTE, hosts, kunden } from "@/mock/data";
+import { CopyableCode } from "@/components/ui/CopyableCode";
+import { formatDatum, formatTageBis } from "@/lib/format";
+import { ablaufDaten } from "@/server/queries/jahresbahn";

 export const metadata = { title: "Jahresbahn" };

 const MONATE = ["Jan", "Feb", "Mär", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez"];
+const GESAMT_TAGE = 365;

-export default function JahresbahnSeite() {
-  const start = new Date(Date.UTC(HEUTE.getUTCFullYear(), HEUTE.getUTCMonth(), 1));
-  const gesamtTage = 365;
+export default async function JahresbahnSeite() {
+  const jetzt = new Date();
+  const { gruppen, naechste90Tage, abgelaufen } = await ablaufDaten(jetzt);

-  function position(datum: string): number | null {
-    const tage = Math.round((new Date(datum).getTime() - start.getTime()) / 86_400_000);
-    if (tage < 0 || tage > gesamtTage) return null;
-    return (tage / gesamtTage) * 100;
+  // Die Bahn beginnt am Ersten des laufenden Monats und zeigt zwölf Monate.
+  const start = new Date(Date.UTC(jetzt.getUTCFullYear(), jetzt.getUTCMonth(), 1));
+
+  function position(datum: Date): number | null {
+    const tage = Math.round((datum.getTime() - start.getTime()) / 86_400_000);
+    if (tage < 0 || tage > GESAMT_TAGE) return null;
+    return (tage / GESAMT_TAGE) * 100;
  }

-  const heutePosition = position(HEUTE.toISOString().slice(0, 10)) ?? 0;
-
-  const monatsBeschriftung = Array.from({ length: 12 }, (_, i) => {
+  const heutePosition = position(jetzt) ?? 0;
+  const monate = Array.from({ length: 12 }, (_, i) => {
    const datum = new Date(Date.UTC(start.getUTCFullYear(), start.getUTCMonth() + i, 1));
    return `${MONATE[datum.getUTCMonth()]} ${String(datum.getUTCFullYear()).slice(2)}`;
  });
@@ -31,79 +36,175 @@ export default function JahresbahnSeite() {

      <div className="app-content">
        <div className="container-fluid">
-          <Card titel="Abläufe der nächsten 12 Monate" rahmen="primary">
-            <div className="table-responsive">
-              <div style={{ minWidth: "760px" }}>
-                <div className="d-flex text-body-secondary small mb-2" style={{ marginLeft: "12rem" }}>
-                  {monatsBeschriftung.map((monat) => (
-                    <div key={monat} style={{ width: `${100 / 12}%` }}>
-                      {monat}
-                    </div>
-                  ))}
-                </div>
-
-                {kunden.map((kunde) => {
-                  const eigene = hosts.filter(
-                    (h) => h.kundeId === kunde.id && h.subscription.nextduedate !== null,
-                  );
-                  if (eigene.length === 0) return null;
-                  return (
-                    <div key={kunde.id} className="mb-3">
-                      <div className="fw-semibold small mb-1">
-                        <Link href={`/kunden/${kunde.id}`} className="text-decoration-none">
-                          {kunde.name}
-                        </Link>
+          <Card titel="Abläufe der nächsten zwölf Monate" rahmen="primary">
+            {gruppen.length === 0 ? (
+              <p className="mb-0 text-body-secondary">Noch kein Host mit Ablaufdatum gemeldet.</p>
+            ) : (
+              <div className="table-responsive">
+                <div style={{ minWidth: "820px" }}>
+                  <div className="d-flex text-body-secondary small mb-2" style={{ marginLeft: "13rem" }}>
+                    {monate.map((monat) => (
+                      <div key={monat} style={{ width: `${100 / 12}%` }}>
+                        {monat}
                      </div>
-                      {eigene.map((host) => {
-                        const datum = host.subscription.nextduedate!;
-                        const links = position(datum.slice(0, 10));
-                        const tage = tageBis(datum, HEUTE);
+                    ))}
+                  </div>
+
+                  {gruppen.map((gruppe) => (
+                    <div key={gruppe.kundeId ?? "ohne"} className="mb-3">
+                      <div className="fw-semibold small mb-1">
+                        {gruppe.kundeId ? (
+                          <Link href={`/kunden/${gruppe.kundeId}`} className="text-decoration-none">
+                            {gruppe.name}
+                          </Link>
+                        ) : (
+                          <span className="badge pl-bg-neutral">{gruppe.name}</span>
+                        )}
+                      </div>
+
+                      {gruppe.eintraege.map((eintrag) => {
+                        const links = position(eintrag.ablauf);
                        const farbe =
-                          tage === null || tage < 14
+                          eintrag.tage < 14
                            ? "var(--pl-danger)"
-                            : tage < 30
+                            : eintrag.tage < 30
                              ? "var(--pl-warning)"
                              : "var(--pl-info)";
                        return (
-                          <div key={host.id} className="d-flex align-items-center mb-1">
-                            <div className="small text-truncate" style={{ width: "12rem" }}>
-                              <Link href={`/hosts/${host.id}`} className="text-decoration-none">
-                                {host.hostname}
+                          <div key={eintrag.hostId} className="d-flex align-items-center mb-1">
+                            <div className="small text-truncate" style={{ width: "13rem" }}>
+                              <Link href={`/hosts/${eintrag.hostId}`} className="text-decoration-none">
+                                {eintrag.hostname}
                              </Link>
                            </div>
                            <div className="pl-timeline-row flex-grow-1 position-relative">
                              <div className="pl-timeline-heute" style={{ left: `${heutePosition}%` }} />
                              {links === null ? (
                                <span className="small text-body-secondary ms-2">
-                                  außerhalb des Zeitraums ({formatDatum(datum)})
+                                  außerhalb des Zeitraums ({formatDatum(eintrag.ablauf)})
                                </span>
                              ) : (
-                                <div
-                                  className="pl-timeline-bar"
+                                <Link
+                                  href={
+                                    eintrag.laufzeitId
+                                      ? `/rechnungen/${eintrag.laufzeitId}`
+                                      : `/hosts/${eintrag.hostId}`
+                                  }
+                                  className="pl-timeline-bar text-decoration-none"
                                  style={{
-                                    left: `${Math.max(0, links - 6)}%`,
+                                    left: `${Math.min(92, Math.max(0, links - 5))}%`,
                                    backgroundColor: farbe,
                                    color: farbe === "var(--pl-warning)" ? "var(--pl-warning-text)" : "#fff",
                                  }}
-                                  title={`${host.hostname} läuft am ${formatDatum(datum)} ab`}
+                                  title={`${eintrag.hostname} läuft am ${formatDatum(eintrag.ablauf)} ab`}
                                >
-                                  {formatDatum(datum)}
-                                </div>
+                                  {formatDatum(eintrag.ablauf)}
+                                </Link>
                              )}
                            </div>
                          </div>
                        );
                      })}
                    </div>
-                  );
-                })}
+                  ))}
+                </div>
              </div>
-            </div>
+            )}
+
            <p className="small text-body-secondary mb-0">
-              Die rote Linie markiert heute ({formatDatum(HEUTE)}). Farbe der Balken: rot unter 14 Tagen, gelb
-              unter 30 Tagen, sonst blau.
+              Die rote Linie markiert heute ({formatDatum(jetzt)}). Balkenfarbe: rot unter 14 Tagen, gelb
+              unter 30 Tagen, sonst blau. Ein Klick führt zur Laufzeit mit ihren Rechnungen.
            </p>
          </Card>
+
+          <div className="row">
+            <div className="col-lg-8">
+              <Card
+                titel={`Ablauf-Kalender: nächste 90 Tage (${naechste90Tage.length})`}
+                rahmen="warning"
+                tabelle
+              >
+                <div className="table-responsive">
+                  <table className="table table-striped align-middle">
+                    <thead>
+                      <tr>
+                        <th scope="col">Ablauf</th>
+                        <th scope="col">Host</th>
+                        <th scope="col">Kunde</th>
+                        <th scope="col">Key</th>
+                        <th scope="col">Proxmox</th>
+                        <th scope="col">Kundenrechnung</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      {naechste90Tage.map((eintrag) => (
+                        <tr key={eintrag.hostId}>
+                          <td>
+                            <AblaufBadge datum={eintrag.ablauf.toISOString()} heute={jetzt} />
+                          </td>
+                          <td>
+                            <Link href={`/hosts/${eintrag.hostId}`} className="text-decoration-none">
+                              {eintrag.hostname}
+                            </Link>
+                          </td>
+                          <td>
+                            {eintrag.kunde ? (
+                              <Link href={`/kunden/${eintrag.kunde.id}`} className="text-decoration-none">
+                                {eintrag.kunde.name}
+                              </Link>
+                            ) : (
+                              <span className="badge pl-bg-neutral">Nicht zugeordnet</span>
+                            )}
+                          </td>
+                          <td>
+                            <CopyableCode wert={eintrag.key} />
+                          </td>
+                          <td>
+                            <EinkaufBadge bezahlt={eintrag.einkaufBezahlt} />
+                          </td>
+                          <td>
+                            <VerkaufBadge erstellt={eintrag.verkaufErstellt ?? false} bezahlt={false} />
+                          </td>
+                        </tr>
+                      ))}
+                      {naechste90Tage.length === 0 ? (
+                        <tr>
+                          <td colSpan={6} className="text-center text-body-secondary py-4">
+                            In den nächsten 90 Tagen läuft nichts ab.
+                          </td>
+                        </tr>
+                      ) : null}
+                    </tbody>
+                  </table>
+                </div>
+              </Card>
+            </div>
+
+            <div className="col-lg-4">
+              <Card
+                titel={`Bereits abgelaufen (${abgelaufen.length})`}
+                rahmen={abgelaufen.length > 0 ? "danger" : "info"}
+              >
+                {abgelaufen.length === 0 ? (
+                  <p className="mb-0 text-body-secondary">Keine abgelaufenen Subscriptions.</p>
+                ) : (
+                  <ul className="list-unstyled mb-0">
+                    {abgelaufen.map((eintrag) => (
+                      <li key={eintrag.hostId} className="mb-2">
+                        <Link href={`/hosts/${eintrag.hostId}`} className="fw-semibold text-decoration-none">
+                          {eintrag.hostname}
+                        </Link>
+                        <div className="small text-body-secondary">
+                          {eintrag.kunde?.name ?? "Nicht zugeordnet"} · {formatDatum(eintrag.ablauf)} (
+                          {formatTageBis(eintrag.tage)})
+                        </div>
+                      </li>
+                    ))}
+                  </ul>
+                )}
+              </Card>
+            </div>
+          </div>
        </div>
      </div>
    </>
@@ -0,0 +1,74 @@
+import { PRODUKT_TEXT, STATUS_TEXT, statusAusDatenbank } from "@/lib/anzeige";
+import { formatDatum, formatEuro } from "@/lib/format";
+import { Abschnitt, Bericht, pdfAntwort, Tabelle } from "@/server/pdf/dokument";
+import { kundeMitDetails, laufzeitenVonKunde, summen, summenProJahr } from "@/server/queries/kunden";
+
+export const dynamic = "force-dynamic";
+
+/** Kundenunterlage als PDF: Hosts, Laufzeiten und Summen eines Kunden. */
+export async function GET(_request: Request, { params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params;
+  const kunde = await kundeMitDetails(id);
+  if (!kunde) return new Response("Nicht gefunden", { status: 404 });
+
+  const laufzeiten = await laufzeitenVonKunde(kunde.id);
+  const gesamt = summen(laufzeiten);
+  const proJahr = summenProJahr(laufzeiten);
+  const datum = new Date().toISOString().slice(0, 10);
+
+  return pdfAntwort(
+    Bericht({
+      titel: kunde.name,
+      untertitel: `Kundennummer ${kunde.kundennummer}${kunde.ansprechpartner ? ` · ${kunde.ansprechpartner}` : ""}`,
+      children: [
+        Abschnitt({ titel: `Hosts (${kunde.hosts.length})` }),
+        Tabelle({
+          spalten: [
+            { titel: "Host", breite: 28, wert: (h: (typeof kunde.hosts)[number]) => h.hostname },
+            { titel: "Produkt", breite: 22, wert: (h) => PRODUKT_TEXT[h.produkt] },
+            { titel: "Status", breite: 16, wert: (h) => STATUS_TEXT[statusAusDatenbank(h.subStatus)] },
+            { titel: "Key", breite: 20, wert: (h) => h.subKey ?? "–" },
+            {
+              titel: "Ablauf",
+              breite: 14,
+              wert: (h) => (h.subNextduedate ? formatDatum(h.subNextduedate) : "–"),
+              rechts: true,
+            },
+          ],
+          zeilen: kunde.hosts,
+        }),
+
+        Abschnitt({ titel: `Laufzeiten (${laufzeiten.length})` }),
+        Tabelle({
+          spalten: [
+            {
+              titel: "Zeitraum",
+              breite: 26,
+              wert: (l: (typeof laufzeiten)[number]) => `${formatDatum(l.start)} – ${formatDatum(l.ende)}`,
+            },
+            { titel: "Host", breite: 18, wert: (l) => l.hostname },
+            { titel: "Proxmox-Rechnung", breite: 18, wert: (l) => l.einkauf?.nummer ?? "–" },
+            { titel: "Einkauf", breite: 12, wert: (l) => formatEuro(l.einkauf?.nettoBetrag), rechts: true },
+            { titel: "Kundenrechnung", breite: 18, wert: (l) => l.verkauf?.nummer ?? "–" },
+            { titel: "Verkauf", breite: 8, wert: (l) => formatEuro(l.verkauf?.nettoBetrag), rechts: true },
+          ],
+          zeilen: laufzeiten,
+          summe: ["Summe", "", "", formatEuro(gesamt.einkauf), "", formatEuro(gesamt.verkauf)],
+        }),
+
+        Abschnitt({ titel: "Summen pro Jahr" }),
+        Tabelle({
+          spalten: [
+            { titel: "Jahr", breite: 25, wert: (j: (typeof proJahr)[number]) => j.jahr },
+            { titel: "Einkauf netto", breite: 25, wert: (j) => formatEuro(j.einkauf), rechts: true },
+            { titel: "Verkauf netto", breite: 25, wert: (j) => formatEuro(j.verkauf), rechts: true },
+            { titel: "Marge", breite: 25, wert: (j) => formatEuro(j.marge), rechts: true },
+          ],
+          zeilen: proJahr,
+          summe: ["Gesamt", formatEuro(gesamt.einkauf), formatEuro(gesamt.verkauf), formatEuro(gesamt.marge)],
+        }),
+      ],
+    }),
+    `proxledger-${kunde.kundennummer}-${datum}.pdf`,
+  );
+}
@@ -41,10 +41,16 @@ export default async function KundenDetailSeite({ params }: { params: Promise<{
        titel={kunde.name}
        brotkrumen={[{ titel: "Kunden", href: "/kunden" }, { titel: kunde.name }]}
        aktion={
-          <Link href={`/kunden/${kunde.id}/bearbeiten`} className="btn btn-sm btn-outline-primary">
-            <i className="bi bi-pencil me-1" aria-hidden="true" />
-            Bearbeiten
-          </Link>
+          <span className="d-flex gap-2">
+            <a href={`/kunden/${kunde.id}/export`} className="btn btn-sm btn-outline-secondary">
+              <i className="bi bi-filetype-pdf me-1" aria-hidden="true" />
+              Unterlage
+            </a>
+            <Link href={`/kunden/${kunde.id}/bearbeiten`} className="btn btn-sm btn-outline-primary">
+              <i className="bi bi-pencil me-1" aria-hidden="true" />
+              Bearbeiten
+            </Link>
+          </span>
        }
      />

@@ -0,0 +1,107 @@
+import { csvAntwort, csvDatei } from "@/lib/csv";
+import { formatDatum, formatEuro } from "@/lib/format";
+import { Bericht, pdfAntwort, Tabelle } from "@/server/pdf/dokument";
+import {
+  kundenListe,
+  offeneRechnungspunkteProKunde,
+  laufzeitenVonKunde,
+  summen,
+} from "@/server/queries/kunden";
+
+export const dynamic = "force-dynamic";
+
+/** Kundenübersicht als CSV oder PDF. */
+export async function GET(request: Request) {
+  const format = new URL(request.url).searchParams.get("format") ?? "csv";
+  const [kunden, punkte] = await Promise.all([kundenListe(), offeneRechnungspunkteProKunde()]);
+
+  const zeilen = await Promise.all(
+    kunden.map(async (kunde) => {
+      const laufzeiten = await laufzeitenVonKunde(kunde.id);
+      const betraege = summen(laufzeiten);
+      return {
+        ...kunde,
+        offeneRechnungspunkte: punkte.get(kunde.id)?.offen ?? 0,
+        ...betraege,
+      };
+    }),
+  );
+
+  const datum = new Date().toISOString().slice(0, 10);
+
+  if (format === "pdf") {
+    return pdfAntwort(
+      Bericht({
+        titel: "Kundenübersicht",
+        untertitel: `${zeilen.length} Kunden`,
+        quer: true,
+        children: Tabelle({
+          spalten: [
+            { titel: "Kunde", breite: 26, wert: (z: (typeof zeilen)[number]) => z.name },
+            { titel: "Nummer", breite: 10, wert: (z) => z.kundennummer },
+            { titel: "Hosts", breite: 7, wert: (z) => String(z.hosts), rechts: true },
+            { titel: "Aktiv", breite: 7, wert: (z) => String(z.aktiv), rechts: true },
+            {
+              titel: "Nächster Ablauf",
+              breite: 13,
+              wert: (z) => (z.naechsterAblauf ? formatDatum(z.naechsterAblauf) : "–"),
+            },
+            { titel: "Warnungen", breite: 9, wert: (z) => String(z.offeneAlerts), rechts: true },
+            {
+              titel: "Offene Rechn.",
+              breite: 10,
+              wert: (z) => String(z.offeneRechnungspunkte),
+              rechts: true,
+            },
+            { titel: "Einkauf", breite: 9, wert: (z) => formatEuro(z.einkauf), rechts: true },
+            { titel: "Marge", breite: 9, wert: (z) => formatEuro(z.marge), rechts: true },
+          ],
+          zeilen,
+          summe: [
+            "Summe",
+            "",
+            String(zeilen.reduce((s, z) => s + z.hosts, 0)),
+            String(zeilen.reduce((s, z) => s + z.aktiv, 0)),
+            "",
+            "",
+            "",
+            formatEuro(zeilen.reduce((s, z) => s + z.einkauf, 0)),
+            formatEuro(zeilen.reduce((s, z) => s + z.marge, 0)),
+          ],
+        }),
+      }),
+      `proxledger-kunden-${datum}.pdf`,
+    );
+  }
+
+  const inhalt = csvDatei(
+    [
+      "Kunde",
+      "Kundennummer",
+      "Ansprechpartner",
+      "Hosts",
+      "Aktiv lizenziert",
+      "Nächster Ablauf",
+      "Offene Warnungen",
+      "Offene Rechnungspunkte",
+      "Einkauf netto",
+      "Verkauf netto",
+      "Marge netto",
+    ],
+    zeilen.map((z) => [
+      z.name,
+      z.kundennummer,
+      z.ansprechpartner,
+      z.hosts,
+      z.aktiv,
+      z.naechsterAblauf,
+      z.offeneAlerts,
+      z.offeneRechnungspunkte,
+      z.einkauf,
+      z.verkauf,
+      z.marge,
+    ]),
+  );
+
+  return csvAntwort(inhalt, `proxledger-kunden-${datum}.csv`);
+}
@@ -21,10 +21,21 @@ export default async function KundenSeite() {
            rahmen="primary"
            tabelle
            werkzeuge={
-              <Link href="/kunden/neu" className="btn btn-sm btn-primary">
-                <i className="bi bi-plus-lg me-1" aria-hidden="true" />
-                Kunde anlegen
-              </Link>
+              <>
+                {/* Downloads: bewusst kein <Link>, sonst würde Next.js die Datei vorab laden. */}
+                <a href="/kunden/export" download className="btn btn-sm btn-outline-secondary">
+                  <i className="bi bi-filetype-csv me-1" aria-hidden="true" />
+                  CSV
+                </a>
+                <a href="/kunden/export?format=pdf" download className="btn btn-sm btn-outline-secondary">
+                  <i className="bi bi-filetype-pdf me-1" aria-hidden="true" />
+                  PDF
+                </a>
+                <Link href="/kunden/neu" className="btn btn-sm btn-primary">
+                  <i className="bi bi-plus-lg me-1" aria-hidden="true" />
+                  Kunde anlegen
+                </Link>
+              </>
            }
          >
            <div className="table-responsive">
@@ -0,0 +1,108 @@
+import { csvAntwort, csvDatei } from "@/lib/csv";
+import { formatDatum, formatEuro } from "@/lib/format";
+import { Bericht, pdfAntwort, Tabelle } from "@/server/pdf/dokument";
+import { rechnungsListe, type RechnungsFilter } from "@/server/queries/rechnungen";
+
+export const dynamic = "force-dynamic";
+
+/** Rechnungsliste als CSV (Buchhaltung) oder PDF, mit den Filtern der Ansicht. */
+export async function GET(request: Request) {
+  const parameter = new URL(request.url).searchParams;
+  const format = parameter.get("format") ?? "csv";
+  const filter: RechnungsFilter = {
+    status: (parameter.get("status") as RechnungsFilter["status"]) ?? "alle",
+    kunde: parameter.get("kunde") ?? undefined,
+    jahr: parameter.get("jahr") ?? undefined,
+    q: parameter.get("q") ?? undefined,
+  };
+
+  const { zeilen, summen } = await rechnungsListe(filter);
+  const datum = new Date().toISOString().slice(0, 10);
+  const zeitraum = filter.jahr ? `Jahr ${filter.jahr}` : "alle Jahre";
+
+  if (format === "pdf") {
+    return pdfAntwort(
+      Bericht({
+        titel: "Rechnungsliste",
+        untertitel: `${zeilen.length} Laufzeiten · ${zeitraum}`,
+        quer: true,
+        children: Tabelle({
+          spalten: [
+            {
+              titel: "Kunde",
+              breite: 18,
+              wert: (z: (typeof zeilen)[number]) => z.kunde?.name ?? "Nicht zugeordnet",
+            },
+            { titel: "Host", breite: 13, wert: (z) => z.hostname },
+            {
+              titel: "Laufzeit",
+              breite: 16,
+              wert: (z) => `${formatDatum(z.start)} – ${formatDatum(z.ende)}`,
+            },
+            { titel: "Proxmox-Rechnung", breite: 13, wert: (z) => z.einkaufNummer ?? "–" },
+            { titel: "Einkauf", breite: 9, wert: (z) => formatEuro(z.einkaufBetrag), rechts: true },
+            { titel: "Bezahlt", breite: 7, wert: (z) => (z.einkaufBezahlt ? "ja" : "nein") },
+            { titel: "Kundenrechnung", breite: 12, wert: (z) => z.verkaufNummer ?? "–" },
+            { titel: "Verkauf", breite: 6, wert: (z) => formatEuro(z.verkaufBetrag), rechts: true },
+            {
+              titel: "Marge",
+              breite: 6,
+              wert: (z) => (z.marge === null ? "–" : formatEuro(z.marge)),
+              rechts: true,
+            },
+          ],
+          zeilen,
+          summe: [
+            "Summe",
+            "",
+            "",
+            "",
+            formatEuro(summen.einkauf),
+            "",
+            "",
+            formatEuro(summen.verkauf),
+            formatEuro(summen.marge),
+          ],
+        }),
+      }),
+      `proxledger-rechnungen-${filter.jahr ?? "alle"}-${datum}.pdf`,
+    );
+  }
+
+  const inhalt = csvDatei(
+    [
+      "Kunde",
+      "Host",
+      "Key",
+      "Laufzeit von",
+      "Laufzeit bis",
+      "Proxmox-Rechnung",
+      "Einkauf netto",
+      "Proxmox bezahlt",
+      "Fällig am",
+      "Kundenrechnung",
+      "Verkauf netto",
+      "Kundenrechnung erstellt",
+      "Vom Kunden bezahlt",
+      "Marge netto",
+    ],
+    zeilen.map((z) => [
+      z.kunde?.name ?? "Nicht zugeordnet",
+      z.hostname,
+      z.key,
+      z.start,
+      z.ende,
+      z.einkaufNummer,
+      z.einkaufBetrag,
+      z.einkaufBezahlt === null ? "" : z.einkaufBezahlt ? "ja" : "nein",
+      z.einkaufFaelligAm,
+      z.verkaufNummer,
+      z.verkaufBetrag,
+      z.verkaufErstellt ? "ja" : "nein",
+      z.verkaufBezahlt ? "ja" : "nein",
+      z.marge,
+    ]),
+  );
+
+  return csvAntwort(inhalt, `proxledger-rechnungen-${filter.jahr ?? "alle"}-${datum}.csv`);
+}
@@ -111,24 +111,40 @@ export default async function RechnungenSeite({ searchParams }: { searchParams:
            rahmen="primary"
            tabelle
            werkzeuge={
-              <div className="btn-group btn-group-sm" role="group" aria-label="Filter">
-                {(
-                  [
-                    ["offen", "Offen"],
-                    ["erledigt", "Erledigt"],
-                    ["alle", "Alle"],
-                    ["vorschlaege", `Vorschläge${vorschlaege ? ` (${vorschlaege})` : ""}`],
-                  ] as const
-                ).map(([wert, text]) => (
-                  <Link
-                    key={wert}
-                    href={adresse({ status: wert })}
-                    className={`btn ${filter.status === wert ? "btn-primary" : "btn-outline-primary"}`}
-                  >
-                    {text}
-                  </Link>
-                ))}
-              </div>
+              <>
+                <a
+                  href={adresse({}).replace("/rechnungen", "/rechnungen/export")}
+                  className="btn btn-sm btn-outline-secondary"
+                >
+                  <i className="bi bi-filetype-csv me-1" aria-hidden="true" />
+                  CSV
+                </a>
+                <a
+                  href={adresse({ format: "pdf" }).replace("/rechnungen", "/rechnungen/export")}
+                  className="btn btn-sm btn-outline-secondary"
+                >
+                  <i className="bi bi-filetype-pdf me-1" aria-hidden="true" />
+                  PDF
+                </a>
+                <div className="btn-group btn-group-sm" role="group" aria-label="Filter">
+                  {(
+                    [
+                      ["offen", "Offen"],
+                      ["erledigt", "Erledigt"],
+                      ["alle", "Alle"],
+                      ["vorschlaege", `Vorschläge${vorschlaege ? ` (${vorschlaege})` : ""}`],
+                    ] as const
+                  ).map(([wert, text]) => (
+                    <Link
+                      key={wert}
+                      href={adresse({ status: wert })}
+                      className={`btn ${filter.status === wert ? "btn-primary" : "btn-outline-primary"}`}
+                    >
+                      {text}
+                    </Link>
+                  ))}
+                </div>
+              </>
            }
          >
            <form className="row g-2 p-3 border-bottom" role="search">
@@ -0,0 +1,168 @@
+import { Document, Page, Path, StyleSheet, Svg, Text, View, renderToBuffer } from "@react-pdf/renderer";
+import type { DocumentProps } from "@react-pdf/renderer";
+import type { ReactElement } from "react";
+
+/**
+ * Gemeinsames Aussehen aller PDF-Ausgaben: einfarbiges Logo, Titel, Datum, Seitenzahl.
+ * Gerendert wird serverseitig ohne Browser (@react-pdf/renderer).
+ */
+
+const NAVY = "#1E2A44";
+
+const stile = StyleSheet.create({
+  seite: { paddingTop: 40, paddingBottom: 48, paddingHorizontal: 40, fontSize: 9, color: "#1F2D3D" },
+  kopf: { flexDirection: "row", alignItems: "center", marginBottom: 18 },
+  kopfText: { marginLeft: 10 },
+  marke: { fontSize: 14, color: NAVY },
+  titel: { fontSize: 16, marginBottom: 2 },
+  untertitel: { fontSize: 9, color: "#6C757D" },
+  tabellenKopf: {
+    flexDirection: "row",
+    borderBottomWidth: 1,
+    borderBottomColor: NAVY,
+    paddingBottom: 4,
+    marginBottom: 2,
+    fontSize: 8,
+    color: NAVY,
+  },
+  zeile: {
+    flexDirection: "row",
+    borderBottomWidth: 0.5,
+    borderBottomColor: "#DEE2E6",
+    paddingVertical: 3,
+  },
+  summenZeile: { flexDirection: "row", borderTopWidth: 1, borderTopColor: NAVY, paddingTop: 4, marginTop: 2 },
+  fuss: {
+    position: "absolute",
+    bottom: 24,
+    left: 40,
+    right: 40,
+    flexDirection: "row",
+    justifyContent: "space-between",
+    fontSize: 7,
+    color: "#6C757D",
+  },
+  abschnitt: { marginTop: 14, marginBottom: 6, fontSize: 11, color: NAVY },
+});
+
+function Logo() {
+  return (
+    <Svg viewBox="0 0 48 48" style={{ width: 28, height: 28 }}>
+      <Path
+        d="M8 4h19a12 12 0 0 1 0 24H16v16H8zM16 11h10a5 5 0 0 1 0 10H16z"
+        fill={NAVY}
+        fillRule="evenodd"
+      />
+      <Path d="M22 36h20M22 43h14" stroke={NAVY} strokeWidth={3.5} strokeLinecap="round" />
+    </Svg>
+  );
+}
+
+export interface Spalte<T> {
+  titel: string;
+  breite: number;
+  wert: (zeile: T) => string;
+  rechts?: boolean;
+}
+
+/** Etwas Luft zwischen den Spalten, sonst stoßen rechtsbündige Zahlen an den nächsten Text. */
+const zelle = (breite: number, rechts?: boolean) => ({
+  width: `${breite}%`,
+  textAlign: (rechts ? "right" : "left") as "right" | "left",
+  paddingRight: 6,
+});
+
+export function Tabelle<T>({
+  spalten,
+  zeilen,
+  summe,
+}: {
+  spalten: Spalte<T>[];
+  zeilen: T[];
+  summe?: string[];
+}) {
+  return (
+    <View>
+      <View style={stile.tabellenKopf} fixed>
+        {spalten.map((spalte) => (
+          <Text key={spalte.titel} style={zelle(spalte.breite, spalte.rechts)}>
+            {spalte.titel}
+          </Text>
+        ))}
+      </View>
+      {zeilen.map((zeile, index) => (
+        <View key={index} style={stile.zeile} wrap={false}>
+          {spalten.map((spalte) => (
+            <Text key={spalte.titel} style={zelle(spalte.breite, spalte.rechts)}>
+              {spalte.wert(zeile)}
+            </Text>
+          ))}
+        </View>
+      ))}
+      {summe ? (
+        <View style={stile.summenZeile}>
+          {summe.map((wert, index) => (
+            <Text key={index} style={zelle(spalten[index]?.breite ?? 10, spalten[index]?.rechts)}>
+              {wert}
+            </Text>
+          ))}
+        </View>
+      ) : null}
+    </View>
+  );
+}
+
+export function Abschnitt({ titel }: { titel: string }) {
+  return <Text style={stile.abschnitt}>{titel}</Text>;
+}
+
+export function Bericht({
+  titel,
+  untertitel,
+  children,
+  quer = false,
+}: {
+  titel: string;
+  untertitel?: string;
+  children: React.ReactNode;
+  quer?: boolean;
+}) {
+  const erstellt = new Intl.DateTimeFormat("de-DE", {
+    timeZone: "Europe/Berlin",
+    dateStyle: "long",
+  }).format(new Date());
+
+  return (
+    <Document title={titel} author="ProxLedger">
+      <Page size="A4" orientation={quer ? "landscape" : "portrait"} style={stile.seite}>
+        <View style={stile.kopf} fixed>
+          <Logo />
+          <View style={stile.kopfText}>
+            <Text style={stile.marke}>ProxLedger</Text>
+            <Text style={stile.untertitel}>Proxmox Subscription Dashboard</Text>
+          </View>
+        </View>
+
+        <Text style={stile.titel}>{titel}</Text>
+        {untertitel ? <Text style={stile.untertitel}>{untertitel}</Text> : null}
+        <View style={{ marginTop: 12 }}>{children}</View>
+
+        <View style={stile.fuss} fixed>
+          <Text>Erstellt am {erstellt}</Text>
+          <Text render={({ pageNumber, totalPages }) => `Seite ${pageNumber} von ${totalPages}`} />
+        </View>
+      </Page>
+    </Document>
+  );
+}
+
+export async function pdfAntwort(element: ReactElement<DocumentProps>, dateiname: string): Promise<Response> {
+  const puffer = await renderToBuffer(element);
+  return new Response(new Uint8Array(puffer), {
+    headers: {
+      "Content-Type": "application/pdf",
+      "Content-Disposition": `attachment; filename="${dateiname}"`,
+      "Cache-Control": "no-store",
+    },
+  });
+}
@@ -0,0 +1,73 @@
+import { prisma } from "@/lib/db";
+
+/** Hosts mit Ablaufdatum, gruppiert nach Kunde – Grundlage für Jahresbahn und Ablauf-Kalender. */
+export async function ablaufDaten(jetzt: Date = new Date()) {
+  const hosts = await prisma.host.findMany({
+    where: { subNextduedate: { not: null } },
+    orderBy: [{ subNextduedate: "asc" }],
+    select: {
+      id: true,
+      hostname: true,
+      subKey: true,
+      subNextduedate: true,
+      subStatus: true,
+      kunde: { select: { id: true, name: true } },
+      laufzeiten: {
+        where: { status: "BESTAETIGT" },
+        orderBy: { start: "desc" },
+        take: 2,
+        select: {
+          id: true,
+          start: true,
+          proxmoxPosition: { select: { rechnung: { select: { bezahlt: true } } } },
+          kundenPosition: { select: { rechnung: { select: { erstellt: true } } } },
+        },
+      },
+    },
+  });
+
+  const eintraege = hosts.map((host) => {
+    const ablauf = host.subNextduedate!;
+    const verlaengerung = host.laufzeiten.find((l) => l.start.getTime() === ablauf.getTime());
+
+    return {
+      hostId: host.id,
+      hostname: host.hostname,
+      key: host.subKey,
+      ablauf,
+      status: host.subStatus,
+      kunde: host.kunde,
+      laufzeitId: verlaengerung?.id ?? null,
+      einkaufBezahlt: verlaengerung?.proxmoxPosition?.rechnung.bezahlt ?? null,
+      verkaufErstellt: verlaengerung?.kundenPosition?.rechnung.erstellt ?? null,
+      tage: Math.round((ablauf.getTime() - jetzt.getTime()) / 86_400_000),
+    };
+  });
+
+  // Nach Kunde gruppieren; Hosts ohne Kunde kommen ans Ende.
+  const gruppen = new Map<string, { name: string; kundeId: string | null; eintraege: typeof eintraege }>();
+  for (const eintrag of eintraege) {
+    const schluessel = eintrag.kunde?.id ?? "ohne";
+    const gruppe = gruppen.get(schluessel) ?? {
+      name: eintrag.kunde?.name ?? "Nicht zugeordnet",
+      kundeId: eintrag.kunde?.id ?? null,
+      eintraege: [],
+    };
+    gruppe.eintraege.push(eintrag);
+    gruppen.set(schluessel, gruppe);
+  }
+
+  const sortiert = [...gruppen.values()].sort((a, b) => {
+    if (a.kundeId === null) return 1;
+    if (b.kundeId === null) return -1;
+    return a.name.localeCompare(b.name, "de");
+  });
+
+  return {
+    gruppen: sortiert,
+    naechste90Tage: eintraege.filter((e) => e.tage >= 0 && e.tage <= 90),
+    abgelaufen: eintraege.filter((e) => e.tage < 0),
+  };
+}
+
+export type AblaufEintrag = Awaited<ReturnType<typeof ablaufDaten>>["naechste90Tage"][number];
Author	SHA1	Message	Date
florian.wilde	5018589f08	Merge branch 'phase/010-export'	2026-09-17 22:12:58 +02:00
florian.wildeandClaude Opus 5	cb009efd7d	feat(export): CSV- und PDF-Ausgaben fuer Hosts, Kunden und Rechnungen (#010 ) PDFs entstehen serverseitig mit @react-pdf/renderer, mit einfarbigem Logo, wiederholtem Spaltenkopf und Summenzeile. Alle Exporte uebernehmen die Filter der jeweiligen Ansicht. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>	2026-09-17 22:12:58 +02:00
florian.wilde	6168ad69f2	Merge branch 'phase/009-jahresbahn'	2026-09-17 21:57:09 +02:00
florian.wildeandClaude Opus 5	1a5327dced	feat(jahresbahn): Zeitleiste und Ablauf-Kalender aus der Datenbank (#009 ) Zwoelf-Monats-Bahn mit Heute-Linie und Gruppierung nach Kunde, 90-Tage-Kalender mit Rechnungsstatus sowie eine Karte fuer bereits abgelaufene Subscriptions. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>	2026-09-17 21:57:09 +02:00