Introduction aux mises en page personnalisées

  • Rversion finale: Washingtondc
  • Mis à jour 1 févr. 2024
  • 6 minutes de lecture

    • Configurez une Générateur d'IU page et commencez à configurer vos composants modulaires de mises en page personnalisées Playbook pour les mises en page personnalisées dans Expérience de playbook.

    Avant de commencer

    Pourquoi et quand exécuter cette tâche

    Après avoir créé une Générateur d'IU page, vous pouvez la personnaliser Expérience de playbook en fonction de vos besoins. Les modèles de page incluent des contrôleurs qui peuvent être utilisés avec des paramètres de composant prédéfinis, y compris les playbook modèles. Consultez Bind data to UI Builder pages using controllers (advanced feature) pour plus d'informations.

    Procédure

    1. Accédez à la Tous > Cadre de travail Now Experience > Générateur d'IU.
    2. Ouvrez l’expérience UI Builder dans laquelle vous souhaitez travailler ou créez une nouvelle expérience.
      L’expérience du générateur d’expérience de playbook a été conçue pour que vous puissiez la personnaliser Expérience de playbook. Pour en savoir plus sur la façon de créer une expérience, reportez-vous à Configure how users interact with your applications in UI Builder.
    3. Dans votre expérience UI Builder , vous pouvez :
      L’utilisation d’un Expérience de playbook modèle accélère le processus de développement, car le contrôleur et les composants de l’interface utilisateur de disposition personnalisée Playbook sont déjà ajoutés à chaque page, y compris les générateurs d’enregistrements à partir de la version 25.2. Le contrôleur renseigne automatiquement tous les composants fournis avec des données.
      Remarque :
      Vous pouvez toujours créer et ajouter des composants personnalisés lorsque vous utilisez un modèle.

      Sélectionnez un playbook modèle.
    4. Si vous utilisez un Expérience de playbook modèle, créez votre page.
      1. Configurez les détails de la page.
        Nom Nom de votre page.
        Adresse URL Le chemin de l’URL vers lequel les utilisateurs accèdent pour accéder à la page.
      2. Passez en revue les paramètres de test pour votre page.
        table Nom de la table parente du playbook.
        sysID Sys_id de l’enregistrement. Pour un enregistrement qui n’existe pas, la valeur est -1.
        expérience L’expérience que vous souhaitez charger.
        selectedPlaybook Le playbook dans lequel se trouve l’agent ou le prestataire.
        selectedStage Étape dans laquelle se trouve l’agent ou le prestataire.
        selectedActivity Activité de l’agent ou du prestataire.
      3. Configurez votre page par défaut variant.
        Nom Nom de votre variante de page.
        Audiences Les utilisateurs qui peuvent voir votre variante de page. Ils peuvent être définis par :
        • Rôle
        • Groupe
        • Utilisateur
        • Société
        • Département
        • Emplacement
        • Script
        Conditions Conditions qui déterminent quand la variante de page est affichée.
      4. Ouvrez la variante de page par défaut que vous venez de créer.
      La nouvelle Expérience de playbook mise en page inclut déjà des contrôleurs et des composants remplis de données, mais il reste quelques configurations supplémentaires. Pour effectuer les configurations restantes, passez à l’étape 6.
    5. Si vous avez utilisé le modèle d’enregistrement standard ou créé votre page à partir de zéro, ajoutez le contrôleur d’interface utilisateur de disposition personnalisée Playbook à la page.
      1. Dans le coin inférieur gauche de votre nouvelle page, sélectionnez Données .
      2. Sélectionnez + Ajouter.
      3. Recherchez « Playbook ».
      4. Sous Ressources de données, sélectionnez Contrôleur d’interface utilisateur de disposition personnalisée Playbook et cliquez sur Ajouter.
      5. Quittez le panneau Ressources de données .
    6. Configurez le contrôleur d’interface utilisateur de disposition personnalisée Playbook que vous venez d’ajouter.
      1. Pour permettre aux utilisateurs de créer un nouvel enregistrement dans ce formulaire personnalisé Expérience de playbook plutôt que dans le formulaire de nouvel enregistrement standard, sélectionnez une pastille de valeur de test en haut à gauche.
        Le popover des valeurs de test s’ouvre.
      2. Assurez-vous que la valeur de test sysID est définie sur -1, puis sélectionnez Appliquer.
        Valeurs de test pour votre expérience playbook, avec la table et le sysID
        Un formulaire de générateur d’enregistrement est disponible lorsque vous ouvrez l’aperçu. Vous devez être en mesure de tester le formulaire du générateur d’enregistrements et confirmer que de nouveaux enregistrements sont créés.
      3. Vous pouvez également mettre à jour le nom de table ou l’un des paramètres facultatifs :
      4. Facultatif : Si vous souhaitez plutôt coder en dur les valeurs de test, revenez à Données > Panneau des ressources de données > Instances des ressources de données locales, puis sélectionnez Page d’enregistrement du contrôleur d’interface utilisateur.
      5. Sous l’onglet Config (Configuration ) du contrôleur, ajoutez le SysID parent ou la table parent. Dans le popover des valeurs de test, il s’agit des champs sysID et table .
        Vous pouvez saisir context.props.table dans le champ Table parente et context.props.sysId dans le champ SysID parent .
        Remarque :
        Assurez-vous que la table ou l’enregistrement que vous entrez a un playbook.
      6. Ajoutez l’expérience de playbook que vous souhaitez utiliser.
      7. Facultatif : Entrez des valeurs pour les autres champs, si nécessaire.
        Mode Vue de l'activité Mode d'affichage utilisé pour présenter les activités du Playbook en mode empilé ou concentré
        Requête du générateur d'enregistrement Chaîne de requête codée pour remplacer éventuellement la requête fournie pour un générateur d'enregistrement
        ID de contexte du playbook sélectionné ID de contexte facultatif du playbook sélectionné pour le lien profond
        ID de contexte de l'étape sélectionnée ID de contexte facultatif de l'étape sélectionnée pour le lien profond
        ID de contexte de l'activité sélectionnée ID de contexte facultatif de l'activité sélectionnée pour le lien profond
      8. Dans la colonne Sorties, vous pouvez sélectionner les valeurs que vous souhaitez coder en dur.
      Le contrôleur est configuré et vous êtes prêt à ajouter playbook des composants.
    7. Ajoutez des playbook composants.
      1. Dans l’arborescence des composants, sélectionnez l’onglet principal.
        Le panneau de l’onglet principal s’ouvre à droite.
      2. Dans le panneau de l’onglet principal , sélectionnez + Ajouter.
        Un modal demandant « Comment voulez-vous créer cet onglet ? » s’affiche.
      3. Sélectionnez Démarrer à partir d’un conteneur vide et cliquez sur Suivant.
        Une fenêtre modale Paramètres d’onglet s’affiche.
      4. Donnez un nom et une icône à votre onglet, puis cliquez sur Créer.
        L’onglet est ajouté à l’arborescence des composants et un canevas vide s’affiche.
      5. Dans l’arborescence des composants, sous votre nouvel onglet, sélectionnez + Ajouter un composant et recherchez « redimensionnable ».
      6. Sélectionnez le composant de volets redimensionnables , donnez-lui un nom, puis cliquez sur Créer.
      7. Dans l’arborescence des composants, ouvrez le nouveau composant de volets redimensionnables que vous venez de créer.
        Le panneau de vos nouveaux volets Redimensionnables s’ouvre à droite.
      8. Configurez selon vos besoins, puis cliquez sur Enregistrer dans le coin supérieur droit.
      9. Pour ajouter le sélecteur d’étapes, recherchez votre nouveau composant de volets redimensionnablesdans l’arborescence des composants, puis sélectionnez + Ajouter un composant sous la gauche.
      10. Dans votre arborescence de composants, sélectionnez le nouveau sélecteur d’étape.
        Le panneau de votre nouveau sélecteur d’étapes s’ouvre à droite.
      11. Sélectionnez le paramètre prédéfini pour ce composant dans le contrôleur de l’interface utilisateur de disposition personnalisée Playbook, puis cliquez sur Enregistrer dans le coin supérieur droit.
        Choisir un paramètre prédéfini pour le composant
        Un message de confirmation s’affiche et les entrées et événements du composant sous l’onglet Événements du panneau du sélecteur d’étape sont renseignés automatiquement.
        Configuration du composant
      12. Pour ajouter la visionneuse d’activité Playbook, recherchez votre composant de volets redimensionnablesdans l’arborescence des composants, puis sélectionnez + Ajouter un composant sous la droite.
      13. Répétez les étapes 7j et 7k.
      14. Pour ajouter les modaux Playbook, recherchez l’onglet que vous avez créé sous l’onglet principal dans l’arborescence des composants, puis sélectionnez + Ajouter un composant.
      15. Répétez les étapes 7j et 7k pour les modaux Playbook.
      16. Revenez au sélecteur d’étape Playbook et déterminez l’orientation de votre sélecteur d’étape.
      17. Dans le coin supérieur droit, cliquez sur Ouvrir pour prévisualiser la playbook mise en page.
      18. Retourner à Générateur d'IU.
      19. Revenez à votre sélecteur d’étapes dans l’arborescence des composants et déterminez l’orientation de votre sélecteur d’étapes dans le panneau qui s’ouvre à droite.