Panels im Jitterbit App Builder

Übersicht

Panels sind die Container auf den Seiten einer App Builder-Anwendung, die die auf der Benutzeroberfläche angezeigten Informationen enthalten, wie Daten, Bilder und Steuerelemente. Jede Seite einer App Builder-Anwendung besteht aus einem oder mehreren Panels; beispielsweise kann eine Seite ein Grid-Panel verwenden, um mehrere Datenzeilen gleichzeitig anzuzeigen, oder ein Form-Panel, um die Details eines einzelnen Datensatzes zu zeigen.

Der Dialog Panel erstellen von App Builder ordnet seine Panel-Typen in drei Kategorien ein, die jeweils in einem eigenen Abschnitt unten beschrieben sind:

• Dynamisch

  • Grid: Mehrere Datenzeilen mit Feldern, die horizontal angezeigt werden.
  • Kachel: Daten, die als Kacheln angezeigt werden und die Seite hinunter umgebrochen werden.
  • Formular: Einzelne Datenzeile mit Steuerelementen, die vertikal angezeigt werden.

• Bericht

  • Kalender: Daten, die als Kalender in verschiedenen Ansichten angezeigt werden.
  • Diagramm: Daten visuell in verschiedenen Diagrammtypen anzeigen.
  • Gantt: Zeigt Daten als Gantt-Diagramm für Planung und Terminplanung an.
  • Karte: Eine Karte anzeigen, um geografische Beziehungen zu visualisieren.
  • Netzwerkdiagramm: Beziehungen zwischen verbundenen Elementen visuell darstellen.
  • Pivot: Zeigt Daten in einem Pivot-Tabellenformat an.

• Sonderfall

  • Agent-Chat: Eine Chat-Schnittstelle zur Interaktion mit deinen konfigurierten Agenten.
  • Benutzerdefiniertes HTML: Ermöglicht die Anzeige von benutzerdefinierten HTML.
  • Event-Diagramm-Panel: Zeige einen visuellen Workflow in einem Panel auf deiner Seite an.
  • Datei-Browser: Fügt ein Datei-Browser-Steuerelement zu deinem Panel hinzu.
  • Frame: Reserviere Platz auf der Seite, um andere Inhalte zu laden.
  • Spur: Daten, die als Kacheln in einer Reihe von Spuren angezeigt werden.

Panel-Typen

Um ein Panel zu einer Seite hinzuzufügen, gehe zur App Workbench, öffne die Registerkarte Seiten, und wähle dann eine der Seiten deiner Anwendung aus oder klicke, um eine neue zu erstellen. Dadurch öffnet sich der Bearbeitungsbildschirm der Seite, wo du mit dem Panel Seiten-Panel-Layout alle Panels der Seite konfigurieren kannst. Klicke auf + Panel hinzufügen, um den Dialog Panel erstellen zu öffnen:

Dynamisch

Grid

Grid-Panels zeigen mehrere Datenzeilen gleichzeitig an und zeigen bestimmte Spalten aus der ausgewählten Datenquellentabelle oder dem Objekt. Klicke auf den Titel einer Spalte, um ihre Zeilen in aufsteigender oder absteigender Reihenfolge zu sortieren. Die Gesamtzahl der Zeilen erscheint in der oberen rechten Ecke über den Spaltentiteln; je nach Gesamtzahl der Datensätze lädt App Builder möglicherweise nur eine Teilmenge der Zeilen auf einmal. Klicke auf Weitere Zeilen laden am unteren Ende des Panels, um zusätzliche Zeilen zu laden.

Kachel

Kachel-Panels kombinieren das Verhalten von Grid- und Form-Panels: Wie Grid-Panels zeigen sie mehrere Informationssätze gleichzeitig an, ordnen sie aber in Blöcken von links nach rechts an, anstatt sie in Spalten zu arrangieren. Wie bei Form-Panels werden Steuerelemente mit anderen Steuerelementen in der gleichen Position in der Datentabelle gruppiert.

Formular

Formular-Panels zeigen eine einzelne Datenzeile aus der ausgewählten Datenquelle an. Dieser Panel-Typ ist besonders nützlich als Popup-Fenster oder Detailseite in einer Anwendung. Wenn einem Formular-Panel mehrere Steuerelemente zugewiesen sind, wird jedes Steuerelement einzeln angezeigt.

