External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-04 18:21:03 -03:30
Code Issues Packages Projects Releases Wiki Activity

Applied list search widget changes (dropdown, boolean, int, etc) to related sets search widget. Fixed desc sort order and desc sort icon display for related set page load. Added job status with icon and color styling to Job Templates related jobs.

Browse Source
This commit is contained in:
chouseknecht
2013-06-12 14:57:39 -04:00
parent 4ac2a98eda
commit 3bb0323b02
3 changed files with 133 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
ansibleworks/ui/static/js/forms/JobTemplates.js
View File

@@ -166,18 +166,39 @@ angular.module('JobTemplateFormDefinition', [])
type: 'collection', type: 'collection',
title: 'Jobs', title: 'Jobs',
iterator: 'job', iterator: 'job',
index: false,
open: false, open: false,
actions: { actions: {
}, },
fields: { fields: {
name: { id: {
label: 'Job ID',
key: true, key: true,
label: 'Name' desc: true,
searchType: 'int'
},
name: {
label: 'Name',
link: true
}, },
description: { description: {
label: 'Description' label: 'Description'
},
status: {
label: 'Status',
icon: 'icon-circle',
"class": 'job-\{\{ job.status \}\}',
searchType: 'select',
searchOptions: [
{ name: "new", value: "new" },
{ name: "pending", value: "pending" },
{ name: "running", value: "running" },
{ name: "successful", value: "successful" },
{ name: "error", value: "error" },
{ name: "failed", value: "failed" },
{ name: "canceled", value: "canceled" } ]
} }
}, },

124
ansibleworks/ui/static/js/helpers/related-search.js
View File

