shaba/awx
1
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2024-11-02 09:51:09 +03:00
Code Releases Activity

Fixed styling on Job Events page to give the Event column more room. Added monospacing and nowrap to txt fields.Shotened Created On and Status columns. Centered Status column. Fixed Actions column so that columnClass directive works.

Browse Source
This commit is contained in:
Chris Houseknecht 2014-02-04 21:26:58 +00:00
parent 00156a5518
commit d08319100d
3 changed files with 179 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
awx/ui/static/js/controllers/JobEvents.js
View File

@ -10,7 +10,7 @@
'use strict';
function JobEventsList ($scope, $rootScope, $location, $log, $routeParams, Rest, Alert, JobEventList,
function JobEventsList ($filter, $scope, $rootScope, $location, $log, $routeParams, Rest, Alert, JobEventList,
GenerateList, LoadBreadCrumbs, Prompt, SearchInit, PaginateInit, ReturnToCaller,
ClearScope, ProcessErrors, GetBasePath, LookUpInit, ToggleChildren,
FormatDate, EventView, Refresh, Wait)
@ -96,7 +96,7 @@ function JobEventsList ($scope, $rootScope, $location, $log, $routeParams, Rest,
if (txt !== '') {
html += "<div class=\"form-group\">\n";
html += "<label>Results:</label>\n";
html += "<textarea readonly class=\"form-control nowrap\" rows=\"" + rows + "\">" + txt + "</textarea>\n";
html += "<textarea readonly class=\"form-control nowrap mono-space\" rows=\"" + rows + "\">" + txt + "</textarea>\n";
html += "</div>\n";
found = true;
}
@ -104,7 +104,7 @@ function JobEventsList ($scope, $rootScope, $location, $log, $routeParams, Rest,
if (fld == "rc" && eventData.res[fld] != '') {
html += "<div class=\"form-group\">\n";
html += "<label>Return Code:</label>\n";
html += "<input type=\"text\" class=\"form-control\" value=\"" + eventData.res[fld] + "\" readonly >\n";
html += "<input type=\"text\" class=\"form-control nowrap mono-space\" value=\"" + eventData.res[fld] + "\" readonly >\n";
html += "</div>\n";
found = true;
}
@ -178,8 +178,9 @@ function JobEventsList ($scope, $rootScope, $location, $log, $routeParams, Rest,
scope.jobevents[i].statusBadgeToolTip = "No errors occurred. Click to view details";
}
}
cDate = new Date(set[i].created);
set[i].created = FormatDate(cDate);
//cDate = new Date(set[i].created);
//set[i].created = FormatDate(cDate);
set[i].created = $filter('date')(set[i].created, 'MM/dd HH:mm:ss');
}
// Need below lookup to get inventory_id, which is not on event record. Plus, good idea to get status and name
@ -233,7 +234,7 @@ function JobEventsList ($scope, $rootScope, $location, $log, $routeParams, Rest,
}
}
JobEventsList.$inject = [ '$scope', '$rootScope', '$location', '$log', '$routeParams', 'Rest', 'Alert', 'JobEventList',
JobEventsList.$inject = [ '$filter', '$scope', '$rootScope', '$location', '$log', '$routeParams', 'Rest', 'Alert', 'JobEventList',
'GenerateList', 'LoadBreadCrumbs', 'Prompt', 'SearchInit', 'PaginateInit', 'ReturnToCaller', 'ClearScope',
'ProcessErrors','GetBasePath', 'LookUpInit', 'ToggleChildren', 'FormatDate', 'EventView', 'Refresh', 'Wait'
];

47
awx/ui/static/js/lists/JobEvents.js
View File

@ -16,23 +16,23 @@ angular.module('JobEventsListDefinition', [])
index: false,
hover: true,
hasChildren: true,
filterBy: '\{ show: true \}',
filterBy: '{ show: true }',
navigationLinks: {
details: {
href: "/#/jobs/{{ job_id }}",
href: '/#/jobs/{{ job_id }}',
label: 'Status',
icon: 'icon-zoom-in',
ngShow: "job_id !== null"
ngShow: 'job_id !== null'
},
events: {
href: "/#/jobs/{{ job_id }}/job_events",
href: '/#/jobs/{{ job_id }}/job_events',
label: 'Events',
active: true,
icon: 'icon-list-ul'
},
hosts: {
href: "/#/jobs/{{ job_id }}/job_host_summaries",
href: '/#/jobs/{{ job_id }}/job_host_summaries',
label: 'Host Summary',
icon: 'icon-laptop'
}
@ -41,6 +41,7 @@ angular.module('JobEventsListDefinition', [])
fields: {
created: {
label: 'Created On',
columnClass: 'col-lg-1 col-md-1 hidden-sm hidden-xs',
key: true,
nosort: true,
searchable: false,
@ -48,55 +49,59 @@ angular.module('JobEventsListDefinition', [])
},
status: {
label: 'Status',
showValue: true,
showValue: false,
columnClass: 'col-sm-1 col-xs-2 text-center',
searchField: 'failed',
searchType: 'boolean',
searchOptions: [{ name: "success", value: 0 }, { name: "error", value: 1 }],
searchOptions: [{ name: 'success', value: 0 }, { name: 'error', value: 1 }],
nosort: true,
searchable: false,
ngClick: "viewJobEvent(\{\{ jobevent.id \}\})",
awToolTip: "\{\{ jobevent.statusBadgeToolTip \}\}",
ngClick: 'viewJobEvent({{ jobevent.id }})',
awToolTip: '{{ jobevent.statusBadgeToolTip }}',
dataPlacement: 'top',
badgeIcon: 'fa icon-job-\{\{ jobevent.status \}\}',
badgeIcon: 'fa icon-job-{{ jobevent.status }}',
badgePlacement: 'left',
badgeToolTip: "\{\{ jobevent.statusBadgeToolTip \}\}",
badgeToolTip: '{{ jobevent.statusBadgeToolTip }}',
badgeTipPlacement: 'top',
badgeNgClick: "viewJobEvent(\{\{ jobevent.id \}\})"
badgeNgClick: 'viewJobEvent({{ jobevent.id }})'
},
event_display: {
label: 'Event',
hasChildren: true,
ngClick: "toggleChildren(\{\{ jobevent.id \}\}, '\{\{ jobevent.related.children \}\}')",
ngClick: 'toggleChildren({{ jobevent.id }}, \'{{ jobevent.related.children }}\')',
nosort: true,
searchable: false,
ngClass: '\{\{ jobevent.class \}\}',
appendHTML: 'jobevent.event_detail',
'columnClass': 'col-lg-4'
ngClass: '{{ jobevent.class }}',
appendHTML: 'jobevent.event_detail'
},
host: {
label: 'Host',
ngBind: 'jobevent.summary_fields.host.name',
ngHref: "\{\{ jobevent.hostLink \}\}",
ngHref: '{{ jobevent.hostLink }}',
searchField: 'hosts__name',
nosort: true,
searchOnly: false,
id: 'job-event-host-header',
columnClass: 'col-lg-3 hidden-sm hidden-xs'
'class': 'break',
columnClass: 'col-lg-2 hidden-sm hidden-xs'
}
},
actions: {
refresh: {
mode: 'all',
awToolTip: "Refresh the page",
ngClick: "refresh()"
awToolTip: 'Refresh the page',
ngClick: 'refresh()'
}
},
fieldActions: {
columnClass: 'col-sm-1 col-xs-2',
view: {
label: 'View',
ngClick: "viewJobEvent(\{\{ jobevent.id \}\})",
ngClick: 'viewJobEvent({{ jobevent.id }})',
awToolTip: 'View event details',
dataPlacement: 'top'
}

35
awx/ui/static/lib/ansible/list-generator.js
View File

@ -25,7 +25,7 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
icon: Icon,
has: function(key) {
return (this.form[key] && this.form[key] != null && this.form[key] != undefined) ? true : false;
return (this.form[key] && this.form[key] !== null && this.form[key] !== undefined) ? true : false;
},
hide: function() {
@ -47,14 +47,16 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
// Inject into a custom element using options.id: <'.selector'>
// Control breadcrumb creation with options.breadCrumbs: <true | false>
//
if (options.mode == 'lookup') {
var element = angular.element(document.getElementById('lookup-modal-body'));
var element;
if (options.mode === 'lookup') {
element = angular.element(document.getElementById('lookup-modal-body'));
}
else if (options.id) {
var element = angular.element(document.getElementById(options.id));
element = angular.element(document.getElementById(options.id));
}
else {
var element = angular.element(document.getElementById('htmlTemplate'));
element = angular.element(document.getElementById('htmlTemplate'));
}
this.setList(list);
element.html(this.build(options)); // Inject the html
@ -96,7 +98,7 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
//ignore any errors should the dialog not be initialized
}
if (options.mode == 'lookup') {
if (options.mode === 'lookup') {
// options should include {hdr: <dialog header>, action: <function...> }
this.scope.formModalActionDisabled = false;
this.scope.lookupHeader = options.hdr;
@ -332,11 +334,15 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
// Row level actions
html += "<td class=\"actions\">";
for (action in list.fieldActions) {
if (list.fieldActions[action].type && list.fieldActions[action].type == 'DropDown') {
var field_action, fAction, itm;
for (field_action in list.fieldActions) {
if (field_action !== 'columnClass') {
if (list.fieldActions[field_action].type && list.fieldActions[field_action].type == 'DropDown') {
html += DropDown({
list: list,
fld: action,
fld: field_action,
options: options,
base: base,
type: 'fieldActions',
@ -344,15 +350,15 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
});
}
else {
var fAction = list.fieldActions[action];
fAction = list.fieldActions[field_action];
html += "<a ";
html += (fAction.href) ? "href=\"" + fAction.href + "\" " : "";
html += (fAction.ngHref) ? "ng-href=\"" + fAction.ngHref + "\" " : "";
html += (action == 'cancel') ? "class=\"cancel red-txt\" " : "";
html += (field_action == 'cancel') ? "class=\"cancel red-txt\" " : "";
html += (fAction.awPopOver) ? "aw-pop-over=\"" + fAction.awPopOver + "\" " : "";
html += (fAction.dataPlacement) ? Attr(fAction, 'dataPlacement') : "";
html += (fAction.dataTitle) ? Attr(fAction, 'dataTitle') : "";
for (var itm in fAction) {
for (itm in fAction) {
if (itm != 'ngHref' && itm != 'href' && itm != 'label' && itm != 'icon' && itm != 'class' &&
itm != 'iconClass' && itm != "dataPlacement" && itm != "awPopOver" && itm != "dataTitle") {
html += Attr(fAction, itm);
@ -363,12 +369,13 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
html += "<i class=\"" + fAction.iconClass + "\"></i>";
}
else {
html += SelectIcon({ action: action });
html += SelectIcon({ action: field_action });
}
html += (fAction.label) ? " " + list.fieldActions[action]['label'] : "";
html += (fAction.label) ? " " + list.fieldActions[field_action]['label'] : "";
html += "</a>";
}
}
}
html += "</td>";
}
html += "</tr>\n";