Template Editor

Der Template Editor ermöglicht es Administratoren, HTML-Vorlagen für Scanner-Anzeigen anzupassen. Diese Vorlagen werden verwendet, um Informationen wie Partiedaten, Chargendaten, Lagerzellen und weitere Daten darzustellen.

Zugriff

Der Template Editor ist nur für Administratoren zugänglich und befindet sich im Admin-Bereich unter Admin > Template Editor.

Benutzeroberfläche

Die Oberfläche des Template Editors ist in drei Bereiche unterteilt:

1. Templateliste (links)

Hier werden alle verfügbaren Templates aufgelistet. Durch Klicken auf ein Template wird dieses im Editor geöffnet. Jedes Template ist einem bestimmten Datentyp zugeordnet (z.B. Partien, Chargen, Lagerzellen).

2. Editor (Mitte)

Der zentrale Bereich enthält den Code-Editor mit Syntaxhervorhebung für HTML. Hier kann das Template bearbeitet werden. Platzhalter für Daten werden grün hervorgehoben.

Über dem Editor befinden sich zwei Buttons:

• Vorschau: Zeigt eine Vorschau des Templates mit Beispieldaten
• Speichern: Speichert die Änderungen

3. Eigenschaften (rechts)

Zeigt alle verfügbaren Eigenschaften für das ausgewählte Template. Durch Klicken auf eine Eigenschaft wird der entsprechende Platzhalter an der Cursorposition im Editor eingefügt.

Template-Syntax

Einfache Platzhalter

Um einen Wert aus den Daten anzuzeigen, verwenden Sie geschweifte Klammern mit einem $-Präfix:

{$eigenschaft}

Beispiel:

<p>Partienummer: {$lotNr}</p>
<p>Beschreibung: {$description}</p>

Formatierer

Werte können mit Formatierern angepasst werden. Der Formatierer wird mit | angehängt:

{$eigenschaft|formatierer:parameter}

Verfügbare Formatierer

Formatierer	Beschreibung	Beispiel
date	Formatiert ein Datum	`{$datum
number	Formatiert eine Zahl	`{$menge
upper	Wandelt Text in Großbuchstaben	`{$text
lower	Wandelt Text in Kleinbuchstaben	`{$text
trim	Entfernt Leerzeichen am Anfang und Ende	`{$text

Beispiele:

<p>Datum: {$manufacturingDate|date:d.m.Y}</p>
<p>Menge: {$quantity|number:2} kg</p>
<p>Sorte: {$fruit|upper}</p>

Standardwerte (Fallback)

Falls eine Eigenschaft leer oder nicht vorhanden ist, kann ein Standardwert angegeben werden:

{$eigenschaft ?? Standardwert}

Beispiel:

<p>Kunde: {$customer ?? Kein Kunde angegeben}</p>

Bedingte Anzeige

Inhalte können abhängig von einer Bedingung angezeigt werden:

Einfache Bedingung (wenn Wert vorhanden)

{$bedingung ? Anzeigetext}

Beispiel:

{$isUrgent ? <span style="color:red">EILIG!</span>}

If-Else Bedingung

{$bedingung ? WertWennWahr :: WertWennFalsch}

Beispiel:

<p>Status: {$isComplete ? Abgeschlossen :: In Bearbeitung}</p>

Vergleichsoperatoren

Es können auch Vergleiche durchgeführt werden:

Operator	Beschreibung
>	Größer als
<	Kleiner als
>=	Größer oder gleich
<=	Kleiner oder gleich
==	Gleich
!=	Ungleich

Beispiele:

{$quantity > 100 ? Großbestellung :: Normalbestellung}
{$status == 1 ? Aktiv :: Inaktiv}
{$count != 0 ? {$count} Stück :: Keine vorhanden}

CSS-Styling

Es gibt standardmäßig ein Stylesheet im iScan, welches für die HTML-Labels verwendet wird. Mit dem folgenden Code kann es ins Label eingebunden werden:

<link rel="stylesheet" href="{$labelCssPath}">

Dieser Pfad verweist auf die zentral konfigurierte CSS-Datei für Labels. In den Einstellungen unter label_css_file kann auch ein eigenes CSS-Stylesheet hochgeladen werden. Das Default-Stylesheet geht dadurch aber verloren!

Vorschau

Die Vorschau-Funktion zeigt, wie die Vorlage mit echten oder Beispieldaten aussieht. Dabei wird:

1. Das aktuelle Template im Editor verwendet (auch ungespeicherte Änderungen)
2. Echte Daten aus der Datenbank geladen, falls verfügbar
3. Andernfalls werden Beispieldaten verwendet

Die Vorschau zeigt auch eine Tabelle mit allen verwendeten Daten und deren Werten.

Datensuche in der Vorschau

In der Vorschau kann nach spezifischen Datensätzen gesucht werden, um das Template mit echten Daten zu testen. Jedes Template hat ein Suchfeld, das je nach Datentyp unterschiedliche Werte akzeptiert:

Template	Suchfeld
LotInfoDto	Partienummer
ChargeInfoDto	Chargennummer
OrderInfoDto	Auftragsnummer
StorageCellInfoDto	Zellencode
SortedContainerInfoDto	Barcode
SupplierLabelDto	QR-Code
PackagingMaterialInfoDto	Partienummer
TcProductionLineDto	Linien-ID
ProductionDto	Chargennummer

Verwendung:

1. Klicken Sie auf Vorschau
2. Geben Sie den Suchwert in das Suchfeld ein
3. Klicken Sie auf Suchen oder drücken Sie Enter
4. Die Vorschau wird mit den gefundenen Daten aktualisiert
5. Klicken Sie auf den Zurücksetzen-Button, um wieder die Standarddaten anzuzeigen

Tipps

• Testen Sie Änderungen mit der Vorschau-Funktion bevor Sie speichern
• Nutzen Sie die Eigenschaften-Liste rechts, um verfügbare Felder zu sehen
• Größere Design-Änderungen sollten in der Label.css durchgeführt werden