So verwenden Sie das Organigramm-Widget im Jitterbit App Builder
Dieser Artikel bietet einen Überblick über die Verwendung des Organigramm-Widgets im App Builder, um ein Organigramm in einem Panel einer App zu erstellen.
Hinweis
Das Organigramm-Widget ist in der Widget-Download-Bibliothek verfügbar.
Konfigurieren Sie App Builder als API
- Gehen Sie im App Builder über das Menü „Verbinden“ zu „Control Center > Sicherheitsanbieter“
-
Klicken Sie im Bereich „Benutzerauthentifizierung“ auf der rechten Seite auf Erstellen
- Geben Sie dem Provider einen Namen. Zum Beispiel: 'OrgChartAPI'
- Wählen Sie bei Typ API -Schlüssel
- Klicken Sie auf Speichern
-
Navigieren Sie zum App Builder Control Center > klicken Sie im Build-Menü auf REST APIs & Webhooks > wählen Sie die Anwendung aus, die Sie konfigurieren, und klicken Sie auf Endpoints verwalten
- Suchen Sie auf dem resultierenden Bildschirm die Anwendung, die Sie konfigurieren, und klicken Sie auf das Bleistift-Bearbeitungssymbol
- Geben Sie im Feld „Endpoint“ den Wert ein, unter dem die API auf die Ressource zugreift. Beispiel: „charts“
- Klicken Sie auf das x, um den Bildschirm zu verlassen
- Klicken Sie unter „Business Objects“ auf „Erstellen“, wählen Sie die Tabelle oder das Objekt aus, das Ihre Organigrammdaten enthält, und legen Sie einen Wert für den Endpoint fest. Beispiel: „Roster“
- Durch Klicken auf das Struktursymbol können Sie steuern, welche Felder in der API verfügbar sind, wenn Sie Spalten deaktivieren möchten, die für das Organigramm nicht benötigt werden.
- Durch Klicken auf das Popup-Symbol können Sie die Anzahl der Zeilen festlegen, die die API zurückgeben kann. Erhöhen Sie diese Anzahl bei Bedarf, abhängig von der Anzahl der Ebenen in Ihrem Organigramm.
- Navigieren Sie zum App Builder App Workbench > Sichern > Benutzerverwaltung
-
Wählen Sie einen vorhandenen Benutzer aus oder erstellen Sie einen neuen Benutzer für den API -Aufruf
- Der Benutzer muss auf den Login-Typ Interaktiv eingestellt sein
- Der Benutzer muss keine lokale Authentifizierung haben
-
Klicken Sie im Popup-Bildschirm des ausgewählten/erstellten Benutzers auf Schlüssel
- Klicken Sie auf Erstellen und wählen Sie den in Schritt 2 erstellten API Anbieter aus. Kopieren Sie den für den Benutzer generierten Schlüsselwert.
- Richten Sie optional alle zusätzlichen Rollen/Sicherheitsgruppen für das Objekt ein, die möglicherweise benötigt werden.
Konfigurieren des Organigramm-Widgets
- Laden Sie das Organigramm-Widget in den App Builder hoch, und zwar in eine Sammlung, auf die die App, mit der Sie arbeiten möchten, Zugriff hat.
-
Konfigurieren Sie alle vom Widget benötigten Parameter, wie in der Widget-Download-Bibliothek aufgeführt. Bei der Eingabe wird zwischen Groß- und Kleinschreibung unterschieden. Der JSONURL-Wert kann im Control Center unter „REST APIs & Webhooks“ abgerufen werden. Suchen Sie den oben konfigurierten Anwendungseintrag und klicken Sie auf das entsprechende Dokumentsymbol. Die resultierende URL sieht in etwa so aus:
https://localhost/rest/v1/roster/org_chart
Wenn Sie die Farben des Organigramms ändern möchten, müssen Sie die Dateien in der ZIP-Datei für das Widget anpassen. -
Die Farbwerte für Beschriftung und Rahmen sind in
\Css\vinyl.orgchart.css
Werte in Hexadezimalzahl - Die Farbwerte für Linien, Hover-Farbe usw. sind in
\Css\jquery.orgchart.css
Werte in RGB
Das Widget einer App Builder Seite hinzufügen
- Navigieren Sie zur App-Seite, auf der Sie das Widget anzeigen möchten, und fügen Sie ein einzelnes Zeilenfeld hinzu, das immer einen Datensatz zurückgibt. Verwenden Sie beispielsweise die Tabelle „Param“ oder „Benutzer“.
- Fügen Sie ein Textsteuerelement hinzu und fügen Sie das Organigramm-Widget zum Steuerelement hinzu
-
Wenn das Organigramm nicht angezeigt wird, können Sie optional:
- Konfigurieren Sie die Datenquelle, die das Panel verwendet, so, dass ein Datensatz vorhanden ist, der den API Schlüssel sowie die vom Organigramm verwendete JSON-URL zurückgibt
- Fügen Sie dem Panel zwei versteckte Textsteuerelemente hinzu, die dem API Schlüssel und der JSON-URL zugeordnet sind. Sie können diese Werte beispielsweise aus einer Parametertabelle speichern.