[mesos] branch master updated: Added consumed quota, allocated, reserved, offered to the roles table.

[bm...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

bmahler pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/mesos.git


The following commit(s) were added to refs/heads/master by this push:
     new eb6ad5c  Added consumed quota, allocated, reserved, offered to the roles table.
eb6ad5c is described below

commit eb6ad5c21b0b85559e582f1f4a166c4dccdcb46e
Author: Benjamin Mahler <bm...@apache.org>
AuthorDate: Thu Jul 11 13:03:49 2019 -0400

    Added consumed quota, allocated, reserved, offered to the roles table.
    
    This adds resource breakdowns on a per role basis to the roles table
    in the webui, each column except for the role name is selectable to
    allow the user to tune the view for their needs.
    
    Review: https://reviews.apache.org/r/71059
---
 src/webui/app/controllers.js   |   9 +++
 src/webui/app/roles/roles.html | 158 +++++++++++++++++++++++++++++------------
 2 files changed, 122 insertions(+), 45 deletions(-)

diff --git a/src/webui/app/controllers.js b/src/webui/app/controllers.js
index 42a9fb6..66cd32e 100644
--- a/src/webui/app/controllers.js
+++ b/src/webui/app/controllers.js
@@ -604,6 +604,15 @@
       update();
     }
 
+    $scope.show_weight = false;
+    $scope.show_framework_count = false;
+    $scope.show_offered = false;
+    $scope.show_allocated = true;
+    $scope.show_reserved = true;
+    $scope.show_quota_consumption = true;
+    $scope.show_quota_guarantee = false;
+    $scope.show_quota_limit = true;
+
     var removeListener = $scope.$on('state_updated', update);
     $scope.$on('$routeChangeStart', removeListener);
   });
diff --git a/src/webui/app/roles/roles.html b/src/webui/app/roles/roles.html
index 45e2a33..b0c57cf 100644
--- a/src/webui/app/roles/roles.html
+++ b/src/webui/app/roles/roles.html
@@ -7,94 +7,162 @@
   </li>
 </ol>
 
+<strong>Columns:</strong>
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_weight">
+Weight
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_framework_count">
+Frameworks
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_offered">
+Offered
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_allocated">
+Allocated
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_reserved">
+Reserved
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_quota_consumption">
+Quota Consumption
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_quota_guarantee">
+Quota Guarantee
+&nbsp
+<input class="form-check-label" type="checkbox" ng-model="show_quota_limit">
+Quota Limit
+
 <table m-table table-content="roles.roles" title="Roles"
   class="table table-striped table-bordered table-condensed">
   <thead>
     <tr>
       <th data-key="name" data-sort class="ascending vertically-center" rowspan="3">Role</th>
-      <th data-key="weight" class="vertically-center" rowspan="3">Weight</th>
-      <th data-key="frameworks.length" class="vertically-center" rowspan="3">Frameworks</th>
-      <th class="group-column" colspan="4" rowspan="2">Allocation + Offered</th>
-      <th class="group-column" colspan="12">Quota</th>
+      <th data-key="weight" class="vertically-center" ng-show="show_weight" rowspan="3">Weight</th>
+      <th data-key="frameworks.length" class="vertically-center" ng-show="show_framework_count" rowspan="3">Frameworks</th>
+      <th class="group-column" ng-show="show_offered" colspan="4" rowspan="2">Offered</th>
+      <th class="group-column" ng-show="show_allocated" colspan="4" rowspan="2">Allocated</th>
+      <th class="group-column" ng-show="show_reserved" colspan="4" rowspan="2">Reserved</th>
+      <th class="group-column" ng-show="show_quota_consumption || show_quota_guarantee || show_quota_limit" colspan="12">Quota</th>
     </tr>
     <tr>
