Kurzinfos (Bands) #

Kurzinfos sind kleine HTML-Panels, die neben der Eingabemaske eines Datensatzes eingeblendet werden. Sie zeigen kontextbezogene Informationen — etwa die letzten Aufträge einer Adresse, Lagerbestände eines Artikels oder Statistiken.

Jede Kurzinfo ist ein HTML-Template mit eingebetteter SQL-Abfrage. EULANDA führt die Query aus, füllt die Platzhalter im Template und zeigt das Ergebnis im eingebetteten Browser an.

Wo werden Kurzinfos definiert? #

Kurzinfos sind in der SQL-Registry unter \OBJECTS\BANDS\ gespeichert. Jeder Schlüssel entspricht einer Kurzinfo:

\OBJECTS\BANDS\
├── cnsoft.Adresse.Auftraege
├── cnsoft.Adresse.Stat.Einfach
├── cnsoft.Artikel.Bestellungen
├── cnsoft.Auftrag.Positionen
├── cnsoft.Rechnung.Mwst
└── ...  (108 Bänder insgesamt)

Die Namenskonvention ist <vendor>.<Dokumenttyp>.<Funktion>, wobei cnsoft der Standard-Vendor ist.

Aufbau einer Kurzinfo #

Jede Kurzinfo besteht aus Metadaten und einem HTML-Template (DATA-Feld).

Metadaten #

Das DATA-Feld (HTML-Template) #

Das DATA-Feld enthält das komplette Template bestehend aus einem <CNXHEAD>-Block (SQL und Steuerlogik) und dem HTML-Markup:

<CNXHEAD>

<query Name="af">
  SELECT $$TOPCLAUSE$$ af.id, af.Kopfnummer,
     Datum = dbo.cnf_DatumKurz(af.Datum),
     af.VkBrutto, af.Waehrung
  FROM $$SCHEMA$$.Auftrag af $$LOCKHINT$$
  WHERE af.AdresseId = $$input.id$$
  ORDER BY af.Datum DESC
</query>

  <logic>
    REPEAT AuftragItems WITH af
  </logic>

</CNXHEAD>

<TABLE data-sortable="true" data-copyable="true">
<THEAD>
<TR>
  <TH align="right" data-sort-type="numeric">Nummer</TH>
  <TH align="right" data-sort-type="date">Datum</TH>
  <TH align="right" data-sort-type="numeric">VK Brutto</TH>
</TR>
</THEAD>

<TBODY>
<TR cnxid="AuftragItems">
  <TD><A HREF="eulanda://./DOC/Eulanda.Auftrag/$$af.id$$">$$af.Kopfnummer$$</A></TD>
  <TD align="right" data-sort="$$FDyyyy-mm-dd:af.Datum$$">$$FDdd.mm.yy:af.Datum$$</TD>
  <TD align="right">$$FF0.00:af.VkBrutto$$ $$af.Waehrung$$</TD>
</TR>
</TBODY>

</TABLE>

CNXHEAD: SQL und Steuerlogik #

Der <CNXHEAD>-Block wird von EULANDA verarbeitet und nicht an den Browser ausgeliefert. Er enthält zwei Elemente:

QUERY — SQL-Abfragen #

<query Name="queryname">
  SELECT ... FROM $$SCHEMA$$.Tabelle WHERE id = $$input.id$$
</query>

Ein Template kann mehrere Queries enthalten. Der Name dient als Präfix für die Datenbindung im HTML-Teil ($$queryname.Spalte$$).

Bei SQL-Statements mit Sonderzeichen (z.B. <, >) muss der Query-Text in <![CDATA[...]]> eingeschlossen werden:

<query Name="warnung"><![CDATA[
  SELECT Warnung FROM $$SCHEMA$$.Adresse
  WHERE id = $$input.id$$ AND ISNULL(Warnung,'') <> ''
]]></query>

LOGIC — Steuerlogik #

Die <logic>-Sektion steuert, welche HTML-Elemente angezeigt werden und wie Daten gebunden werden:

<logic>
  SET Hinweis.Visible = EMPTY af
  SET Daten.Visible = NOT EMPTY af
  REPEAT AuftragItems WITH af
</logic>

Platzhalter im Template #

Im HTML-Teil werden Platzhalter durch die Query-Ergebnisse ersetzt:

Feldwerte #

Die Formatangabe nach FF bzw. FD folgt der VB-Syntax:

System-Platzhalter #

Datenbindung im HTML #

Das Attribut cnxid markiert HTML-Elemente für die Datenbindung:

<!-- Wird für jede Zeile der Query "af" wiederholt -->
<TR cnxid="AuftragItems">
  <TD>$$af.Kopfnummer$$</TD>
</TR>

Links auf Datensätze verwenden das eulanda://-Protokoll mit der ID aus der Query:

<A HREF="eulanda://./DOC/Eulanda.Auftrag/$$af.id$$">$$af.Kopfnummer$$</A>

Typen von Kurzinfos #

Datenlisten #

Der häufigste Typ — eine Tabelle mit Zeilen aus einer SQL-Query. Beispiele: Aufträge einer Adresse, Positionen eines Auftrags, Bestellungen eines Artikels.

