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

UX Audit fixes to Mgmt Jobs

Browse Source
This commit is contained in:
Jared Tabor
2016-05-09 13:56:40 -04:00
parent 8a1d06789b
commit 5218644f0b
9 changed files with 53 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
awx/ui/client/legacy-styles/forms.less
View File

@@ -216,6 +216,10 @@
border:1px solid @field-border-sel; border:1px solid @field-border-sel;
} }
.Form-monospace{
font-family: Menlo,Monaco,Consolas,"Courier New",monospace!important;
}
.ui-spinner{ .ui-spinner{
height: 30px; height: 30px;
background-color: @field-secondary-bg; background-color: @field-secondary-bg;

20
awx/ui/client/src/forms/Credentials.js
View File

@@ -79,24 +79,7 @@ export default
dataTitle: 'Type', dataTitle: 'Type',
dataPlacement: 'right', dataPlacement: 'right',
dataContainer: "body", dataContainer: "body",
hasSubForm: true, hasSubForm: true
// helpCollapse: [{
// hdr: 'Select a Credential Type',
// content: '<dl>\n' +
// '<dt>Machine</dt>\n' +
// '<dd>Authentication for remote machine access. This can include SSH keys, usernames, passwords, ' +
// 'and sudo information. Machine credentials are used when submitting jobs to run playbooks against ' +
// 'remote hosts.</dd>' +
// '<dt>Source Control</dt>\n' +
// '<dd>Used to check out and synchronize playbook repositories with a remote source control ' +
// 'management system such as Git, Subversion (svn), or Mercurial (hg). These credentials are ' +
// 'used on the Projects tab.</dd>\n' +
// '<dt>Others (Cloud Providers)</dt>\n' +
// '<dd>Access keys for authenticating to the specific ' +
// 'cloud provider, usually used for inventory sync ' +
// 'and deployment.</dd>\n' +
// '</dl>\n'
// }]
}, },
access_key: { access_key: {
label: 'Access Key', label: 'Access Key',
@@ -255,6 +238,7 @@ export default
init: true init: true
}, },
class: 'Form-textAreaLabel Form-formGroup--fullWidth', class: 'Form-textAreaLabel Form-formGroup--fullWidth',
elementClass: 'Form-monospace',
hintText: "{{ key_hint }}", hintText: "{{ key_hint }}",
addRequired: false, addRequired: false,
editRequired: false, editRequired: false,

1
awx/ui/client/src/inventory-scripts/add/add.controller.js
View File

@@ -49,7 +49,6 @@ export default
script: scope.script script: scope.script
}) })
.success(function (data) { .success(function (data) {
$rootScope.addedItem = data.id;
$state.go('inventoryScripts', {}, {reload: true}); $state.go('inventoryScripts', {}, {reload: true});
Wait('stop'); Wait('stop');
}) })

3
awx/ui/client/src/inventory-scripts/edit/edit.controller.js
View File

