External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-13 23:17:32 -02:30
Code Issues Packages Projects Releases Wiki Activity

Inventory refactor: group drag-n-drop now fully working.

Browse Source
This commit is contained in:
chris Houseknecht
2014-01-15 12:34:40 -05:00
parent 2ccecd16a7
commit 9bf941e8d4
4 changed files with 23 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
awx/ui/static/js/helpers/Hosts.js
View File

@@ -56,7 +56,6 @@ angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'H
SearchInit({ scope: scope, set: 'hosts', list: InventoryHosts, url: url }); SearchInit({ scope: scope, set: 'hosts', list: InventoryHosts, url: url });
PaginateInit({ scope: scope, list: InventoryHosts, url: url }); PaginateInit({ scope: scope, list: InventoryHosts, url: url });
console.log('before call to hosts search')
scope.search(InventoryHosts.iterator); scope.search(InventoryHosts.iterator);
} }
}]) }])

7
awx/ui/static/less/ansible-ui.less
View File

@@ -1063,17 +1063,14 @@ input[type="checkbox"].checkbox-no-label {
} }
.draggable-clone { .draggable-clone {
/* padding: 4px; opacity: .60;
border-radius: 6px;
background: transparent;
border: 1px solid @grey; */
font-weight: bold; font-weight: bold;
} }
.droppable-hover { .droppable-hover {
background-color: @info; background-color: @info;
color: @info-color; color: @info-color;
padding: 4px; padding: 5px;
border: 1px solid @info-border; border: 1px solid @info-border;
border-radius: 4px; border-radius: 4px;
} }

26
awx/ui/static/lib/ansible/InventoryTree.js
View File

