Print Views: Etiketten-Druckseiten als PWA

Modell

Ein Design kann mehrere Views mit unterschiedlichen Formularen haben, z. B. eine Filial-View (EAN → ein Produktlabel) und eine Versand-View (Auftragsnummer → drei Labels). Der Endnutzer öffnet die URL, füllt das Formular, prüft die PDF-Vorschau und druckt. Designer-Zugang ist nicht nötig.

URLs und Zugriff

Kanonisch: https://print.zplcloud.com/d/{designName}.{designId}/{viewSlug}
Kurz: https://print.zplcloud.com/pv/{id} → 302 auf die kanonische URL (für QR-Codes).
DHL-only-Views (ohne Design): https://print.zplcloud.com/d/dhl/{slug} - siehe Integrationen.
Zugriff: Login erforderlich; Ersteller + Konten in allowedEmails; alle anderen erhalten 403. Demo-Konten dürfen nicht drucken.

https://print.zplcloud.com/d/australia-open-rfid.15/store
https://print.zplcloud.com/pv/7        # → /d/…

View anlegen

Plattform → Print Views (/platform/printviews).
Gespeichertes Design wählen; Name und View-ID (Slug, a-z 0-9 -) setzen; Beschreibung optional.
Erlaubte Konten: E-Mail-Adressen, eine je Zeile oder mit ; getrennt. Der Ersteller hat immer Zugriff.
Form-Designer: Felder hinzufügen (dx-text-box, dx-select-box, dx-check-box, dx-button); je Feld Label, Binding-Name, Platzhalter, Pflicht, Optionen, Datenquelle, Lookup-Spalte, Scanner an/aus.
Optional Standard-Drucker (Weblink) und allowedPrinters.
Speichern: beide URLs mit Kopier-Buttons plus QR-Code der URL als PNG/PDF/ZPL, druckbar auf einen Weblink-Drucker (/api/barcode/generate, /api/render/zpl-pdf).

Formularfelder und Daten

Feld	Verhalten
dx-text-box	Texteingabe; optional 📷-Scanner-Button (Kamera → Wert ins Feld; Kamerawahl im localStorage gemerkt; Beep bei Erfolg).
dx-select-box	Dropdown mit statischen Optionen oder Datenquelle (100 Testartikel).
dx-check-box	Boolescher Schalter.
dx-button	Auslöser (Vorschau).

Lookup: der eingegebene Wert (z. B. EAN) wird gegen die Lookup-Spalte geprüft; die Trefferzeile wird in den Record gemischt, alle Spalten stehen dem Design als $bindings zur Verfügung. Aktuelle Datenquelle: 100 deterministische Testartikel mit EAN-13-Prüfziffer. DHL-only-Views nutzen Datenhub-Datenquellen (SQL Server / MongoDB über CLI-Agent).
Validierung: Vorschau / PDF / Druck sind erst aktiv, wenn alle Pflichtfelder gültig sind; der Server antwortet bei fehlenden oder ungültigen Daten mit 400 (nicht 500).
Button Formular leeren setzt alle Felder zurück.

Scanner-Formate

ZXing-C++ (WASM, self-hosted unter /pvlib/*) mit dem ZXing-JS-Port als Fallback; kein CDN. Eigene Frame-Schleife (Canvas → Luminance-Source → Binarizer), TRY_HARDER, plus Zoom-Pass der Bildmitte in nativer Auflösung für kleine Codes (blauer Eckrahmen).

1D: EAN-13, EAN-8, UPC-A, UPC-E, Code 128, Code 39, Code 93, Codabar, ITF, DataBar (RSS-14), DataBar Expanded
2D: QR-Code, Data Matrix, PDF417, Aztec, Micro QR

Vorschau und Druck

Vorschau als PDF - rendert das Design mit den Formulardaten (LabelRenderer).
PDF drucken - Browser-Druckdialog der Vorschau.
Weblink drucken - POST …/print sendet das ZPL an den gewählten Weblink-Drucker; Drucker werden dedupliziert nach zebraPrinterId/Name gelistet, der Standard-Drucker ist vorausgewählt. DHL-only-Views können zusätzlich CLI-Agent-Drucker und Watch-Ordner ansteuern.

PWA

Route	Inhalt
/{view}/manifest.json	name = View-Name, `display: standalone`, `start_url` = View-URL, Icons 192 / 512 px.
/{view}/icon.png?size=192\|512	Generiertes PNG mit der Initiale der View (SkiaSharp; ZPLCloud / Liberation Sans / Droid-Fallback).
/sw.js	Minimaler Service Worker: Netzwerk-Passthrough, kein Caching von Label- oder API-Daten.
iOS-Meta	`apple-mobile-web-app-capable`, `apple-touch-icon` → standalone ohne Browser-UI.

Android „App installieren“ / iOS „Zum Home-Bildschirm“. Ohne Session öffnet zuerst die Login-Seite, danach die View. Layout mobile-first: Formular und Vorschau stapeln unter 820 px.

Datenrouten (gleiche Origin, kein CORS)

Route	Funktion
GET /api/printviews/list	Views im Scope des Nutzers.
POST /api/printviews/save	Anlegen / ändern (nur Ersteller).
POST /api/printviews/delete	Löschen (nur Ersteller).
GET /api/printviews/{id}	Detail inkl. Design-JSON und Testartikeln.
GET /api/printviews/testdata	Die 100 Testartikel.
GET /api/weblink/connections · POST /api/weblink/send-zpl	Weblink-Drucker (wie im Batch-Tab).

Ablage: Tabelle printviews; Formular-JSON { version, fields[] }.

Host-Isolation

Auf print.zplcloud.com existieren nur diese Routen: /d/…, /pv/{id}, manifest.json, icon.png, /sw.js, /api/*, Konto-/Login-Seiten und die Login-Assets. Alles andere (SPA, Marketing) antwortet mit 404. Andere Hosts sind nicht betroffen.