feat(stack): Add the ability to scale services in stack-details (#1776)

app/docker/views/stacks/edit/stack.html

@@ -27,6 +27,7 @@
       nodes="nodes"
       public-url="state.publicURL"
       show-text-filter="true"
+      scale-action="scaleAction"
     ></stack-services-datatable>
   </div>
 </div>

app/docker/views/stacks/edit/stackController.js

@@ -84,5 +84,20 @@ function ($q, $scope, $state, $transition$, StackService, NodeService, ServiceSe
     $scope.stackFileContent = cm.getValue();
   };
 
+  $scope.scaleAction =  function scaleService(service) {
+    var config = ServiceHelper.serviceToConfig(service.Model);
+    config.Mode.Replicated.Replicas = service.Replicas;
+    ServiceService.update(service, config)
+    .then(function success(data) {
+      Notifications.success('Service successfully scaled', 'New replica count: ' + service.Replicas);
+      $state.reload();
+    })
+    .catch(function error(err) {
+      Notifications.error('Failure', err, 'Unable to scale service');
+      service.Scale = false;
+      service.Replicas = service.ReplicaCount;
+    });
+  };
+
   initView();
 }]);

app/portainer/components/datatables/stack-services-datatable/stackServicesDatatable.html

@@ -63,6 +63,16 @@
               <td>
                 {{ item.Mode }}
                 <code>{{ item.Tasks | runningtaskscount }}</code> / <code>{{ item.Mode === 'replicated' ? item.Replicas : ($ctrl.nodes | availablenodecount) }}</code>
+                <span ng-if="item.Mode === 'replicated' && !item.Scale">
+                  <a class="interactive" ng-click="item.Scale = true; item.ReplicaCount = item.Replicas;">
+                    <i class="fa fa-arrows-alt-v" aria-hidden="true"></i> Scale
+                  </a>
+                </span>
+                <span ng-if="item.Mode === 'replicated' && item.Scale">
+                  <input class="input-sm" type="number" ng-model="item.Replicas" on-enter-key="$ctrl.scaleAction(item)" />
+                  <a class="interactive" ng-click="item.Scale = false;"><i class="fa fa-times"></i></a>
+                  <a class="interactive" ng-click="$ctrl.scaleAction(item)"><i class="fa fa-check-square"></i></a>
+                </span>                
               </td>
               <td>
                 <a ng-if="item.Ports && item.Ports.length > 0 && p.PublishedPort" ng-repeat="p in item.Ports" class="image-tag" ng-href="http://{{ $ctrl.publicUrl }}:{{ p.PublishedPort }}" target="_blank">

app/portainer/components/datatables/stack-services-datatable/stackServicesDatatable.js

@@ -9,6 +9,7 @@ angular.module('portainer.app').component('stackServicesDatatable', {
     orderBy: '@',
     reverseOrder: '<',
     nodes: '<',
+    scaleAction: '<',
     publicUrl: '<',
     showTextFilter: '<'
   }