108 lines
4.1 KiB
Twig
108 lines
4.1 KiB
Twig
{% extends '@CadolesCore/base.html.twig' %}
|
|
{% block pagewrapper %}
|
|
<div class="row" style="margin-top:20px">
|
|
<div class="col-md-6" style="padding:20px;text-align:center;">
|
|
<div class="col-md-12">
|
|
<h1 style="margin-top:0px"><i class="fa fa-server fa-fw"></i>Serveurs = {{ totalserveurs }} </h1>
|
|
</div>
|
|
|
|
|
|
<div class="col-md-6" >
|
|
<h1>Serveurs par Module</h1>
|
|
<div id='bymodule-chart'></div>
|
|
<div id="bymodule-legend"></div>
|
|
</div>
|
|
|
|
<div class="col-md-6" >
|
|
<h1>Serveurs par Version</h1>
|
|
<div id='byversion-chart'></div>
|
|
<div id="byversion-legend"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6" style="padding:20px;text-align:center;margin: 0px;">
|
|
<div class="col-md-12">
|
|
<h1 style="margin-top:0px; margin-bottom:25px""><i class="fa fa-cubes fa-fw"></i>Applications = {{ totalapplications }} </h1>
|
|
</div>
|
|
|
|
<h1>Applications Installées</h1>
|
|
|
|
<div class="col-md-8" >
|
|
<div id='byapplication-chart'></div>
|
|
</div>
|
|
<div id="byapplication-legend" class="col-md-4"></div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block localjavascript %}
|
|
$(document).ready(function() {
|
|
//== byModule
|
|
var bymodule = Morris.Donut({
|
|
element: 'bymodule-chart',
|
|
data: [
|
|
{% for total in totalbymodules %}
|
|
{'label':'{{ total.label }}','value':{{ total.total }}},
|
|
{% endfor %}
|
|
],
|
|
resize: true
|
|
});
|
|
|
|
bymodule.options.data.forEach(function(label, i) {
|
|
var legendItem = $('<span style="margin:auto; width: 50%;display: block;text-align: left;"></span>').text( label['label'] + " ( " +label['value'] + " )" ).prepend('<span> </span>');
|
|
legendItem.find('span')
|
|
.css('backgroundColor', bymodule.options.colors[i])
|
|
.css('width', '20px')
|
|
.css('display', 'inline-block')
|
|
.css('margin', '5px');
|
|
$('#bymodule-legend').append(legendItem)
|
|
});
|
|
|
|
//== byVersion
|
|
var byversion = Morris.Donut({
|
|
element: 'byversion-chart',
|
|
data: [
|
|
{% for total in totalbyversions %}
|
|
{'label':'{{ total.label }}','value':{{ total.total }}},
|
|
{% endfor %}
|
|
],
|
|
resize: true
|
|
});
|
|
|
|
byversion.options.data.forEach(function(label, i) {
|
|
var legendItem = $('<span style="margin:auto; width: 50%;display: block;text-align: left;"></span>').text( label['label'] + " ( " +label['value'] + " )" ).prepend('<span> </span>');
|
|
legendItem.find('span')
|
|
.css('backgroundColor', byversion.options.colors[i])
|
|
.css('width', '20px')
|
|
.css('display', 'inline-block')
|
|
.css('margin', '5px');
|
|
$('#byversion-legend').append(legendItem)
|
|
});
|
|
|
|
//== byApplication
|
|
var byapplication = Morris.Donut({
|
|
element: 'byapplication-chart',
|
|
data: [
|
|
{% for total in totalbyapplications %}
|
|
{
|
|
'label':'{{ total.label }}',
|
|
'value':{{ total.total }},
|
|
},
|
|
{% endfor %}
|
|
],
|
|
resize: true
|
|
});
|
|
|
|
byapplication.options.data.forEach(function(label, i) {
|
|
var legendItem = $('<span style="display: block;text-align: left;"></span>').text( label['label'] + " ( " +label['value'] + " )" ).prepend('<span> </span>');
|
|
legendItem.find('span')
|
|
.css('backgroundColor', byapplication.options.colors[i])
|
|
.css('width', '20px')
|
|
.css('display', 'inline-block')
|
|
.css('margin', '0px 5px 5px 0px');
|
|
$('#byapplication-legend').append(legendItem)
|
|
|
|
});
|
|
});
|
|
{% endblock %} |