Add component-based stdout for host modal

awx/ui/client/features/_index.less

@@ -1,3 +1,3 @@
 @import 'credentials/_index';
-@import 'jobs/_index';
+@import 'output/_index';
 @import 'users/tokens/_index';

awx/ui/client/features/output/index.controller.js

@@ -3,6 +3,7 @@ import hasAnsi from 'has-ansi';
 
 let vm;
 let ansi;
+let jobEvent;
 let $timeout;
 let $sce;
 let $compile;
@@ -26,19 +27,19 @@ const TIME_EVENTS = [
     EVENT_STATS_PLAY
 ];
 
-function JobsIndexController (job, _$sce_, _$timeout_, _$scope_, _$compile_) {
+function JobsIndexController (job, JobEventModel, _$sce_, _$timeout_, _$scope_, _$compile_) {
     $timeout = _$timeout_;
     $sce = _$sce_;
     $compile = _$compile_;
     $scope = _$scope_;
+
     ansi = new Ansi();
+    jobEvent = new JobEventModel();
 
     const events = job.get('related.job_events.results');
     const html = $sce.trustAsHtml(parseEvents(events));
 
-    vm = this || {};
-
-    $scope.ns = 'jobs';
+    vm = this || {}; $scope.ns = 'jobs';
     $scope.jobs = {
         modal: {}
     };
@@ -256,7 +257,17 @@ function getTime (created) {
 }
 
 function showHostDetails (id) {
-    $scope.jobs.modal.show('title', `test${id}`);
+    jobEvent.request('get', id)
+        .then(() => {
+            const title = jobEvent.get('host_name');
+
+            vm.host = {
+                menu: true,
+                stdout: jobEvent.get('stdout')
+            };
+
+            $scope.jobs.modal.show(title);
+        });
 }
 
 function toggle (uuid) {
@@ -280,6 +291,6 @@ function toggle (uuid) {
     }
 }
 
-JobsIndexController.$inject = ['job', '$sce', '$timeout', '$scope', '$compile'];
+JobsIndexController.$inject = ['job', 'JobEventModel', '$sce', '$timeout', '$scope', '$compile'];
 
 module.exports = JobsIndexController;

awx/ui/client/features/output/index.js

@@ -1,3 +1,8 @@
+import JobsStrings from '~features/output/jobs.strings';
+import IndexController from '~features/output/index.controller';
+import atLibModels from '~models';
+import atLibComponents from '~components';
+
 import JobsStrings from '~features/output/jobs.strings';
 import IndexController from '~features/output/index.controller';
 
@@ -24,7 +29,7 @@ function JobsRun ($stateExtender, strings) {
             }
         },
         resolve: {
-            job: ['JobsModel', '$stateParams', (Jobs, $stateParams) => {
+            job: ['JobModel', '$stateParams', (Jobs, $stateParams) => {
                 const { id } = $stateParams;
 
                 return new Jobs('get', id)
@@ -42,7 +47,10 @@ function JobsRun ($stateExtender, strings) {
 JobsRun.$inject = ['$stateExtender', 'JobsStrings'];
 
 angular
-    .module(MODULE_NAME, [])
+    .module(MODULE_NAME, [
+        atLibModels,
+        atLibComponents
+    ])
     .controller('indexController', IndexController)
     .service('JobsStrings', JobsStrings)
     .run(JobsRun);

awx/ui/client/features/output/index.view.html

@@ -1,7 +1,7 @@
 <div class="container-fluid">
     <div class="col-md-4">
         <at-panel>
-            <p>left</p>
+            <p></p>
         </at-panel>
     </div>
 
@@ -31,5 +31,8 @@
         </at-panel>
     </div>
 
-    <at-modal></at-modal>
+    <at-modal>
+        <br />
+        <at-output-stdout state="vm.host"></at-output-stdout>
+    </at-modal>
 </div>