Guide pratique pour afficher la progression de l’opération dans une extension du portail d’administration Azure Pack Windows

 

S’applique à : Windows Azure Pack

Si une opération initiée par l’utilisateur prend un certain temps à traiter, il est recommandé d’utiliser ProgressOperation pour ne pas bloquer l’interface utilisateur du portail de gestion, mais autoriser l’utilisateur à voir que l’opération est en cours. Un ProgressOperation a plusieurs options pour vous permettre de garder l’utilisateur informé de l’opération. Chacune de ces options peut être utilisée indépendamment les unes des autres.

Les opérations de progression peuvent être déterminés. Vous pouvez savoir comment terminer l’opération est, par exemple, l’opération peut signaler la valeur complète du pourcentage. Ils peuvent également être indéterminés. Vous savez que l’opération est ou n’est pas terminée, mais pas à quel point elle est proche de l’état.

ProgressOperation a une propriété indéterminée qui indique à l’utilisateur qu’il y a, ou non, de signaler la progression vers l’achèvement.

Une opération peut être constituée d’une séquence d’étapes individuelles, chacune pouvant réussir ou échouer. Lorsque l’échec se produit, toute progression supplémentaire de l’opération est arrêtée. Lorsque les opérations ont des étapes, un bouton Détails s’affiche :

Le fait de cliquer sur celui-ci révèle les étapes individuelles, avec des états individuels tels que la réussite, l’échec ou l’avertissement : consultez les méthodes addStep /removeStep dans ProgressOperation pour plus d’informations.

Un exemple d’opération de progression est contenu dans l’exemple d’Assistant. La fonction onComplete de l’Assistant configure une opération de progression pour s’afficher lorsque l’opération de serveur se termine.

Pour afficher la progression d’une opération dans un Assistant

1. Utilisez le code suivant pour afficher la progression dans un Assistant.

   cdm.stepWizard({
       extension: "DomainTenantExtension",
       steps: [{
         template: "createStep1",
         data: data,
         // Called when the step is first created
         onStepCreated: function () {
           wizard = this;
         },
         // Called each time the step is displayed
         onStepActivate: step1Activate,
         // Called before the wizard moves to the next step
         onNextStep: function () {
           return Shell.UI.Validation.validateContainer("#dm-create-step1");
         }
       }],
       // Called when the user clicks the "Finish" button on the last step
       onComplete: function () {
         var newPassword, newResellerPortalUrl;
         newPassword = $("#dm-password").val();
         newResellerPortalUrl = registerReseller ? $("#dm-portalUrl").val() : null;
         // Call whatever backend function we need to. In our example, it returns a promise
         promise = callback(newPassword, newResellerPortalUrl);
   
         // Create a new Progress Operation object
         var progressOperation = new Shell.UI.ProgressOperation(
           // Title of operation
           "Registering endpoint...",
           // Initial status. null = default
           null,
           // Is indeterministic? (Does it NOT provide a % complete)
           true);
   
         // This adds the progress operation we set up earlier to the visible list of PrOp's
         Shell.UI.ProgressOperations.add(progressOperation);
   
         promise
           .done(function() {
              // When the operation succeeds, complete the progress operation
              progressOperation.complete(
                "Successfully registered the endpoint.",
                Shell.UI.InteractionSeverity.information);
              })
           .fail(function() {
              // When the operation fails, complete the progress operation
              progressOperation.complete(
                "Failed to register the endpoint.",
                Shell.UI.InteractionSeverity.error,
                Shell.UI.InteractionBehavior.ok);
           });
       }
     },
     {
       // Other supported sized include large, medium & small
       size: "mediumplus" 
     });
   

Voir aussi

Exécution de tâches courantes dans une extension du portail d’administration Azure Pack Windows