vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

feat(super-users): paginate user tab

Browse source
This commit is contained in:
EvB 2016-12-20 13:54:31 -05:00
parent a2ac62f5ce
commit d25051a953
2 changed files with 64 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
static/directives/manage-users-tab.html
View file

@ -14,30 +14,40 @@
</span>
</div>
<div class="filter-box" collection="users" filter-model="search" filter-name="Users"></div>
<table class="cor-table">
<div class="co-top-bar">
<span class="co-filter-box">
<span class="page-controls" total-count="orderedUsers.entries.length" current-page="options.page" page-size="usersPerPage"></span>
<input class="form-control" type="text" ng-model="options.filter" placeholder="Filter Users..." style="margin-right: 10px;">
</span>
</div>
<table class="cor-table" ng-if="orderedUsers.entries.length && !isLoading">
<thead>
<td style="width: 24px;"></td>
<td>Username</td>
<td>E-mail address</td>
<td style="width: 24px;"></td>
<td style="width: 24px;"></td>
<td ng-class="tablePredicateClass('username', options.predicate, options.reverse)">
<a ng-click="orderBy('username')">Username</a>
</td>
<td ng-class="tablePredicateClass('email', options.predicate, options.reverse)">
<a ng-click="orderBy('email')">E-mail address</a>
</td>
<td style="width: 24px;"></td>
</thead>
<tr ng-repeat="current_user in (users | filter:search | orderBy:'username')"
<tr ng-repeat="current_user in orderedUsers.entries | slice
:(usersPerPage * options.page)
:(usersPerPage * (options.page + 1))"
class="user-row"
ng-class="current_user.enabled ? 'enabled': 'disabled'">
<td>
<span class="avatar" data="current_user.avatar" size="24"></span>
<span class="avatar" data="current_user.avatar" size="24"></span>
</td>
<td>
<span class="labels">
<span class="label label-success" ng-if="user.username == current_user.username">You</span>
<span class="label label-primary"
ng-if="current_user.super_user">Superuser</span>
<span class="label label-default"
ng-if="!current_user.enabled">Disabled</span>
</span>
<span class="labels">
<span class="label label-success" ng-if="user.username == current_user.username">You</span>
<span class="label label-primary"
ng-if="current_user.super_user">Superuser</span>
<span class="label label-default"
ng-if="!current_user.enabled">Disabled</span>
</span>
{{ current_user.username }}
</td>
<td>

41
static/js/directives/ui/manage-user-tab.js
View file

@ -9,30 +9,61 @@ angular.module('quay').directive('manageUserTab', function () {
transclude: true,
restrict: 'C',
scope: {
'isEnabled': '=isEnabled'
'isEnabled': '=isEnabled'
},
controller: function ($scope, $timeout, $location, $element, ApiService, UserService) {
controller: function ($scope, $timeout, $location, $element, ApiService, UserService, TableService) {
$scope.user = UserService.currentUser();
$scope.users = null;
$scope.orderedUsers = [];
$scope.usersPerPage = 10;
$scope.newUser = {};
$scope.createdUser = null;
$scope.takeOwnershipInfo = null;
$scope.options = {
'predicate': 'username',
'reverse': false,
'filter': null,
'page': 0
};
$scope.showCreateUser = function () {
$scope.createdUser = null;
$('#createUserModal').modal('show');
};
var sortUsers = function() {
if (!$scope.users) {return;}
$scope.orderedUsers = TableService.buildOrderedItems($scope.users, $scope.options,
['username', 'email'], []);
};
var loadUsersInternal = function () {
ApiService.listAllUsers().then(function (resp) {
$scope.users = resp['users'];
sortUsers();
$scope.showInterface = true;
}, function (resp) {
$scope.users = [];
$scope.usersError = ApiService.getErrorMessage(resp);
});
};
$scope.tablePredicateClass = function(name, predicate, reverse) {
if (name != predicate) {
return '';
}
return 'current ' + (reverse ? 'reversed' : '');
};
$scope.orderBy = function(predicate) {
if (predicate == $scope.options.predicate) {
$scope.options.reverse = !$scope.options.reverse;
return;
}
$scope.options.reverse = false;
$scope.options.predicate = predicate;
};
$scope.createUser = function () {
$scope.creatingUser = true;
$scope.createdUser = null;
@ -224,6 +255,10 @@ angular.module('quay').directive('manageUserTab', function () {
loadUsersInternal();
}
});
$scope.$watch('options.predicate', sortUsers);
$scope.$watch('options.reverse', sortUsers);
$scope.$watch('options.filter', sortUsers);
}
};
return directiveDefinitionObject;