Afficher un composant dans un modal

  • Rversion finale: Washingtondc
  • Mis à jour 1 févr. 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 besoin d’accéder à 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 un modal 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.

    Liste dans le modal

    Procédure

    1. Développez et déployez un composant personnalisé sur votre instance.
    2. Créez une entrée dans le modal de scripting enregistré.
      1. Dans le Navigateur de filtre, entrez sys_aw_registered_scripting_modal.list 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. Entrez le nom de l’API, dans ce cas showHeader.
      5. L’API publique est renseignée automatiquement :
        Enregistrer 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 du formulaire d’espace de travail ou le bouton de menu de l’espace de travail en fonction de l’endroit et de la façon dont 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 à 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 d’espace de travail s’affiche.
      2. Entrez le code suivant dans la zone de texte Script client d’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 panneau Formulaire.