Demo-JDP-Schulungsvorlage

Diese Vorlage erzeugt eine eigenständige App basierend auf der Sparte „US-Privatfahrzeuge“ aus dem GO Marketplace von Guidewire. Sie wird zu Bildungs- und Schulungszwecken verwendet.

Wenn Sie eine App mit dieser Vorlage erstellen, müssen Sie sicherstellen, dass die Sparte von Marketplace heruntergeladen und in der von Ihnen gewählten PolicyCenter-Instanz innerhalb Ihrer GWCP-Umgebung installiert wurde, damit die App korrekt funktioniert. Die Vorlage führt eine Angebots- und Kauftransaktion durch, und die daraus resultierende App erzeugt ein Angebot mit einem Wert, der auf der entsprechenden Tarifierungskonfiguration innerhalb der gewählten PolicyCenter-Instanz basiert. Wenn keine Tarifierung konfiguriert ist, wird ein Null-Dollar-Angebot zurückgegeben und in der App angezeigt.

Diese Implementierung folgt einem Muster, das die Präsentationslogik in React-Komponenten aufteilt und die Geschäftslogik der Anwendung den React-Hooks überlässt.

Abhängigkeiten

Um auf diese Vorlage zugreifen zu können, müssen Sie Zugriff auf die Jutro Web Apps UI haben.

Einrichten der Vorlage

Erstellen Sie zunächst eine Anwendung in der Jutro Web Apps-Benutzeroberfläche mit dieser Vorlage, dann erhalten Sie Zugriff auf ein Bitbucket-Repository, das diese Vorlage enthält.

Verbindung zu PolicyCenter Cloud API konfigurieren

Um die Verbindung zum PolicyCenter und zum Autorisierungsanbieter zu konfigurieren, müssen Sie Werte für die Parameter in der src/config/config.json-Datei festlegen:

  "env": {
    "JUTRO_PC_CLOUD_API_URL": "API_URL_HERE",
    "JUTRO_AUTH_ENABLED": true,
    "JUTRO_AUTH_ISSUER": "AUTH_ISSUER_HERE",
    "JUTRO_AUTH_CLIENT_ID": "CLIENT_ID_HERE",
    "JUTRO_AUTH_REDIRECT_BASE": "REDIRECT_BASE_HERE",
    "JUTRO_AUTH_REDIRECT_PATH": "/callback",
    "JUTRO_AUTH_PKCE_ENABLED": true
  }

Liste der Parameter

Parameter	Beschreibung
JUTRO_PC_CLOUD_API_URL	URL zu PolicyCenter Cloud API
JUTRO_AUTH_ENABLED	Authentifizierung aktivieren (true) / deaktivieren (false)
JUTRO_AUTH_ISSUER	URL zu einem Autorisierungsaussteller
JUTRO_AUTH_CLIENT_ID	Authentifizierungs-Client-ID
JUTRO_AUTH_REDIRECT_BASE	Weiterleitungs-URL
JUTRO_AUTH_REDIRECT_PATH	Weiterleitungspfad
JUTRO_AUTH_PKCE_ENABLED	Aktivieren des Autorisierungs-PKCE-Ablaufs

Nachdem Sie die Vorlage fertig eingerichtet haben, können Sie sie lokal ausführen:

1. Führen Sie den npm install-Befehl in Ihrem Terminal aus, um alle in der package.json-Datei aufgeführten Abhängigkeiten zu installieren.
2. Führen Sie npm start aus.

Grundlegende Informationen zum Code

Das Layout der Vorlage besteht aus einer Floorplan-Komponente und einer Wizard-Komponente. Die Floorplan-Komponente legt das Gesamtlayout für die Vorlage und den Assistenten fest. Die Wizard-Komponente verwaltet jede im steps-Verzeichnis enthaltene Seite. Diese Vorlage enthält außerdem drei wichtige Dateien:

1. index.tsx – die als Einstiegspunkt für die Anwendung dient und die App.tsx-Komponente rendert.
2. App.tsx – mit der Sie den Grundriss auf der Seite des Angebots-Assistenten konfigurieren und rendern können.
3. QuoteWizard.tsx – welche die Assistentenkomponente sowie die Schritte des Assistenten konfiguriert und rendert. Sie verwaltet den Status auf der Ebene der Anwendung, die von den Schritten gemeinsam genutzt wird.

Der Code und die Einstellungen für die einzelnen Seiten des Assistenten befinden sich innerhalb des src/pages/QuoteWizard/steps-Verzeichnisses in einem eigenen Unterordner. Außerdem gibt es für bestimmte Seiten spezifische Hooks und Komponenten. Sie befinden sich ebenfalls in den Unterordnern der Seiten.

