add progress dialog for service instantiation

Change-Id: Iac8cf032248f40b213d7d8dcff4741fae2451767
Issue-id: USECASEUI-55
Signed-off-by: Luji7 <lu.ji3@zte.com.cn>

4 files changed, 167 insertions, 11 deletions

diff --git a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/ServiceTemplateService.js b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/ServiceTemplateService.js
index c9357618..d46c35c4 100644
--- a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/ServiceTemplateService.js
+++ b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/ServiceTemplateService.js
@@ -144,7 +144,7 @@
        });
      },
 
-     createService: function (customer, serviceType, service, template) {
+     createService: function (customer, serviceType, service, template, successFun, failedFun) {
        var reqPara = [];
        service.segments.forEach(function (segment) {
          var reqParas = {};
@@ -203,7 +203,7 @@
        };
 
        console.log('request body: ');
-       console.log(requestBody);
+       console.log(JSON.stringify(requestBody));
 
        return $http({
          url: url+'/services',
@@ -213,10 +213,14 @@
        }).then(function(response){
          console.log('create response...');
          console.log(response.data);
+
+         var serviceId = response.data.service.serviceId;
+         var operationId = response.data.service.operationId;
+         successFun(serviceId, operatinId);
        });
      },
 
-     deleteService: function (serviceId) {
+     deleteService: function (serviceId, successFun) {
        return $http({
          url: url+'/services/' + serviceId,
          method: 'DELETE',
@@ -225,6 +229,26 @@
        }).then(function(response){
          console.log('delete response...');
          console.log(response.data);
+         successFun(serviceId, response.data.operationId);
+       });
+     },
+
+     queryServiceProgress: function (serviceId, operationId, progressFun) {
+       return $http({
+         url: url+'/services/' + serviceId + '/operations/' + operationId,
+         method: 'GET',
+         data: null,
+         headers: uuiHeaders
+       }).then(function(response){
+         console.log('get progress response...');
+         console.log(response.data);
+         var op = response.data.operation;
+         progressFun({
+           result: op.result,
+           progress : op.progress,
+           operationContent: op.operationContent,
+           reason: op.reason
+         });
        });
      },
 
diff --git a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/lcmController.js b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/lcmController.js
index 78e32aea..d53fd945 100644
--- a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/lcmController.js
+++ b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/controller/lcmController.js
@@ -16,6 +16,38 @@
 app.controller('lcmCtrl', ['$scope', '$uibModal', '$log', '$http', '$timeout', '$interval', 'ServiceTemplateService',
     function ($scope, $uibModal, $log, $http, $timeout, $interval, ServiceTemplateService) {
       var ctrl = this;
+      ctrl.alerts = [];
+      ctrl.closeAlert = function(index) {
+        ctrl.alerts.splice(index, 1);
+      };
+      var openServiceProgressDialog = function (serviceId, operationId, title, successFun, failFun) {
+        var serviceProgressInstance = $uibModal.open({
+          ariaLabelledBy: 'modal-title',
+          ariaDescribedBy: 'modal-body',
+          templateUrl : 'app/uui/fusion/scripts/view-models/progress-dialog.html',
+          controller : 'ServiceProgressCtrl',
+          controllerAs : 'ctrl',
+          resolve: {
+            serviceId: function () {
+              return serviceId;
+            },
+            operationId: function () {
+              return operationId;
+            },
+            operationTitle: function () {
+              return title;
+            }
+          }
+        });
+        serviceProgressInstance.result.then(
+          function (result) {
+            successFun(result);
+          },
+          function (reason) {
+            failFun(reason);
+          }
+        );
+      };
       ctrl.openCreateServiceDialog = function () {
         var modalInstance = $uibModal.open({
           ariaLabelledBy: 'modal-title',
@@ -36,6 +68,16 @@ app.controller('lcmCtrl', ['$scope', '$uibModal', '$log', '$http', '$timeout', '
           function(result) {
             console.log('receive ok button clicked!');
             console.log(result);
+            var successFun = function (result) {
+              ctrl.alerts.push({type: 'success', msg: result});
+              ServiceTemplateService.getServiceInstances(ctrl.customer.id, ctrl.serviceType.value, function (instances) {
+                ctrl.serviceInstances = instances;
+              });
+            }
+            var failFun = function (reason) {
+              ctrl.alerts.push({type: 'danger',msg: reason});
+            }
+            openServiceProgressDialog(result.serviceId, result.operationId, 'Create Service', successFun, failFun);
           },
           function(reason) {
             console.log('receive cancel button clicked!');
@@ -79,7 +121,19 @@ app.controller('lcmCtrl', ['$scope', '$uibModal', '$log', '$http', '$timeout', '
       };
 
       ctrl.deleteService = function (serviceInstance) {
-        ServiceTemplateService.deleteService(serviceInstance.serviceInstanceId);
+        var successFun = function (serviceId, operationId) {
+          var successFun = function (result) {
+            ctrl.alerts.push({type: 'success', msg: result});
+            ServiceTemplateService.getServiceInstances(ctrl.customer.id, ctrl.serviceType.value, function (instances) {
+              ctrl.serviceInstances = instances;
+            });
+          }
+          var failFun = function (reason) {
+            ctrl.alerts.push({type: 'danger',msg: reason});
+          }
+          openServiceProgressDialog(serviceId, operationId, 'Delete Service', successFun, failFun);
+        }
+        ServiceTemplateService.deleteService(serviceInstance.serviceInstanceId, successFun);
       };
 
       ctrl.packageOnboard = function (onboardPackage) {
@@ -88,8 +142,8 @@ app.controller('lcmCtrl', ['$scope', '$uibModal', '$log', '$http', '$timeout', '
     }
   ]
 )
-.controller('createServiceCtrl',['$scope', '$uibModalInstance', 'ServiceTemplateService', 'customer', 'serviceType',
-    function($scope, $uibModalInstance, ServiceTemplateService, customer, serviceType) {
+.controller('createServiceCtrl',['$scope', '$uibModal','$uibModalInstance', 'ServiceTemplateService', 'customer', 'serviceType',
+    function($scope,$uibModal, $uibModalInstance, ServiceTemplateService, customer, serviceType) {
       var ctrl = this;
 
       ServiceTemplateService.getAllServiceTemplates(function (t) {
@@ -165,12 +219,19 @@ app.controller('lcmCtrl', ['$scope', '$uibModal', '$log', '$http', '$timeout', '
         console.log(customer);
         console.log(serviceType);
         console.log(ctrl.realTemplate);
-        ServiceTemplateService.createService(customer, serviceType, ctrl.service, ctrl.realTemplate);
-        var result = 'success.';
-        $uibModalInstance.close(result);
-      };
 
-      console.log($uibModalInstance);
+
+        var errorMessage = function () {
+
+        };
+        var successFun = function (serviceId, operationId) {
+          $uibModalInstance.close({
+            serviceId: serviceId,
+            operationId: operationId
+          });
+        }
+        ServiceTemplateService.createService(customer, serviceType, ctrl.service, ctrl.realTemplate, successFun, errorMessage);
+      };
       // cancel click
       ctrl.cancel = function() {
         $uibModalInstance.dismiss('cancel');
@@ -211,4 +272,43 @@ app.controller('lcmCtrl', ['$scope', '$uibModal', '$log', '$http', '$timeout', '
       };
 
     }]
+).controller('ServiceProgressCtrl', ['$uibModalInstance', 'ServiceTemplateService', 'serviceId', 'operationId', 'operationTitle', '$q', '$interval',
+function ($uibModalInstance, ServiceTemplateService, serviceId, operationId, operationTitle, $q, $interval) {
+  var ctrl = this;
+  ctrl.title = operationTitle;
+  ctrl.operation = '';
+  ctrl.max = 100;
+  ctrl.dynamic = 0;
+
+  var timerDeferred = $q.defer();
+  var timerPromise = timerDeferred.promise;
+
+  var progressFun = function (serviceProgress) {
+    if('finished' === serviceProgress.result || 'error' === serviceProgress.result) {
+      ctrl.dynamic = 100;
+      timerDeferred.resolve();
+      if('finished' === serviceProgress.result) {
+        $uibModalInstance.close(operationTitle + ' finished!');
+      } else if('error' === serviceProgress.result) {
+        $uibModalInstance.dismiss(operationTitle + ' failed! ' + serviceProgress.reason);
+      }
+      console.log('timer finished!');
+    } else if('processing' === serviceProgress.result) {
+      ctrl.dynamic = serviceProgress.progress;
+      ctrl.operation = serviceProgress.operationContent;
+      console.log('timer processing ......');
+    }
+  };
+
+  var timer = $interval(function () {
+    ServiceTemplateService.queryServiceProgress(serviceId, operationId, progressFun);
+  }, 1000);
+
+  timerPromise.then(function () {
+    $interval.cancel(timer);
+    console.log('timer cancel ---- ');
+  },function () {
+    $interval.cancel(timer);
+  });
+}]
 );
diff --git a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/lifecyclemanagement.html b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/lifecyclemanagement.html
index 0f3c5759..37abd51f 100644
--- a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/lifecyclemanagement.html
+++ b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/lifecyclemanagement.html
@@ -17,6 +17,7 @@
 -->
 <div class="templatemo-content-wrapper" ng-controller="lcmCtrl as ctrl" ng-init="ctrl.init()">
   <div class="templatemo-content">
+    <div uib-alert ng-repeat="alert in ctrl.alerts" ng-class="'alert-' + (alert.type || 'warning')"  close="ctrl.closeAlert($index)" dismiss-on-timeout="10000">{{alert.msg}}</div>
     <h1 style="margin-bottom:40px">Life Cycle Manager</h1>
 
     <uib-tabset active="active">
diff --git a/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/progress-dialog.html b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/progress-dialog.html
new file mode 100644
index 00000000..d89fa2be
--- /dev/null
+++ b/usecaseui-lcm/src/main/webapp/app/uui/fusion/scripts/view-models/progress-dialog.html
@@ -0,0 +1,31 @@
+<!--
+
+    Copyright 2016-2017 ZTE Corporation.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+-->
+<div class="modal-header" style="margin-bottom: 15px;">
+  <h4 class="modal-title" id="myModalLabel">
+    <span>{{ctrl.title}}</span>
+  </h4>
+</div>
+
+<div class="modal-body">
+  <h5>{{ctrl.operation}}</h5>
+  <uib-progressbar max="ctrl.max" value="ctrl.dynamic"><span style="color:white; white-space:nowrap;">{{ctrl.dynamic}}%</span></uib-progressbar>
+</div>
+
+<div class="modal-footer">
+
+</div>