Démonstration de l'application Multirisque Habitation

Ce modèle génère une application autonome basée sur la ligne métier Véhicule personnel (LOB) pour les États-Unis à partir de la GO Marketplace de Guidewire. Lors de la création d'une application avec ce modèle, assurez-vous que la LOB est téléchargée à partir de la place de marché et installée dans l'instance PolicyCenter de votre choix dans votre environnement GWCP pour que l'application fonctionne correctement. Le modèle effectue une transaction Quote and Buy et l'application qui en résulte génère un devis, avec une valeur basée sur la configuration de tarification appropriée au sein de l'instance PolicyCenter choisie. Si aucune tarification n'est configurée, un devis de zéro dollar est renvoyé et affiché dans l'application.

Cette implémentation suit un modèle qui sépare la logique de présentation en composants React, laissant la logique métier de l'application aux crochets React.

Dépendances

Pour accéder à ce modèle, vous devez avoir accès à l'interface utilisateur de Jutro Web Apps.

Configuration du modèle

Créez d'abord une application dans l'interface utilisateur de Jutro Web Apps à l'aide de ce modèle et vous aurez accès à un référentiel Bitbucket contenant ce modèle.

Configuration d'une connexion à PolicyCenter Cloud API

Pour configurer la connexion à PolicyCenter et au fournisseur d'autorisation, vous devez définir des valeurs pour les paramètres dans le fichier src/config/config.json :

  "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 des paramètres

Param	Description
JUTRO_PC_CLOUD_API_URL	URL vers PolicyCenter Cloud API
JUTRO_AUTH_ENABLED	Activer (true) / Désactiver (false) l'authentification
JUTRO_AUTH_ISSUER	URL vers un émetteur d'autorisation
JUTRO_AUTH_CLIENT_ID	ID du client d'authentification
JUTRO_AUTH_REDIRECT_BASE	URL de redirection
JUTRO_AUTH_REDIRECT_PATH	Chemin de redirection
JUTRO_AUTH_PKCE_ENABLED	Activer le flux PKCE d'autorisation

Une fois la configuration du modèle terminée, procédez comme suit pour l'exécuter localement :

1. Exécutez la commande npm install dans votre terminal pour installer toutes les dépendances répertoriées dans le fichier package.json.
2. Exécutez npm start.

Comprendre le code

La structure du modèle se compose d'un composant Floorplan et d'un composant Wizard. Le composant Floorplan définit la structure générale du modèle et de l'assistant. Le composant Wizard gère chaque page contenue dans le répertoire steps. Ce modèle contient également trois fichiers importants :

1. index.tsx qui fait office de point d'entrée de l'application et affiche le composant App.tsx.
2. App.tsx qui configure et affiche le plan sur la page de l'assistant Devis.
3. QuoteWizard.tsx qui configure et affiche le composant de l'assistant, ainsi que les étapes de l'assistant. Il gère l'état au niveau de l'application qui est partagé entre les étapes.

Le code et les paramètres de chacune des pages de l'assistant se trouvent dans le répertoire src/pages/QuoteWizard/steps de leur propre sous-dossier. Il existe également des crochets et des composants spécifiques à certaines pages. Ils se trouvent également dans les sous-dossiers de la page.

Gestion d'état

Trois éléments gèrent les données qui transitent par le modèle :

• L'état de niveau page est géré par les crochets personnalisés d'une page. Chaque page possède son propre crochet individuel.
• L'état au niveau de l'application est géré par le composant ApplicationContext, qui sert de magasin centralisé pour les données transmises entre les pages. C'est ce que l'on appelle l'état de l'application.
• L'état au niveau du produit est géré par le composant HOStateContext. Les données au niveau du produit incluent des éléments tels que les valeurs actuelles de certains champs, garanties et conditions. C'est ce que l'on appelle l'état HO (Multirisque Habitation).

Pages

Page d'informations sur le compte

Dans la première étape de l'assistant, vous devez entrer les informations sur le titulaire du compte.

Cette page n'est pas pilotée par définition de produit, ce qui permet une personnalisation accrue. Cette page dispose d'un crochet personnalisé pour gérer l'état de l'application et interagir avec les API, tandis que le composant de la page gère la structure et la validation côté client, qui repose uniquement sur des composants Jutro pour la validation. Cette page accède à l'état de l'application, mais n'a pas besoin d'interagir avec l'état HO.

