Erste Schritte mit anwenderdefinierten Layouts

  • Freigeben Version: Yokohama
  • Aktualisiert 30. Januar 2025
  • 5 Minuten Lesedauer

    • Richten Sie eine Seite UI Builder ein, und beginnen Sie mit der Konfiguration Ihrer modularen Playbook-Komponenten mit anwenderdefinierten Layouts für anwenderdefinierte Layouts in Playbook-Experience.

    Vorbereitungen

    • Wenn Sie kein Playbook haben, auf das Sie anwenderdefinierte Layouts anwenden können, erstellen Sie ein Playbook. Weitere Informationen finden Sie unter Playbooks werden erstellt.
    • Installieren Sie die aktuelle Version der Apps Playbook-Experience und Playbook-Experience-Komponente aus dem ServiceNow Store. Siehe Playbook Experience-Apps.

    Erforderliche Rolle: ui_builder_admin, admin

    Warum und wann dieser Vorgang ausgeführt wird

    Nach dem Erstellen einer Seite UI Builder können Sie die Seiten Playbook-Experience an Ihre Bedürfnisse anpassen. Seitenvorlagen enthalten Controller, die mit Komponentenvoreinstellungen verwendet werden können, einschließlich der Playbook -Vorlagen. Weitere Informationen finden Sie unter Bind data to UI Builder pages using controllers (advanced feature).

    Prozedur

    1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
    2. Öffnen Sie die UI Builder- Experience, in der Sie arbeiten möchten, oder erstellen Sie eine neue Experience.
      Die Playbook-Experience-Builder- Experience wurde für Sie zum Anpassen von Playbook-Experienceerstellt. Weitere Informationen zum Erstellen einer Experience finden Sie unter Configure how users interact with your applications in UI Builder.
    3. In Ihrer UI Builder- Experience können Sie:
      Die Verwendung einer Vorlage Playbook-Experience beschleunigt den Entwicklungsprozess, da der UI-Controller für das anwenderdefinierte Playbook-Layout und -Komponenten bereits jeder Seite hinzugefügt wurden, einschließlich Datensatzgeneratoren ab Version 25.2. Der Controller füllt automatisch alle bereitgestellten Komponenten mit Daten.
      Hinweis:
      Sie können weiterhin anwenderdefinierte Komponenten erstellen und hinzufügen, wenn Sie eine Vorlage verwenden.

      Wählen Sie eine Playbook -Vorlage aus.
    4. Wenn Sie eine Vorlage Playbook-Experience verwenden, erstellen Sie Ihre Seite.
      1. Richten Sie die Seitendetails ein.
        Name Name Ihrer Seite.
        URL-Pfad Der URL-Pfad, zu dem Anwender navigieren, um auf die Seite zuzugreifen.
      2. Überprüfen Sie die Testparameter für Ihre Seite.
        table Name der übergeordneten Tabelle für das Playbook.
        sysID Sys_id des Datensatzes. Für einen nicht vorhandenen Datensatz lautet der Wert -1.
        Experience Die Experience, die Sie laden möchten.
        selectedPlaybook Das Playbook, in dem sich der Service Desk-Mitarbeiter oder Erfüller befindet.
        selectedStage Die Phase, in der sich der Service Desk-Mitarbeiter oder Erfüller befindet.
        selectedActivity Die Aktivität, in der sich der Service Desk-Mitarbeiter oder Erfüller befindet.
      3. Richten Sie Ihren Standardseiten-Vvariantein.
        Name Der Name Ihrer Seitenvariante.
        Zielgruppen Die Anwender, die Ihre Seitenvariante sehen können. Sie können wie folgt definiert werden:
        • Rolle
        • Gruppe
        • Anwender
        • Unternehmen
        • Abteilung
        • Standort
        • Skript
        Bedingungen Bedingungen, die bestimmen, wann die Seitenvariante angezeigt wird.
      4. Öffnen Sie die soeben erstellte Standardseitenvariante.
      Das neue Playbook-Experience -Layout enthält bereits Controller und mit Daten gefüllte Komponenten, es müssen jedoch noch einige weitere Konfigurationen vorgenommen werden. Um die verbleibenden Konfigurationen vorzunehmen, fahren Sie mit Schritt 6 fort.
    5. Wenn Sie die Standard-Datensatzvorlage verwendet oder Ihre Seite von Grund auf neu erstellt haben, fügen Sie der Seite den UI-Controller für anwenderdefiniertes Playbook-Layout hinzu.
      1. Wählen Sie in der unteren Ecke Ihrer neuen Seite das Datensymbol ( Datensymbol.)
      2. Wählen Sie + Hinzufügen aus.
      3. Suchen Sie nach „Playbook“.
      4. Wählen Sie unter Datenressourcendie Option Playbook – UI-Controller für anwenderdefiniertes Layout aus, und klicken Sie auf Hinzufügen.
      5. Beenden Sie den Bereich Datenressourcen.
    6. Konfigurieren Sie den soeben hinzugefügten anwenderdefinierten Layout-UI-Controller für das Playbook.
      1. Damit Anwender einen neuen Datensatz in diesem anwenderdefinierten Playbook-Experience anstelle des Standardformulars für neue Datensätze erstellen können, wählen Sie oben links eine Testwertpille aus.
        Das Popover für die Testwerte wird geöffnet.
      2. Stellen Sie sicher, dass der sysID- Testwert auf -1festgelegt ist, und wählen Sie Übernehmen aus.
        Testen Sie die Werte für Ihre Playbook-Experience mit der Tabelle und der sysID.
        Wenn Sie die Vorschau öffnen, ist ein Datensatzgeneratorformular verfügbar. Sie sollten in der Lage sein, das Datensatzgeneratorformular zu testen und zu bestätigen, dass neue Datensätze erstellt werden.
      3. Sie können auch den Tabellennamen oder einen der optionalen Parameter aktualisieren:
      4. Wahlweise: Wenn Sie stattdessen die Testwerte hartcodieren möchten, navigieren Sie zurück zu Daten > Datenressourcenbereich > Lokale Instanzen der Datenressourcenund wählen Sie UI-Controller-Datensatzseiteaus.
      5. Fügen Sie auf der Registerkarte Konfig des Controllers die Übergeordnete SysID oder Übergeordnete Tabellehinzu. Im Popover für die Testwerte sind dies die Felder „sysID“ und „table“.
        Sie können context.props.table im Feld Übergeordnete Tabelle und context.props.sysId für das Feld Übergeordnete SysID eingeben.
        Hinweis:
        Stellen Sie sicher, dass die von Ihnen eingegebene Tabelle oder der von Ihnen eingegebene Datensatz ein Playbookenthält.
      6. Fügen Sie die Playbook-Experience hinzu, die Sie verwenden möchten.
      7. Wahlweise: Geben Sie bei Bedarf Werte für die anderen Felder ein.
        Aktivitätsansichtsmodus Ansichtsmodus, der zum Rendern von Playbook-Aktivitäten im gestapelten oder fokussierten Modus verwendet wird
        Datensatzgenerator-Abfrage Codierte Abfragezeichenfolge zum optionalen Überschreiben der für einen Datensatzgenerator angegebenen Abfrage
        Ausgewähltes Playbook – Kontext-ID Optionale Kontext-ID des ausgewählten Playbooks für Deep Linking
        Ausgewählte Phase – Kontext-ID Optionale Kontext-ID der ausgewählten Phase für Deep Linking
        Ausgewählte Aktivität – Kontext-ID Optionale Kontext-ID der ausgewählten Aktivität für Deep Linking
      8. Wahlweise: In der Spalte „Ausgaben“ können Sie die Werte auswählen, die Sie hartcodieren möchten.
      Der Controller ist konfiguriert, und Sie können Playbook Komponenten hinzufügen.
    7. Fügen Sie Playbook Komponenten hinzu.
      1. Wählen Sie in der Komponentenstruktur die Registerkarte Main (Hauptregisterkarte)aus.
        Der Hauptregisterkartenbereich wird auf der rechten Seite geöffnet.
      2. Wählen Sie im Bereich Hauptregisterkarte die Option + Hinzufügen aus.
        Ein modales Fenster mit der Frage „Wie möchten Sie diese Registerkarte erstellen?“ Anzeigen.
      3. Wählen Sie Von einem leeren Container aus starten und klicken Sie auf Weiter.
        Das modale Fenster Registerkarteneinstellungen wird angezeigt.
      4. Geben Sie Ihrer Registerkarte einen Namen und ein Symbol, und klicken Sie auf Erstellen.
        Die Registerkarte wird der Komponentenstruktur hinzugefügt, und eine leere Canvas wird angezeigt.
      5. Wählen Sie in der Komponentenstruktur unter Ihrer neuen Registerkarte die Option „+ Komponente hinzufügen“ aus, und suchen Sie nach „größenverstellbar“.
      6. Wählen Sie die Komponente Größenanpassbare Bereiche aus, geben Sie ihr einen Namen, und klicken Sie auf Erstellen.
      7. Öffnen Sie in der Komponentenstruktur die neue Komponente der größenverstellbaren Bereiche, die Sie gerade erstellt haben.
        Der Bereich für Ihre neuen größenverstellbaren Bereiche wird auf der rechten Seite geöffnet.
      8. Konfigurieren Sie nach Bedarf, und klicken Sie oben rechts auf Speichern.
      9. Um die Phasenauswahl hinzuzufügen, suchen Sie in der Komponentenstruktur nach der neuen Komponente der größenverstellbaren Bereiche, und wählen Sie + Komponente hinzufügen unter linksaus.
      10. Wählen Sie in Ihrer Komponentenstruktur die neue Phasenauswahl aus.
        Der Bereich für Ihre neue Phasenauswahl wird auf der rechten Seite geöffnet.
      11. Wählen Sie die Voreinstellung für diese Komponente unter „UI-Controller für anwenderdefiniertes Playbook-Layout“ aus, und klicken Sie oben rechts auf „Speichern“.
        Wählen Sie eine Voreinstellung für die Komponente aus.
        Eine Bestätigungsmeldung wird angezeigt, und die Komponenteneingaben und Ereignisse auf der Registerkarte Events im Phasenauswahlbereich werden automatisch gefüllt.
        Komponentenkonfiguration
      12. Um die Playbook-Aktivitätsanzeigehinzuzufügen, suchen Sie in der Komponentenstruktur nach der Komponente „Anpassbare Bereiche“, und wählen Sie + Komponente hinzufügen unter der rechten Seiteaus.
      13. Wiederholen Sie die Schritte 7j und 7k.
      14. Um die Playbook-Modalehinzuzufügen, suchen Sie die von Ihnen erstellte Registerkarte unter der Hauptregisterkarte in der Komponentenstruktur, und wählen Sie + Komponente hinzufügenaus.
      15. Wiederholen Sie die Schritte 7j und 7k für die Playbook-Modale.
      16. Navigieren Sie zurück zur Playbook-Phasenauswahlund bestimmen Sie die Ausrichtung Ihrer Phasenauswahl.
      17. Klicken Sie in der oberen rechten Ecke auf Öffnen, um eine Vorschau des Playbook -Layouts anzuzeigen.
      18. Zurück zu UI Builder.
      19. Navigieren Sie zurück zu Ihrer Phasenauswahl in der Komponentenstruktur, und bestimmen Sie die Ausrichtung Ihrer Phasenauswahl im Bereich, der sich rechts öffnet.