Zum Inhalt springen

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.

Organigrammbeispiel

Konfigurieren Sie App Builder als API

  1. Gehen Sie im App Builder über das Menü „Verbinden“ zu „Control Center > Sicherheitsanbieter“
  2. Klicken Sie im Bereich „Benutzerauthentifizierung“ auf der rechten Seite auf Erstellen

    1. Geben Sie dem Provider einen Namen. Zum Beispiel: 'OrgChartAPI'
    2. Wählen Sie bei Typ API -Schlüssel
    3. Klicken Sie auf Speichern
  3. 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

  4. Suchen Sie auf dem resultierenden Bildschirm die Anwendung, die Sie konfigurieren, und klicken Sie auf das Bleistift-Bearbeitungssymbol
  5. Geben Sie im Feld „Endpoint“ den Wert ein, unter dem die API auf die Ressource zugreift. Beispiel: „charts“
  6. Klicken Sie auf das x, um den Bildschirm zu verlassen
  7. 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“
  8. 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.
  9. 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.
  10. Navigieren Sie zum App Builder App Workbench > Sichern > Benutzerverwaltung
  11. Wählen Sie einen vorhandenen Benutzer aus oder erstellen Sie einen neuen Benutzer für den API -Aufruf

    1. Der Benutzer muss auf den Login-Typ Interaktiv eingestellt sein
    2. Der Benutzer muss keine lokale Authentifizierung haben
  12. Klicken Sie im Popup-Bildschirm des ausgewählten/erstellten Benutzers auf Schlüssel

  13. 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.
  14. Richten Sie optional alle zusätzlichen Rollen/Sicherheitsgruppen für das Objekt ein, die möglicherweise benötigt werden.

Konfigurieren des Organigramm-Widgets

  1. 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.
  2. 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.

  3. Die Farbwerte für Beschriftung und Rahmen sind in \Css\vinyl.orgchart.css Werte in Hexadezimalzahl

  4. 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

  1. 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“.
  2. Fügen Sie ein Textsteuerelement hinzu und fügen Sie das Organigramm-Widget zum Steuerelement hinzu
  3. Wenn das Organigramm nicht angezeigt wird, können Sie optional:

    1. 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
    2. 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.