<TABLE data-sortable="true" data-copyable="true">
  <THEAD><TR><TH>...</TH></TR></THEAD>
  <TBODY><TR cnxid="Items">...</TR></TBODY>
</TABLE>

Statistiken #

Feste Zeitraum-Vergleiche (Monat, Vormonat, Jahr, Vorjahr). Die Zeilen haben eine vorgegebene Reihenfolge und sind deshalb nicht sortierbar, aber kopierbar:

<TABLE data-copyable="true">
<THEAD>
  <TR><TH>Zeitraum</TH><TH>Umsatz</TH><TH>Ertrag</TH></TR>
</THEAD>
<TBODY>
  <TR><TH>Monat</TH><TD>$$FF#,###0.00:stat1.VkNetto_AktuellerMonat$$</TD>...</TR>
  <TR><TH>Vormonat</TH><TD>$$FF#,###0.00:stat1.VkNetto_VorMonat$$</TD>...</TR>
  <TR><TH>Jahr</TH><TD>$$FF#,###0.00:stat1.VkNetto_AktuellesJahr$$</TD>...</TR>
  <TR><TH>Vorjahr</TH><TD>$$FF#,###0.00:stat1.VkNetto_VorJahr$$</TD>...</TR>
</TBODY>
</TABLE>

Warnungen #

Textblock ohne Tabelle. Verwendet die CSS-Klasse bandmessage:

<DIV class="bandmessage" cnxid="WarnungItems">
  <p>$$Warnung.Warnung$$</p>
</DIV>

Bilder #

Zeigt das Artikelbild über das eulanda://-Protokoll:

<img src="eulanda://./DOC/Eulanda.Artikel/$$bild.id$$/DEFAULT.JPG?w=$$session.bands.imgwidth$$&h=$$session.bands.imgheight$$">

Formulare #

Interaktive Bänder mit Eingabefeldern und Buttons, z.B. für Zahlungseingänge. Diese laden zusätzliches JavaScript und können Aktionen auf dem Host auslösen:

<input id="eZeBetrag" value="$$FF#,##0.00:qu.Saldo$$">
<button onclick="AuftragZe.clickSave($$input.id$$)">Zahlung Buchen</button>

Interaktive Features (infopanel.js) #

Die Bibliothek infopanel.js erweitert Kurzinfo-Tabellen um Sortierung, Kopieren und Action-Buttons. Die Features werden über Data-Attribute am <TABLE>-Element aktiviert.

TABLE-Attribute #

Sortierung #

Die Spaltenüberschriften (<TH>) steuern das Sortierverhalten:

<TH data-sort-type="numeric">Menge</TH>
<TH data-sort-type="date">Datum</TH>
<TH data-sort-type="text">Name</TH>
<TH data-sort-type="none">Aktionen</TH>

Bei formatierten Datumswerten muss ein data-sort-Attribut am <TD> den Sortierwert im ISO-Format liefern:

<TD data-sort="$$FDyyyy-mm-dd:af.Datum$$">$$FDdd.mm.yy:af.Datum$$</TD>

Kopieren #

Der Kopier-Button überträgt die Tabelle Tab-separiert in die Zwischenablage — direkt in Excel einfügbar.

Action-Button #

Ruft eine in der SQL-Registry definierte Action auf (\OBJECTS\ACTIONS\):

<TABLE data-action="cnsoft.Artikel.Export">

Kurzinfos einbinden #

Kurzinfos können auch in den statischen Seiten, wie der EULANDA-Startseite per JavaScript eingebunden werden. Die Funktion addMenuCurrentBand aus forms.js rendert ein Band für den aktuellen Datensatz:

currentMenu = g("mnuClientRight");
currentId = urlId;

addMenuCurrentBand("INFO", "Aufträge", "cnsoft.Adresse.Auftraege");
addMenuCurrentBand("INFO", "Statistik", "cnsoft.Adresse.Stat.Einfach");
addMenuCurrentBand("INFO", "Kontakte", "cnsoft.Adresse.Kontakt");

Die Kurzinfos erscheinen typischerweise in der rechten Spalte (mnuClientRight) der Detailansicht.

Benutzer-Overrides (UserVar) #

Benutzer können einzelne Metadaten einer Kurzinfo überschreiben, ohne das Template zu ändern. Dazu wird ein Unterschlüssel UserVar angelegt:

\OBJECTS\BANDS\cnsoft.Adresse.Auftraege\
├── Context = "DOC.Eulanda.Adresse"
├── MaxRows = 5
└── UserVar\
    └── MaxRows = 10         ← Benutzer sieht 10 statt 5 Zeilen

Übersicht der Kurzinfos nach Dokumenttyp #

Adresse #

Artikel #

Auftrag #

Weitere Dokumenttypen #

Positions-Kurzinfos #

Wenn ein Benutzer eine einzelne Position markiert, erscheinen positionsbezogene Kurzinfos:

Statistik-Bänder (Startseite) #

Die cnsoft.Common.Stat.*-Bänder zeigen Unternehmenskennzahlen auf der Startseite: