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

fix host summary display when 0 search results are found, fix graph sizing, resolves #2399 (#2430)

This commit is contained in:
Leigh 2016-06-16 10:03:37 -04:00 committed by GitHub
parent e75cf000e4
commit 219b570eb6
4 changed files with 34 additions and 57 deletions

View File

@ -1017,36 +1017,7 @@ export default
.style({
"text-anchor": 'start'
});
/*
d3.select(element.find(".nv-label text")[1])
.attr("class", "HostSummary-graph--changed")
.style({
"font-family": 'Open Sans',
"font-size": "16px",
"text-transform" : "uppercase",
"fill" : colors[1],
"src": "url(/static/assets/OpenSans-Regular.ttf)"
});
d3.select(element.find(".nv-label text")[2])
.attr("class", "HostSummary-graph--failed")
.style({
"font-family": 'Open Sans',
"font-size": "16px",
"text-transform" : "uppercase",
"fill" : colors[2],
"src": "url(/static/assets/OpenSans-Regular.ttf)"
});
d3.select(element.find(".nv-label text")[3])
.attr("class", "HostSummary-graph--unreachable")
.style({
"font-family": 'Open Sans',
"font-size": "16px",
"text-transform" : "uppercase",
"fill" : colors[3],
"src": "url(/static/assets/OpenSans-Regular.ttf)"
});
*/
return job_detail_chart;
return job_detail_chart;
};
}])

View File

@ -10,21 +10,6 @@
var page_size = 200;
$scope.loading = $scope.hosts.length > 0 ? false : true;
$scope.filter = 'all';
$scope.search = null;
var init = function(){
Wait('start');
JobDetailService.getJobHostSummaries($stateParams.id, {page_size: page_size})
.success(function(res){
$scope.hosts = res.results;
$scope.next = res.next;
Wait('stop');
});
JobDetailService.getJob({id: $stateParams.id})
.success(function(res){
$scope.status = res.results[0].status;
});
};
var buildGraph = function(hosts){
// status waterfall: unreachable > failed > changed > ok > skipped
@ -48,6 +33,21 @@
};
return count;
};
var init = function(){
Wait('start');
JobDetailService.getJobHostSummaries($stateParams.id, {page_size: page_size})
.success(function(res){
$scope.hosts = res.results;
$scope.next = res.next;
$scope.count = buildGraph(res.results);
Wait('stop');
DrawGraph({count: $scope.count, resize:true});
});
JobDetailService.getJob({id: $stateParams.id})
.success(function(res){
$scope.status = res.results[0].status;
});
};
var socketListener = function(){
// emitted by the API in the same function used to persist host summary data
// JobEvent.update_host_summary_from_stats() from /awx/main.models.jobs.py
@ -64,6 +64,7 @@
}
});
};
$scope.buildTooltip = function(n, status){
var grammar = function(n, status){
var dict = {
@ -92,6 +93,7 @@
}
};
$scope.search = function(){
$scope.searchActive = true;
Wait('start');
JobDetailService.getJobHostSummaries($stateParams.id, {
page_size: page_size,
@ -102,6 +104,11 @@
Wait('stop');
});
};
$scope.clearSearch = function(){
$scope.searchActive = false;
$scope.searchTerm = null;
init();
};
$scope.setFilter = function(filter){
$scope.filter = filter;
var getAll = function(){
@ -127,11 +134,10 @@
};
$scope.get = filter === 'all' ? getAll() : getFailed();
};
$scope.$watchCollection('hosts', function(curr){
$scope.count = buildGraph(curr);
DrawGraph({count: $scope.count, resize:true});
});
socketListener();
init();
// calling the init routine twice will size the d3 chart correctly - no idea why
// instantiating the graph inside a setTimeout() SHOULD have the same effect, but it doesn't
// instantiating the graph further down the promise chain e.g. .then() or .finally() also does not work
init();
}];

View File

@ -1,13 +1,13 @@
<div id="hosts-summary-section" class="section">
<div class="JobDetail-instructions" ng-hide="hosts.length == 0"><span class="badge">4</span> Please select a host below to view a summary of all associated tasks.</div>
<div class="JobDetail-searchHeaderRow" ng-hide="hosts.length == 0">
<div class="JobDetail-instructions" ng-hide="hosts.length == 0 && !searchTerm"><span class="badge">4</span> Please select a host below to view a summary of all associated tasks.</div>
<div class="JobDetail-searchHeaderRow" ng-hide="hosts.length == 0 && !searchTerm">
<div class="JobDetail-searchContainer form-group">
<div class="search-name">
<form ng-submit="search()">
<input type="text" class="JobDetail-searchInput form-control List-searchInput" id="search_host_summary_name" ng-model="searchTerm" placeholder="Host Name" />
<a class="List-searchInputIcon search-icon" ng-click="search()"><i class="fa fa-search"></i></a>
<a class="List-searchInputIcon search-icon" ng-click="search()" ng-show="!searchActive"><i class="fa fa-search"></i></a>
<a class="List-searchInputIcon search-icon" ng-show="searchActive" ng-click="clearSearch()"><i class="fa fa-times"></i></a>
</form>
</div>
</div>
@ -22,7 +22,7 @@
</div>
</div>
<div class="table-header" ng-hide="hosts.length == 0">
<div class="table-header" ng-hide="hosts.length == 0 && !searchTerm">
<table class="table table-condensed">
<thead>
<tr>

View File

@ -738,11 +738,11 @@ export default
scope.toggleLessEvents = function() {
if (!scope.lessEvents) {
$('#events-summary').slideUp(200);
$('#events-summary').slideUp(0);
scope.lessEvents = true;
}
else {
$('#events-summary').slideDown(200);
$('#events-summary').slideDown(0);
scope.lessEvents = false;
}
};