diff --git a/awx/ui/client/lib/components/list/row-item.directive.js b/awx/ui/client/lib/components/list/row-item.directive.js index b28b661581..b7e9abb7ad 100644 --- a/awx/ui/client/lib/components/list/row-item.directive.js +++ b/awx/ui/client/lib/components/list/row-item.directive.js @@ -18,7 +18,6 @@ function atRowItem () { statusTip: '@', statusClick: '&?', labelValue: '@', - labelLink: '@', labelState: '@', value: '@', valueLink: '@', diff --git a/awx/ui/client/lib/components/list/row-item.partial.html b/awx/ui/client/lib/components/list/row-item.partial.html index 17f1e3b5d9..788724ce43 100644 --- a/awx/ui/client/lib/components/list/row-item.partial.html +++ b/awx/ui/client/lib/components/list/row-item.partial.html @@ -32,9 +32,6 @@
{{ secondaryTag }}
-
- {{ labelValue }} -
{{ labelValue }}
diff --git a/awx/ui/client/src/instance-groups/instances/instance-modal.controller.js b/awx/ui/client/src/instance-groups/instances/instance-modal.controller.js index bdb2f1cbe8..474e3712bf 100644 --- a/awx/ui/client/src/instance-groups/instances/instance-modal.controller.js +++ b/awx/ui/client/src/instance-groups/instances/instance-modal.controller.js @@ -2,6 +2,7 @@ function InstanceModalController ($scope, $state, Dataset, models, strings, Proc const { instanceGroup } = models; const vm = this || {}; let relatedInstanceIds = []; + let paginateQuerySet = {}; function setRelatedInstances () { vm.relatedInstances = instanceGroup.get('related.instances.results'); @@ -21,11 +22,9 @@ function InstanceModalController ($scope, $state, Dataset, models, strings, Proc vm.instanceGroupId = instanceGroup.get('id'); vm.instanceGroupName = instanceGroup.get('name'); - vm.querySet = $state.params.instance_search; - vm.list = { name: 'instances', - iterator: 'instance', + iterator: 'add_instance', basePath: `/api/v2/instances/` }; @@ -33,14 +32,51 @@ function InstanceModalController ($scope, $state, Dataset, models, strings, Proc vm.instance_dataset = Dataset.data; setRelatedInstances(); - - $scope.$watch('vm.instances', function() { - angular.forEach(vm.instances, function(instance) { - instance.isSelected = _.filter(vm.selectedRows, { 'id': instance.id }).length > 0; - }); - }); } + const toolbarSortDefault = { + label: `${strings.get('sort.NAME_ASCENDING')}`, + value: 'hostname' + }; + + vm.toolbarSortValue = toolbarSortDefault; + vm.toolbarSortOptions = [ + toolbarSortDefault, + { + label: `${strings.get('sort.NAME_DESCENDING')}`, + value: '-hostname' + } + ]; + + const removeStateParamsListener = $scope.$watchCollection('$state.params', () => { + setToolbarSort(); + }); + + function setToolbarSort () { + const orderByValue = _.get($state.params, 'add_instance_search.order_by'); + const sortValue = _.find(vm.toolbarSortOptions, (option) => option.value === orderByValue); + if (sortValue) { + vm.toolbarSortValue = sortValue; + } else { + vm.toolbarSortValue = toolbarSortDefault; + } + } + + vm.onToolbarSort = (sort) => { + vm.toolbarSortValue = sort; + + const queryParams = Object.assign( + {}, + $state.params.add_instance_search, + paginateQuerySet, + { order_by: sort.value } + ); + + $state.go('.', { + add_instance_search: queryParams + }, { notify: false, location: 'replace' }); + }; + vm.submit = () => { Wait('start'); const selectedRowIds = vm.selectedRows.map(instance => instance.id); @@ -97,8 +133,22 @@ function InstanceModalController ($scope, $state, Dataset, models, strings, Proc row.isSelected = true; vm.selectedRows.push(row); } - }; + + const removeUpdateDatasetListener = $scope.$on('updateDataset', (e, dataset, queryset) => { + vm.instances = dataset.results; + vm.instance_dataset = dataset; + paginateQuerySet = queryset; + + angular.forEach(vm.instances, function(instance) { + instance.isSelected = _.filter(vm.selectedRows, { 'id': instance.id }).length > 0; + }); + }); + + $scope.$on('$destroy', function() { + removeUpdateDatasetListener(); + removeStateParamsListener(); + }); } InstanceModalController.$inject = [ diff --git a/awx/ui/client/src/instance-groups/instances/instance-modal.partial.html b/awx/ui/client/src/instance-groups/instances/instance-modal.partial.html index 54f2e42ed8..9b1081b946 100644 --- a/awx/ui/client/src/instance-groups/instances/instance-modal.partial.html +++ b/awx/ui/client/src/instance-groups/instances/instance-modal.partial.html @@ -18,16 +18,21 @@ class="at-List-search" django-model="instances" base-path="{{vm.list.basePath}}" - iterator="instance" + iterator="add_instance" list="vm.list" collection="vm.instances" dataset="vm.instance_dataset" search-tags="vm.searchTags" - default-params="vm.querySet" - query-set="vm.querySet" search-bar-full-width="true"> + + @@ -51,9 +56,8 @@ + iterator="add_instance" + base-path="{{vm.list.basePath}}">
diff --git a/awx/ui/client/src/instance-groups/instances/instances.controller.js b/awx/ui/client/src/instance-groups/instances/instances.controller.js index 2db2eb6fc4..329ee1ad19 100644 --- a/awx/ui/client/src/instance-groups/instances/instances.controller.js +++ b/awx/ui/client/src/instance-groups/instances/instances.controller.js @@ -1,4 +1,4 @@ -function InstancesController ($scope, $state, $http, models, strings, Dataset, ProcessErrors) { +function InstancesController ($scope, $state, $http, $transitions, models, strings, Dataset, ProcessErrors) { const { instanceGroup } = models; const vm = this || {}; let paginateQuerySet = {}; @@ -21,6 +21,7 @@ function InstancesController ($scope, $state, $http, models, strings, Dataset, P value: 'hostname' }; + vm.toolbarSortValue = toolbarSortDefault; vm.toolbarSortOptions = [ toolbarSortDefault, { @@ -29,9 +30,7 @@ function InstancesController ($scope, $state, $http, models, strings, Dataset, P } ]; - vm.toolbarSortValue = toolbarSortDefault; - - $scope.$watchCollection('$state.params', () => { + const removeStateParamsListener = $scope.$watchCollection('$state.params', () => { setToolbarSort(); }); @@ -124,17 +123,32 @@ function InstancesController ($scope, $state, $http, models, strings, Dataset, P return id === selected; }; - $scope.$on('updateDataset', (e, dataset, queryset) => { + const removeUpdateDatasetListener = $scope.$on('updateDataset', (e, dataset, queryset) => { vm.instances = dataset.results; vm.instance_dataset = dataset; paginateQuerySet = queryset; }); + + const removeStateChangeListener = $transitions.onSuccess({}, function(trans) { + if (trans.to().name === 'instanceGroups.instances.modal.add') { + removeUpdateDatasetListener(); + removeStateChangeListener(); + removeStateParamsListener(); + } + }); + + $scope.$on('$destroy', function() { + removeUpdateDatasetListener(); + removeStateChangeListener(); + removeStateParamsListener(); + }); } InstancesController.$inject = [ '$scope', '$state', '$http', + '$transitions', 'resolvedModels', 'InstanceGroupsStrings', 'Dataset', diff --git a/awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html b/awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html index d239a7124d..962d406a7b 100644 --- a/awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html +++ b/awx/ui/client/src/instance-groups/list/instance-groups-list.partial.html @@ -51,7 +51,7 @@
diff --git a/awx/ui/client/src/instance-groups/main.js b/awx/ui/client/src/instance-groups/main.js index 9c8328aea8..ea822235f1 100644 --- a/awx/ui/client/src/instance-groups/main.js +++ b/awx/ui/client/src/instance-groups/main.js @@ -183,6 +183,7 @@ function InstanceGroupsRun ($stateExtender, strings) { $stateExtender.addState({ name: 'instanceGroups.instances', url: '/:instance_group_id/instances', + searchPrefix: 'instance', ncyBreadcrumb: { parent: 'instanceGroups.edit', label: strings.get('state.INSTANCES_BREADCRUMB_LABEL') @@ -230,11 +231,13 @@ function InstanceGroupsRun ($stateExtender, strings) { $stateExtender.addState({ name: 'instanceGroups.instances.modal.add', + url: '/add', ncyBreadcrumb: { skip: true, }, + searchPrefix: 'add_instance', params: { - instance_search: { + add_instance_search: { value: { page_size: '10', order_by: 'hostname' @@ -254,7 +257,7 @@ function InstanceGroupsRun ($stateExtender, strings) { Dataset: ['GetBasePath', 'QuerySet', '$stateParams', function(GetBasePath, qs, $stateParams) { let path = `${GetBasePath('instances')}`; - return qs.search(path, $stateParams[`instance_search`]); + return qs.search(path, $stateParams[`add_instance_search`]); } ] }