Statusverwaltung

Es gibt drei Elemente. Sie verwalten die Daten, welche die Vorlage durchlaufen:

• Der Status auf Seitenebene wird von den benutzerdefinierten Hooks einer Seite verwaltet. Jede Seite hat ihren eigenen individuellen Hook.
• Der Status auf Anwendungsebene wird von der ApplicationContext-Komponente verwaltet, die als zentraler Speicher für Daten fungiert, die zwischen den Seiten übergeben werden. Dies wird als der Anwendungsstatus bezeichnet.
• Der Status auf Produktebene wird von der PAStateContext-Komponente verwaltet. Zu den Daten auf Produktebene gehören Elemente wie die aktuellen Werte bestimmter Felder, Deckungen und Bedingungen. Dies wird als PA-Status (Personal auto, Privatfahrzeuge) bezeichnet.

Seiten

Seite „Kontoinformationen“

Im ersten Schritt des Assistenten müssen Sie die Daten des Kontoinhabers eingeben. Um zum nächsten Schritt zu gelangen, füllen Sie die Pflichtfelder aus und klicken auf Weiter.

Diese Seite wird nicht durch die Produktdefinition gesteuert, so dass sie besser angepasst werden kann. Die Seite verfügt über einen benutzerdefinierten Hook für die Verwaltung des Anwendungsstatus und die Interaktion mit den APIs, während die Seitenkomponente die Struktur und die clientseitige Validierung übernimmt, die sich bei der Validierung ausschließlich auf Jutro-Komponenten stützt. Diese Seite greift auf den Anwendungsstatus zu, muss aber nicht mit dem PA-Status interagieren.

Seiten mit Details zu Fahrzeug und Fahrer

Auf diesen Seiten müssen Sie Informationen über das Fahrzeug und den Fahrer angeben.

Diese beiden Seiten werden von der Produktdefinition gesteuert und ermöglichen das automatische Rendern von Feldern basierend auf den Informationen aus dem InsuranceSuite-Schema. Sie haben jeweils einen benutzerdefinierten Hook zum Abrufen der anzuzeigenden Felder und zum Anwenden dynamischer Einschränkungen aus dem Schema. Das bedeutet, dass bestimmte Felder basierend auf den in anderen Feldern ausgewählten Werten erscheinen oder verschwinden können. Die clientseitige Validierung basierend auf Jutro-Komponenten wird von der Komponente jeder Seite durchgeführt. Sie verwenden den Anwendungsstatus und den PA-Status, um auf Daten zuzugreifen und sie zu speichern.

Seite „Fahrzeug und Policendeckungen“

Auf diesen Seiten müssen Sie alle Fahrzeuge und Policendeckungen auswählen, die Sie hinzufügen möchten.

Note: Zur Vereinfachung des Benutzerführung sind die vorgeschlagenen Deckungen markiert, und die erforderlichen Deckungen sind vorausgewählt und können nicht deaktiviert werden.

Beiden Seiten haben jeweils einen benutzerdefinierten Hook zum Abrufen der anzuzeigenden Felder und zur Anwendung dynamischer Einschränkungen aus den InsuranceSuite-Schemas. Sie teilen sich eine Coverage-Komponente, die sich im Ordner src/components befindet. Diese Komponente verwendet einen eigenen benutzerdefinierten Hook. Diese Seiten werden von der Produktdefinition gesteuert, wodurch die automatische Darstellung von Deckungen und Bedingungen basierend auf dem Schema ermöglicht wird. Das bedeutet, dass bestimmte Felder basierend auf den in anderen Feldern ausgewählten Werten erscheinen oder verschwinden können. Sie verwenden beide den Anwendungsstatus und den PA-Status, um auf Daten zuzugreifen und sie zu speichern.

Seiten für Angebot, Zusammenfassung der Police, Zahlung und Bestätigung

Abgesehen vom Erstellen und Verbindlichmachen des Angebots sind dies schreibgeschützte Seiten, die zu Informationszwecken gedacht sind und keine handlungsrelevanten Elemente enthalten. Diese Seiten zeigen Daten an, die sowohl aus dem Anwendungsstatus als auch aus dem PA-Status stammen. Das automatische Rendern wird nur zur dynamischen Anzeige der Deckungsbedingungen verwendet.

Seite „Kfz-Angebot“

Seite „Policenzusammenfassung“

Seite „Policenzahlung“

Seite „Policenbestätigung“