@@ -222,8 +222,8 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
// Copy or Move a group on the tree after drag-n-drop // Copy or Move a group on the tree after drag-n-drop
.factory('CopyMoveGroup', ['$compile', 'Alert', 'ProcessErrors', 'Find', 'Wait', 'Rest', 'Empty', .factory('CopyMoveGroup', ['$compile', 'Alert', 'ProcessErrors', 'Find', 'Wait', 'Rest', 'Empty', 'GetBasePath',
function($compile, Alert, ProcessErrors, Find, Wait, Rest, Empty) { function($compile, Alert, ProcessErrors, Find, Wait, Rest, Empty, GetBasePath) {
return function(params) { return function(params) {
var scope = params.scope; var scope = params.scope;
@@ -248,20 +248,23 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
} }
html += "</div>\n"; html += "</div>\n";
html += "<div class=\"modal-body text-center\">\n"; html += "<div class=\"modal-body\">\n";
if (target.id == 1) { if (target.id == 1) {
html += "<p>Are you sure you want to move group " + inbound.name + " to the top level?</p>"; html += "<p>Are you sure you want to move group " + inbound.name + " to the top level?</p>";
} }
else if (inbound.parent == 0) { else if (inbound.parent == 0) {
html += "<p>Are you sure you want to move group " + inbound.name + " away from the top level?</p>"; html += "<p>Are you sure you want to move group " + inbound.name + " from the top level and make it a child of " +
target.name + "?</p>";
} }
else { else {
html += "<div class=\"text-center\">\n";
html += "<p>Would you like to copy or move group <em>" + inbound.name + "</em> to group <em>" + target.name + "</em>?</p>\n"; html += "<p>Would you like to copy or move group <em>" + inbound.name + "</em> to group <em>" + target.name + "</em>?</p>\n";
html += "<div style=\"margin-top: 30px;\">\n"; html += "<div style=\"margin-top: 30px;\">\n";
html += "<a href=\"\" ng-click=\"moveGroup()\" class=\"btn btn-primary\" style=\"margin-right: 15px;\"><i class=\"fa fa-cut\"></i> Move</a>\n"; html += "<a href=\"\" ng-click=\"moveGroup()\" class=\"btn btn-primary\" style=\"margin-right: 15px;\"><i class=\"fa fa-cut\"></i> Move</a>\n";
html += "<a href=\"\" ng-click=\"copyGroup()\" class=\"btn btn-primary\"><i class=\"fa fa-copy\"></i> Copy</a>\n"; html += "<a href=\"\" ng-click=\"copyGroup()\" class=\"btn btn-primary\"><i class=\"fa fa-copy\"></i> Copy</a>\n";
html += "</div>\n"; html += "</div>\n";
html += "</div>\n";
} }
html += "</div>\n"; html += "</div>\n";
@@ -280,7 +283,7 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
// Inject our custom dialog // Inject our custom dialog
var e = angular.element(document.getElementById('inventory-modal-container')); var e = angular.element(document.getElementById('inventory-modal-container'));
e.append(html); e.empty().append(html);
$compile(e)(scope); $compile(e)(scope);
// Display it // Display it
@@ -303,7 +306,8 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
scope.removeGroupRemove = scope.$on('removeGroup', function() { scope.removeGroupRemove = scope.$on('removeGroup', function() {
if (inbound.parent > 0) { if (inbound.parent > 0) {
// Only remove a group from a parent when the parent is a group and not the inventory root // Only remove a group from a parent when the parent is a group and not the inventory root
var url = GetBasePath('base') + 'groups/' + inbound.parent + '/children/'; var parent = Find({ list: scope.groups, key: 'id', val: inbound.parent })
var url = GetBasePath('base') + 'groups/' + parent.group_id + '/children/';
Rest.setUrl(url); Rest.setUrl(url);
Rest.post({ id: inbound.group_id, disassociate: 1 }) Rest.post({ id: inbound.group_id, disassociate: 1 })
.success( function(data, status, headers, config) { .success( function(data, status, headers, config) {
@@ -311,9 +315,10 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
scope.$emit('GroupDeleteCompleted'); scope.$emit('GroupDeleteCompleted');
}) })
.error( function(data, status, headers, config) { .error( function(data, status, headers, config) {
Wait('stop');
ProcessErrors(scope, data, status, null, ProcessErrors(scope, data, status, null,
{ hdr: 'Error!', msg: 'Failed to remove ' + inbound.name + { hdr: 'Error!', msg: 'Failed to remove ' + inbound.name +
' from ' + target.name + '. POST returned status: ' + status }); ' from ' + parent.name + '. POST returned status: ' + status });
}); });
} }
else { else {
@@ -325,7 +330,7 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
// add the new group to the target parent // add the new group to the target parent
var url = (!Empty(target.group_id)) ? var url = (!Empty(target.group_id)) ?
GetBasePath('base') + 'groups/' + target.group_id + '/children/' : GetBasePath('base') + 'groups/' + target.group_id + '/children/' :
GetBasePath('inventory') + inv_id + '/groups/'; GetBasePath('inventory') + scope.inventory_id + '/groups/';
var group = { var group = {
id: inbound.group_id, id: inbound.group_id,
name: inbound.name, name: inbound.name,
@@ -339,6 +344,7 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
}) })
.error( function(data, status, headers, config) { .error( function(data, status, headers, config) {
var target_name = (Empty(target.group_id)) ? 'inventory' : target.name; var target_name = (Empty(target.group_id)) ? 'inventory' : target.name;
Wait('stop');
ProcessErrors(scope, data, status, null, ProcessErrors(scope, data, status, null,
{ hdr: 'Error!', msg: 'Failed to add ' + node.attr('name') + ' to ' + { hdr: 'Error!', msg: 'Failed to add ' + node.attr('name') + ' to ' +
target_name + '. POST returned status: ' + status }); target_name + '. POST returned status: ' + status });
@@ -348,10 +354,11 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
scope.copyGroup = function() { scope.copyGroup = function() {
$('#copy-prompt-modal').modal('hide'); $('#copy-prompt-modal').modal('hide');
Wait('start');
// add the new group to the target parent // add the new group to the target parent
var url = (!Empty(target.group_id)) ? var url = (!Empty(target.group_id)) ?
GetBasePath('base') + 'groups/' + target.group_id + '/children/' : GetBasePath('base') + 'groups/' + target.group_id + '/children/' :
GetBasePath('inventory') + inv_id + '/groups/'; GetBasePath('inventory') + scope.inventory_id + '/groups/';
var group = { var group = {
id: inbound.group_id, id: inbound.group_id,
name: inbound.name, name: inbound.name,
@@ -366,6 +373,7 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
}) })
.error( function(data, status, headers, config) { .error( function(data, status, headers, config) {
var target_name = (Empty(target.group_id)) ? 'inventory' : target.name; var target_name = (Empty(target.group_id)) ? 'inventory' : target.name;
Wait('stop');
ProcessErrors(scope, data, status, null, ProcessErrors(scope, data, status, null,
{ hdr: 'Error!', msg: 'Failed to add ' + node.attr('name') + ' to ' + { hdr: 'Error!', msg: 'Failed to add ' + node.attr('name') + ' to ' +
target_name + '. POST returned status: ' + status }); target_name + '. POST returned status: ' + status });

6
awx/ui/static/lib/ansible/directives.js
View File

@@ -533,7 +533,8 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService'])
helper: "clone", helper: "clone",
start: function(e, ui) { start: function(e, ui) {
ui.helper.addClass('draggable-clone'); ui.helper.addClass('draggable-clone');
} },
zIndex: 100
}); });
} }
@@ -573,7 +574,8 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService'])
// Drag-n-drop succeeded. Trigger a response from the inventory.edit controller // Drag-n-drop succeeded. Trigger a response from the inventory.edit controller
$(this).removeClass('droppable-hover'); $(this).removeClass('droppable-hover');
scope.$emit('CopyMoveGroup', ui.draggable.attr('data-tree-id'), $(this).attr('data-tree-id')); scope.$emit('CopyMoveGroup', ui.draggable.attr('data-tree-id'), $(this).attr('data-tree-id'));
} },
tolerance: 'touch'
}); });
} }