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

Merge pull request #1684 from jakemcdermott/job-results/tag-lists

Browse Source 
show job and skip tags as collapsable label lists
This commit is contained in:
Jake McDermott 2018-05-04 14:45:55 -04:00 committed by GitHub
commit 34a2128af8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 110 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
awx/ui/client/features/output/details.directive.js
View File

@ -367,25 +367,48 @@ function getInstanceGroupDetails () {
}
function getJobTagDetails () {
const label = 'Job Tags';
const value = resource.model.get('job_tags');
const tagString = resource.model.get('job_tags');
if (!value) {
let jobTags;
if (tagString) {
jobTags = tagString.split(',');
} else {
jobTags = [];
}
if (jobTags.length < 1) {
return null;
}
return { label, value };
const label = 'Job Tags';
const more = false;
const value = jobTags.filter(tag => tag !== '').map($filter('sanitize'));
return { label, more, value };
}
function getSkipTagDetails () {
const label = 'Skip Tags';
const value = resource.model.get('skip_tags');
const tagString = resource.model.get('skip_tags');
if (!value) {
let skipTags;
if (tagString) {
skipTags = tagString.split(',');
} else {
skipTags = [];
}
if (skipTags.length < 1) {
return null;
}
return { label, value };
const label = 'Skip Tags';
const more = false;
const value = skipTags.filter(tag => tag !== '').map($filter('sanitize'));
return { label, more, value };
}
function getExtraVarsDetails () {
@ -428,19 +451,41 @@ function createErrorHandler (path, action) {
}
const ELEMENT_LABELS = '#job-results-labels';
const ELEMENT_JOB_TAGS = '#job-results-job-tags';
const ELEMENT_SKIP_TAGS = '#job-results-skip-tags';
const ELEMENT_PROMPT_MODAL = '#prompt-modal';
const LABELS_SLIDE_DISTANCE = 200;
const TAGS_SLIDE_DISTANCE = 200;
function toggleLabels () {
if (!this.labels.more) {
$(ELEMENT_LABELS).slideUp(LABELS_SLIDE_DISTANCE);
$(ELEMENT_LABELS).slideUp(TAGS_SLIDE_DISTANCE);
this.labels.more = true;
} else {
$(ELEMENT_LABELS).slideDown(LABELS_SLIDE_DISTANCE);
$(ELEMENT_LABELS).slideDown(TAGS_SLIDE_DISTANCE);
this.labels.more = false;
}
}
function toggleJobTags () {
if (!this.jobTags.more) {
$(ELEMENT_JOB_TAGS).slideUp(TAGS_SLIDE_DISTANCE);
this.jobTags.more = true;
} else {
$(ELEMENT_JOB_TAGS).slideDown(TAGS_SLIDE_DISTANCE);
this.jobTags.more = false;
}
}
function toggleSkipTags () {
if (!this.skipTags.more) {
$(ELEMENT_SKIP_TAGS).slideUp(TAGS_SLIDE_DISTANCE);
this.skipTags.more = true;
} else {
$(ELEMENT_SKIP_TAGS).slideDown(TAGS_SLIDE_DISTANCE);
this.skipTags.more = false;
}
}
function cancelJob () {
const actionText = strings.get('cancelJob.CANCEL_JOB');
const hdr = strings.get('cancelJob.HEADER');
@ -562,6 +607,8 @@ function AtJobDetailsController (
vm.cancelJob = cancelJob;
vm.deleteJob = deleteJob;
vm.toggleLabels = toggleLabels;
vm.toggleJobTags = toggleJobTags;
vm.toggleSkipTags = toggleSkipTags;
const observe = (getter, transform, key) => {
$scope.$watch(getter, value => { vm[key] = transform(value); });

66
awx/ui/client/features/output/details.partial.html
View File

@ -237,18 +237,6 @@
</div>
</div>
<!-- TAGS DETAIL -->
<div class="JobResults-resultRow" ng-if="vm.jobTags">
<label class="JobResults-resultRowLabel">{{ vm.jobTags.label }}</label>
<div class="JobResults-resultRowText">{{ vm.jobTags.value }}</div>
</div>
<!-- SKIP TAGS DETAIL -->
<div class="JobResults-resultRow" ng-if="vm.skipTags">
<label class="JobResults-resultRowLabel">{{ vm.skipTags.label }}</label>
<div class="JobResults-resultRowText"> {{ vm.skipTags.value }}</div>
</div>
<!-- EXTRA VARIABLES DETAIL -->
<at-code-mirror
class="JobResults-resultRow"
@ -267,14 +255,14 @@
ng-show="vm.labels.more"
href=""
ng-click="vm.toggleLabels()">
<span translate>Labels</span>
<span translate>{{ vm.labels.label }}</span>
<i class="JobResults-expandArrow fa fa-caret-right"></i>
</a>
<a class="JobResults-resultRowLabel JobResults-resultRowLabel--fullWidth"
ng-show="!vm.labels.more"
href=""
ng-click="vm.toggleLabels()">
<span translate>Labels</span>
<span translate>{{ vm.labels.label }}</span>
<i class="JobResults-expandArrow fa fa-caret-down"></i>
</a>
</div>
@ -284,3 +272,53 @@
</div>
</div>
</div>
<!-- TAGS DETAIL -->
<div class="JobResults-resultRow" ng-show="vm.jobTags">
<div class="JobResults-resultRow">
<a class="JobResults-resultRowLabel JobResults-resultRowLabel--fullWidth"
ng-show="vm.jobTags.more"
href=""
ng-click="vm.toggleJobTags()">
<span translate>{{ vm.jobTags.label }}</span>
<i class="JobResults-expandArrow fa fa-caret-right"></i>
</a>
<a class="JobResults-resultRowLabel JobResults-resultRowLabel--fullWidth"
ng-show="!vm.jobTags.more"
href=""
ng-click="vm.toggleJobTags()">
<span translate>{{ vm.jobTags.label }}</span>
<i class="JobResults-expandArrow fa fa-caret-down"></i>
</a>
</div>
<div id="job-results-job-tags" class="LabelList JobResults-resultRowText JobResults-resultRowText--fullWidth">
<div ng-repeat="tag in vm.jobTags.value" class="LabelList-tagContainer">
<div class="LabelList-tag"><div class="LabelList-name">{{ tag }}</div></div>
</div>
</div>
</div>
<!-- SKIP TAGS DETAIL -->
<div class="JobResults-resultRow" ng-show="vm.skipTags">
<div class="JobResults-resultRow">
<a class="JobResults-resultRowLabel JobResults-resultRowLabel--fullWidth"
ng-show="vm.skipTags.more"
href=""
ng-click="vm.toggleSkipTags()">
<span translate>{{ vm.skipTags.label }}</span>
<i class="JobResults-expandArrow fa fa-caret-right"></i>
</a>
<a class="JobResults-resultRowLabel JobResults-resultRowLabel--fullWidth"
ng-show="!vm.skipTags.more"
href=""
ng-click="vm.toggleSkipTags()">
<span translate>{{ vm.skipTags.label }}</span>
<i class="JobResults-expandArrow fa fa-caret-down"></i>
</a>
</div>
<div id="job-results-skip-tags" class="LabelList JobResults-resultRowText JobResults-resultRowText--fullWidth">
<div ng-repeat="tag in vm.skipTags.value" class="LabelList-tagContainer">
<div class="LabelList-tag"><div class="LabelList-name">{{ tag }}</div></div>
</div>
</div>
</div>