-      <th class="group-column" colspan="4" class="end-group-column">Consumption <span class="glyphicon glyphicon-question-sign" aria-hidden="true" tooltip="Allocated or Reserved"/></th>
-      <th class="group-column" colspan="4" class="end-group-column">Guarantee</th>
-      <th class="group-column" colspan="4" class="end-group-column">Limit</th>
+      <th class="group-column" ng-show="show_quota_consumption" colspan="4" class="end-group-column">Consumption <span class="glyphicon glyphicon-question-sign" aria-hidden="true" tooltip="Allocated or Reserved"/></th>
+      <th class="group-column" ng-show="show_quota_guarantee" colspan="4" class="end-group-column">Guarantee</th>
+      <th class="group-column" ng-show="show_quota_limit" colspan="4" class="end-group-column">Limit</th>
     </tr>
     <tr>
-      <th data-key="resources.cpus" class="begin-group-column">CPU</th>
-      <th data-key="resources.gpus">GPU</th>
-      <th data-key="resources.mem">Mem</th>
-      <th data-key="resources.disk" class="end-group-column">Disk</th>
-      <th data-key="resources.cpus" class="begin-group-column">CPU</th>
-      <th data-key="resources.gpus">GPU</th>
-      <th data-key="resources.mem">Mem</th>
-      <th data-key="resources.disk" class="end-group-column">Disk</th>
-      <th data-key="resources.cpus" class="begin-group-column">CPU</th>
-      <th data-key="resources.gpus">GPU</th>
-      <th data-key="resources.mem">Mem</th>
-      <th data-key="resources.disk" class="end-group-column">Disk</th>
-      <th data-key="resources.cpus" class="begin-group-column">CPU</th>
-      <th data-key="resources.gpus">GPU</th>
-      <th data-key="resources.mem">Mem</th>
-      <th data-key="resources.disk" class="end-group-column">Disk</th>
+      <th ng-show="show_offered" data-key="resources.cpus" class="begin-group-column">CPU</th>
+      <th ng-show="show_offered" data-key="resources.gpus">GPU</th>
+      <th ng-show="show_offered" data-key="resources.mem">Mem</th>
+      <th ng-show="show_offered" data-key="resources.disk" class="end-group-column">Disk</th>
+
+      <th ng-show="show_allocated" data-key="resources.cpus" class="begin-group-column">CPU</th>
+      <th ng-show="show_allocated" data-key="resources.gpus">GPU</th>
+      <th ng-show="show_allocated" data-key="resources.mem">Mem</th>
+      <th ng-show="show_allocated" data-key="resources.disk" class="end-group-column">Disk</th>
+
+      <th ng-show="show_reserved" data-key="resources.cpus" class="begin-group-column">CPU</th>
+      <th ng-show="show_reserved" data-key="resources.gpus">GPU</th>
+      <th ng-show="show_reserved" data-key="resources.mem">Mem</th>
+      <th ng-show="show_reserved" data-key="resources.disk" class="end-group-column">Disk</th>
+
+      <th ng-show="show_quota_consumption" data-key="resources.cpus" class="begin-group-column">CPU</th>
+      <th ng-show="show_quota_consumption" data-key="resources.gpus">GPU</th>
+      <th ng-show="show_quota_consumption" data-key="resources.mem">Mem</th>
+      <th ng-show="show_quota_consumption" data-key="resources.disk" class="end-group-column">Disk</th>
+
+      <th ng-show="show_quota_guarantee" data-key="resources.cpus" class="begin-group-column">CPU</th>
+      <th ng-show="show_quota_guarantee" data-key="resources.gpus">GPU</th>
+      <th ng-show="show_quota_guarantee" data-key="resources.mem">Mem</th>
+      <th ng-show="show_quota_guarantee" data-key="resources.disk" class="end-group-column">Disk</th>
+
+      <th ng-show="show_quota_limit" data-key="resources.cpus" class="begin-group-column">CPU</th>
+      <th ng-show="show_quota_limit" data-key="resources.gpus">GPU</th>
+      <th ng-show="show_quota_limit" data-key="resources.mem">Mem</th>
+      <th ng-show="show_quota_limit" data-key="resources.disk" class="end-group-column">Disk</th>
     </tr>
   </thead>
   <tbody>
     <tr ng-repeat="role in $data">
       <td>{{role.name}}</td>
