public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Efficient sort of arbitrary fields in table panel. Sweet

Browse Source
This commit is contained in:
Rashid Khan
2013-03-30 11:20:20 -07:00
parent e793ac4b5f
commit 83684f705f
7 changed files with 95 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
panels/table/module.html
+13 -12
View File
@@ -7,20 +7,21 @@
<div style="height:{{panel.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>
<i ng-click="panel.offset = 0" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
<i ng-click="panel.offset = (panel.offset - panel.size)" 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>
<strong>{{panel.offset}}</strong> to <strong>{{panel.offset + data.slice(panel.offset,panel.offset+panel.size).length}}</strong>
<small> of {{data.length}} available for paging</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>
<i ng-click="panel.offset = (panel.offset + panel.size)" ng-show="data.length > panel.offset+panel.size" class='icon-arrow-right pointer'></i>
</div>
</div>
<div class="small" ng-show="panel.fields.length == 0">No columns configured. You may want to add a <strong>fields panel</strong>, or click the edit button in the top right of this panel to add some columns</div>
<table class="table-hover table table-condensed" ng-style="panel.style">
<thead>
<th></th>
<th style="white-space:nowrap" ng-repeat="field in panel.fields">
<span class="pointer" ng-click="set_sort(field)" ng-show='panel.sortable'>
{{field}}
@@ -29,9 +30,9 @@
<span ng-show='!panel.sortable'>{{field}}</span>
</th>
</thead>
<tbody ng-repeat="row in data" ng-class-odd="'odd'">
<tbody ng-repeat="row in data.slice(panel.offset,panel.offset+panel.size)" ng-class-odd="'odd'">
<tr ng-click="toggle_details(row)">
<td ng-repeat="field in panel.fields">{{row[field]}}</td>
<td>{{$index}}</td><td ng-repeat="field in panel.fields">{{row[field]}}</td>
</tr>
<tr ng-show="row.kibana.details">
<td colspan=1000>
@@ -56,15 +57,15 @@
</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>
<i ng-click="panel.offset = 0" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
<i ng-click="panel.offset = (panel.offset - panel.size)" 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>
<strong>{{panel.offset}}</strong> to <strong>{{panel.offset + data.slice(panel.offset,panel.offset+panel.size).length}}</strong>
<small> of {{data.length}} available for paging</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>
<i ng-click="panel.offset = (panel.offset + panel.size)" ng-show="data.length > panel.offset+panel.size" class='icon-arrow-right pointer'></i>
</div>
</div>
</div>