Introduction aux mises en page personnalisées

  • Rversion finale: Yokohama
  • Mis à jour 30 janv. 2025
  • 6 minutes de lecture

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

    Avant de commencer

    • Si vous n’avez playbook pas de mise en page personnalisée, créez un playbook. Pour en savoir plus, consultez Création de playbooks.
    • Installez la dernière version des applications et Composant Expérience de Expérience de playbook playbook à partir du ServiceNow Store. Voir Applications Expérience de playbook.

    Rôle requis : ui_builder_admin, admin

    Pourquoi et quand exécuter cette tâche

    Après avoir créé une Générateur d'IU page, vous pouvez personnaliser Expérience de playbook les pages en fonction de vos besoins. Les modèles de page incluent des contrôleurs qui peuvent être utilisés avec des paramètres prédéfinis de composant, 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 Tout > Cadre de travail Now Experience > Générateur d'IU.
    2. Ouvrez l’expérience du générateur d’IU 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 création d’une expérience, reportez-vous à la section Configure how users interact with your applications in UI Builder.
    3. Dans votre expérience de générateur d’IU , 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 la disposition personnalisée du 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 remplit 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 d’accès de l’URL vers lequel les utilisateurs naviguent pour accéder à la page.
      2. Examinez les paramètres de test de votre page.
        table Nom de la table parente pour le 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 L’étape dans laquelle se trouve l’agent ou le prestataire.
        selectedActivity L’activité dans laquelle se trouve l’agent ou le prestataire.
      3. Configurez votre page par défaut contreariant.
        Nom Le 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
        • Entreprise
        • 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 disposition comprend déjà des contrôleurs et des composants remplis de données, mais il reste quelques configurations supplémentaires à effectuer. 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 de l’interface utilisateur de disposition personnalisée de Playbook à la page.
      1. Dans le coin inférieur de votre nouvelle page, sélectionnez l’icône de données (icône de données).
      2. Sélectionnez + Ajouter.
      3. Recherchez « Playbook ».
      4. Sous Ressources de données, sélectionnez Contrôleur de l’interface utilisateur de disposition personnalisée du Playbook et cliquez sur Ajouter.
      5. Quittez le panneau Ressources de données .
    6. Configurez le contrôleur de l’interface utilisateur de disposition personnalisée du 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 au lieu du 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.
        Testez les valeurs pour votre expérience de playbook, avec la table et le sysID.
        Un formulaire de générateur d’enregistrement est disponible lorsque vous ouvrez l’aperçu. Vous devriez être en mesure de tester le formulaire du générateur d’enregistrement et de confirmer que de nouveaux enregistrements sont créés.
      3. Vous pouvez également mettre à jour le nom de la 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 localeset sélectionnez Page d’enregistrement du contrôleur d’interface utilisateur.
      5. Sous l’onglet Configuration du contrôleur, ajoutez le SysID parent ou la table parente. Dans le popover des valeurs de test, il s’agit des champs sysID et table .
        Vous pouvez entrer 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 saisissez a une balise playbook.
      6. Ajoutez l’expérience de playbook que vous souhaitez utiliser.
      7. Facultatif : Saisissez 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. Facultatif : Dans la colonne Sorties, vous pouvez sélectionner les valeurs que vous souhaitez coder en dur.
      Le contrôleur est configuré et vous pouvez ajouter playbook des composants.
    7. Ajouter des playbook composants.
      1. Dans l’arborescence des composants, sélectionnez l’onglet Principal.
        Le panneau de l’onglet principal s’ouvre sur la droite.
      2. Dans le panneau de l’onglet principal , sélectionnez + Ajouter.
        Une fenêtre modale 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 Volets redimensionnables , donnez-lui un nom et cliquez sur Créer.
      7. Dans l’arborescence des composants, ouvrez le nouveau composant Volets redimensionnables que vous venez de créer.
        Le panneau de vos nouveaux volets redimensionnables s’ouvre sur la droite.
      8. Configurez selon vos besoins, puis cliquez sur Enregistrer dans le coin supérieur droit.
      9. Pour ajouter le sélecteur d’étape, recherchez votre nouveau composant de volets redimensionnablesdans l’arborescence des composants, puis sélectionnez + Ajouter un composant sous la gauche.
      10. Dans l’arborescence de vos composants, sélectionnez le nouveau sélecteur d’étape.
        Le panneau de votre nouveau sélecteur d’étape s’ouvre sur la 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 du Playbook, puis cliquez sur Enregistrer dans le coin supérieur droit.
        Choisissez un paramètre prédéfini pour le composant.
        Un message de confirmation s’affiche et les entrées et événements de composant sous l’onglet Événements du panneau du sélecteur d’étape sont automatiquement remplis.
        Configuration du composant.
      12. Pour ajouter la visionneuse d’activité Playbook, recherchez votre composant de volets redimensionnablesdans l’arborescence des composants et sélectionnez + Ajouter un composant à 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. Revenir à .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.