From 3f15966d9dbdd20289e2c97b138142b2f1cfe7d1 Mon Sep 17 00:00:00 2001 From: mabashian Date: Thu, 29 Mar 2018 13:54:22 -0400 Subject: [PATCH] Fixed templates list pagination --- .../templates/list-templates.controller.js | 22 ++++--- .../client/features/templates/list.view.html | 5 +- .../shared/paginate/paginate.controller.js | 64 ++++++++----------- 3 files changed, 40 insertions(+), 51 deletions(-) diff --git a/awx/ui/client/features/templates/list-templates.controller.js b/awx/ui/client/features/templates/list-templates.controller.js index 321c991011..a5f5213cbf 100644 --- a/awx/ui/client/features/templates/list-templates.controller.js +++ b/awx/ui/client/features/templates/list-templates.controller.js @@ -46,17 +46,19 @@ function ListTemplatesController( $scope.canAdd = ($scope.canAddJobTemplate || $scope.canAddWorkflowJobTemplate); // smart-search - const name = 'templates'; - const iterator = 'template'; - const key = 'template_dataset'; - - $scope.list = { iterator, name }; - $scope.collection = { iterator, basePath: 'unified_job_templates' }; - $scope[key] = Dataset.data; - $scope[name] = Dataset.data.results; + $scope.list = { + iterator: 'template', + name: 'templates' + }; + $scope.collection = { + iterator: 'template', + basePath: 'unified_job_templates' + }; + $scope.template_dataset = Dataset.data; + $scope.templates = Dataset.data.results; $scope.$on('updateDataset', (e, dataset) => { - $scope[key] = dataset; - $scope[name] = dataset.results; + $scope.template_dataset = dataset; + $scope.templates = dataset.results; }); vm.isInvalid = (template) => { diff --git a/awx/ui/client/features/templates/list.view.html b/awx/ui/client/features/templates/list.view.html index a6557423ce..ba45081856 100644 --- a/awx/ui/client/features/templates/list.view.html +++ b/awx/ui/client/features/templates/list.view.html @@ -114,11 +114,10 @@ + base-path="unified_job_templates"> diff --git a/awx/ui/client/src/shared/paginate/paginate.controller.js b/awx/ui/client/src/shared/paginate/paginate.controller.js index 38d02b279f..34a3031a0e 100644 --- a/awx/ui/client/src/shared/paginate/paginate.controller.js +++ b/awx/ui/client/src/shared/paginate/paginate.controller.js @@ -5,45 +5,26 @@ export default ['$scope', '$stateParams', '$state', '$filter', 'GetBasePath', 'Q queryset, path; $scope.pageSize = pageSize; - $scope.basePageSize = parseInt(pageSize) === 5 ? 5 : 20; $scope.maxVisiblePages = $scope.maxVisiblePages ? parseInt($scope.maxVisiblePages) : 10; - function init() { - - let updatePaginationVariables = function() { - $scope.pageSize = calcPageSize(); - $scope.current = calcCurrent(); - $scope.last = calcLast(); - $scope.pageRange = calcPageRange($scope.current, $scope.last); - $scope.dataRange = calcDataRange(); - }; - - updatePaginationVariables(); - - $scope.$watch('collection', function(){ - updatePaginationVariables(); - }); - } - $scope.filter = function(id){ let pageSize = Number(id); $('#period-dropdown') .replaceWith(""+id+ "\n"); - if($scope.querySet){ + if ($scope.querySet){ let origQuerySet = _.cloneDeep($scope.querySet); queryset = _.merge(origQuerySet, { page_size: pageSize }); - } - else { + } else { queryset = _.merge($stateParams[`${$scope.iterator}_search`], { page_size: pageSize, page: 1 }); } $scope.toPage(); }; $scope.toPage = function(page) { - if(page === 0 || page > $scope.last) { + if (page === 0 || page > $scope.last) { return; } if (GetBasePath($scope.basePath) || $scope.basePath) { @@ -52,24 +33,23 @@ export default ['$scope', '$stateParams', '$state', '$filter', 'GetBasePath', 'Q let interpolator = $interpolate($scope.basePath); path = interpolator({ $stateParams: $stateParams }); } - if($scope.querySet) { + if ($scope.querySet) { // merging $scope.querySet seems to destroy our initial reference which // kills the two-way binding here. To fix that, clone the queryset first // and merge with that object. let origQuerySet = _.cloneDeep($scope.querySet); queryset = _.merge(origQuerySet, { page: page }); - } - else { + } else { queryset = _.merge($stateParams[`${$scope.iterator}_search`], { page: page }); } - if(!$scope.querySet) { + if (!$scope.querySet) { $state.go('.', { [$scope.iterator + '_search']: queryset }, {notify: false}); } qs.search(path, queryset).then((res) => { - if($scope.querySet) { + if ($scope.querySet) { // Update the query set $scope.querySet = queryset; } @@ -83,10 +63,9 @@ export default ['$scope', '$stateParams', '$state', '$filter', 'GetBasePath', 'Q } function calcCurrent() { - if($scope.querySet) { + if ($scope.querySet) { return parseInt($scope.querySet.page || '1'); - } - else { + } else { return parseInt($stateParams[`${$scope.iterator}_search`].page || '1'); } } @@ -96,23 +75,20 @@ export default ['$scope', '$stateParams', '$state', '$filter', 'GetBasePath', 'Q maxVisiblePages = parseInt($scope.maxVisiblePages), pagesLeft, pagesRight; - if(maxVisiblePages % 2) { + if (maxVisiblePages % 2) { // It's an odd number pagesLeft = (maxVisiblePages - 1) / 2; pagesRight = ((maxVisiblePages - 1) / 2) + 1; - } - else { + } else { // Its an even number pagesLeft = pagesRight = maxVisiblePages / 2; } if (last < maxVisiblePages) { // Don't have enough pages to exceed the max range - just show all of them result = _.range(1, last + 1); - } - else if(current === last) { + } else if (current === last) { result = _.range(last + 1 - maxVisiblePages, last + 1); - } - else { + } else { let topOfRange = current + pagesRight > maxVisiblePages + 1 ? (current + pagesRight < last + 1 ? current + pagesRight : last + 1) : maxVisiblePages + 1; let bottomOfRange = (topOfRange === last + 1) ? last + 1 - maxVisiblePages : (current - pagesLeft > 0 ? current - pagesLeft : 1); result = _.range(bottomOfRange, topOfRange); @@ -137,6 +113,18 @@ export default ['$scope', '$stateParams', '$state', '$filter', 'GetBasePath', 'Q return Number(pageSize) ; } - init(); + let updatePaginationVariables = function() { + $scope.pageSize = calcPageSize(); + $scope.current = calcCurrent(); + $scope.last = calcLast(); + $scope.pageRange = calcPageRange($scope.current, $scope.last); + $scope.dataRange = calcDataRange(); + }; + + updatePaginationVariables(); + + $scope.$watch('collection', function(){ + updatePaginationVariables(); + }); } ];