-      <td>{{role.weight | number}}</td>
-      <td>{{role.frameworks.length | number}}</td>
-      <td class="begin-group-column">
-        {{(role.resources.cpus | decimalFloat) || "-"}}
+      <td ng-show="show_weight">{{role.weight | number}}</td>
+      <td ng-show="show_framework_count">{{role.frameworks.length | number}}</td>
+
+      <td ng-show="show_offered" class="begin-group-column">
+        {{(role.offered.cpus | decimalFloat) || "-"}}
+      </td>
+      <td ng-show="show_offered">
+        {{(role.offered.gpus | decimalFloat) || "-"}}
+      </td>
+      <td ng-show="show_offered">
+        {{((role.offered.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
+      </td>
+      <td ng-show="show_offered" class="end-group-column">
+        {{((role.offered.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
+      </td>
+
+      <td ng-show="show_allocated" class="begin-group-column">
+        {{(role.allocated.cpus | decimalFloat) || "-"}}
+      </td>
+      <td ng-show="show_allocated">
+        {{(role.allocated.gpus | decimalFloat) || "-"}}
+      </td>
+      <td ng-show="show_allocated">
+        {{((role.allocated.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
+      </td>
+      <td ng-show="show_allocated" class="end-group-column">
+        {{((role.allocated.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
+      </td>
+
+      <td ng-show="show_reserved" class="begin-group-column">
+        {{(role.reserved.cpus | decimalFloat) || "-"}}
       </td>
-      <td>
-        {{(role.resources.gpus | decimalFloat) || "-"}}
+      <td ng-show="show_reserved">
+        {{(role.allocated.gpus | decimalFloat) || "-"}}
       </td>
-      <td>
-        {{((role.resources.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
+      <td ng-show="show_reserved">
+        {{((role.allocated.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
-      <td class="end-group-column">
-        {{((role.resources.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
+      <td ng-show="show_reserved" class="end-group-column">
+        {{((role.allocated.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
 
-      <td class="begin-group-column">
+      <td ng-show="show_quota_consumption" class="begin-group-column">
         {{(role.quota.consumed.cpus | decimalFloat) || "-"}}
       </td>
-      <td>
+      <td ng-show="show_quota_consumption">
         {{(role.quota.consumed.gpus | decimalFloat) || "-"}}
       </td>
-      <td>
+      <td ng-show="show_quota_consumption">
         {{((role.quota.consumed.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
-      <td class="end-group-column">
+      <td ng-show="show_quota_consumption" class="end-group-column">
         {{((role.quota.consumed.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
 
-      <td class="begin-group-column">
+      <td ng-show="show_quota_guarantee" class="begin-group-column">
         {{(role.quota.guarantee.cpus | decimalFloat) || "-"}}
       </td>
-      <td>
+      <td ng-show="show_quota_guarantee">
         {{(role.quota.guarantee.gpus | decimalFloat) || "-"}}
       </td>
-      <td>
+      <td ng-show="show_quota_guarantee">
         {{((role.quota.guarantee.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
-      <td class="end-group-column">
+      <td ng-show="show_quota_guarantee" class="end-group-column">
         {{((role.quota.guarantee.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
 
-      <td class="begin-group-column">
+      <td ng-show="show_quota_limit" class="begin-group-column">
         {{(role.quota.limit.cpus | decimalFloat) || "-"}}
       </td>
-      <td>
+      <td ng-show="show_quota_limit">
         {{(role.quota.limit.gpus | decimalFloat) || "-"}}
       </td>
-      <td>
+      <td ng-show="show_quota_limit">
         {{((role.quota.limit.mem * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
-      <td class="end-group-column">
+      <td ng-show="show_quota_limit" class="end-group-column">
         {{((role.quota.limit.disk * (1024 * 1024) || NaN) | dataSize) || "-"}}
       </td>
     </tr>