Afficher un composant dans un modal

  • Rversion finale: Xanadu
  • Mis à jour 1 août 2024
  • 1 minute de lecture
  • Utilisez une action d’interface utilisateur pour lancer un composant personnalisé dans un modal afin qu’un agent n’ait pas à naviguer vers un autre écran pour accomplir une tâche.

    Avant de commencer

    Rôle requis : workspace_admin

    Pourquoi et quand exécuter cette tâche

    Lancez un composant personnalisé dans une fenêtre modale afin qu’un agent n’ait pas à quitter l’écran actuel. Par exemple, vous pouvez lancer un modal contenant les informations de contact du client nommé dans un enregistrement ouvert afin qu’un agent puisse demander aux appelants de confirmer leur identité. L’exemple suivant montre une liste dans un modal.

    Répertorier dans le modal

    Procédure

    1. Développez et déployez un composant personnalisé sur votre instance.
      Pour plus d’informations, reportez-vous à la section Composants personnalisés.
    2. Créer une entrée dans le modal de scripting enregistré.
      1. Dans le navigateur de filtre, saisissez sys_aw_registered_scripting_modal.liste pour ouvrir cette table.
      2. Cliquez sur Nouveau.
      3. Utilisez l’icône de recherche (icône de recherche) pour sélectionner un composant, dans ce cas, utilisez sn-workspace-header.
      4. Saisissez le nom de l’API, dans ce cas showHeader.
      5. L’API publique est remplie automatiquement :
        Inscrire le modal
      6. Cliquez sur Enregistrer.
    3. Créez votre action d’interface utilisateur pour afficher votre composant dans un modal.
      1. Créez une nouvelle action d’interface utilisateur pour la table appropriée et, dans l’onglet Espace de travail , sélectionnez le bouton Formulaire d’espace de travail ou le bouton Menu Espace de travail en fonction de la façon dont vous souhaitez que l’action d’interface utilisateur apparaisse et de l’endroit où vous souhaitez que l’action d’interface utilisateur apparaisse.

        Pour en savoir plus sur la création d’une action d’interface utilisateur, reportez-vous à la section Configurer des actions d’interface utilisateur personnalisées dans legacy workspace.

        Bouton ou menu du formulaire d’espace de travail

        Lorsque vous cochez l’une des cases, la zone de texte Script client de l’espace de travail s’affiche.
      2. Entrez le code suivant dans la zone de texte Script client de l’espace de travail :
        function onClick(g_form) {
          g_modal.global.showHeader({
            title: 'Test custom modal',
            confirmTitle:'YES',
            params: {
              primaryValue: 'THIS IS A PRIMARY VALUE',
              secondaryItems:{}
            }
          }).then(function(result){
            alert('confirm:'+result);
          }, function(error) {
            alert('cancel:'+error);
          });
        }
    4. Testez maintenant l’action d’interface utilisateur en ouvrant un enregistrement à Espace de travail partir de la table que vous avez sélectionnée lors de la création de cette action d’interface utilisateur.
      L’action d’interface utilisateur doit apparaître dans le volet Formulaire.