Customiser un flux ouvert en pop-up via un bouton

Last modified by Aurelie Bertrand on 2023/11/16 10:27

Il est possible de personnaliser un flux ouvert en pop-up depuis un bouton sur le tableau de bord. Par exemple, il peut être choisi de ne pas afficher les commandes d'export dans le menu. 

Il existe 2 manières de procéder :

  • Paramétrer le flux à afficher en pop-up et utiliser la fonction openPortletInWindow 
  • Utiliser la fonction openFlowInWindow en ajoutant des paramètres de customisation

La seconde solution utilise un objet JSON permet une personnalisation plus avancée.

Paramétrer le flux et utiliser la fonction openPortletInWindow

  1.  Dans l'Éditeur de tableaux de bord, ajoutez le flux qui sera à afficher en pop-up depuis un bouton.
  2. Sélectionnez l'objet contenant le flux et, dans l'onglet Propriétés du panneau latéral, décochez les éléments que vous ne souhaitez pas afficher et cochez ceux à ajouter.
    Dans cet exemple, on désactive la sauvegarde dans les différents types de format.
    Options_menu_flux
     
  3. Dans l'onglet Affichage, cochez la case Cache l'objet afin que le flux ne soit pas affiché sur le tableau de bord (hormis en pop-up).
  4. Dans l'onglet Informations, récupérez la valeur de l'identifiant de l'objet.
  5. Depuis le menu hamburger en haut à droite de la fenêtre, ouvrez l'Éditeur Javascript.
    Menu_paramètres
  6. Entrez alors la fonction suivante en remplaçant Identifiant_objet par la valeur de l'identifiant de l'objet et cliquez sur OK.
    function openPopupCustomPortlet() {
    ddCtrl.openPortletInWindow("Identifiant_objet", "80%", "80%"); }

Par exemple :
Code_JS_solution1

  1. Ajoutez l'objet Bouton qui permettra d'ouvrir le flux en pop-up.
  2. Dans la section Actions de l'onglet Propriétés du bouton, cliquez sur Ajouter une action.
  3. Dans la boite Action, sélectionnez Fonction personnalisée, puis entrez le nom de la fonction openPopupCustomPortlet() et cliquez sur OK.
    Action
  4. Vous pouvez alors enregistrer et afficher le tableau de bord pour visualiser le résultat.
    Dans cet exemple, les commandes d'export ne s'affichent pas dans le menu.

Popup sans export

Utiliser la fonction openFlowInWindow avec des paramètres de customisation

  1. Récupérez l'identifiant du flux (graphique) à afficher.
  2. Dans l'Éditeur de tableaux de bord, depuis le menu hamburger en haut à droite de la fenêtre, ouvrez l'Éditeur Javascript.
    Menu_paramètres
  3. Entrez alors la fonction suivante en remplaçant Identifiant_flux par la valeur de l'identifiant du flux et en personnalisant l'objet JSON contenant les paramètres de la portlet entre {}. Dans cet exemple, on désactive la sauvegarde dans les différents types de formats.
    function openPopup() {
    ddCtrl.openFlowInWindow("5f9a3882", "50%", "50%", {"exportPDF":"false","exportPPT":"false", "exportXLS":"false", "exportCSV":"false"}); }

D'autres paramètres sont disponibles : css, cssstyle, color, image, menu  (valeur "true" ou "false"), etc.

On peut ainsi, par exemple, ajouter une couleur de fond.

function openPopup() {
ddCtrl.openFlowInWindow("5f9a3882", "50%", "50%", {"color":"#F4F6F8","exportPDF":"false","exportPPT":"false", "exportXLS":"false", "exportCSV":"false"}); }
  1. Dans l'Éditeur de tableaux de bord, ajoutez l'objet Bouton qui permettra d'ouvrir le flux en pop-up.
  2. Dans la section Actions de l'onglet Propriétés du bouton, cliquez sur Ajouter une action.
  3. Dans la boite Action, sélectionnez Fonction personnalisée, puis entrez le nom de la fonction openPopup() et cliquez sur OK.
    Action
  4. Vous pouvez alors enregistrer et afficher le tableau de bord pour visualiser le résultat.
    Dans cet exemple, les commandes d'export ne s'affichent pas dans le menu et le fond est gris.

Rendu