Просмотр исходного кода

Added pagination to table module

Rashid Khan 13 лет назад
Родитель
Сommit
c72053a0ac
3 измененных файлов с 35 добавлено и 2 удалено
  1. 1 1
      panels/pie/module.js
  2. 27 1
      panels/table/module.html
  3. 7 0
      panels/table/module.js

+ 1 - 1
panels/pie/module.js

@@ -6,7 +6,7 @@ angular.module('kibana.pie', [])
   // Set and populate defaults
   var _d = {
     query   : { field:"_all", query:"*", goal: 1}, 
-    size    : 100,
+    size    : 10,
     exclude : [],
     donut   : false,
     tilt    : false,

+ 27 - 1
panels/table/module.html

@@ -1,5 +1,18 @@
 <kibana-panel ng-controller='table'>
-  <div style="height:{{row.height}};overflow-y:auto;overflow-x:auto"> 
+  <div style="height:{{row.height}};overflow-y:auto;overflow-x:auto">
+    <div class="row-fluid">
+      <div class="span1 offset3" style="text-align:right">
+        <i ng-click="panel.offset = 0;get_data();" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
+        <i ng-click="panel.offset = (panel.offset - panel.size);get_data();" ng-show="panel.offset > 0" class='icon-arrow-left pointer'></i>
+      </div>
+      <div class="span4" style="text-align:center">
+        <strong>{{panel.offset}}</strong> to <strong>{{panel.offset + data.length}}</strong>
+        <small> of &#8805 {{hits}} hits</small>
+      </div>
+      <div class="span1" style="text-align:left">
+        <i ng-click="panel.offset = (panel.offset + panel.size);get_data();" ng-show="hits > (panel.offset + data.length)" class='icon-arrow-right pointer'></i>
+      </div>
+    </div>
     <table class="table table-condensed table-striped" ng-style="panel.style">
       <thead>
         <th style="white-space:nowrap" ng-repeat="field in panel.fields">
@@ -13,5 +26,18 @@
         <td ng-repeat="field in panel.fields">{{row['_source'][field]}}</td>
       </tr>
     </table>
+    <div class="row-fluid">
+      <div class="span1 offset3" style="text-align:right">
+        <i ng-click="panel.offset = 0;get_data();" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
+        <i ng-click="panel.offset = (panel.offset - panel.size);get_data();" ng-show="panel.offset > 0" class='icon-arrow-left pointer'></i>
+      </div>
+      <div class="span4" style="text-align:center">
+        <strong>{{panel.offset}}</strong> to <strong>{{panel.offset + data.length}}</strong>
+        <small> of &#8805 {{hits}} hits</small>
+      </div>
+      <div class="span1" style="text-align:left">
+        <i ng-click="panel.offset = (panel.offset + panel.size);get_data();" ng-show="hits > (panel.offset + data.length)" class='icon-arrow-right pointer'></i>
+      </div>
+    </div>
   </div>
 </kibana-panel>         

+ 7 - 0
panels/table/module.js

@@ -7,6 +7,7 @@ angular.module('kibana.table', [])
   var _d = {
     query   : "*",
     size    : 100,
+    offset  : 0,
     sort    : ['@timestamp','desc'],
     group   : "default",
     style   : {},
@@ -54,6 +55,11 @@ angular.module('kibana.table', [])
     broadcast_fields();
   }
 
+  $scope.page = function(page) {
+    $scope.panel.offset = page*$scope.panel.size
+    $scope.get_data();
+  }
+
   $scope.get_data = function() {
     // Make sure we have everything for the request to complete
     if(_.isUndefined($scope.panel.index) || _.isUndefined($scope.time))
@@ -70,6 +76,7 @@ angular.module('kibana.table', [])
         )
       )
       .size($scope.panel.size)
+      .from($scope.panel.offset)
       .sort($scope.panel.sort[0],$scope.panel.sort[1])
       .doSearch();