Bericht

Kalender

Kalender-Panels füllen einen Kalender mit Informationen aus der ausgewählten Datenquelle. Wie Diagramm-Panels können Kalender-Panels mit einem anderen Panel verknüpft werden, um mehr Details über ein Ereignis im Kalender anzuzeigen.

Erforderliche Steuerelementtypen

• Beschreibung: Bestimmt, was im Kalender angezeigt wird; normalerweise der Name eines Ereignisses.
• Ereignisstart: Bestimmt, an welchem Tag das Ereignis beginnt; kann Zeitstempel enthalten, die neben der Ereignisbeschreibung angezeigt werden.
• Ereignisende: Bestimmt, an welchem Tag das Ereignis endet; kann Zeitstempel enthalten, die neben der Ereignisbeschreibung angezeigt werden.

Optionale Steuerelementtypen

• Farbe: Farbwert, den der Kalender zur Kennzeichnung von Ereignissen verwendet.
• Sortieren: Ermöglicht das Sortieren des ausgewählten Wertes.

Weitere Informationen zu Kalender-Panels finden Sie unter Kalenderpanels.

Diagramm

Diagramm-Panels zeigen Daten in grafischer Darstellung an. App Builder unterstützt viele Diagrammtypen, darunter Balken, Säule, Linie und Fläche. Diagramme können mit den zugrunde liegenden Daten verknüpft werden, sodass ein Benutzer durchklicken und die unterstützenden Daten anzeigen kann.

Erforderliche Steuerelementtypen

• Kategorie: Stellt die X-Achse (horizontal) im Diagramm dar.
• Wert: Stellt die Y-Achse (vertikal) im Diagramm dar.

Optionale Steuerelementtypen

• Farbe: Farbwert, den das Diagramm verwendet.
• Sortieren: Ermöglicht das Sortieren des ausgewählten Wertes.
• Kennzeichnung: Wird verwendet, um ein Ereignis oder einen interessanten Punkt zu markieren.
• JSON Options Object: JSON-Objekt, das Diagrammoptionen außer Kraft setzt.

Weitere Informationen zu Diagramm-Panels finden Sie unter Diagramm.

Gantt

Gantt-Panels zeigen Gantt-Diagramme an, die für die Planung und Terminierung von Projekten nützlich sind. Sie helfen dabei zu beurteilen, wie lange ein Projekt dauern sollte, welche Ressourcen erforderlich sind, und in welcher Reihenfolge Aufgaben abgeschlossen werden. Gantt-Diagramme sind auch ein hilfreiches Instrument zur Verwaltung von Abhängigkeiten zwischen Aufgaben.

Um ein Gantt-Diagramm auf einem Gantt-Panel zu verwenden, benötigen Sie ein Geschäftsobjekt, das Informationen für die erforderlichen Steuerelemente enthält. Gantt-Diagramme können auch Aufgabenabhängigkeiten und Aufgabengruppen darstellen, sofern diese Informationen im Geschäftsobjekt konfiguriert sind.

Erforderliche Steuerelementtypen

• Aufgabe: Stellt eine einzelne nachverfølgte Projektaufgabe dar.
• Startdatum: Stellt das Aufgabenstartdatum dar.
• Enddatum: Stellt das Aufgabenenddatum dar.

Optionale Steuerelementtypen

• Farbe: Farbwert für die Aufgabe im Diagramm.
• Abhängigkeit: Bestimmt die Beziehung von der Aufgabe zu anderen Aufgaben, von denen sie abhängig ist.
• Übergeordnete Aufgabe: Verweis auf eine andere Aufgabe aus dem Geschäftsobjekt, wird für hierarchische Anordnung verwendet.
• Sortieren: Ermöglicht das Sortieren des ausgewählten Wertes.
• Aufgabengruppe: Wird zum Gruppieren oder Platzieren mehrerer Aufgaben in derselben Zeile verwendet.

Weitere Informationen zu Gantt-Panels finden Sie unter Gantt-Diagramm.

Karte

Karten-Panels zeigen eine Karte an, auf der Steuerelemente über geografischen Standort visualisiert werden können. Je nach den Daten, die angezeigt werden sollen, können verschiedene, über die Highmaps API bereitgestellte Karten ausgewählt werden.

Erforderliche Steuerelementtypen

