From 584777e21ea80bcc3c5a6c01c5b706f0162c84d6 Mon Sep 17 00:00:00 2001 From: Alex Corey Date: Tue, 3 Sep 2019 16:53:15 -0400 Subject: [PATCH] Adds Tabs to CGs --- .../jobs/routes/instanceGroupJobs.route.js | 68 ++++++++++++- awx/ui/client/legacy/styles/forms.less | 3 - .../lib/components/switch/switch.partial.html | 2 +- .../add-container-group.controller.js | 23 ++++- .../add-container-group.view.html | 19 +++- .../edit-container-group.controller.js | 45 +++++++-- .../instance-groups/instance-group.block.less | 8 ++ .../instance-groups.partial.html | 2 + .../instance-groups.strings.js | 4 +- .../instances/instance-modal.controller.js | 9 +- .../instances/instance-modal.partial.html | 2 +- .../instances/instances-list.partial.html | 2 +- .../instances/instances.controller.js | 67 +++++++++---- ...tanceGroupsJobsListContainer.controller.js | 58 +++++++---- awx/ui/client/src/instance-groups/main.js | 98 +++++++++++++++++-- 15 files changed, 344 insertions(+), 66 deletions(-) diff --git a/awx/ui/client/features/jobs/routes/instanceGroupJobs.route.js b/awx/ui/client/features/jobs/routes/instanceGroupJobs.route.js index c52ad0cd67..269c2c6ea0 100644 --- a/awx/ui/client/features/jobs/routes/instanceGroupJobs.route.js +++ b/awx/ui/client/features/jobs/routes/instanceGroupJobs.route.js @@ -5,7 +5,7 @@ import jobsListController from '../jobsList.controller'; const jobsListTemplate = require('~features/jobs/jobsList.view.html'); const listContainerTemplate = require('~src/instance-groups/jobs/instanceGroupsJobsListContainer.partial.html'); -export default { +const instanceGroupJobsRoute = { name: 'instanceGroups.jobs', url: '/:instance_group_id/jobs', ncyBreadcrumb: { @@ -63,6 +63,70 @@ export default { SearchBasePath: [ '$stateParams', ($stateParams) => `api/v2/instance_groups/${$stateParams.instance_group_id}/jobs` - ] + ], } }; + +const containerGroupJobsRoute = { + name: 'instanceGroups.containerGroupJobs', + url: '/container_groups/:instance_group_id/jobs', + ncyBreadcrumb: { + parent: 'instanceGroups.editContainerGroup', + label: N_('JOBS') + }, + params: { + job_search: { + value: { + page_size: '10', + order_by: '-finished' + }, + dynamic: true + } + }, + views: { + 'instanceGroupsJobsContainer@instanceGroups': { + templateUrl: listContainerTemplate, + controller: listContainerController, + controllerAs: 'vm' + }, + 'jobsList@instanceGroups.containerGroupJobs': { + templateUrl: jobsListTemplate, + controller: jobsListController, + controllerAs: 'vm' + }, + }, + resolve: { + resolvedModels: [ + 'UnifiedJobModel', + (UnifiedJob) => { + const models = [ + new UnifiedJob(['options']), + ]; + return Promise.all(models); + }, + ], + Dataset: [ + '$stateParams', + 'Wait', + 'GetBasePath', + 'QuerySet', + ($stateParams, Wait, GetBasePath, qs) => { + const groupId = $stateParams.instance_group_id; + + const searchParam = $stateParams.job_search; + + const searchPath = `api/v2/instance_groups/${groupId}/jobs`; + + Wait('start'); + return qs.search(searchPath, searchParam) + .finally(() => Wait('stop')); + } + ], + SearchBasePath: [ + '$stateParams', + ($stateParams) => `api/v2/instance_groups/${$stateParams.instance_group_id}/jobs` + ], + } +}; + +export { instanceGroupJobsRoute, containerGroupJobsRoute }; diff --git a/awx/ui/client/legacy/styles/forms.less b/awx/ui/client/legacy/styles/forms.less index cb8e9c726e..f36914df31 100644 --- a/awx/ui/client/legacy/styles/forms.less +++ b/awx/ui/client/legacy/styles/forms.less @@ -209,9 +209,6 @@ width: 100% !important; padding-right: 0px !important; } -.containerGroups-codeMirror{ - margin: 20px; -} .Form-formGroup--checkbox{ display: flex; diff --git a/awx/ui/client/lib/components/switch/switch.partial.html b/awx/ui/client/lib/components/switch/switch.partial.html index 78b2d50a5a..d1f1614767 100644 --- a/awx/ui/client/lib/components/switch/switch.partial.html +++ b/awx/ui/client/lib/components/switch/switch.partial.html @@ -3,4 +3,4 @@ - \ No newline at end of file + diff --git a/awx/ui/client/src/instance-groups/container-groups/add-container-group.controller.js b/awx/ui/client/src/instance-groups/container-groups/add-container-group.controller.js index 094d390071..f23cc223f1 100644 --- a/awx/ui/client/src/instance-groups/container-groups/add-container-group.controller.js +++ b/awx/ui/client/src/instance-groups/container-groups/add-container-group.controller.js @@ -27,9 +27,16 @@ function AddContainerGroupController(ToJSON, $scope, $state, models, strings, i1 vm.form.extraVars = { label: strings.get('container.POD_SPEC_LABEL'), value: DataSet.data.actions.POST.pod_spec_override.default, - name: 'extraVars' + name: 'extraVars', + toggleLabel: strings.get('container.POD_SPEC_TOGGLE'), }; + vm.tab = { + details: { _active: true }, + instances: {_disabled: true }, + jobs: {_disabled: true } +}; + $scope.variables = vm.form.extraVars.value; $scope.name = vm.form.extraVars.name; vm.panelTitle = strings.get('container.PANEL_TITLE'); @@ -41,11 +48,23 @@ function AddContainerGroupController(ToJSON, $scope, $state, models, strings, i1 } }); vm.form.save = (data) => { - data.pod_spec_override = vm.form.extraVars.value; + data.pod_spec_override = null; + if (vm.form.extraVars.isOpen) { + data.pod_spec_override = vm.form.extraVars.value; + } return instanceGroup.request('post', { data: data }).then((res) => { $state.go('instanceGroups.editContainerGroup', { instance_group_id: res.data.id }, { reload: true }); }); }; + vm.form.extraVars.isOpen = false; + vm.toggle = () => { + if (vm.form.extraVars.isOpen === true) { + vm.form.extraVars.isOpen = false; + } else { + vm.form.extraVars.isOpen = true; + } + return vm.form.extraVars.isOpen; + }; } diff --git a/awx/ui/client/src/instance-groups/container-groups/add-container-group.view.html b/awx/ui/client/src/instance-groups/container-groups/add-container-group.view.html index 1d7f779487..758c24aaa1 100644 --- a/awx/ui/client/src/instance-groups/container-groups/add-container-group.view.html +++ b/awx/ui/client/src/instance-groups/container-groups/add-container-group.view.html @@ -1,18 +1,35 @@
+ + {{:: vm.strings.get('tab.DETAILS') }} + {{:: vm.strings.get('tab.INSTANCES') }} + {{:: vm.strings.get('tab.JOBS') }} + +
+ +
+ +
+
diff --git a/awx/ui/client/src/instance-groups/container-groups/edit-container-group.controller.js b/awx/ui/client/src/instance-groups/container-groups/edit-container-group.controller.js index e242f073c4..e6f46b26bd 100644 --- a/awx/ui/client/src/instance-groups/container-groups/edit-container-group.controller.js +++ b/awx/ui/client/src/instance-groups/container-groups/edit-container-group.controller.js @@ -15,7 +15,7 @@ function EditContainerGroupController($rootScope, $scope, $state, models, string $rootScope.breadcrumb.instance_group_name = instanceGroup.get('name'); - vm.mode = 'add'; + vm.mode = 'edit'; vm.strings = strings; vm.panelTitle = EditContainerGroupDataset.data.name; vm.lookUpTitle = strings.get('container.LOOK_UP_TITLE'); @@ -33,30 +33,59 @@ function EditContainerGroupController($rootScope, $scope, $state, models, string vm.form.credential._displayValue = EditContainerGroupDataset.data.summary_fields.credential.name; vm.form.credential.required = true; vm.form.credential._value = EditContainerGroupDataset.data.summary_fields.credential.id; - vm.podSpec = { - type: 'textarea', - id: 'pod_spec' - }; - vm.podSpec.label = strings.get('container.POD_SPEC_LABEL'); + vm.tab = { + details: { + _active: true, + _go: 'instanceGroups.editContainerGroup', + _params: { instance_group_id: instanceGroup.get('id') } + }, + instances: { + _go: 'instanceGroups.containerGroupInstances', + _params: { instance_group_id: instanceGroup.get('id') } + }, + jobs: { + _go: 'instanceGroups.containerGroupJobs', + _params: { instance_group_id: instanceGroup.get('id') } + } +}; vm.form.extraVars = { label: strings.get('container.POD_SPEC_LABEL'), value: EditContainerGroupDataset.data.pod_spec_override, - name: 'extraVars' + name: 'extraVars', + toggleLabel: strings.get('container.POD_SPEC_TOGGLE') }; + if (vm.form.extraVars.value) { + vm.form.extraVars.isOpen = true; + } else { + vm.form.extraVars.isOpen = false; + } + $scope.$watch('credential', () => { if ($scope.credential) { vm.form.credential._idFromModal= $scope.credential; } }); vm.form.save = (data) => { - data.pod_spec_override = vm.form.extraVars.value; + if (vm.form.extraVars.value === '---') { + data.pod_spec_override = null; + } else { + data.pod_spec_override = vm.form.extraVars.value; + } return instanceGroup.request('put', { data: data }).then((res) => { $state.go('instanceGroups.editContainerGroup', { instance_group_id: res.data.id }, { reload: true }); } ); + }; + vm.toggle = () => { + if (vm.form.extraVars.isOpen === true) { + vm.form.extraVars.isOpen = false; + } else { + vm.form.extraVars.isOpen = true; + } + return vm.form.extraVars.isOpen; }; } diff --git a/awx/ui/client/src/instance-groups/instance-group.block.less b/awx/ui/client/src/instance-groups/instance-group.block.less index eedfd05e94..b6ba5c6c38 100644 --- a/awx/ui/client/src/instance-groups/instance-group.block.less +++ b/awx/ui/client/src/instance-groups/instance-group.block.less @@ -78,6 +78,14 @@ color: @at-white; } } + .at-Row-toggle{ + margin-top: 20px; + padding-left: 15px; + } + + .ContainerGroups-codeMirror{ + margin-bottom: 10px; + } } .at-Row-links { justify-content: flex-end; diff --git a/awx/ui/client/src/instance-groups/instance-groups.partial.html b/awx/ui/client/src/instance-groups/instance-groups.partial.html index 7bec7b2624..c9b49020b9 100644 --- a/awx/ui/client/src/instance-groups/instance-groups.partial.html +++ b/awx/ui/client/src/instance-groups/instance-groups.partial.html @@ -4,6 +4,8 @@
+
+
diff --git a/awx/ui/client/src/instance-groups/instance-groups.strings.js b/awx/ui/client/src/instance-groups/instance-groups.strings.js index 2f3d9865ab..4821b72065 100644 --- a/awx/ui/client/src/instance-groups/instance-groups.strings.js +++ b/awx/ui/client/src/instance-groups/instance-groups.strings.js @@ -71,7 +71,9 @@ function InstanceGroupsStrings(BaseString) { LOOK_UP_TITLE: t.s('Add Credential'), CREDENTIAL_PLACEHOLDER: t.s('SELECT A CREDENTIAL'), POD_SPEC_LABEL: t.s('Pod Spec Override'), - BADGE_TEXT: t.s('Container Group') + BADGE_TEXT: t.s('Container Group'), + POD_SPEC_TOGGLE: t.s('Customize Pod Spec') + }; } 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 7ca555d81e..ec92f51cac 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 @@ -1,4 +1,4 @@ -function InstanceModalController ($scope, $state, Dataset, models, strings, ProcessErrors, Wait) { +function InstanceModalController ($scope, $state, Dataset, models, strings, ProcessErrors, Wait, routeData) { const { instanceGroup } = models; const vm = this || {}; let relatedInstanceIds = []; @@ -116,11 +116,11 @@ function InstanceModalController ($scope, $state, Dataset, models, strings, Proc }; vm.onSaveSuccess = () => { - $state.go('instanceGroups.instances', {}, {reload: 'instanceGroups.instances'}); + $state.go(`${routeData}`, {}, {reload: `${routeData}`}); }; vm.dismiss = () => { - $state.go('instanceGroups.instances'); + $state.go(`${routeData}`); }; vm.toggleRow = (row) => { @@ -163,7 +163,8 @@ InstanceModalController.$inject = [ 'resolvedModels', 'InstanceGroupsStrings', 'ProcessErrors', - 'Wait' + 'Wait', + 'routeData' ]; export default InstanceModalController; 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 9b1081b946..1b3f2ac2a3 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 @@ -62,7 +62,7 @@