mirror of
https://github.com/ansible/awx.git
synced 2026-01-14 11:20:39 -03:30
adding code for carousel for dashboard
This commit is contained in:
Jared Tabor
parent
e9115c5ca2
commit
33e5168213
@ -75,7 +75,8 @@ angular.module('Tower', [
|
||||
'License',
|
||||
'HostGroupsFormDefinition',
|
||||
'DashboardCountsWidget',
|
||||
'DashboardChartsWidget',
|
||||
'JobStatusGraphWidget',
|
||||
'HostGraphWidget',
|
||||
'DashboardJobsWidget',
|
||||
'StreamWidget',
|
||||
'JobsHelper',
|
||||
|
||||
@ -10,7 +10,7 @@
|
||||
|
||||
'use strict';
|
||||
|
||||
function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, DashboardCounts, DashboardCharts, DashboardJobs,
|
||||
function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, DashboardCounts, HostGraph, JobStatusGraph, DashboardJobs,
|
||||
ClearScope, Stream, Rest, GetBasePath, ProcessErrors, Button){
|
||||
|
||||
ClearScope('home');
|
||||
@ -76,16 +76,22 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
|
||||
target: 'container1',
|
||||
dashboard: data
|
||||
});
|
||||
DashboardCharts({
|
||||
JobStatusGraph({
|
||||
scope: $scope,
|
||||
target: 'container2',
|
||||
dashboard: data
|
||||
});
|
||||
DashboardJobs({
|
||||
HostGraph({
|
||||
scope: $scope,
|
||||
target: 'container3',
|
||||
dashboard: data
|
||||
});
|
||||
|
||||
DashboardJobs({
|
||||
scope: $scope,
|
||||
target: 'container4',
|
||||
dashboard: data
|
||||
});
|
||||
});
|
||||
|
||||
$scope.showActivity = function () {
|
||||
@ -112,7 +118,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
|
||||
|
||||
}
|
||||
|
||||
Home.$inject = ['$scope', '$compile', '$routeParams', '$rootScope', '$location', 'Wait', 'DashboardCounts', 'DashboardCharts', 'DashboardJobs', 'ClearScope', 'Stream', 'Rest', 'GetBasePath', 'ProcessErrors', 'Button'
|
||||
Home.$inject = ['$scope', '$compile', '$routeParams', '$rootScope', '$location', 'Wait', 'DashboardCounts', 'HostGraph','JobStatusGraph', 'DashboardJobs', 'ClearScope', 'Stream', 'Rest', 'GetBasePath', 'ProcessErrors', 'Button'
|
||||
];
|
||||
|
||||
|
||||
|
||||
@ -20,37 +20,174 @@ angular.module('DashboardCountsWidget', ['RestServices', 'Utilities'])
|
||||
|
||||
html, element;
|
||||
|
||||
html = "<div id=\"count-container\" class=\"panel-body\" style=\"border:none\">\n";
|
||||
html += "<table>\n";
|
||||
html += "<tr>\n";
|
||||
html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/home/hosts>" + dashboard.hosts.total+"</a></td>\n";
|
||||
html += "<td class=\"h1 col-lg-1-1 text-center\"><a href=/#/home/hosts>"+dashboard.hosts.failed+"</a></td>\n";
|
||||
html += "<td class=\"h1 col-lg-1-1 text-center\"><a href=/#/inventories>"+dashboard.inventories.total+"</a></td>\n";
|
||||
html += "<td class=\"h1 col-lg-1 text-center\" id=\"sync-failure\"><a href=/#/inventories/?inventory_sources_with_failures>"+dashboard.inventories.inventory_failed+"</a></td>\n";
|
||||
html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.total+"</a></td>\n";
|
||||
html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.failed+"</a></td>\n";
|
||||
html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/users>"+dashboard.users.total+"</a></td>\n";
|
||||
html += "</tr>\n";
|
||||
function createHTML(html){
|
||||
var docw = $(window).width();
|
||||
if(docw<768){
|
||||
|
||||
html += "<tr>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Hosts</td>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Failed Hosts</td>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Inventories</td>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Inventory Sync Failures</td>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Projects</td>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Project Sync Failures</td>\n";
|
||||
html += "<td class=\"h5 col-lg-1 text-center\">Users</td>\n";
|
||||
html += "</tr>\n";
|
||||
html += "</table>\n";
|
||||
html += "</div>\n";
|
||||
html += "<hr>\n";
|
||||
html = "<div id=\"dash-count-carousel\" class=\"carousel slide\" data-interval=\"1000\" data-ride=\"carousel\">\n" ;
|
||||
// html += " <!-- Indicators -->\n";
|
||||
html += "<ol class=\"carousel-indicators\">\n";
|
||||
html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"0\" class=\"active\"></li>\n";
|
||||
html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"1\"></li>\n";
|
||||
html += "<li data-target=\"#dash-count-carousel\" data-slide-to=\"2\"></li>\n";
|
||||
html += "</ol>\n";
|
||||
|
||||
//<!-- Wrapper for slides -->
|
||||
//html += "<div class=\"carousel-inner\">\n" ;
|
||||
html += "<div class=\"carousel-inner\">\n" ;
|
||||
html += "<div class=\"item active\">\n" ;
|
||||
html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
|
||||
html += "<div class=\"carousel-caption\">\n" ;
|
||||
html += "<p>Caption text here</p>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "<div class=\"item\">\n" ;
|
||||
html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
|
||||
html += "<div class=\"carousel-caption\">\n" ;
|
||||
html += "<p>Caption text here</p>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "<div class=\"item\">\n" ;
|
||||
html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
|
||||
html += "<div class=\"carousel-caption\">\n" ;
|
||||
html += "<p>Caption text here</p>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "<div class=\"item\">\n" ;
|
||||
html += "<img src=\"http://placehold.it/1200x480\" alt=\"\" />\n" ;
|
||||
html += "<div class=\"carousel-caption\">\n" ;
|
||||
html += "<p>Caption text here</p>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "</div>\n" ;
|
||||
html += "</div>\n" ;
|
||||
|
||||
// html += \"<!-- Controls -->\n" ;
|
||||
html += "<a class=\" carousel-control left\" href=\"#dash-count-carousel\" role=\"button\" data-slide=\"prev\">\n" ;
|
||||
html += "<span class=\"icon-prev\" onclick=\"javascript:$(\'.carousel\'').carousel(\'prev\'')\"></span>\n" ;
|
||||
html += "</a>\n" ;
|
||||
html += "<a class=\"carousel-control right\" href=\"#dash-count-carousel\" role=\"button\" data-slide=\"next\">\n" ;
|
||||
html += "<span class=\"icon-next\"></span>\n" ;
|
||||
html += "</a>\n" ;
|
||||
html += "</div>\n" ;
|
||||
// <!-- Controls -->
|
||||
// <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
|
||||
// <span class="glyphicon glyphicon-chevron-left"></span>
|
||||
// </a>
|
||||
// <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
|
||||
// <span class="glyphicon glyphicon-chevron-right"></span>
|
||||
// </a>
|
||||
// </div>
|
||||
// $('.carousel').carousel({
|
||||
// interval: 2000
|
||||
// })
|
||||
|
||||
|
||||
}
|
||||
else{
|
||||
html = "<div id=\"count-container\" class=\"panel-body\" style=\"borderBottom:thick solid #0000FF\">\n";
|
||||
html += "<table class=\"table-bordered\">\n";
|
||||
html += "<tr>\n";
|
||||
html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/home/hosts>" + dashboard.hosts.total+"</a></td>\n";
|
||||
html += "<td class=\"h2 col-lg-1-1 text-center\"><a href=/#/home/hosts>"+dashboard.hosts.failed+"</a></td>\n";
|
||||
html += "<td class=\"h2 col-lg-1-1 text-center\"><a href=/#/inventories>"+dashboard.inventories.total+"</a></td>\n";
|
||||
html += "<td class=\"h2 col-lg-1 text-center\" id=\"sync-failure\"><a href=/#/inventories/?inventory_sources_with_failures>"+dashboard.inventories.inventory_failed+"</a></td>\n";
|
||||
html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.total+"</a></td>\n";
|
||||
html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.failed+"</a></td>\n";
|
||||
html += "<td class=\"h2 col-lg-1 text-center\"><a href=/#/users>"+dashboard.users.total+"</a></td>\n";
|
||||
html += "</tr>\n";
|
||||
|
||||
html += "<tr>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Hosts</td>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Failed Hosts</td>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Inventories</td>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Inventory Sync Failures</td>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Projects</td>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Project Sync Failures</td>\n";
|
||||
html += "<td class=\"h6 col-lg-1 text-center\">Users</td>\n";
|
||||
html += "</tr>\n";
|
||||
html += "</table>\n";
|
||||
html += "</div>\n";
|
||||
// html += "<hr>\n";
|
||||
|
||||
}
|
||||
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// html = "<div id=\"count-container\" class=\"panel-body visible-xs-block\" style=\"border:none\">\n";
|
||||
// html += "<table>table1\n";
|
||||
// html += "<tr>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/home/hosts>" + dashboard.hosts.total+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1-1 text-center\"><a href=/#/home/hosts>"+dashboard.hosts.failed+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1-1 text-center\"><a href=/#/inventories>"+dashboard.inventories.total+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\" id=\"sync-failure\"><a href=/#/inventories/?inventory_sources_with_failures>"+dashboard.inventories.inventory_failed+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.total+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.failed+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/users>"+dashboard.users.total+"</a></td>\n";
|
||||
// html += "</tr>\n";
|
||||
|
||||
// html += "<tr>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Hosts</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Failed Hosts</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Inventories</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Inventory Sync Failures</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Projects</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Project Sync Failures</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Users</td>\n";
|
||||
// html += "</tr>\n";
|
||||
// html += "</table>\n";
|
||||
// html += "</div>\n";
|
||||
// html += "<hr>\n";
|
||||
|
||||
//--------------------------------------------------------------------------------------------------------------------
|
||||
// html = "<div id=\"count-container\" class=\"panel-body visible-md-block\" style=\"border:none\">\n";
|
||||
// html += "<table>table2\n";
|
||||
// html += "<tr>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/home/hosts>" + dashboard.hosts.total+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1-1 text-center\"><a href=/#/home/hosts>"+dashboard.hosts.failed+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1-1 text-center\"><a href=/#/inventories>"+dashboard.inventories.total+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\" id=\"sync-failure\"><a href=/#/inventories/?inventory_sources_with_failures>"+dashboard.inventories.inventory_failed+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.total+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/projects>"+dashboard.projects.failed+"</a></td>\n";
|
||||
// html += "<td class=\"h1 col-lg-1 text-center\"><a href=/#/users>"+dashboard.users.total+"</a></td>\n";
|
||||
// html += "</tr>\n";
|
||||
|
||||
// html += "<tr>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Hosts</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Failed Hosts</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Inventories</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Inventory Sync Failures</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Projects</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Project Sync Failures</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-1 text-center\">Users</td>\n";
|
||||
// html += "</tr>\n";
|
||||
// html += "</table>\n";
|
||||
// html += "</div>\n";
|
||||
// html += "<hr>\n";
|
||||
//--------------------------------------------------------------------------------------------------------------------
|
||||
element = angular.element(document.getElementById(target));
|
||||
element.html(html);
|
||||
element.html(createHTML(html));
|
||||
$compile(element)(scope);
|
||||
|
||||
scope.$emit('WidgetLoaded');
|
||||
|
||||
|
||||
//window.onresize = scaleForSmallDevices;
|
||||
|
||||
function scaleForSmallDevices(){
|
||||
var docw = $(window).width();
|
||||
if(docw<600){
|
||||
alert('success');
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
}
|
||||
]);
|
||||
@ -129,7 +129,7 @@ angular.module('DashboardJobsWidget', ['RestServices', 'Utilities'])
|
||||
search_row = Math.max($('.search-row:eq(0)').outerHeight(), 50);
|
||||
page_row = Math.max($('.page-row:eq(0)').outerHeight(), 33);
|
||||
header = Math.max($('#completed_jobs_table thead').height(), 41);
|
||||
height = Math.floor(available_height) - header - page_row - 15;
|
||||
height = Math.floor(available_height) - header - page_row ;
|
||||
row_height = (docw < 1415) ? 47 : 27;
|
||||
//$('.jobs-list-container tbody tr:eq(0)').height(); <-- only works if data is loaded
|
||||
max_rows = Math.floor(height / row_height);
|
||||
|
||||
110
awx/ui/static/js/widgets/HostGraph.js
Normal file
110
awx/ui/static/js/widgets/HostGraph.js
Normal file
@ -0,0 +1,110 @@
|
||||
/*********************************************
|
||||
* Copyright (c) 2014 AnsibleWorks, Inc.
|
||||
*
|
||||
* Dashboard.js
|
||||
*
|
||||
* The new dashboard
|
||||
*
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
|
||||
.factory('HostGraph', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
|
||||
function ($rootScope, $compile) {
|
||||
return function (params) {
|
||||
|
||||
var scope = params.scope,
|
||||
target = params.target,
|
||||
//dashboard = params.dashboard,
|
||||
|
||||
html, element;
|
||||
|
||||
// html = "<div class=\"panel panel-default\" style=\"border:none\">\n";
|
||||
html = "<div id=\"graph-container\" class=\"panel-body \" style=\"border:none\">\n";
|
||||
|
||||
html += "<table class=\"table\" >\n";
|
||||
html += "<tr> \n";
|
||||
// html += "<td class=\"h5 col-lg-6 text-center\" style=\"border:none\">Job Status</td>\n";
|
||||
html += "<td class=\"h6 text-center\" style=\"border:none\">Hosts vs License Agreement</td>\n";
|
||||
html += "</tr>\n";
|
||||
html += "<tr>\n";
|
||||
// html += "<td class=\"job-status-graph\" style=\"border:none\"><svg></svg></td>\n";
|
||||
html += "<td class=\"host-count-graph\" style=\"border:none\"><svg></svg></td>\n";
|
||||
html += "</tr>\n";
|
||||
html += "</table>\n";
|
||||
html += "</div>\n";
|
||||
// html += "</div>\n";
|
||||
|
||||
|
||||
|
||||
function makeHostCountGraph(){
|
||||
d3.json("static/js/hostcount.json",function(error,data) {
|
||||
|
||||
data.map(function(series) {
|
||||
series.values = series.values.map(function(d) { return {x: d[0], y: d[1] }; });
|
||||
return series;
|
||||
});
|
||||
|
||||
nv.addGraph({
|
||||
generate: function() {
|
||||
var width = nv.utils.windowSize().width/3,
|
||||
height = nv.utils.windowSize().height/4,
|
||||
chart = nv.models.lineChart()
|
||||
.margin({top: 15, right: 75, bottom: 40, left: 80})
|
||||
.x(function(d,i) { return i ;})
|
||||
.useInteractiveGuideline(true) //We want nice looking tooltips and a guideline!
|
||||
.transitionDuration(350) //how fast do you want the lines to transition?
|
||||
.showLegend(true) //Show the legend, allowing users to turn on/off line series.
|
||||
.showYAxis(true) //Show the y-axis
|
||||
.showXAxis(true) //Show the x-axis
|
||||
;
|
||||
|
||||
chart.xAxis
|
||||
.axisLabel("Time")
|
||||
.tickFormat(function(d) {
|
||||
var dx = data[0].values[d] && data[0].values[d].x || 0;
|
||||
return dx ? d3.time.format('%m/%d')(new Date(dx)) : '';
|
||||
});
|
||||
|
||||
chart.yAxis //Chart y-axis settings
|
||||
.axisLabel('Hosts')
|
||||
.tickFormat(d3.format('.f'));
|
||||
|
||||
d3.select('.host-count-graph svg')
|
||||
.datum(data).transition()
|
||||
.attr('width', width)
|
||||
.attr('height', height)
|
||||
.duration(500)
|
||||
.call(chart)
|
||||
.style({
|
||||
// 'width': width,
|
||||
// 'height': height,
|
||||
"font-family": 'Open Sans',
|
||||
"font-style": "normal",
|
||||
"font-weight":400,
|
||||
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
|
||||
});
|
||||
|
||||
d3.selectAll(".nv-line").on("click", function () {
|
||||
alert("clicked");
|
||||
});
|
||||
|
||||
nv.utils.windowResize(chart.update);
|
||||
return chart;
|
||||
},
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
element = angular.element(document.getElementById(target));
|
||||
element.html(html);
|
||||
$compile(element)(scope);
|
||||
// makeJobStatusGraph();
|
||||
makeHostCountGraph();
|
||||
scope.$emit('WidgetLoaded');
|
||||
|
||||
};
|
||||
}
|
||||
]);
|
||||
@ -9,8 +9,8 @@
|
||||
|
||||
'use strict';
|
||||
|
||||
angular.module('DashboardChartsWidget', ['RestServices', 'Utilities'])
|
||||
.factory('DashboardCharts', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
|
||||
angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
|
||||
.factory('JobStatusGraph', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
|
||||
function ($rootScope, $compile) {
|
||||
return function (params) {
|
||||
|
||||
@ -23,14 +23,14 @@ angular.module('DashboardChartsWidget', ['RestServices', 'Utilities'])
|
||||
// html = "<div class=\"panel panel-default\" style=\"border:none\">\n";
|
||||
html = "<div id=\"graph-container\" class=\"panel-body \" style=\"border:none\">\n";
|
||||
|
||||
html += "<table class=\"table\" >\n";
|
||||
html += "<table class=\"table table-bordered\" >\n";
|
||||
html += "<tr> \n";
|
||||
html += "<td class=\"h5 col-lg-6 text-center\" style=\"border:none\">Job Status</td>\n";
|
||||
html += "<td class=\"h5 col-lg-6 text-center\" style=\"border:none\">Hosts vs License Agreement</td>\n";
|
||||
html += "<td class=\"h6 col-lg-6 text-center\" style=\"border:none\">Job Status</td>\n";
|
||||
// html += "<td class=\"h5 col-lg-6 text-center\" style=\"border:none\">Hosts vs License Agreement</td>\n";
|
||||
html += "</tr>\n";
|
||||
html += "<tr>\n";
|
||||
html += "<td class=\"job-status-graph\" style=\"border:none\"><svg></svg></td>\n";
|
||||
html += "<td class=\"host-count-graph\" style=\"border:none\"><svg></svg></td>\n";
|
||||
// html += "<td class=\"host-count-graph\" style=\"border:none\"><svg></svg></td>\n";
|
||||
html += "</tr>\n";
|
||||
html += "</table>\n";
|
||||
html += "</div>\n";
|
||||
@ -148,6 +148,11 @@ angular.module('DashboardChartsWidget', ['RestServices', 'Utilities'])
|
||||
"font-weight":400,
|
||||
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
|
||||
});
|
||||
|
||||
d3.selectAll(".nv-line").on("click", function () {
|
||||
alert("clicked");
|
||||
});
|
||||
|
||||
nv.utils.windowResize(chart.update);
|
||||
return chart;
|
||||
},
|
||||
@ -160,7 +165,7 @@ angular.module('DashboardChartsWidget', ['RestServices', 'Utilities'])
|
||||
element.html(html);
|
||||
$compile(element)(scope);
|
||||
makeJobStatusGraph();
|
||||
makeHostCountGraph();
|
||||
// makeHostCountGraph();
|
||||
scope.$emit('WidgetLoaded');
|
||||
|
||||
};
|
||||
@ -8,7 +8,7 @@
|
||||
*/
|
||||
|
||||
#sync-failure {
|
||||
color:red;
|
||||
color:red;
|
||||
}
|
||||
|
||||
.job-status-graph, .host-count-graph{
|
||||
@ -27,4 +27,25 @@
|
||||
stroke: steelblue;
|
||||
stroke-width: 1.5px;
|
||||
}
|
||||
.jobs-list-container {
|
||||
border: 1px solid @grey;
|
||||
border-radius: 4px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.carousel-control.left, .carousel-control.right {
|
||||
background-image: none
|
||||
}
|
||||
|
||||
.custon-carousel{
|
||||
width:150px;
|
||||
height:200px;
|
||||
min-width:150px;
|
||||
min-height:100px;
|
||||
max-width:200px;
|
||||
max-height:100px;
|
||||
overflow:hidden;
|
||||
display:block;
|
||||
border:1px solid black;
|
||||
background-color: #A9A9A9;
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
|
||||
<div class="tab-pane" id="home">
|
||||
<div ng-cloak id="htmlTemplate">
|
||||
<div ng-cloak id="htmlTemplate" style="padding:20px">
|
||||
<!--<div id="refresh-row" class="row">
|
||||
<div class="col-lg-12">
|
||||
<div id="home-list-actions" class="list-actions pull-right"></div>
|
||||
@ -11,10 +11,11 @@
|
||||
<div id="container1" class="col-lg-12"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div id="container2" class="col-lg-12"></div>
|
||||
<div id="container2" class="col-lg-6"></div>
|
||||
<div id="container3" class="col-lg-6"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div id="container3" class="col-lg-12"></div>
|
||||
<div id="container4" class="col-lg-6 "></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -163,7 +163,8 @@
|
||||
<script src="{{ STATIC_URL }}js/helpers/JobTemplates.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/JobStatus.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/DashboardCounts.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/DashboardCharts.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/HostGraph.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/JobStatusGraph.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/DashboardJobs.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/widgets/Stream.js"></script>
|
||||
<script src="{{ STATIC_URL }}js/help/InventoryGroups.js"></script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user