Skip to content
GitLab
Commit 084e3e79 authored by Adrien Morais-Mestre's avatar Adrien Morais-Mestre Committed by Adrien Morais
Browse files

fix(global-health): issue when reload widget after refresh interval reached (#43)

parent 3fa7bdba
Hide whitespace changes
Inline Side-by-side
global-health/index.php
View file @ 084e3e79
<?php
/*
* Copyright 2005-2020 Centreon
* Copyright 2005-2021 Centreon
* Centreon is developed by : Julien Mathis and Romain Le Merlus under
* GPL Licence 2.0.
*
......@@ -112,7 +112,7 @@ try {
jQuery("#global_health").html(htmlData);
let h = jQuery("#global_health").prop("scrollHeight") + 36;
parent.iResize(window.name, h);
jQuery("#global_health").find("img, style, script, link").load(function () {
jQuery("#global_health").find("img, style, script, link").on('load', function () {
let h = jQuery("#global_health").prop("scrollHeight") + 36;
parent.iResize(window.name, h);
});
......
global-health/src/global_health.php
View file @ 084e3e79
<?php
/*
* Copyright 2005-2020 Centreon
* Copyright 2005-2021 Centreon
* Centreon is developed by : Julien Mathis and Romain Le Merlus under
* GPL Licence 2.0.
*
......
global-health/src/global_health_host.ihtml
View file @ 084e3e79
......@@ -29,7 +29,7 @@
</thead>
<tbody>
<tr>
<td> <span class="ListColCenter state_badge" style="background:#87BD23"></span> <b> Ok </b> </td>
<td> <span class="ListColCenter state_badge" style="background:#87BD23"></span> <b> Up </b> </td>
<td> {$hosts.UP.value} </td>
<td> {$hosts.UP.acknowledged} </td>
<td> {$hosts.UP.downtime} </td>
......@@ -64,61 +64,63 @@
</div>
<script>
{literal}
let UP = {/literal}{$hosts.UP.percent}{literal};
let DOWN = {/literal}{$hosts.DOWN.percent}{literal};
let UNREACHABLE = {/literal}{$hosts.UNREACHABLE.percent}{literal};
let PENDING = {/literal}{$hosts.PENDING.percent}{literal};
(() => {
let UP = {/literal}{$hosts.UP.percent}{literal};
let DOWN = {/literal}{$hosts.DOWN.percent}{literal};
let UNREACHABLE = {/literal}{$hosts.UNREACHABLE.percent}{literal};
let PENDING = {/literal}{$hosts.PENDING.percent}{literal};
let options = {
chart: {
id:'hosts',
width:260,
type:'pie',
height:200,
},
legend: {
show:false,
position:'bottom',
},
responsive: [{
breakpoint:480,
options: {
chart: {
width:230
let options = {
chart: {
id:'hosts',
width:260,
type:'pie',
height:200,
},
legend: {
show:false,
position:'bottom',
},
responsive: [{
breakpoint:480,
options: {
chart: {
width:230
}
}
}
}],
dataLabels: {
style: {
fontSize:'12px',
fontFamily:'Arial, sans-serif',
colors:['#000000']
},
},
tooltip: {
fillSeriesColor: false,
},
plotOptions: {
pie: {
dataLabels: {
offset:0,
minAngleToShowLabel:25
}],
dataLabels: {
style: {
fontSize:'12px',
fontFamily:'Arial, sans-serif',
colors:['#000000']
},
},
},
labels:['Up', 'Down', 'Unreachable', 'Pending'],
series:[UP, DOWN, UNREACHABLE, PENDING],
colors:['#87BD23', '#ED1C24', '#CDCDCD','#2AD1D4']
};
//The legend appear when the user hide the table because the table include it originally
{/literal}{if $preferences.hide_table}
options.legend.show = true;
{/if}{literal}
},
tooltip: {
fillSeriesColor: false,
},
plotOptions: {
pie: {
dataLabels: {
offset:0,
minAngleToShowLabel:25
},
},
},
labels:['Up', 'Down', 'Unreachable', 'Pending'],
series:[UP, DOWN, UNREACHABLE, PENDING],
colors:['#87BD23', '#ED1C24', '#CDCDCD','#2AD1D4']
};
//The legend appear when the user hide the table because the table include it originally
{/literal}{if $preferences.hide_table}
options.legend.show = true;
{/if}{literal}
const chart = new ApexCharts(
document.querySelector("#global_health_host_div"),
options
);
chart.render();
const chart = new ApexCharts(
document.querySelector("#global_health_host_div"),
options
);
chart.render();
})()
{/literal}
</script>
global-health/src/global_health_service.ihtml
View file @ 084e3e79
......@@ -69,62 +69,64 @@
</div>
<script>
{literal}
let OK = {/literal}{$services.OK.percent}{literal};
let WARNING = {/literal}{$services.WARNING.percent}{literal};
let CRITICAL = {/literal}{$services.CRITICAL.percent}{literal};
let UNKNOWN = {/literal}{$services.UNKNOWN.percent}{literal};
let PENDING = {/literal}{$services.PENDING.percent}{literal};
(() => {
let OK = {/literal}{$services.OK.percent}{literal};
let WARNING = {/literal}{$services.WARNING.percent}{literal};
let CRITICAL = {/literal}{$services.CRITICAL.percent}{literal};
let UNKNOWN = {/literal}{$services.UNKNOWN.percent}{literal};
let PENDING = {/literal}{$services.PENDING.percent}{literal};
let options = {
chart: {
id:'svc',
width:260,
type:'pie',
height:200,
},
legend: {
show:false,
position:'bottom'
},
responsive: [{
breakpoint:480,
options: {
chart: {
width:230
let options = {
chart: {
id:'svc',
width:260,
type:'pie',
height:200,
},
legend: {
show:false,
position:'bottom'
},
responsive: [{
breakpoint:480,
options: {
chart: {
width:230
}
}
}
}],
dataLabels: {
style: {
fontSize:'12px',
fontFamily:'Arial, sans-serif',
colors:['#000000']
},
},
tooltip:{
fillSeriesColor: false,
},
plotOptions: {
pie: {
dataLabels: {
offset:0,
minAngleToShowLabel:25
}],
dataLabels: {
style: {
fontSize:'12px',
fontFamily:'Arial, sans-serif',
colors:['#000000']
},
},
},
labels:['Ok', 'Warning', 'Critical','Unknown', 'Pending'],
series:[OK, WARNING, CRITICAL,UNKNOWN, PENDING],
colors:['#87BD23','#FF9913', '#ED1C24', '#CDCDCD','#2AD1D4']
};
//The legend appear when the user hide the table because the table include it originally
{/literal}{if $preferences.hide_table}
options.legend.show = true;
{/if}{literal}
},
tooltip:{
fillSeriesColor: false,
},
plotOptions: {
pie: {
dataLabels: {
offset:0,
minAngleToShowLabel:25
},
},
},
labels:['Ok', 'Warning', 'Critical','Unknown', 'Pending'],
series:[OK, WARNING, CRITICAL,UNKNOWN, PENDING],
colors:['#87BD23','#FF9913', '#ED1C24', '#CDCDCD','#2AD1D4']
};
//The legend appear when the user hide the table because the table include it originally
{/literal}{if $preferences.hide_table}
options.legend.show = true;
{/if}{literal}
const chart = new ApexCharts(
document.querySelector("#global_health_svc_div"),
options
);
chart.render();
const chart = new ApexCharts(
document.querySelector("#global_health_svc_div"),
options
);
chart.render();
})()
{/literal}
</script>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment