github
/
portainer
mirror of https://github.com/portainer/portainer
1
0
Fork 0
Code Issues Releases Wiki Activity

feat(home): pagination on endpoints list (#2981)

pull/2993/head
xAt0mZ 2019-07-04 23:46:59 +02:00 committed by Anthony Lapenna
parent 3d4af7c54f
commit 4084e7c8ec
3 changed files with 30 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/portainer/components/endpoint-list/endpoint-list-controller.js
View File

@ -1,11 +1,12 @@
import _ from 'lodash-es'; import _ from 'lodash-es';
angular.module('portainer.app').controller('EndpointListController', ['DatatableService', angular.module('portainer.app').controller('EndpointListController', ['DatatableService', 'PaginationService',
function EndpointListController(DatatableService) { function EndpointListController(DatatableService, PaginationService) {
var ctrl = this; var ctrl = this;
ctrl.state = { ctrl.state = {
textFilter: '', textFilter: '',
filteredEndpoints: [] filteredEndpoints: [],
paginatedItemLimit: '10'
}; };
ctrl.$onChanges = $onChanges; ctrl.$onChanges = $onChanges;
@ -58,12 +59,17 @@ angular.module('portainer.app').controller('EndpointListController', ['Datatable
}); });
} }
this.changePaginationLimit = function() {
PaginationService.setPaginationLimit(this.tableKey, this.state.paginatedItemLimit);
};
function convertStatusToString(status) { function convertStatusToString(status) {
return status === 1 ? 'up' : 'down'; return status === 1 ? 'up' : 'down';
} }
function $onInit() { function $onInit() {
var textFilter = DatatableService.getDataTableTextFilters(ctrl.tableKey); var textFilter = DatatableService.getDataTableTextFilters(ctrl.tableKey);
this.state.paginatedItemLimit = PaginationService.getPaginationLimit(this.tableKey);
if (textFilter !== null) { if (textFilter !== null) {
ctrl.state.textFilter = textFilter; ctrl.state.textFilter = textFilter;
onTextFilterChange(); onTextFilterChange();

21
app/portainer/components/endpoint-list/endpointList.html
View File

@ -26,7 +26,7 @@
<div class="blocklist"> <div class="blocklist">
<endpoint-item <endpoint-item
ng-repeat="endpoint in $ctrl.state.filteredEndpoints" dir-paginate="endpoint in $ctrl.state.filteredEndpoints | itemsPerPage: $ctrl.state.paginatedItemLimit"
model="endpoint" model="endpoint"
on-select="$ctrl.dashboardAction" on-select="$ctrl.dashboardAction"
on-edit="$ctrl.editAction" on-edit="$ctrl.editAction"
@ -40,6 +40,25 @@
</div> </div>
</div> </div>
<div class="footer" ng-if="$ctrl.endpoints">
<div class="paginationControls">
<form class="form-inline">
<span class="limitSelector">
<span style="margin-right: 5px;">
Items per page
</span>
<select class="form-control" ng-model="$ctrl.state.paginatedItemLimit" ng-change="$ctrl.changePaginationLimit()">
<option value="0">All</option>
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</span>
<dir-pagination-controls max-size="5"></dir-pagination-controls>
</form>
</div>
</div>
</rd-widget-body> </rd-widget-body>
</rd-widget> </rd-widget>
</div> </div>

2
app/portainer/views/home/home.html
View File

@ -28,7 +28,7 @@
<div class="col-sm-12"> <div class="col-sm-12">
<endpoint-list <endpoint-list
title-text="Endpoints" title-icon="fa-plug" title-text="Endpoints" title-icon="fa-plug"
endpoints="endpoints" table-key="endpoints" endpoints="endpoints" table-key="home_endpoints"
dashboard-action="goToDashboard" dashboard-action="goToDashboard"
show-snapshot-action="!applicationState.application.authentication || isAdmin" show-snapshot-action="!applicationState.application.authentication || isAdmin"
snapshot-action="triggerSnapshot" snapshot-action="triggerSnapshot"