Merge pull request #4570 from sonenko/master

show total in DataTable

src/plugins/table_vis/public/table_vis.html

@@ -9,7 +9,9 @@
       group="tableGroups"
       export-title="vis.title"
       per-page="vis.params.perPage"
-      sort="sort">
+      sort="sort"
+      show-total="vis.params.showTotal"
+      total-func="vis.params.totalFunc">
     </kbn-agg-table-group>
   </div>
 </div>

src/plugins/table_vis/public/table_vis.js

@@ -42,7 +42,9 @@ function TableVisTypeProvider(Private) {
         sort: {
           columnIndex: null,
           direction: null
-        }
+        },
+        showTotal: false,
+        totalFunc: 'sum'
       },
       editor: '<table-vis-params></table-vis-params>'
     },

src/plugins/table_vis/public/table_vis_params.html

@@ -23,3 +23,19 @@
     Calculate metrics for every bucket/level
   </label>
 </div>
+
+<div class="checkbox">
+  <label>
+    <input type="checkbox" ng-model="vis.params.showTotal">
+    Show total
+  </label>
+</div>
+
+<div>
+  <label>Total function</label>
+  <select ng-disabled="!vis.params.showTotal"
+          class="form-control"
+          ng-model="vis.params.totalFunc"
+          ng-options="x for x in totalAggregations">
+  </select>
+</div>

src/plugins/table_vis/public/table_vis_params.js

@@ -8,6 +8,8 @@ uiModules.get('kibana/table_vis')
     restrict: 'E',
     template: tableVisParamsTemplate,
     link: function ($scope) {
+      $scope.totalAggregations = ['sum', 'avg', 'min', 'max', 'count'];
+
       $scope.$watchMulti([
         'vis.params.showPartialRows',
         'vis.params.showMeticsAtAllLevels'

src/ui/public/agg_table/agg_table.html

@@ -3,7 +3,9 @@
   rows="rows"
   columns="formattedColumns"
   per-page="perPage"
-  sort="sort">
+  sort="sort"
+  show-total="showTotal"
+  totalFunc="totalFunc">
 
   <div class="agg-table-controls">
     <small>Export:</small>&nbsp;&nbsp;

src/ui/public/agg_table/agg_table.js

@@ -16,7 +16,9 @@ uiModules
       table: '=',
       perPage: '=?',
       sort: '=?',
-      exportTitle: '=?'
+      exportTitle: '=?',
+      showTotal: '=',
+      totalFunc: '='
     },
     controllerAs: 'aggTable',
     compile: function ($el) {
@@ -93,6 +95,35 @@ uiModules
             formattedColumn.class = 'visualize-table-right';
           }
 
+          const isFieldNumeric = (field && field.type === 'number');
+          const isFirstValueNumeric = _.isNumber(_.get(table, `rows[0][${i}].value`));
+
+          if (isFieldNumeric || isFirstValueNumeric) {
+            function sum(tableRows) {
+              return _.reduce(tableRows, function (prev, curr, n, all) {return prev + curr[i].value; }, 0);
+            }
+
+            switch ($scope.totalFunc) {
+              case 'sum':
+                formattedColumn.total = sum(table.rows);
+                break;
+              case 'avg':
+                formattedColumn.total = sum(table.rows) / table.rows.length;
+                break;
+              case 'min':
+                formattedColumn.total = _.chain(table.rows).map(i).map('value').min().value();
+                break;
+              case 'max':
+                formattedColumn.total = _.chain(table.rows).map(i).map('value').max().value();
+                break;
+              case 'count':
+                formattedColumn.total = table.rows.length;
+                break;
+              default:
+                break;
+            }
+          }
+
           return formattedColumn;
         });
       });

src/ui/public/agg_table/agg_table_group.html

@@ -9,13 +9,21 @@
   <tbody ng-repeat-end>
     <tr>
       <td>
-        <kbn-agg-table-group ng-if="table.tables" group="table" per-page="perPage" sort="sort"></kbn-agg-table-group>
+        <kbn-agg-table-group
+          ng-if="table.tables"
+          group="table"
+          per-page="perPage"
+          sort="sort"
+          show-total="showTotal"
+          total-func="totalFunc"></kbn-agg-table-group>
         <kbn-agg-table
           ng-if="table.rows"
           table="table"
           export-title="exportTitle"
           per-page="perPage"
-          sort="sort">
+          sort="sort"
+          show-total="showTotal"
+          total-func="totalFunc">
         </kbn-agg-table>
       </td>
     </tr>
@@ -33,13 +41,21 @@
   <tbody>
     <tr>
       <td ng-repeat="table in columns">
-        <kbn-agg-table-group ng-if="table.tables" group="table" per-page="perPage" sort="sort"></kbn-agg-table-group>
+        <kbn-agg-table-group
+          ng-if="table.tables"
+          group="table"
+          per-page="perPage"
+          sort="sort"
+          show-total="showTotal"
+          total-func="totalFunc"></kbn-agg-table-group>
         <kbn-agg-table
           ng-if="table.rows"
           table="table"
           export-title="exportTitle"
           per-page="perPage"
-          sort="sort">
+          sort="sort"
+          show-total="showTotal"
+          total-func="totalFunc">
         </kbn-agg-table>
       </td>
     </tr>

src/ui/public/agg_table/agg_table_group.js

@@ -13,7 +13,9 @@ uiModules
       group: '=',
       perPage: '=?',
       sort: '=?',
-      exportTitle: '=?'
+      exportTitle: '=?',
+      showTotal: '=',
+      totalFunc: '='
     },
     compile: function ($el) {
       // Use the compile function from the RecursionHelper,

src/ui/public/paginated_table/paginated_table.html

@@ -27,6 +27,11 @@
         </tr>
       </thead>
       <tbody kbn-rows="page" kbn-rows-min="perPage"></tbody>
+      <tfoot ng-if="showTotal">
+        <tr>
+          <th ng-repeat="col in columns" class="numeric-value">{{col.total | number}}</th>
+        </tr>
+      </tfoot>
     </table>
   </div>
 

src/ui/public/paginated_table/paginated_table.js

@@ -17,7 +17,9 @@ uiModules
       perPage: '=?',
       sortHandler: '=?',
       sort: '=?',
-      showSelector: '=?'
+      showSelector: '=?',
+      showTotal: '=',
+      totalFunc: '='
     },
     controllerAs: 'paginatedTable',
     controller: function ($scope) {