Einbetten von Objekten in Formularaktionen

Sie können Ihre Formularaktionen so gestalten, dass Bilder oder PDF-Dateien angezeigt werden, um das Aussehen einfach mit Logos und Symbolen anzupassen oder Materialien bereitzustellen, die Ihren Action Center-Benutzern beim Ausführen der Aktion helfen können.

Diese Funktion ist nur mit der Aktivität Create Form Task verfügbar.

Um Objekte einzubetten, verwenden Sie die Eigenschaften unter dem Abschnitt Speicher der Aktivität Create Form Task , um eine Verknüpfung mit einem Speicher-Bucket und der Aktivität Upload Storage File herzustellen, um Dateien hinzuzufügen.

Sie können jeden Objekttyp einbetten, der von Speicher-Buckets unterstützt wird.

Das folgende Video zeigt, wie sich eine eingebettete PDF-Datei im Action Center verhält:

Voraussetzungen

Um die Funktionen zum Einbetten von Objekten in Formularaktionen nutzen zu können, benötigen Benutzer die folgenden Berechtigungen:

Benutzertyp	Berechtigungen
Action Center -Benutzer	Dieser Benutzer benötigt die folgenden Berechtigungen auf Ordnerebene: View for Storage Bucket und View for Storage File.
Roboterbenutzer	Dieser Benutzer benötigt die folgenden Berechtigungen auf Ordnerebene: View and Edit for Storage Bucketund View and Create for Storage File.

Einbetten von Bildern aus Speicher-Buckets

Damit Ihre Actions Center-Benutzer eine bessere Leistung erzielen können, empfehlen wir Ihnen, Bilder einzubetten, die zuvor in einen Speicher-Buckethochgeladen wurden.

So betten Sie ein Bild in eine Formularaktion ein:

1. Verwenden Sie Aktivitäten wie die Aktivität Speicherdatei hochladen, um das Bild in den Speicher-Bucket hochzuladen, der von der Aktivität Create Form Task verwendet wird. Erstellen Sie in diesem Schritt eine String -Variable, um den Pfad zu speichern, in den die Datei hochgeladen wird, z. B. imagePath.
   Wichtig: Der Speicher-Bucket-Upload konvertiert das + -Zeichen in ein Leerzeichen, was zu einem Fehler beim Rendern des Formulars führen kann.
2. Klicken Sie in der Aktivität Create Form Task (Create Form Task) auf die Auslassungspunkte (...) rechts neben FormData und fügen Sie ein Argument mit dem Schlüsselwort _storage als Suffix hinzu:
   • Name: image_storage.
   • Richtung: In.
   • Typ: String.
   • Wert: imagePath.
   Hinweis: Das Schlüsselwort _storage wird verwendet, um anzugeben, dass dies ein Objekt ist, das im Speicher-Bucket der Aktivität verfügbar ist. Für den Wert haben wir die Variable hinzugefügt, in der wir den Pfad zum hochgeladenen Bild gespeichert haben.
   Tipp: Bei Bildern, die kleiner als 2 KB sind, z. B. Logos oder Symbole, können Sie diesen Schritt überspringen. Verwenden Sie im folgenden Schritt, in dem das Argument image_storage verwendet wird, stattdessen die Variable imagePath .
3. Fügen Sie eine HTML-Element -Komponente hinzu und konfigurieren Sie sie wie folgt:
   • HTML-Tag: div.
   • Inhalt: <img src="{{ data.image_storage }}" />. Dadurch wird das Speicherdateiargument der Formularkomponente zugeordnet. Mit dem <img> -Tag wird das Bild im Formular angezeigt. Alternativ können Sie <a src="{{ data.image_storage }}" target=_blank> verwenden, um einen Link hinzuzufügen, der das Bild in einem neuen Fenster öffnet.
   • Bei Änderung aktualisieren: ausgewählt.
   Hinweis: Sie können Links zu bestimmten Dateien hinzufügen, indem Sie im <a href="https://link-to-file"></a> -Tag darauf verweisen. Sie können alle Validierungsfehler ignorieren, die im Feld Inhalt angezeigt werden. Sie wirken sich nicht auf das Rendern von Formularen zur Laufzeit aus.

Wichtig: TIFF-Dateien werden in Formularaktionen nicht unterstützt. Versuchen Sie alternativ Folgendes:

• Konvertieren Sie die TIFF -Dateien in JPEG oder PNG , bevor Sie sie in einen Speicher-Bucket hochladen, indem Sie benutzerdefinierte Aktivitäten innerhalb des Workflows verwenden, mit dem Sie arbeiten.
• Verweisen Sie mit einem <href> -Tag auf die Datei im Speicher-Bucket.

