mirror of
https://github.com/ansible/awx.git
synced 2026-01-13 11:00:03 -03:30
create dashboard-hosts model, finish list view w/ status toggle, #1598
This commit is contained in:
Leigh Johnson
parent
434097101f
commit
baf8d9ef6f
@ -0,0 +1,19 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2016 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
export default
|
||||
['$scope', '$state', '$stateParams', 'DashboardHostsForm', 'GenerateForm', 'host',
|
||||
function($scope, $state, $stateParams, DashboardHostsForm, GenerateForm, host){
|
||||
var generator = GenerateForm,
|
||||
form = DashboardHostsForm;
|
||||
|
||||
var init = function(){
|
||||
$scope.host = host;
|
||||
GenerateForm.inject(form, {mode: 'edit', related: false, scope: $scope});
|
||||
};
|
||||
|
||||
init();
|
||||
}];
|
||||
@ -0,0 +1,4 @@
|
||||
<div class="tab-pane" id="organizations">
|
||||
<div ui-view></div>
|
||||
<div ng-cloak id="htmlTemplate" class="Panel"></div>
|
||||
</div>
|
||||
@ -0,0 +1,48 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2016 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
export default
|
||||
['$scope', '$state', '$stateParams', 'Rest', 'GetBasePath', 'DashboardHostsList',
|
||||
'generateList', 'PaginateInit', 'SetStatus', 'DashboardHostsService', 'hosts',
|
||||
function($scope, $state, $stateParams, Rest, GetBasePath, DashboardHostsList, GenerateList, PaginateInit, SetStatus, DashboardHostsService, hosts){
|
||||
var generator = GenerateList,
|
||||
list = DashboardHostsList,
|
||||
defaultUrl = GetBasePath('hosts');
|
||||
$scope.editHost = function(id){
|
||||
$state.go('dashboardHosts.edit', {id: id});
|
||||
};
|
||||
$scope.toggleHostEnabled = function(host){
|
||||
DashboardHostsService.setHostStatus(host, !host.enabled)
|
||||
.then(function(res){
|
||||
var index = _.findIndex($scope.hosts, function(o) {return o.id === res.data.id;});
|
||||
$scope.hosts[index].enabled = res.data.enabled;
|
||||
});
|
||||
};
|
||||
var setJobStatus = function(){
|
||||
_.forEach($scope.hosts, function(value, key){
|
||||
SetStatus({
|
||||
scope: $scope,
|
||||
host: value
|
||||
});
|
||||
});
|
||||
};
|
||||
var init = function(){
|
||||
$scope.list = list;
|
||||
$scope.host_active_search = false;
|
||||
$scope.host_total_rows = hosts.length;
|
||||
$scope.hosts = hosts;
|
||||
setJobStatus();
|
||||
generator.inject(list, {mode: 'edit', scope: $scope});
|
||||
PaginateInit({
|
||||
scope: $scope,
|
||||
list: list,
|
||||
url: defaultUrl
|
||||
});
|
||||
console.log($scope)
|
||||
$scope.hostLoading = false;
|
||||
};
|
||||
init();
|
||||
}];
|
||||
@ -0,0 +1,4 @@
|
||||
<div class="tab-pane" id="HomeHosts">
|
||||
<div ui-view></div>
|
||||
<div ng-cloak id="htmlTemplate" class="Panel"></div>
|
||||
</div>
|
||||
66
awx/ui/client/src/dashboard/hosts/dashboard-hosts.form.js
Normal file
66
awx/ui/client/src/dashboard/hosts/dashboard-hosts.form.js
Normal file
@ -0,0 +1,66 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2016 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
export default function(){
|
||||
return {
|
||||
editTitle: '{{host.name}}',
|
||||
name: 'host',
|
||||
well: true,
|
||||
formLabelSize: 'col-lg-3',
|
||||
formFieldSize: 'col-lg-9',
|
||||
headerFields:{
|
||||
enabled: {
|
||||
label: 'Enabled?',
|
||||
type: 'checkbox',
|
||||
editRequired: false,
|
||||
'default': true,
|
||||
awPopOver: "<p>Indicates if a host is available and should be included in running jobs.</p><p>For hosts that " +
|
||||
"are part of an external inventory, this flag cannot be changed. It will be set by the inventory sync process.</p>",
|
||||
dataTitle: 'Host Enabled'
|
||||
}
|
||||
},
|
||||
fields: {
|
||||
enabled: {
|
||||
label: 'Status',
|
||||
columnClass: 'List-staticColumn--toggle',
|
||||
type: 'toggle',
|
||||
ngClick: 'toggleHostEnabled(host)',
|
||||
searchable: false,
|
||||
nosort: true
|
||||
},
|
||||
name: {
|
||||
label: 'Host Name',
|
||||
type: 'text',
|
||||
editRequired: true,
|
||||
awPopOver: "<p>Provide a host name, ip address, or ip address:port. Examples include:</p>" +
|
||||
"<blockquote>myserver.domain.com<br/>" +
|
||||
"127.0.0.1<br />" +
|
||||
"10.1.0.140:25<br />" +
|
||||
"server.example.com:25" +
|
||||
"</blockquote>",
|
||||
},
|
||||
description: {
|
||||
label: 'Description',
|
||||
type: 'text',
|
||||
editRequired: false
|
||||
},
|
||||
variables: {
|
||||
label: 'Variables',
|
||||
type: 'textarea',
|
||||
editRequired: false,
|
||||
rows: 6,
|
||||
default: '---',
|
||||
awPopOver: "<p>Enter variables using either JSON or YAML syntax. Use the radio button to toggle between the two.</p>" +
|
||||
"JSON:<br />\n" +
|
||||
"<blockquote>{<br />\"somevar\": \"somevalue\",<br />\"password\": \"magic\"<br /> }</blockquote>\n" +
|
||||
"YAML:<br />\n" +
|
||||
"<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n" +
|
||||
'<p>View JSON examples at <a href="http://www.json.org" target="_blank">www.json.org</a></p>' +
|
||||
'<p>View YAML examples at <a href="http://docs.ansible.com/YAMLSyntax.html" target="_blank">docs.ansible.com</a></p>',
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
91
awx/ui/client/src/dashboard/hosts/dashboard-hosts.list.js
Normal file
91
awx/ui/client/src/dashboard/hosts/dashboard-hosts.list.js
Normal file
@ -0,0 +1,91 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2015 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
|
||||
export default function(){
|
||||
return {
|
||||
name: 'hosts',
|
||||
iterator: 'host',
|
||||
selectTitle: 'Add Existing Hosts',
|
||||
editTitle: 'Hosts',
|
||||
listTitle: 'Hosts',
|
||||
index: false,
|
||||
hover: true,
|
||||
well: true,
|
||||
|
||||
fields: {
|
||||
status: {
|
||||
basePath: 'unified_jobs',
|
||||
label: '',
|
||||
iconOnly: true,
|
||||
searchable: true,
|
||||
searchType: 'select',
|
||||
nosort: true,
|
||||
searchOptions: [],
|
||||
searchLabel: 'Job Status',
|
||||
icon: 'icon-job-{{ host.active_failures }}',
|
||||
awToolTip: '{{ host.badgeToolTip }}',
|
||||
awTipPlacement: 'right',
|
||||
dataPlacement: 'right',
|
||||
awPopOver: '{{ host.job_status_html }}',
|
||||
ngClick:'viewHost(host.id)',
|
||||
columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2 List-staticColumn--smallStatus'
|
||||
},
|
||||
name: {
|
||||
key: true,
|
||||
label: 'Name',
|
||||
columnClass: 'col-lg-5 col-md-5 col-sm-5 col-xs-8 ellipsis List-staticColumnAdjacent',
|
||||
ngClick: 'editHost(host.id)'
|
||||
},
|
||||
inventory_name: {
|
||||
label: 'Inventory',
|
||||
sourceModel: 'inventory',
|
||||
sourceField: 'name',
|
||||
columnClass: 'col-lg-5 col-md-4 col-sm-4 hidden-xs elllipsis',
|
||||
linkTo: "{{ '/#/inventories/' + host.inventory_id }}",
|
||||
searchable: false
|
||||
},
|
||||
enabled: {
|
||||
label: 'Status',
|
||||
columnClass: 'List-staticColumn--toggle',
|
||||
type: 'toggle',
|
||||
ngClick: 'toggleHostEnabled(host)',
|
||||
searchable: false,
|
||||
nosort: true
|
||||
},
|
||||
has_active_failures: {
|
||||
label: 'Has failed jobs?',
|
||||
searchSingleValue: true,
|
||||
searchType: 'boolean',
|
||||
searchValue: 'true',
|
||||
searchOnly: true
|
||||
},
|
||||
has_inventory_sources: {
|
||||
label: 'Has external source?',
|
||||
searchSingleValue: true,
|
||||
searchType: 'boolean',
|
||||
searchValue: 'true',
|
||||
searchOnly: true
|
||||
}
|
||||
},
|
||||
|
||||
fieldActions: {
|
||||
|
||||
columnClass: 'col-lg-2 col-md-3 col-sm-3 col-xs-4',
|
||||
edit: {
|
||||
label: 'Edit',
|
||||
ngClick: 'editHost(host.id)',
|
||||
icon: 'icon-edit',
|
||||
awToolTip: 'Edit host',
|
||||
dataPlacement: 'top'
|
||||
}
|
||||
},
|
||||
|
||||
actions: {
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
62
awx/ui/client/src/dashboard/hosts/dashboard-hosts.route.js
Normal file
62
awx/ui/client/src/dashboard/hosts/dashboard-hosts.route.js
Normal file
@ -0,0 +1,62 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2016 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import {templateUrl} from '../../shared/template-url/template-url.factory';
|
||||
import listController from './dashboard-hosts-list.controller';
|
||||
import editController from './dashboard-hosts-edit.controller';
|
||||
|
||||
var dashboardHostsList = {
|
||||
name: 'dashboardHosts',
|
||||
url: '/home/hosts',
|
||||
controller: listController,
|
||||
templateUrl: templateUrl('dashboard/hosts/dashboard-hosts-list'),
|
||||
data: {
|
||||
activityStream: true,
|
||||
activityStreamTarget: 'host'
|
||||
},
|
||||
ncyBreadcrumb: {
|
||||
parent: 'dashboard',
|
||||
label: "HOSTS"
|
||||
},
|
||||
resolve: {
|
||||
features: ['FeaturesService', function(FeaturesService) {
|
||||
return FeaturesService.get();
|
||||
}],
|
||||
hosts: ['Rest', 'GetBasePath', function(Rest, GetBasePath){
|
||||
var defaultUrl = GetBasePath('hosts') + '?page_size=10';
|
||||
Rest.setUrl(defaultUrl);
|
||||
return Rest.get().then(function(res){
|
||||
return _.map(res.data.results, function(value, key){
|
||||
value.inventory_name = value.summary_fields.inventory.name;
|
||||
value.inventory_id = value.summary_fields.inventory.id;
|
||||
return value;
|
||||
});
|
||||
});
|
||||
}]
|
||||
}
|
||||
};
|
||||
|
||||
var dashboardHostsEdit = {
|
||||
name: 'dashboardHosts.edit',
|
||||
url: '/:id',
|
||||
controller: editController,
|
||||
templateUrl: templateUrl('dashboard/hosts/dashboard-hosts-edit'),
|
||||
ncyBreadcrumb: {
|
||||
parent: 'dashboardHosts',
|
||||
label: "{{host.name}}"
|
||||
},
|
||||
resolve: {
|
||||
host: ['$stateParams', 'Rest', 'GetBasePath', function($stateParams, Rest, GetBasePath){
|
||||
var defaultUrl = GetBasePath('hosts') + '?id=' + $stateParams.id;
|
||||
Rest.setUrl(defaultUrl);
|
||||
return Rest.get().then(function(res){
|
||||
return res.data.results[0];
|
||||
});
|
||||
}]
|
||||
}
|
||||
};
|
||||
|
||||
export {dashboardHostsList, dashboardHostsEdit};
|
||||
18
awx/ui/client/src/dashboard/hosts/dashboard-hosts.service.js
Normal file
18
awx/ui/client/src/dashboard/hosts/dashboard-hosts.service.js
Normal file
@ -0,0 +1,18 @@
|
||||
export default
|
||||
['$rootScope', 'Rest', 'GetBasePath', 'ProcessErrors', function($rootScope, Rest, GetBasePath, ProcessErrors){
|
||||
return {
|
||||
|
||||
setHostStatus: function(host, enabled){
|
||||
var url = GetBasePath('hosts') + host.id;
|
||||
Rest.setUrl(url);
|
||||
return Rest.put({enabled: enabled, name: host.name})
|
||||
.success(function(data){
|
||||
return data;
|
||||
})
|
||||
.error(function(data, status) {
|
||||
ProcessErrors($rootScope, data, status, null, { hdr: 'Error!',
|
||||
msg: 'Call to ' + url + '. GET returned: ' + status });
|
||||
});
|
||||
}
|
||||
};
|
||||
}];
|
||||
20
awx/ui/client/src/dashboard/hosts/main.js
Normal file
20
awx/ui/client/src/dashboard/hosts/main.js
Normal file
@ -0,0 +1,20 @@
|
||||
/*************************************************
|
||||
* Copyright (c) 2016 Ansible, Inc.
|
||||
*
|
||||
* All Rights Reserved
|
||||
*************************************************/
|
||||
|
||||
import {dashboardHostsList, dashboardHostsEdit} from './dashboard-hosts.route';
|
||||
import list from './dashboard-hosts.list';
|
||||
import form from './dashboard-hosts.form';
|
||||
import service from './dashboard-hosts.service';
|
||||
|
||||
export default
|
||||
angular.module('dashboardHosts', [])
|
||||
.service('DashboardHostsService', service)
|
||||
.factory('DashboardHostsList', list)
|
||||
.factory('DashboardHostsForm', form)
|
||||
.run(['$stateExtender', function($stateExtender){
|
||||
$stateExtender.addState(dashboardHostsList);
|
||||
$stateExtender.addState(dashboardHostsEdit);
|
||||
}]);
|
||||
Loading…
x
Reference in New Issue
Block a user