mirror of
https://github.com/ansible/awx.git
synced 2026-01-12 10:30:03 -03:30
adding the related groups tags to host list
for the related hosts list off the inventory. This also includes dissociating the host from the group if the user clicks the red X icon.
This commit is contained in:
Jared Tabor
parent
71641bdfb7
commit
05f29e5144
@ -9,12 +9,14 @@
|
||||
import relatedHostList from './list/main';
|
||||
import relatedHostsListDefinition from './related-host.list';
|
||||
import relatedHostsFormDefinition from './related-host.form';
|
||||
import relatedGroupsLabels from './related-groups-labels/main';
|
||||
|
||||
export default
|
||||
angular.module('relatedHost', [
|
||||
relatedHostAdd.name,
|
||||
relatedHostEdit.name,
|
||||
relatedHostList.name
|
||||
relatedHostList.name,
|
||||
relatedGroupsLabels.name
|
||||
])
|
||||
.factory('RelatedHostsFormDefinition', relatedHostsFormDefinition)
|
||||
.value('RelatedHostsListDefinition', relatedHostsListDefinition);
|
||||
|
||||
@ -0,0 +1,11 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2015 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import relatedGroupsabelsList from './relatedGroupsLabelsList.directive';
|
||||
|
||||
export default
|
||||
angular.module('relatedGroupsLabels', [])
|
||||
.directive('relatedGroupsLabelsList', relatedGroupsabelsList);
|
||||
@ -0,0 +1,6 @@
|
||||
/** @define LabelList */
|
||||
// @import "./client/src/shared/branding/colors.default.less";
|
||||
|
||||
.RelatedGroupsLabelsCell{
|
||||
width:100%;
|
||||
}
|
||||
@ -0,0 +1,103 @@
|
||||
/* jshint unused: vars */
|
||||
export default
|
||||
[ 'templateUrl',
|
||||
'Wait',
|
||||
'Rest',
|
||||
'GetBasePath',
|
||||
'ProcessErrors',
|
||||
'Prompt',
|
||||
'$q',
|
||||
'$filter',
|
||||
'$state',
|
||||
function(templateUrl, Wait, Rest, GetBasePath, ProcessErrors, Prompt, $q, $filter, $state) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: false,
|
||||
templateUrl: templateUrl('inventories/related-hosts/related-groups-labels/relatedGroupsLabelsList'),
|
||||
link: function(scope, element, attrs) {
|
||||
scope.showDelete = attrs.showDelete === 'true';
|
||||
scope.seeMoreInactive = true;
|
||||
|
||||
var getNext = function(data, arr, resolve) {
|
||||
Rest.setUrl(data.next);
|
||||
Rest.get()
|
||||
.success(function (data) {
|
||||
if (data.next) {
|
||||
getNext(data, arr.concat(data.results), resolve);
|
||||
} else {
|
||||
resolve.resolve(arr.concat(data.results));
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
scope.seeMore = function () {
|
||||
var seeMoreResolve = $q.defer();
|
||||
Rest.setUrl(scope[scope.$parent.list.iterator].related.groups);
|
||||
Rest.get()
|
||||
.success(function(data) {
|
||||
if (data.next) {
|
||||
getNext(data, data.results, seeMoreResolve);
|
||||
} else {
|
||||
seeMoreResolve.resolve(data.results);
|
||||
}
|
||||
});
|
||||
|
||||
seeMoreResolve.promise.then(function (groups) {
|
||||
scope.related_groups = groups;
|
||||
scope.seeMoreInactive = false;
|
||||
});
|
||||
};
|
||||
|
||||
scope.seeLess = function() {
|
||||
// Trim the groups array back down to 10 items
|
||||
scope.related_groups = scope.related_groups.slice(0, 5);
|
||||
// Re-set the seeMoreInteractive flag so that the "See More" will be displayed
|
||||
scope.seeMoreInactive = true;
|
||||
};
|
||||
|
||||
scope.deleteLabel = function(host, group) {
|
||||
var action = function () {
|
||||
$('#prompt-modal').modal('hide');
|
||||
scope.seeMoreInactive = true;
|
||||
Wait('start');
|
||||
let url = `${GetBasePath('groups')}${group.id}/hosts`;
|
||||
if(url) {
|
||||
Rest.setUrl(url);
|
||||
Rest.post({"disassociate": true, "id": host.id})
|
||||
.success(function () {
|
||||
Wait('stop');
|
||||
$state.go('.', null, {reload: true});
|
||||
})
|
||||
.error(function (data, status) {
|
||||
Wait('stop');
|
||||
ProcessErrors(scope, data, status, null, { hdr: 'Error!',
|
||||
msg: 'Could not disassociate host from group. Call to ' + url + ' failed. DELETE returned status: ' + status });
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
Prompt({
|
||||
hdr: 'Remove host from ' + group.name ,
|
||||
body: '<div class="Prompt-bodyQuery">Confirm the removal of the <span class="Prompt-emphasis">' + $filter('sanitize')(host.name) + '</span> from the <span class="Prompt-emphasis">' + $filter('sanitize')(group.name) + '</span> group.</div>',
|
||||
action: action,
|
||||
actionText: 'REMOVE'
|
||||
});
|
||||
};
|
||||
|
||||
scope.$watchCollection(scope.$parent.list.iterator, function() {
|
||||
// To keep the array of groups fresh, we need to set up a watcher - otherwise, the
|
||||
// array will get set initially and then never be updated as groups are removed
|
||||
if (scope[scope.$parent.list.iterator].summary_fields.groups){
|
||||
scope.related_groups = scope[scope.$parent.list.iterator].summary_fields.groups.results;
|
||||
scope.count = scope[scope.$parent.list.iterator].summary_fields.groups.count;
|
||||
}
|
||||
else{
|
||||
scope.related_groups = null;
|
||||
scope.count = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
};
|
||||
}
|
||||
];
|
||||
@ -0,0 +1,14 @@
|
||||
<div class="LabelList-tagContainer" ng-repeat="related_group in related_groups">
|
||||
<div class="LabelList-deleteContainer"
|
||||
ng-click="deleteLabel(host, related_group)"
|
||||
ng-show="showDelete && host.summary_fields.user_capabilities.edit">
|
||||
<i class="fa fa-times LabelList-tagDelete"></i>
|
||||
</div>
|
||||
<div class="LabelList-tag" ng-class="{'LabelList-tag--deletable' : (showDelete && host.summary_fields.user_capabilities.edit)}">
|
||||
<span class="LabelList-name">{{ related_group.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="LabelList-seeMoreLess" ng-show="count > 5 && seeMoreInactive"
|
||||
ng-click="seeMore()">View More</div>
|
||||
<div class="LabelList-seeMoreLess" ng-show="count > 5 && !seeMoreInactive"
|
||||
ng-click="seeLess()">View Less</div>
|
||||
@ -44,6 +44,20 @@ export default {
|
||||
dataHostId: "{{ host.id }}",
|
||||
dataType: "host",
|
||||
class: 'InventoryManage-breakWord'
|
||||
},
|
||||
groups: {
|
||||
label: "Related Groups",
|
||||
type: 'related_groups',
|
||||
nosort: true,
|
||||
showDelete: true,
|
||||
columnClass: 'RelatedGroupsLabelsCell List-tableCell col-lg-2 col-md-3 hidden-sm hidden-xs'
|
||||
// ngBind: 'host.summary_fields.groups',
|
||||
// ngClass: "{ 'host-disabled-label': !host.enabled }",
|
||||
// columnClass: 'col-lg-6 col-md-8 col-sm-8 col-xs-7',
|
||||
// dataHostId: "{{ host.id }}",
|
||||
// dataType: "host",
|
||||
// class: 'InventoryManage-breakWord'
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -491,13 +491,23 @@ angular.module('GeneratorHelpers', [systemStatus.name])
|
||||
</td>
|
||||
`;
|
||||
} else if (field.type === 'labels') {
|
||||
var showDelete = field.showDelete === undefined ? true : field.showDelete;
|
||||
let showDelete = field.showDelete === undefined ? true : field.showDelete;
|
||||
classList = (field.columnClass) ?
|
||||
Attr(field, 'columnClass') : "";
|
||||
html += `
|
||||
<td ${classList}>
|
||||
<labels-list class=\"LabelList\" show-delete="${showDelete}">
|
||||
</labels-list>
|
||||
</td>
|
||||
`;
|
||||
} else if (field.type === 'related_groups') {
|
||||
let showDelete = field.showDelete === undefined ? true : field.showDelete;
|
||||
classList = (field.columnClass) ?
|
||||
Attr(field, 'columnClass') : "";
|
||||
html += `
|
||||
<td ${classList}>
|
||||
<related-groups-labels-list class=\"LabelList\" show-delete="${showDelete}">
|
||||
</related-groups-labels-list>
|
||||
</td>
|
||||
`;
|
||||
} else if (field.type === 'owners') {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user