• Kategorie: Land, Bundesstaat usw.
• Wert: Mit der Kategorie verknüpfter Wert.

Optionale Steuerelementtypen

• JSON Options Object: JSON-Objekt, das Diagrammoptionen außer Kraft setzt.
• Farbe: Farbwert für ein Ereignis oder eine Aufgabe.

Weitere Informationen zu Karten-Panels finden Sie unter Kartenpanel. Informationen zu Quellkarten, die im Kartenpanel bereitgestellt werden, finden Sie in der Highmaps-Dokumentation.

Netzwerkdiagramm

Netzwerkdiagramm-Panels zeigen Verbindungen zwischen einer Reihe von Entitäten. Jede Entität wird durch einen Knoten dargestellt, und Verbindungen zwischen Knoten werden durch Links visualisiert.

Erforderliche Steuerelementtypen

• Von: Ausgangsknoten für diese Verbindung.
• Knoten: Ein Netzwerkdiagramm-Knoten.
• Knotenbeschriftung: Eine Netzwerkdiagramm-Knotenbeschriftung. Erforderlich bei Verwendung von UUIDs für Beziehungen.

Optionale Steuerelementtypen

• JSON-Optionsobjekt: JSON-Objekt, das Diagrammoptionen überschreibt.
• Link-Farbe: Die Farbe der Netzwerkdiagramm-Links.
• Farbe: Farbwert für ein Ereignis oder eine Aufgabe.

Weitere Informationen zu Netzwerkdiagramm-Panels finden Sie unter Netzwerkdiagramm.

Pivot

Pivot-Panels zeigen eine Pivot-Tabelle mit Informationen aus einer Datenquelle an.

Erforderliche Steuerelementtypen

• Spalte: Füllt die Spaltenkopfzeilen.
• Zeile: Füllt die Zeilenkopfzeilen.
• Wert: Zeigt die relevanten Daten aus der Quelle an.

Weitere Informationen zu Pivot-Panels finden Sie unter Pivot-Panels.

Sonderfälle

Agent Chat

Agent Chat-Panels bieten die Schnittstelle zum Chatten mit konfigurierten KI-Agenten. In diesen Panels können Nutzer Nachrichten eingeben und Antworten erhalten vom Agenten, ohne die Anwendung zu verlassen.

Benutzerdefiniertes HTML

Benutzerdefiniertes HTML-Panels verwenden HTML/CSS-Vorlagen zur Anzeige von Daten und Bildern. Sie bieten ein hohes Maß an Kontrolle über die Anzeigeausgabe und ähneln stark einer Standardwebseite.

Event Diagram Panel

Event Diagram Panel-Panels betten einen interaktiven visuellen Workflow in eine Seite ein und zeigen die konfigurierten Ereignisse einer Tabelle oder eines Geschäftsobjekts als BPMN-Prozessflussdiagramm.

Dateibrowser

Dateibrowser-Panels sind mit einem lokalen oder Netzwerk-Dateisystem verbunden und ähneln einem Dateiverzeichnis. Sie ermöglichen es Nutzern, Dateien auf einen Server hochzuladen und auf ein Gerät herunterzuladen. Navigation innerhalb von Unterverzeichnissen ist ebenfalls möglich, wobei Unterverzeichnisse durch ein Ordnersymbol gekennzeichnet sind.

Rahmen

Rahmen-Panels reservieren einen Bereich auf dem Bildschirm, in den alle angeklickten Seitenlinks geladen werden. Der Rahmen-Paneltyp hat keinen eigenen Inhalt – wenn ein Rahmen-Panel auf einem Bildschirm vorhanden ist, wird eine Seitennavigation in den Rahmen statt des gesamten Bildschirms geleitet. Dieser Paneltyp wird am häufigsten verwendet, um ein persistentes Seitenmenü sichtbar zu halten, während der Container des Rahmen-Panels die Zielseite darin rendert.

Weitere Informationen zu Rahmen-Panels finden Sie unter Rahmen-Panel.

Spur

Spur-Panels zeigen gruppierte Informationen an. Sie ähneln Kachel-Panels darin, dass sie Daten im Formular-Panelformat gruppiert anzeigen, können aber vertikal oder horizontal konfiguriert werden.

Weitere Informationen zu Spur-Panels finden Sie unter Spur-Panel.