Anwendungsbeispiele: Übersichten erstellen use-cases-creating-overviews

Erstellen Sie eine einseitige Webanwendung und deaktivieren Sie ausgehende Transitionen und Transitionen zur nächsten Seite.

Ändern Sie den Seitentitel.

Dieser Titel wird im Header der Webanwendungs-Übersicht angezeigt.

Ändern Sie in den Eigenschaften der Webanwendung das Rendering der Anwendung, indem Sie die Vorlage Einseitige Webanwendung auswählen.

Öffnen Sie die Aktivität Seite Ihrer Webanwendung und danach eine Liste (Statische Elemente > Liste).

Wählen Sie in der Liste im Tab Daten den Typ der Webanwendung sowie den Titel, das Erstellungsdatum und die Ausgabespalten des Anwendungstyps aus.

Erstellen Sie im Untertab Filter (wie unten dargestellt) den folgenden Filter, sodass nur Webanwendungen angezeigt und Vorlagen verborgen werden.

Schließen Sie das Konfigurationsfenster der Seite und wählen Sie Vorschau aus.

Daraufhin wird die Liste der in Ihrer Datenbank verfügbaren Webanwendungen angezeigt.

Platzieren Sie den Cursor auf den Knoten Seite Ihrer Webanwendung und fügen Sie das Element Ordner auswählen hinzu (Erweiterte Steuerelemente > Ordner auswählen).

Wählen Sie im sich öffnenden Fenster Speicherung den Link Variablen bearbeiten… aus.

Ändern Sie den Titel der Variablen nach Bedarf.

Ändern Sie den Variablennamen in den Wert des Ordners folder.

Wählen Sie für die Variable den Typ XML.

Wählen Sie die Interaktion Seite aktualisieren aus.

Platzieren Sie den Cursor in Ihrer Liste und verweisen Sie im Tab Erweitert auf die Variable, die Sie zuvor im Tab XPath des Ordnerfilters der Liste erstellt haben. Sie müssen den Namen des vom Ordner-Link betroffenen Elements verwenden, d. h. den Ordner.

Platzieren Sie den Cursor auf das Element Seite und fügen Sie einen Link hinzu (Statische Elemente > Link).

Ändern Sie den Link-Titel. Dieser wird auf der Schaltfläche in der Übersicht angezeigt.

In unserem Beispiel lautet der Titel Neu.

Fügen Sie die folgende URL in das URL-Feld ein: xtk://open/?schema=nms:webApp&form=nms:newWebApp.

Definieren Sie, dass die URL im selben Fenster erscheinen soll.

Fügen Sie das Webanwendungssymbol im Bildfeld hinzu: /nms/img/webApp.png.

Dieses Symbol wird auf der Schaltfläche Neu angezeigt.

Geben Sie button im Feld Stil ein.

Dieser Stil ist in der zuvor ausgewählten Vorlage Einseitige Webanwendung definiert.

Platzieren Sie den Cursor auf das zuvor erstellte Listenelement.

Wählen Sie im Tab Allgemein in der Dropdown-Liste den Anzeigemodus Spalten und zusätzliche Details aus.

Fügen Sie im Tab Daten die Optionen Primärschlüssel, interner Name und Beschreibung hinzu und wählen Sie für jede dieser Optionen Ausgeblendetes Feld aus.

Diese Informationen werden in der Folge nur in der Detailansicht eines jeden Eintrags sichtbar sein.

Fügen Sie im Tab Zusätzliches Detail den folgenden Code hinzu:

<div class="detailBox">
  <div class="actionBox">
    <span class="action"><img src="/xtk/img/fileEdit.png"/><a title="Open" class="linkAction" href="xtk://open/?schema=nms:webApp&form=nms:webApp&pk=
    <%=webApp.id%>">Open...</a></span>
    <%
    if( webApp.@appType == 1 ) { //survey
    %>
    <span class="action"><img src="/xtk/img/report.png"/><a target="_blank" title="Reports" class="linkAction" href="/xtk/report.jssp?_context=selection&
      _schema=nms:webApp&_selection=<%=webApp.@id%>
      &__sessiontoken=<%=document.controller.getSessionToken()%>">Reports</a></span>
    <%
    }
    %>
  </div>
  <div>
    Internal name: <%= webApp.@internalName %>
  </div>
  <%
  if( webApp.desc != "" )
  {
  %>
  <div>
    Description: <%= webApp.desc %>
  </div>
  <%
  }
  %>
</div>

Platzieren Sie den Cursor auf das Element Seite und wählen Sie Container > Standard aus.

Wählen Sie für die Anzahl der Spalten "2", sodass der Link-Editor und der Link nebeneinander platziert werden.

Weiterführende Informationen zum Layout von Elementen erfahren Sie in diesem Abschnitt.

Wenden Sie dottedFilter an.

Dieser Stil ist in der zuvor ausgewählten Vorlage Einseitige Webanwendung definiert.

Platzieren Sie den Cursor auf den im vorherigen Schritt erstellten Container und fügen Sie mithilfe des Menüs Erweiterte Steuerelemente einen Link-Editor ein.

Wählen Sie im sich automatisch öffnenden Speicherfenster die Option Variablen und danach den Link Variablen bearbeiten… aus und erstellen Sie eine XML-Variable zum Filtern von Daten.

Passen Sie den Titel an.

Dieser wird in der Übersicht neben dem Feld Filter zu sehen sein.

Wählen Sie die Benutzer-Tabelle als Anwendungsschema aus.

Platzieren Sie den Cursor auf das Listenelement und erstellen Sie im Tab Daten > Filter einen Filter:

• Ausdruck: Fremdschlüssel des Links "Erstellt von"
• Benutzer: gleich
• Wert: Variablen (variables)
• Berücksichtigt wenn: '$(var2/@id)'!=''

Platzieren Sie den Cursor auf den Container und fügen Sie einen Link über das Menü Statische Elemente ein.

Passen Sie den Titel an.

Wählen Sie Listendaten aktualisieren aus.

Fügen Sie die zuvor erstellte Liste hinzu.

Fügen Sie das Aktualisierungssymbol im Feld Bild hinzu: /xtk/img/refresh.png.

Ordnen Sie mithilfe der Sortierpfeile die unterschiedlichen Elemente der Webanwendung wie unten dargestellt neu.