[UI] Org Admin permissions for Instance Groups

awx/ui/client/src/instance-groups/capacity-adjuster/capacity-adjuster.directive.js

@@ -1,7 +1,8 @@
 function CapacityAdjuster (templateUrl, ProcessErrors, Wait) {
     return {
         scope: {
-            state: '='
+            state: '=',
+            disabled: '@'
         },
         templateUrl: templateUrl('instance-groups/capacity-adjuster/capacity-adjuster'),
         restrict: 'E',
@@ -17,7 +18,6 @@ function CapacityAdjuster (templateUrl, ProcessErrors, Wait) {
 
             scope.min_capacity = _.min(adjustment_values, 'value');
             scope.max_capacity = _.max(adjustment_values, 'value');
-
         },
         controller: function($http) {
             const vm = this || {};

awx/ui/client/src/instance-groups/capacity-adjuster/capacity-adjuster.partial.html

@@ -8,6 +8,7 @@
             min="0"
             max="1"
             step="0.1"
+            ng-disabled="{{disabled}}"
             ng-change="vm.slide(state)"/>
         <p>{{max_capacity.label}} {{max_capacity.value}}</p>
     </div>

awx/ui/client/src/instance-groups/instances/instances-list.partial.html

@@ -27,6 +27,7 @@
                     type="button"
                     ng-click="$state.go('instanceGroups.instances.modal.add')"
                     class="at-Button--add"
+                    ng-show="vm.isSuperuser"
                     aria-expanded="false">
                 </button>
                 <div ui-view="modal"></div>
@@ -37,15 +38,18 @@
                 ng-class="{'at-Row--active': (instance.id === vm.activeId)}">
                 <div class="at-Row-toggle">
                     <div class="ScheduleToggle"
-                        ng-class="{'is-on': instance.enabled}">
+                        ng-class="{'is-on': instance.enabled,
+                            'ScheduleToggle--disabled': vm.rowAction.toggle._disabled}">
                         <button ng-show="instance.enabled"
                             class="ScheduleToggle-switch is-on ng-hide"
-                            ng-click="vm.toggle(instance)">
+                            ng-click="vm.toggle(instance)"
+                            ng-disabled="vm.rowAction.toggle._disabled">
                             {{:: vm.strings.get('ON') }}
                         </button>
                         <button ng-show="!instance.enabled"
                             class="ScheduleToggle-switch"
-                            ng-click="vm.toggle(instance)">
+                            ng-click="vm.toggle(instance)"
+                            ng-disabled="vm.rowAction.toggle._disabled">
                             {{:: vm.strings.get('OFF') }}
                         </button>
                     </div>
@@ -63,7 +67,7 @@
                 </div>
 
                 <div class="at-Row-actions">
-                    <capacity-adjuster state="instance"></capacity-adjuster>
+                    <capacity-adjuster state="instance" disabled="{{vm.rowAction.capacity_adjustment._disabled}}"></capacity-adjuster>
                     <capacity-bar label-value="Used Capacity" capacity="instance.consumed_capacity" total-capacity="instance.capacity"></capacity-bar>
                 </div>
             </at-row>

awx/ui/client/src/instance-groups/instances/instances.controller.js

@@ -5,6 +5,7 @@ function InstancesController ($scope, $state, $http, models, Instance, strings,
     vm.panelTitle = instanceGroup.get('name');
     vm.instances = instanceGroup.get('related.instances.results');
     vm.instance_group_id = instanceGroup.get('id');
+    vm.isSuperuser = $scope.$root.user_is_superuser;
 
     init();
 
@@ -47,6 +48,15 @@ function InstancesController ($scope, $state, $http, models, Instance, strings,
         }
     };
 
+    vm.rowAction = {
+        toggle: {
+            _disabled: !vm.isSuperuser
+        },
+        capacity_adjustment: {
+            _disabled: !vm.isSuperuser
+        }
+    };
+
     vm.toggle = (toggled) => {
         const instance = _.find(vm.instances, 'id', toggled.id);
         instance.enabled = !instance.enabled;

awx/ui/client/src/instance-groups/list/instance-groups-list.controller.js

@@ -4,6 +4,7 @@ export default ['$scope', '$filter', '$state', 'Alert', 'resolvedModels', 'Datas
         const { instanceGroup } = resolvedModels;
 
         vm.strings = strings;
+        vm.isSuperuser = $scope.$root.user_is_superuser;
 
         init();
 
@@ -32,6 +33,12 @@ export default ['$scope', '$filter', '$state', 'Alert', 'resolvedModels', 'Datas
             vm.activeId = parseInt($state.params.instance_group_id);
         });
 
+        vm.rowAction = {
+            trash: instance_group => {
+                return vm.isSuperuser && instance_group.name !== 'tower';
+            }
+        };
+
         vm.deleteInstanceGroup = instance_group => {
             if (!instance_group) {
                 Alert(strings.get('error.DELETE'), strings.get('alert.MISSING_PARAMETER'));

awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html

@@ -23,6 +23,7 @@
                     type="button"
                     ui-sref="instanceGroups.add"
                     class="at-Button--add"
+                    ng-show="vm.isSuperuser"
                     aria-haspopup="true"
                     aria-expanded="false">
                 </button>
@@ -60,7 +61,7 @@
 
                 <div class="at-Row-actions">
                     <capacity-bar label-value="Used Capacity" capacity="instance_group.consumed_capacity" total-capacity="instance_group.capacity"></capacity-bar>
-                    <at-row-action icon="fa-trash" ng-click="vm.deleteInstanceGroup(instance_group)" ng-if="instance_group.name !== 'tower'">
+                    <at-row-action icon="fa-trash" ng-click="vm.deleteInstanceGroup(instance_group)" ng-if="vm.rowAction.trash(instance_group)">
                     </at-row-action>
                 </div>
             </at-row>

awx/ui/client/src/scheduler/scheduleToggle.block.less

@@ -20,7 +20,8 @@
 
     &.ScheduleToggle--disabled  {
         cursor: not-allowed;
-        border-color: @default-link !important;
+        background-color: none;
+        border-color: @d7grey !important;
         .ScheduleToggle-switch  {
             background-color: @d7grey !important;
             cursor: not-allowed;