diff --git a/awx/ui/client/features/templates/templates.strings.js b/awx/ui/client/features/templates/templates.strings.js index d3c963b7e4..ffc36b32f0 100644 --- a/awx/ui/client/features/templates/templates.strings.js +++ b/awx/ui/client/features/templates/templates.strings.js @@ -117,7 +117,7 @@ function TemplatesStrings (BaseString) { TOTAL_NODES: t.s('TOTAL NODES'), ADD_A_NODE: t.s('ADD A NODE'), EDIT_TEMPLATE: t.s('EDIT TEMPLATE'), - JOBS: t.s('JOBS'), + JOBS: t.s('Jobs'), PLEASE_CLICK_THE_START_BUTTON: t.s('Please click the start button to build your workflow.'), PLEASE_HOVER_OVER_A_TEMPLATE: t.s('Please hover over a template for additional options.'), EDIT_LINK_TOOLTIP: t.s('Click to edit link'), @@ -144,7 +144,8 @@ function TemplatesStrings (BaseString) { UNSAVED_CHANGES_PROMPT_TEXT: t.s('Are you sure you want to exit the Workflow Creator without saving your changes?'), EXIT: t.s('EXIT'), CANCEL: t.s('CANCEL'), - SAVE_AND_EXIT: t.s('SAVE & EXIT') + SAVE_AND_EXIT: t.s('SAVE & EXIT'), + PAUSE_NODE: t.s('Pause Node') }; } diff --git a/awx/ui/client/legacy/styles/ansible-ui.less b/awx/ui/client/legacy/styles/ansible-ui.less index 90824e43f5..708cc44496 100644 --- a/awx/ui/client/legacy/styles/ansible-ui.less +++ b/awx/ui/client/legacy/styles/ansible-ui.less @@ -1981,11 +1981,6 @@ tr td button i { box-shadow: none !important; } -.select2-container { - margin-left: 2px; - margin-top: 2px; -} - .form-control + .select2-container--disabled .select2-selection { background-color: @ebgrey !important; } diff --git a/awx/ui/client/lib/components/_index.less b/awx/ui/client/lib/components/_index.less index 81dc40c580..ea4da9a9c9 100644 --- a/awx/ui/client/lib/components/_index.less +++ b/awx/ui/client/lib/components/_index.less @@ -1,4 +1,5 @@ @import 'action/_index'; +@import 'approvalsDrawer/_index'; @import 'dialog/_index'; @import 'input/_index'; @import 'launchTemplateButton/_index'; diff --git a/awx/ui/client/lib/components/approvalsDrawer/_index.less b/awx/ui/client/lib/components/approvalsDrawer/_index.less new file mode 100644 index 0000000000..abca0e2166 --- /dev/null +++ b/awx/ui/client/lib/components/approvalsDrawer/_index.less @@ -0,0 +1,56 @@ +.at-ApprovalsDrawer { + position: absolute; + right: 0px; + top: 0; + height: 100%; + width: 540px; + background-color: white; + z-index: 1000000; + animation-duration: 0.5s; + // TODO: fix animation? + // animation-name: slidein; + padding: 20px; + box-shadow: -3px 0px 8px -2px #aaaaaa; + + &-header { + display: flex; + width: 100%; + margin-bottom: 20px; + } + + &-title { + flex: 1 0 auto; + color: #606060; + font-size: 14px; + font-weight: bold; + width: calc(82%); + } + + &-exit { + justify-content: flex-end; + display: flex; + + button { + height: 20px; + font-size: 20px; + color: #D7D7D7; + line-height: 1; + opacity: 1; + } + + button:hover{ + color: @default-icon; + opacity: 1; + } + } +} + +@keyframes slidein { + from { + width: 0px; + } + + to { + width: 540px; + } +} \ No newline at end of file diff --git a/awx/ui/client/lib/components/approvalsDrawer/approvalsDrawer.directive.js b/awx/ui/client/lib/components/approvalsDrawer/approvalsDrawer.directive.js new file mode 100644 index 0000000000..556d216559 --- /dev/null +++ b/awx/ui/client/lib/components/approvalsDrawer/approvalsDrawer.directive.js @@ -0,0 +1,86 @@ +const templateUrl = require('~components/approvalsDrawer/approvalsDrawer.partial.html'); + +function AtApprovalsDrawerController (strings, Rest, GetBasePath, $rootScope) { + const vm = this || {}; + + const toolbarSortDefault = { + label: `${strings.get('sort.CREATED_ASCENDING')}`, + value: 'created' + }; + + vm.toolbarSortValue = toolbarSortDefault; + + // This will probably need to be expanded + vm.toolbarSortOptions = [ + toolbarSortDefault, + { label: `${strings.get('sort.CREATED_DESCENDING')}`, value: '-created' } + ]; + + vm.queryset = { + page_size: 5 + }; + + vm.emptyListReason = strings.get('approvals.NONE'); + + const loadTheList = () => { + Rest.setUrl(`${GetBasePath('workflow_approval')}?page_size=5&order_by=created&status=pending`); + Rest.get() + .then(({ data }) => { + vm.dataset = data; + vm.approvals = data.results; + vm.count = data.count; + $rootScope.pendingApprovalCount = data.count; + vm.listLoaded = true; + }); + }; + + loadTheList(); + + vm.onToolbarSort = (sort) => { + vm.toolbarSortValue = sort; + + // TODO: this... + // const queryParams = Object.assign( + // {}, + // $state.params.user_search, + // paginateQuerySet, + // { order_by: sort.value } + // ); + + // // Update URL with params + // $state.go('.', { + // user_search: queryParams + // }, { notify: false, location: 'replace' }); + + // rather than ^^ we want to just re-load the data based on new params + }; + + vm.approve = (approval) => { + Rest.setUrl(`${GetBasePath('workflow_approval')}${approval.id}/approve`); + Rest.post() + .then(() => loadTheList()); + }; + + vm.deny = (approval) => { + Rest.setUrl(`${GetBasePath('workflow_approval')}${approval.id}/deny`); + Rest.post() + .then(() => loadTheList()); + }; +} + +AtApprovalsDrawerController.$inject = ['ComponentsStrings', 'Rest', 'GetBasePath', '$rootScope']; + +function atApprovalsDrawer () { + return { + restrict: 'E', + transclude: true, + templateUrl, + controller: AtApprovalsDrawerController, + controllerAs: 'vm', + scope: { + closeApprovals: '&' + }, + }; +} + +export default atApprovalsDrawer; diff --git a/awx/ui/client/lib/components/approvalsDrawer/approvalsDrawer.partial.html b/awx/ui/client/lib/components/approvalsDrawer/approvalsDrawer.partial.html new file mode 100644 index 0000000000..55e8a0ab2f --- /dev/null +++ b/awx/ui/client/lib/components/approvalsDrawer/approvalsDrawer.partial.html @@ -0,0 +1,79 @@ +
+