From 0f9b2c855548eb2b7d6fa99e1d69c713c494b194 Mon Sep 17 00:00:00 2001
From: Davide Alberani <da@erlug.linux.it>
Date: Sun, 3 Dec 2017 16:34:49 +0100
Subject: [PATCH] fix #194: pagination for user tickets

---
 angular_app/js/controllers.js | 36 ++++++++++++++++++++++++++++++++---
 angular_app/user-edit.html    | 20 ++++++++++---------
 2 files changed, 44 insertions(+), 12 deletions(-)

diff --git a/angular_app/js/controllers.js b/angular_app/js/controllers.js
index a8755a0..dd8f03c 100644
--- a/angular_app/js/controllers.js
+++ b/angular_app/js/controllers.js
@@ -990,14 +990,43 @@ eventManControllers.controller('EventTicketsCtrl', ['$scope', '$state', 'Event',
 );
 
 
-eventManControllers.controller('UsersCtrl', ['$scope', '$rootScope', '$state', '$log', 'User', '$uibModal',
-    function ($scope, $rootScope, $state, $log, User, $uibModal) {
+eventManControllers.controller('UsersCtrl', ['$scope', '$rootScope', '$state', '$log', 'User', '$uibModal', '$filter',
+    function ($scope, $rootScope, $state, $log, User, $uibModal, $filter) {
         $scope.loginData = {};
         $scope.user = {};
+        $scope.user.tickets = [];
         $scope.updateUserInfo = {};
         $scope.users = [];
         $scope.usersOrderProp = 'username';
-        $scope.ticketsOrderProp = 'title';
+        $scope.query = "";
+
+        $scope.userQuery = "";
+        $scope.userCurrentPage = 1;
+        $scope.userItemsPerPage = 10;
+        $scope.userFilteredLength = 0;
+        $scope.userMaxPaginationSize = 10;
+        $scope.userMaxAllPersons = 10;
+        $scope.userShownItems = [];
+
+        $scope.userFilterTickets = function() {
+            var tickets = $scope.user.tickets || [];
+            tickets = $filter('splittedFilter')(tickets, $scope.userQuery);
+            $scope.userFilteredTickets = angular.copy(tickets);
+            $scope.userFilteredLength = $scope.userFilteredTickets.length;
+            tickets = $filter('pagination')(tickets, $scope.userCurrentPage, $scope.userItemsPerPage);
+            $scope.userShownItems = tickets;
+        };
+
+        $scope.$watch('userQuery', function() {
+            if (!$scope.userQuery) {
+                $scope.userCurrentPage = 1;
+            }
+            $scope.userFilterTickets();
+        });
+
+        $scope.$watch('userCurrentPage + userItemsPerPage', function() {
+            $scope.userFilterTickets();
+        });
 
         $scope.confirm_delete = 'Do you really want to delete this user?';
         $rootScope.$on('$translateChangeSuccess', function () {
@@ -1018,6 +1047,7 @@ eventManControllers.controller('UsersCtrl', ['$scope', '$rootScope', '$state', '
             $scope.user = User.get({id: $state.params.id}, function() {
                 $scope.updateUserInfo = $scope.user;
                 $scope.updateUserInfo.isAdmin = $rootScope.hasPermission('admin|all', $scope.updateUserInfo);
+                $scope.userFilterTickets();
             });
         }
 
diff --git a/angular_app/user-edit.html b/angular_app/user-edit.html
index b58364b..4ca1d6f 100644
--- a/angular_app/user-edit.html
+++ b/angular_app/user-edit.html
@@ -36,26 +36,25 @@
             <form class="form-inline">
                 <div class="form-group">
                     <label for="query-tickets">{{'Search:' | translate}}</label>
-                    <input eventman-focus type="text" id="query-tickets" class="form-control" placeholder="{{'Event title' | translate}}" ng-model="query" ng-model-options="{debounce: 350}">
-                </div>
-                <div class="form-group">
-                    <label for="tickets-order">{{'Sort by:' | translate}}</label>
-                    <select id="tickets-order" class="form-control" ng-model="ticketsOrderProp">
-                        <option value="title">{{'Title' | translate}}</option>
-                        <option value="-title">{{'Title (descending)' | translate}}</option>
-                    </select>
+                    <input eventman-focus type="text" id="query-tickets" class="form-control" placeholder="{{'Name' | translate}}" ng-model="userQuery" ng-model-options="{debounce: 350}">
                 </div>
             </form>
+
+            <uib-pagination ng-model="userCurrentPage" total-items="userFilteredLength" items-per-page="userItemsPerPage"
+                        direction-links="false" boundary-links="true" boundary-link-numbers="true" max-size="userMaxPaginationSize">
+            </uib-pagination>
             <table class="table">
                 <thead>
                     <tr>
+                        <th class="text-right nowrap">#</th>
                         <th>{{'Ticket' | translate}}</th>
                         <th>{{'Event' | translate}}</th>
                         <th class="text-center">{{'Attended' | translate}}</th>
                     </tr>
                 </thead>
                 <tbody>
-                    <tr ng-repeat="ticket in (user.tickets || []) | splittedFilter:query | orderBy:ticketsOrderProp">
+                    <tr ng-repeat="ticket in userShownItems">
+                        <td class="text-right">{{$index + 1 + ((userCurrentPage-1)*userItemsPerPage)}}</td>
                         <td>
                             <strong>
                                 <a ui-sref="event.ticket.edit({id: ticket.event_id, ticket_id: ticket._id})">
@@ -73,6 +72,9 @@
                     </tr>
                 </tbody>
             </table>
+            <uib-pagination ng-model="userCurrentPage" total-items="userFilteredLength" items-per-page="userItemsPerPage"
+                        direction-links="false" boundary-links="true" boundary-link-numbers="true" max-size="userMaxPaginationSize">
+            </uib-pagination>
         </div>
     </div>
 </div>