Beispielworkflow

Laden Sie den Beispielworkflow herunter, um die Schritte des Tutorials auszuführen und es selbst auszuprobieren.

Einbetten von PDF-Dateien aus Speicher-Buckets

Das Einbetten einer PDF-Datei aus einem Speicher-Bucket ist bei regulären Formularen anders als bei erweiterten Formularen. Erweiterte Formulare bieten eine verbesserte Rendering-Leistung und eine erweiterte Nutzung der Komponenten und ihrer Logik. Sie können erweiterte Formulare erstellen, indem Sie in der Aktivität Create Form Task die Option Erweiterte Formulare aktivieren auswählen.

Reguläre Formulare

Sie können auch PDF-Dateien, die in einen Speicher-Bucket hochgeladen wurden, zu einer Formularaktion hinzufügen, damit Ihre Action Center-Benutzer sie überprüfen können.

So bebetten Sie eine PDF-Datei in eine reguläre Formularaufgabe:

1. Verwenden Sie Aktivitäten wie die Aktivität Speicherdatei hochladen, um die PDF-Datei in den Speicher-Bucket hochzuladen, der von der Aktivität Create Form Task verwendet wird. Erstellen Sie in diesem Schritt eine String -Variable, um den Pfad zu speichern, in den die Datei hochgeladen wird, z. B. docPath.
2. Klicken Sie in der Aktivität Create Form Task (Create Form Task) auf die Auslassungspunkte (...) rechts neben FormData und fügen Sie ein Argument mit dem Schlüsselwort _storage als Suffix hinzu:
   • Name: doc_storage.
   • Richtung: In.
   • Typ: String.
   • Wert: docPath.
     Wichtig: Das Schlüsselwort _storage wird verwendet, um anzugeben, dass dies ein Objekt ist, das im Speicher-Bucket der Aktivität verfügbar ist. Für den Wert haben wir die Variable hinzugefügt, in der wir den Pfad zur hochgeladenen PDF-Datei gespeichert haben.

3. Fügen Sie dem Formular eine HTML-Element -Komponente hinzu und geben Sie Folgendes an:

   • HTML-Tag: div.
   • Inhalt: <embed src={{ data.doc_storage }} width="600px" height="500px"></embed>.
   • Bei Änderung aktualisieren: deaktiviert.
4. Speichern Sie Ihre Änderungen und schließen Sie das Komponentenfenster, um zum Fenster Formular-Designer zurückzukehren.
5. Klicken Sie auf JSON bearbeiten Symbol für das HTML-Element.
6. Suchen Sie unter der Komponente JSONnach "refreshOn" und legen Sie seinen Wert auf das Formulardatenattribut fest, sodass Sie "refreshOn": "doc_storage"haben.
7. Stellen Sie sicher, dass der Text, der für das Feld _storage automatisch generiert wird, im Formular verfügbar ist. Es kann als ausgeblendetes Feld markiert werden.
   Wichtig: Wenn Sie UiPath.FormActivitiyLibrary v1.1.10 verwenden, beachten Sie, dass die Option Komponenten-JSON nicht die Option "refreshOn" auflistet. Sie können jedoch den "refreshOn" -Schlüssel manuell hinzufügen und dessen Wert wie oben erwähnt festlegen.

Laden Sie dieses Beispiel hier herunter.

Erweiterte Formulare

So bebetten Sie eine PDF-Datei in eine erweiterte Formularaufgabe:

1. Verwenden Sie Aktivitäten wie die Aktivität Upload Storage File , um die PDF-Datei in den Speicher-Bucket hochzuladen, der von der Aktivität Create Form Task verwendet wird. Geben Sie den Pfad der Datei im Feld Pfad der Aktivität Upload Storage File an. Geben Sie in diesem Beispiel sample.pdf ein.
2. Klicken Sie in der Aktivität Create Form Task auf die drei Punkte (...) rechts neben FormData und fügen Sie ein Argument mit den folgenden Konfigurationen hinzu:
   • Schlüssel: pdf.
   • Richtung: In.
   • Typ: String.
   • Wert: "sample.pdf".
3. Fügen Sie dem Formular eine PDF -Komponente hinzu, und geben Sie den Namen des zuvor hinzugefügten Arguments als Eigenschaftsname an. Geben Sie für dieses Beispiel pdf an.
4. Speichern Sie Ihre Änderungen und schließen Sie das Komponentenfenster, um zum Fenster Formular-Designer zurückzukehren.

Laden Sie dieses Beispiel hier herunter.