@@ -79,9 +79,8 @@ export default
script: $scope.script script: $scope.script
}) })
.success(function () { .success(function () {
$state.transitionTo('inventoryScriptsList'); $state.transitionTo('inventoryScripts');
Wait('stop'); Wait('stop');
}) })
.error(function (data, status) { .error(function (data, status) {
ProcessErrors($scope, data, status, form, { hdr: 'Error!', ProcessErrors($scope, data, status, form, { hdr: 'Error!',

1
awx/ui/client/src/inventory-scripts/inventory-scripts.form.js
View File

@@ -48,6 +48,7 @@ export default function() {
type: 'textarea', type: 'textarea',
hintText: "Drag and drop an inventory script on the field below", hintText: "Drag and drop an inventory script on the field below",
class: 'Form-formGroup--fullWidth', class: 'Form-formGroup--fullWidth',
elementClass: 'Form-monospace',
addRequired: true, addRequired: true,
editRequired: true, editRequired: true,
awDropFile: true, awDropFile: true,

28
awx/ui/client/src/management-jobs/card/card.controller.js
View File

@@ -7,16 +7,14 @@
// import listGenerator from 'tower/shared/list-generator/main'; // import listGenerator from 'tower/shared/list-generator/main';
export default export default
[ 'Wait', '$location' , '$compile', 'CreateDialog', [ 'Wait', '$location' , '$compile', 'CreateDialog', 'GetBasePath' ,
'GetBasePath' , 'SearchInit' , 'PaginateInit', 'SearchInit' , 'PaginateInit', 'SchedulesList', 'Rest' ,
'SchedulesList', 'ProcessErrors', 'managementJobsListObject', '$rootScope', '$state',
'Rest' , 'ProcessErrors', 'managementJobsListObject', '$rootScope', '$scope', 'CreateSelect2',
'$state','$scope', function( Wait, $location, $compile, CreateDialog, GetBasePath,
function( Wait, $location, $compile, CreateDialog, SearchInit, PaginateInit, SchedulesList, Rest, ProcessErrors,
GetBasePath, SearchInit, PaginateInit, managementJobsListObject, $rootScope, $state, $scope,
SchedulesList, CreateSelect2) {
Rest, ProcessErrors, managementJobsListObject, $rootScope,
$state, $scope) {
var defaultUrl = GetBasePath('system_job_templates'); var defaultUrl = GetBasePath('system_job_templates');
@@ -154,6 +152,14 @@ export default
// $('#configure-tower-dialog').dialog('close'); // $('#configure-tower-dialog').dialog('close');
$('#prompt-for-days-facts').show(); $('#prompt-for-days-facts').show();
$('#prompt-for-days-facts').dialog('open'); $('#prompt-for-days-facts').dialog('open');
CreateSelect2({
element: '#keep_unit',
multiple: false
});
CreateSelect2({
element: '#granularity_keep_unit',
multiple: false
});
Wait('stop'); Wait('stop');
}); });
}; };
@@ -238,7 +244,7 @@ export default
}; };
$scope.chooseRunJob = function(id, name) { $scope.chooseRunJob = function(id, name) {
if(id === 4) { if(this.card.job_type === "cleanup_facts") {
// Run only for 'Cleanup Fact Details' // Run only for 'Cleanup Fact Details'
$scope.submitCleanupJob(id, name); $scope.submitCleanupJob(id, name);
} else { } else {

15
awx/ui/client/src/management-jobs/card/card.partial.html
View File

@@ -16,17 +16,20 @@
<h3 class="MgmtCards-label"> {{ card.name }}</h3> <h3 class="MgmtCards-label"> {{ card.name }}</h3>
<div class="MgmtCards-actionItems"> <div class="MgmtCards-actionItems">
<button class="MgmtCards-actionItem List-actionButton" <button class="MgmtCards-actionItem List-actionButton"
ng-click='goToNotifications(card, card.id)'> ng-click='chooseRunJob(card.id, card.name)'
<i class="MgmtCards-actionItemIcon fa fa-bell-o"></i> data-placement="top" aw-tool-tip="Launch Management Job" data-original-title="" title="">
</button>
<button class="MgmtCards-actionItem List-actionButton"
ng-click='chooseRunJob(card.id, card.name)'>
<i class="MgmtCards-actionItemIcon fa fa-rocket"></i> <i class="MgmtCards-actionItemIcon fa fa-rocket"></i>
</button> </button>
<button class="MgmtCards-actionItem List-actionButton" <button class="MgmtCards-actionItem List-actionButton"
ng-click='configureSchedule(card.id)'> ng-click='configureSchedule(card.id)'
data-placement="top" aw-tool-tip="Schedule Management Job" data-original-title="" title="">
<i class="MgmtCards-actionItemIcon fa fa-calendar"></i> <i class="MgmtCards-actionItemIcon fa fa-calendar"></i>
</button> </button>
<button class="MgmtCards-actionItem List-actionButton"
ng-click='goToNotifications(card, card.id)'
data-placement="top" aw-tool-tip="Configure Notifications" data-original-title="" title="">
<i class="MgmtCards-actionItemIcon fa fa-bell-o"></i>
</button>
</div> </div>
</div> </div>
<!-- End Card Header --> <!-- End Card Header -->

8
awx/ui/client/src/management-jobs/card/mgmtcards.block.less
View File

@@ -22,6 +22,14 @@
border-left: 5px solid #337AB7; border-left: 5px solid #337AB7;
} }
.MgmtCards-card--promptElements{
padding-top: 10px;
}
// .MgmtCards-promptText{
// color:@default-interface-txt;
// }
.MgmtCards-header { .MgmtCards-header {
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;

22
awx/ui/templates/ui/index.html
View File

@@ -157,9 +157,9 @@
<div id="help-modal-dialog" style="display: none;"></div> <div id="help-modal-dialog" style="display: none;"></div>
<div id="prompt-for-days" style="display:none"> <div id="prompt-for-days" style="display:none">
<form name="prompt_for_days_form" id="prompt_for_days_form"> <form name="prompt_for_days_form" id="prompt_for_days_form" class="MgmtCards-promptText">
Set how many days of data should be retained. <br> Set how many days of data should be retained. <br>
<input type="integer" id="days_to_keep" name="days_to_keep" ng-model="days_to_keep" ng-required="true" class="form-control" min=0 max=9999 style="margin-top:10px;" integer> <input type="integer" id="days_to_keep" name="days_to_keep" ng-model="days_to_keep" ng-required="true" class="form-control Form-textInput" min=0 max=9999 style="margin-top:10px;" integer>
<div class="error" ng-show="prompt_for_days_form.days_to_keep.$dirty && (prompt_for_days_form.days_to_keep.$error.number || prompt_for_days_form.days_to_keep.$error.integer || <div class="error" ng-show="prompt_for_days_form.days_to_keep.$dirty && (prompt_for_days_form.days_to_keep.$error.number || prompt_for_days_form.days_to_keep.$error.integer ||
prompt_for_days_form.days_to_keep.$error.required || prompt_for_days_form.days_to_keep.$error.required ||
prompt_for_days_form.days_to_keep.$error.min || prompt_for_days_form.days_to_keep.$error.min ||
@@ -167,7 +167,7 @@
</form> </form>
</div> </div>
<div id="prompt-for-days-facts" style="display:none"> <div id="prompt-for-days-facts" style="display:none">
<form name="prompt_for_days_facts_form" id="prompt_for_days_facts_form"> <form name="prompt_for_days_facts_form" id="prompt_for_days_facts_form" class="MgmtCards-promptText">
<div style="padding-bottom:15px;">For facts collected older than the time period specified, <div style="padding-bottom:15px;">For facts collected older than the time period specified,
save one fact scan (snapshot) per time window (frequency). save one fact scan (snapshot) per time window (frequency).
For example, facts older than 30 days are purged, while one For example, facts older than 30 days are purged, while one
@@ -182,11 +182,11 @@
</span> </span>
</label> </label>
<div class="row"> <div class="row">
<div class="col-xs-4"> <div class="col-xs-6">
<input type="integer" id="keep_amount" name="keep_amount" ng-model="keep_amount" ng-required="true" class="form-control" min=0 max=9999 style="margin-top:10px;" integer></input> <input type="integer" id="keep_amount" name="keep_amount" ng-model="keep_amount" ng-required="true" class="form-control Form-textInput MgmtCards-card--promptElements" min=0 max=9999 integer></input>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-6">
<select id="keep_unit" name="keep_unit" ng-model="keep_unit" ng-options="type.label for type in keep_unit_choices track by type.value" ng-required="true" class="form-control" style="margin-top:10px;"></select> <select id="keep_unit" name="keep_unit" ng-model="keep_unit" ng-options="type.label for type in keep_unit_choices track by type.value" ng-required="true" class="form-control MgmtCards-card--promptElements"></select>
</div> </div>
</div> </div>
<div class="error" ng-show="prompt_for_days_facts_form.keep_amount.$dirty && (prompt_for_days_facts_form.keep_amount.$error.number || prompt_for_days_facts_form.keep_amount.$error.integer || <div class="error" ng-show="prompt_for_days_facts_form.keep_amount.$dirty && (prompt_for_days_facts_form.keep_amount.$error.number || prompt_for_days_facts_form.keep_amount.$error.integer ||
@@ -201,12 +201,12 @@
</span> </span>
</label> </label>
<div class="row"> <div class="row">
<div class="col-xs-4"> <div class="col-xs-6">
<input type="integer" id="granularity_keep_amount" name="granularity_keep_amount" ng-model="granularity_keep_amount" ng-required="true" class="form-control" min=0 max=9999 style="margin-top:10px;" integer></input> <input type="integer" id="granularity_keep_amount" name="granularity_keep_amount" ng-model="granularity_keep_amount" ng-required="true" class="form-control Form-textInput MgmtCards-card--promptElements" min=0 max=9999 integer></input>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-6">
<select id="granularity_keep_unit" name="granularity_keep_unit" ng-model="granularity_keep_unit" <select id="granularity_keep_unit" name="granularity_keep_unit" ng-model="granularity_keep_unit"
ng-options="type.label for type in granularity_keep_unit_choices track by type.value" ng-required="true" class="form-control" style="margin-top:10px;"></select> ng-options="type.label for type in granularity_keep_unit_choices track by type.value" ng-required="true" class="form-control MgmtCards-card--promptElements" ></select>
</div> </div>
</div> </div>
<div class="error" ng-show="prompt_for_days_facts_form.granularity_keep_amount.$dirty && (prompt_for_days_facts_form.granularity_keep_amount.$error.number || prompt_for_days_facts_form.granularity_keep_amount.$error.integer || <div class="error" ng-show="prompt_for_days_facts_form.granularity_keep_amount.$dirty && (prompt_for_days_facts_form.granularity_keep_amount.$error.number || prompt_for_days_facts_form.granularity_keep_amount.$error.integer ||