@@ -24,28 +24,67 @@ angular.module('RelatedSearchHelper', ['RestServices', 'Utilities','RefreshRelat
var form = params.form; var form = params.form;
// Set default values // Set default values
var iterator, f;
for (var set in form.related) { for (var set in form.related) {
if (form.related[set].type != 'tree') { if (form.related[set].type != 'tree') {
iterator = form.related[set].iterator;
for (var fld in form.related[set].fields) { for (var fld in form.related[set].fields) {
if (form.related[set].fields[fld].key) { if (form.related[set].fields[fld].key) {
scope[form.related[set].iterator + 'SearchField'] = fld scope[iterator + 'SearchField'] = fld
scope[form.related[set].iterator + 'SearchFieldLabel'] = form.related[set].fields[fld].label; scope[iterator + 'SearchFieldLabel'] = form.related[set].fields[fld].label;
break; break;
} }
} }
scope[form.related[set].iterator + 'SortOrder'] = null; scope[iterator + 'SortOrder'] = null;
scope[form.related[set].iterator + 'SearchType'] = 'contains'; scope[iterator + 'SearchType'] = 'contains';
scope[form.related[set].iterator + 'SearchTypeLabel'] = 'Contains'; scope[iterator + 'SearchTypeLabel'] = 'Contains';
scope[form.related[set].iterator + 'SelectShow'] = false; scope[iterator + 'SelectShow'] = false;
scope[form.related[set].iterator + 'HideSearchType'] = false; scope[iterator + 'HideSearchType'] = false;
f = scope[iterator + 'SearchField']
if (form.related[set].fields[f].searchType && ( form.related[set].fields[f].searchType == 'boolean'
|| form.related[set].fields[f].searchType == 'select')) {
scope[iterator + 'SelectShow'] = true;
scope[iterator + 'SearchSelectOpts'] = list.fields[f].searchOptions;
}
if (form.related[set].fields[f].searchType && form.related[set].fields[f].searchType == 'int') {
scope[iterator + 'HideSearchType'] = true;
}
if (form.related[set].fields[f].searchType && form.related[set].fields[f].searchType == 'gtzero') {
scope[iterator + "InputHide"] = true;
}
} }
} }
// Functions to handle search widget changes // Functions to handle search widget changes
scope.setSearchField = function(model, fld, label) { scope.setSearchField = function(iterator, fld, label) {
scope[model + 'SearchFieldLabel'] = label;
scope[model + 'SearchField'] = fld; for (var related in form.related) {
scope.search(model); if ( form.related[related].iterator == iterator ) {
var f = form.related[set].fields[fld];
}
}
scope[iterator + 'SearchFieldLabel'] = label;
scope[iterator + 'SearchField'] = fld;
scope[iterator + 'SearchValue'] = '';
scope[iterator + 'SelectShow'] = false;
scope[iterator + 'HideSearchType'] = false;
scope[iterator + 'InputHide'] = false;
if (f.searchType && f.searchType == 'gtzero') {
scope[iterator + "InputHide"] = true;
}
if (f.searchType && (f.searchType == 'boolean'
|| f.searchType == 'select')) {
scope[iterator + 'SelectShow'] = true;
scope[iterator + 'SearchSelectOpts'] = f.searchOptions;
}
if (f.searchType && f.searchType == 'int') {
scope[iterator + 'HideSearchType'] = true;
}
scope.search(iterator);
} }
scope.setSearchType = function(model, type, label) { scope.setSearchType = function(model, type, label) {
@@ -54,38 +93,71 @@ angular.module('RelatedSearchHelper', ['RestServices', 'Utilities','RefreshRelat
scope.search(model); scope.search(model);
} }
scope.search = function(model) { scope.search = function(iterator) {
scope[model + 'SearchSpin'] = true; scope[iterator + 'SearchSpin'] = true;
scope[model + 'Loading'] = true; scope[iterator + 'Loading'] = true;
var set, url, iterator, sort_order; var set, url, iterator, sort_order;
for (var key in relatedSets) { for (var key in relatedSets) {
if (relatedSets[key].iterator == model) { if (relatedSets[key].iterator == iterator) {
set = key; set = key;
iterator = relatedSets[key].iterator;
url = relatedSets[key].url; url = relatedSets[key].url;
for (var fld in form.related[key].fields) { for (var fld in form.related[key].fields) {
if (form.related[key].fields[fld].key) { if (form.related[key].fields[fld].key) {
sort_order = fld; if (form.related[key].fields[fld].desc) {
sort_order = '-' + fld;
}
else {
sort_order = fld;
}
} }
} }
break; break;
} }
} }
sort_order = (scope[model + 'SortOrder'] == null) ? sort_order : scope[model + 'SortOrder']; sort_order = (scope[iterator + 'SortOrder'] == null) ? sort_order : scope[iterator + 'SortOrder'];
if (scope[model + 'SearchValue'] != '' && scope[model + 'SearchValue'] != undefined) { var f = form.related[set].fields[scope[iterator + 'SearchField']];
scope[model + 'SearchParams'] = '?' + scope[model + 'SearchField'] + if ( (scope[iterator + 'SelectShow'] == false && scope[iterator + 'SearchValue'] != '' && scope[iterator + 'SearchValue'] != undefined) ||
'__' + scope[model + 'SearchType'] + '=' + escape(scope[model + 'SearchValue']); (scope[iterator + 'SelectShow'] && scope[iterator + 'SearchSelectValue']) || (f.searchType && f.searchType == 'gtzero') ) {
scope[model + 'SearchParams'] += (sort_order) ? '&order_by=' + escape(sort_order) : ''; if (f.sourceModel) {
// handle fields whose source is a related model e.g. inventories.organization
scope[iterator + 'SearchParams'] = '?' + f.sourceModel + '__' + f.sourceField + '__';
}
else if (f.searchField) {
scope[iterator + 'SearchParams'] = '?' + f.searchField + '__';
}
else {
scope[iterator + 'SearchParams'] = '?' + scope[iterator + 'SearchField'] + '__';
}
if ( f.searchType && (f.searchType == 'int' || f.searchType == 'boolean' ) ) {
scope[iterator + 'SearchParams'] += 'int=';
}
else if ( f.searchType && f.searchType == 'gtzero' ) {
scope[iterator + 'SearchParams'] += 'gt=0';
}
else {
scope[iterator + 'SearchParams'] += scope[iterator + 'SearchType'] + '=';
}
if ( f.searchType && (f.searchType == 'boolean' || f.searchType == 'select') ) {
scope[iterator + 'SearchParams'] += scope[iterator + 'SearchSelectValue'].value;
}
else if ( f.searchType == undefined || f.searchType == 'gtzero' ) {
scope[iterator + 'SearchParams'] += escape(scope[iterator + 'SearchValue']);
}
scope[iterator + 'SearchParams'] += (sort_order) ? '&order_by=' + escape(sort_order) : '';
} }
else { else {
scope[model + 'SearchParams'] = (sort_order) ? '?order_by=' + escape(sort_order) : ''; scope[iterator + 'SearchParams'] = '';
scope[iterator + 'SearchParams'] += (sort_order) ? '?order_by=' + escape(sort_order) : '';
} }
url += scope[model + 'SearchParams'];
url += (scope[model + 'PageSize']) ? '&page_size=' + scope[iterator + 'PageSize'] : ""; scope[iterator + 'Page'] = 0;
url += scope[iterator + 'SearchParams'];
url += (scope[iterator + 'PageSize']) ? '&page_size=' + scope[iterator + 'PageSize'] : "";
RefreshRelated({ scope: scope, set: set, iterator: iterator, url: url }); RefreshRelated({ scope: scope, set: set, iterator: iterator, url: url });
} }

16
ansibleworks/ui/static/lib/ansible/form-generator.js
View File

@@ -52,6 +52,9 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
case 'dataPlacement': case 'dataPlacement':
result = "data-placement=\"" + obj[key] + "\" "; result = "data-placement=\"" + obj[key] + "\" ";
break; break;
case 'icon':
result = "<i class=\"" + obj[key] +"\"></i> ";
break;
default: default:
result = key + "=\"" + obj[key] + "\" "; result = key + "=\"" + obj[key] + "\" ";
} }
@@ -885,7 +888,7 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
html += "<table class=\"" + form.related[itm].iterator + " table table-condensed table-hover\">\n"; html += "<table class=\"" + form.related[itm].iterator + " table table-condensed table-hover\">\n";
html += "<thead>\n"; html += "<thead>\n";
html += "<tr>\n"; html += "<tr>\n";
html += "<th>#</th>\n"; html += (form.related[itm].index == undefined || form.related[itm].index !== false) ? "<th>#</th>\n" : "";
for (var fld in form.related[itm].fields) { for (var fld in form.related[itm].fields) {
html += "<th class=\"list-header\" id=\"" + form.related[itm].iterator + '-' + fld + "-header\" " + html += "<th class=\"list-header\" id=\"" + form.related[itm].iterator + '-' + fld + "-header\" " +
"ng-click=\"sort('" + form.related[itm].iterator + "', '" + fld + "')\">" + "ng-click=\"sort('" + form.related[itm].iterator + "', '" + fld + "')\">" +
@@ -911,8 +914,10 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
html += "<tbody>\n"; html += "<tbody>\n";
html += "<tr ng-repeat=\"" + form.related[itm].iterator + " in " + itm + "\" >\n"; html += "<tr ng-repeat=\"" + form.related[itm].iterator + " in " + itm + "\" >\n";
html += "<td>{{ $index + (" + form.related[itm].iterator + "Page * " + if (form.related[itm].index == undefined || form.related[itm].index !== false) {
form.related[itm].iterator + "PageSize) + 1 }}.</td>\n"; html += "<td>{{ $index + (" + form.related[itm].iterator + "Page * " +
form.related[itm].iterator + "PageSize) + 1 }}.</td>\n";
}
var cnt = 1; var cnt = 1;
var rfield; var rfield;
var base = (form.related[itm].base) ? form.related[itm].base : itm; var base = (form.related[itm].base) ? form.related[itm].base : itm;
@@ -920,7 +925,10 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
for (var fld in form.related[itm].fields) { for (var fld in form.related[itm].fields) {
cnt++; cnt++;
rfield = form.related[itm].fields[fld]; rfield = form.related[itm].fields[fld];
html += "<td>"; html += "<td ";
html += (rfield['class']) ? 'class="'+ rfield['class'] + '"' : "";
html += ">";
html += (rfield.icon) ? this.attr(rfield,'icon') : "";
if ((rfield.key || rfield.link || rfield.linkTo || rfield.ngClick )) { if ((rfield.key || rfield.link || rfield.linkTo || rfield.ngClick )) {
if (rfield.linkTo) { if (rfield.linkTo) {
html += "<a href=\"#" + rfield.linkTo + "\">"; html += "<a href=\"#" + rfield.linkTo + "\">";