From 21e74fc5eb8d9181a2cf479039084a80041e9678 Mon Sep 17 00:00:00 2001 From: gconsidine Date: Mon, 11 Dec 2017 16:10:29 -0500 Subject: [PATCH] Add click to launch host event detail modal --- awx/ui/client/features/jobs/_index.less | 17 ++++- .../features/output/index.controller.js | 71 +++++++++++++------ awx/ui/client/features/output/index.view.html | 3 + .../lib/components/modal/modal.directive.js | 3 +- 4 files changed, 68 insertions(+), 26 deletions(-) diff --git a/awx/ui/client/features/jobs/_index.less b/awx/ui/client/features/jobs/_index.less index 32ef05dbf7..78e1de6b33 100644 --- a/awx/ui/client/features/jobs/_index.less +++ b/awx/ui/client/features/jobs/_index.less @@ -49,9 +49,13 @@ } &-event { - padding: 0 10px; - word-wrap: break-word; - white-space: pre-wrap; + .at-mixin-event(); + } + + &-event--host { + .at-mixin-event(); + + cursor: pointer; } &-time { @@ -80,3 +84,10 @@ } } } + +.at-mixin-event() { + padding: 0 10px; + word-wrap: break-word; + white-space: pre-wrap; + +} diff --git a/awx/ui/client/features/output/index.controller.js b/awx/ui/client/features/output/index.controller.js index e6976a2ab1..3139c3a6f8 100644 --- a/awx/ui/client/features/output/index.controller.js +++ b/awx/ui/client/features/output/index.controller.js @@ -33,11 +33,19 @@ function JobsIndexController (job, _$sce_, _$timeout_, _$scope_, _$compile_) { $scope = _$scope_; ansi = new Ansi(); - vm = this || {}; const events = job.get('related.job_events.results'); const html = $sce.trustAsHtml(parseEvents(events)); + vm = this || {}; + + $scope.ns = 'jobs'; + $scope.jobs = { + modal: {} + }; + vm.toggle = toggle; + vm.showHostDetails = showHostDetails; + vm.menu = { expand: menuExpand, scrollToBottom: menuScrollToBottom, @@ -64,13 +72,13 @@ function menuExpand () { function menuScrollToBottom () { const container = $('.at-Stdout-container')[0]; - container.scrollTo(0, container.scrollHeight); + container.scrollTop = container.scrollHeight; } function menuScrollToTop () { const container = $('.at-Stdout-container')[0]; - container.scrollTo(0, 0); + container.scrollTop = 0; } function parseEvents (events) { @@ -123,14 +131,20 @@ function createRecord (ln, lines, event) { } const info = { + id: event.id, line: ln + 1, uuid: event.uuid, level: event.event_level, start: event.start_line, end: event.end_line, - isTruncated: (event.end_line - event.start_line) > lines.length + isTruncated: (event.end_line - event.start_line) > lines.length, + isHost: typeof event.host === 'number' }; + if (info.isHost) { + console.log(event); + } + if (event.parent_uuid) { info.parents = getParentEvents(event.parent_uuid); } @@ -147,11 +161,13 @@ function createRecord (ln, lines, event) { } if (event.parent_uuid) { - if (record[event.parent_uuid].children && - !record[event.parent_uuid].children.includes(event.uuid)) { - record[event.parent_uuid].children.push(event.uuid); - } else { - record[event.parent_uuid].children = [event.uuid]; + if (record[event.parent_uuid]) { + if (record[event.parent_uuid].children && + !record[event.parent_uuid].children.includes(event.uuid)) { + record[event.parent_uuid].children.push(event.uuid); + } else { + record[event.parent_uuid].children = [event.uuid]; + } } } } @@ -171,21 +187,21 @@ function getParentEvents (uuid, list) { if (record[uuid]) { list.push(uuid); - } - if (record[uuid].parents) { - list = list.concat(record[uuid].parents); + if (record[uuid].parents) { + list = list.concat(record[uuid].parents); + } } return list; } function createRow (current, ln, content) { - let expand = ''; - let timestamp = ''; - let toggleRow = ''; - let classList = ''; let id = ''; + let timestamp = ''; + let tdToggle = ''; + let tdEvent = ''; + let classList = ''; content = content || ''; @@ -196,8 +212,11 @@ function createRow (current, ln, content) { if (current) { if (current.isParent && current.line === ln) { id = current.uuid; - expand = ''; - toggleRow = `${expand}`; + tdToggle = ``; + } + + if (current.isHost) { + tdEvent = `${content}`; } if (current.time && current.line === ln) { @@ -209,8 +228,12 @@ function createRow (current, ln, content) { } } - if (!toggleRow) { - toggleRow = ''; + if (!tdEvent) { + tdEvent = `${content}`; + } + + if (!tdToggle) { + tdToggle = ''; } if (!ln) { @@ -219,9 +242,9 @@ function createRow (current, ln, content) { return ` - ${toggleRow} + ${tdToggle} ${ln} - ${content} + ${tdEvent} ${timestamp} `; } @@ -232,6 +255,10 @@ function getTime (created) { return `${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`; } +function showHostDetails (id) { + $scope.jobs.modal.show('title', `test${id}`); +} + function toggle (uuid) { const lines = $(`.child-of-${uuid}`); let icon = $(`#${uuid} .at-Stdout-toggle > i`); diff --git a/awx/ui/client/features/output/index.view.html b/awx/ui/client/features/output/index.view.html index 2da5753b03..ba1256c5cc 100644 --- a/awx/ui/client/features/output/index.view.html +++ b/awx/ui/client/features/output/index.view.html @@ -4,6 +4,7 @@

left

+
@@ -29,4 +30,6 @@
+ + diff --git a/awx/ui/client/lib/components/modal/modal.directive.js b/awx/ui/client/lib/components/modal/modal.directive.js index 302ff92a03..f3def99885 100644 --- a/awx/ui/client/lib/components/modal/modal.directive.js +++ b/awx/ui/client/lib/components/modal/modal.directive.js @@ -12,7 +12,7 @@ function atModalLink (scope, el, attrs, controllers) { }); } -function AtModalController (eventService, strings) { +function AtModalController ($timeout, eventService, strings) { const vm = this; let overlay; @@ -58,6 +58,7 @@ function AtModalController (eventService, strings) { } AtModalController.$inject = [ + '$timeout', 'EventService', 'ComponentsStrings' ];