Détails de la police

Dans cette étape, vous devez fournir des informations sur les détails de votre police d'assurance.

Cette page est pilotée par la définition du produit, ce qui permet le rendu automatique des champs en fonction des schémas InsuranceSuite. Elle dispose d'un crochet personnalisé pour récupérer les champs à afficher et appliquer des contraintes dynamiques à partir du schéma. Cela signifie que certains champs peuvent apparaître ou disparaître en fonction des valeurs sélectionnées dans d'autres champs. Si vous répondez Non à la question 2, Une compagnie d'assurance a-t-elle refusé de vous fournir une assurance au cours des cinq dernières années, certains des champs suivants sont désactivés. La validation côté client basée sur les composants Jutro est gérée par le composant de chaque page. Il utilise l'état de l'application et l'état HO pour accéder aux données et les stocker.

Page des détails de l'habitation

Dans cette étape, vous devez fournir des informations sur l'habitation proprement dite.

Cette page est pilotée par la définition du produit, ce qui permet le rendu automatique des champs en fonction du schéma InsuranceSuite. Elle dispose d'un crochet personnalisé pour récupérer les champs à afficher et appliquer des contraintes dynamiques à partir du schéma. Cela signifie que certains champs peuvent apparaître ou disparaître en fonction des valeurs sélectionnées dans d'autres champs. Si vous ne sélectionnez pas Autre pour la question 2, l'entrée Autre type de construction située plus bas dans la page est désactivée. La validation côté client basée sur les composants Jutro est gérée par le composant de chaque page. Il utilise l'état de l'application et l'état HO pour accéder aux données et les stocker.

Pages de risques pour les animaux et les dangers dz l'habitation

Sur ces pages, vous pouvez ajouter des risques pour votre habitation. À l'aide des éléments déroulants, vous pouvez effectuer une sélection dans les champs existants et ajouter des informations supplémentaires. Les risques sont ensuite ajoutés à la police.

Ces pages consacrées aux risques sont pilotées par la définition du produit, ce qui permet le rendu automatique des champs en fonction des schémas InsuranceSuite. Elles disposent chacune d'un crochet personnalisé pour récupérer les champs à afficher et appliquer des contraintes dynamiques à partir des schémas. Cela signifie que certains champs peuvent apparaître ou disparaître en fonction des valeurs sélectionnées dans d'autres champs. Sur la page Risque animal, si vous ne sélectionnez pas de type, l'élément déroulant Race est désactivé. La validation côté client basée sur les composants Jutro est gérée par le composant de chaque page. Chaque page utilise l'état de l'application et l'état HO pour accéder aux données et les stocker.

Habitation et garanties de police

Dans ces pages, vous pouvez sélectionner une habitation et des garanties de police. Vous pouvez choisir ces garanties en cochant les cases et, dans certains cas, en fournissant des informations supplémentaires requises.

Ces deux pages disposent chacune d'un crochet personnalisé pour récupérer les champs à afficher et appliquer les contraintes dynamiques des schémas. Elles partagent un composant Coverage qui se trouve dans le dossier src/components. Ce composant utilise un crochet personnalisé qui lui est propre. Ces pages sont pilotées par la définition du produit, ce qui permet le rendu automatique des garanties et des conditions en fonction des schémas InsuranceSuite. Cela signifie que certains champs peuvent apparaître ou disparaître en fonction des valeurs sélectionnées dans d'autres champs. Elles utilisent l'état de l'application et l'état HO pour accéder aux données et les stocker.

Pages Devis, Synthèse de la police, Paiement et Confirmation

Hormis la création du devis et sa souscription, il s'agit de pages en lecture seule conçues à des fins d'information et ne contenant aucun élément exécutable. Ces pages affichent des données provenant à la fois de l'état de l'application et de l'état HO. Le rendu automatique est uniquement appliqué pour afficher les conditions de garantie de manière dynamique.

Page de devis habitation

Page Synthèse de la police

Page Paiement de la police

Page Confirmation du paiement

Liste des langues et formats régionaux disponibles

• Anglais (US)
• Espagnol (ES)
• Espagnol (MX)
• Allemand (DE)
• Polonais (PL)

Liste des thèmes disponibles

Thème
Enterprise
Consumer
Ski