Update chart.js v3 to v4 (#6529)
* Update chart.min.js * Update missed_calls.php * Update recent_calls.php * Update system_counts.php * Update system_cpu_status.php * Update system_status.php * Update domain_limits.php * Update voicemails.php
This commit is contained in:
parent
310d4d00e7
commit
37ab508d1b
|
|
@ -71,43 +71,37 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
var domain_limits_chart_context = document.getElementById('domain_limits_chart').getContext('2d');
|
||||
|
||||
const domain_limits_chart_data = {
|
||||
datasets: [{
|
||||
data:['<?php echo $hud_stat; ?>', 0.00001],
|
||||
borderColor: 'rgba(0,0,0,0)',
|
||||
backgroundColor: ['#2a9df4', '#d4d4d4'],
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const domain_limits_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: domain_limits_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $hud_stat; ?>',
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-domain_limits']; ?>',
|
||||
fontFamily: chart_text_font
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
};
|
||||
|
||||
const domain_limits_chart = new Chart(
|
||||
domain_limits_chart_context,
|
||||
domain_limits_chart_config
|
||||
document.getElementById('domain_limits_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data:['<?php echo $hud_stat; ?>', 0.00001],
|
||||
borderColor: 'rgba(0,0,0,0)',
|
||||
backgroundColor: ['#2a9df4', '#d4d4d4'],
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $hud_stat; ?>',
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-domain_limits']; ?>',
|
||||
fontFamily: chart_text_font
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -80,48 +80,42 @@
|
|||
//add doughnut chart
|
||||
?>
|
||||
<div style='display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 20px;'>
|
||||
<div style='width: 175px; height: 175px;'><canvas id='switch_status_chart'></canvas></div>
|
||||
<canvas id='switch_status_chart' width='175px' height='175px'></canvas>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var switch_status_chart_context = document.getElementById('switch_status_chart').getContext('2d');
|
||||
|
||||
const switch_status_chart_data = {
|
||||
datasets: [{
|
||||
data: ['<?php echo $registrations; ?>', 0.00001],
|
||||
backgroundColor: ['<?php echo $_SESSION['dashboard']['switch_status_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['switch_status_chart_sub_background_color']['text']; ?>'],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['switch_status_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['switch_status_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const switch_status_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: switch_status_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $registrations; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-switch_status']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
};
|
||||
|
||||
const switch_status_chart = new Chart(
|
||||
switch_status_chart_context,
|
||||
switch_status_chart_config
|
||||
document.getElementById('switch_status_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: ['<?php echo $registrations; ?>', 0.00001],
|
||||
backgroundColor: ['<?php echo $_SESSION['dashboard']['switch_status_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['switch_status_chart_sub_background_color']['text']; ?>'],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['switch_status_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['switch_status_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $registrations; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-switch_status']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -290,52 +290,46 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
var system_counts_chart_context = document.getElementById('system_counts_chart').getContext('2d');
|
||||
|
||||
const system_counts_chart_data = {
|
||||
labels: ['<?php echo $text['label-active']; ?>: <?php echo $domain_active; ?>', '<?php echo $text['label-inactive']; ?>: <?php echo $domain_inactive; ?>'],
|
||||
datasets: [{
|
||||
data: ['<?php echo $domain_active; ?>', '<?php echo $domain_inactive; ?>'],
|
||||
backgroundColor: [
|
||||
'<?php echo $_SESSION['dashboard']['system_counts_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['system_counts_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['system_counts_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['system_counts_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const system_counts_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: system_counts_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $domain_total; ?>'
|
||||
},
|
||||
legend: {
|
||||
position: 'right',
|
||||
reverse: true,
|
||||
labels: {
|
||||
usePointStyle: true,
|
||||
pointStyle: 'rect'
|
||||
}
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-system_counts']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
};
|
||||
|
||||
const system_counts_chart = new Chart(
|
||||
system_counts_chart_context,
|
||||
system_counts_chart_config
|
||||
document.getElementById('system_counts_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
labels: ['<?php echo $text['label-active']; ?>: <?php echo $domain_active; ?>', '<?php echo $text['label-inactive']; ?>: <?php echo $domain_inactive; ?>'],
|
||||
datasets: [{
|
||||
data: ['<?php echo $domain_active; ?>', '<?php echo $domain_inactive; ?>'],
|
||||
backgroundColor: [
|
||||
'<?php echo $_SESSION['dashboard']['system_counts_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['system_counts_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['system_counts_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['system_counts_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $domain_total; ?>'
|
||||
},
|
||||
legend: {
|
||||
position: 'right',
|
||||
reverse: true,
|
||||
labels: {
|
||||
usePointStyle: true,
|
||||
pointStyle: 'rect'
|
||||
}
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-system_counts']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -57,12 +57,10 @@
|
|||
//add half doughnut chart
|
||||
?>
|
||||
<div style='display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 20px'>
|
||||
<div style='width: 175px; height: 175px; margin: 0 auto;'><canvas id='system_cpu_status_chart'></canvas></div>
|
||||
<div><canvas id='system_cpu_status_chart' width='175px' height='175px' ></canvas></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var system_cpu_status_chart_context = document.getElementById('system_cpu_status_chart').getContext('2d');
|
||||
|
||||
var system_cpu_status_chart_background_color;
|
||||
if ('<?php echo $percent_cpu; ?>' <= 60) {
|
||||
system_cpu_status_chart_background_color = '<?php echo $_SESSION['dashboard']['cpu_usage_chart_main_background_color'][0]; ?>';
|
||||
|
|
@ -72,50 +70,46 @@
|
|||
system_cpu_status_chart_background_color = '<?php echo $_SESSION['dashboard']['cpu_usage_chart_main_background_color'][2]; ?>';
|
||||
}
|
||||
|
||||
const system_cpu_status_chart_data = {
|
||||
datasets: [{
|
||||
data: ['<?php echo $percent_cpu; ?>', 100 - '<?php echo $percent_cpu; ?>'],
|
||||
backgroundColor: [
|
||||
system_cpu_status_chart_background_color,
|
||||
'<?php echo $_SESSION['dashboard']['cpu_usage_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['cpu_usage_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['cpu_usage_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const system_cpu_status_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: system_cpu_status_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
circumference: 180,
|
||||
rotation: 270,
|
||||
plugins: {
|
||||
chart_counter_2: {
|
||||
chart_text: '<?php echo $percent_cpu; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false,
|
||||
},
|
||||
tooltip: {
|
||||
yAlign: 'bottom',
|
||||
displayColors: false,
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-cpu_usage']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter_2],
|
||||
};
|
||||
|
||||
const system_cpu_status_chart = new Chart(
|
||||
system_cpu_status_chart_context,
|
||||
system_cpu_status_chart_config
|
||||
document.getElementById('system_cpu_status_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: ['<?php echo $percent_cpu; ?>', 100 - '<?php echo $percent_cpu; ?>'],
|
||||
backgroundColor: [
|
||||
system_cpu_status_chart_background_color,
|
||||
'<?php echo $_SESSION['dashboard']['cpu_usage_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['cpu_usage_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['cpu_usage_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
circumference: 180,
|
||||
rotation: 270,
|
||||
plugins: {
|
||||
chart_counter_2: {
|
||||
chart_text: '<?php echo $percent_cpu; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false,
|
||||
},
|
||||
tooltip: {
|
||||
yAlign: 'bottom',
|
||||
displayColors: false,
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-cpu_usage']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter_2],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -42,12 +42,10 @@
|
|||
//add half doughnut chart
|
||||
?>
|
||||
<div style='display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 20px'>
|
||||
<div style='width: 175px; height: 175px;'><canvas id='system_status_chart'></canvas></div>
|
||||
<div><canvas id='system_status_chart' width='175px' height='175px'></canvas></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var system_status_chart_context = document.getElementById('system_status_chart').getContext('2d');
|
||||
|
||||
var system_status_chart_background_color;
|
||||
if ('<?php echo $percent_disk_usage; ?>' <= 80) {
|
||||
system_status_chart_background_color = '<?php echo $_SESSION['dashboard']['disk_usage_chart_main_background_color'][0]; ?>';
|
||||
|
|
@ -57,44 +55,40 @@
|
|||
system_status_chart_background_color = '<?php echo $_SESSION['dashboard']['disk_usage_chart_main_background_color'][2]; ?>';
|
||||
}
|
||||
|
||||
const system_status_chart_data = {
|
||||
datasets: [{
|
||||
data: ['<?php echo $percent_disk_usage; ?>', 100 - '<?php echo $percent_disk_usage; ?>'],
|
||||
backgroundColor: [system_status_chart_background_color,
|
||||
'<?php echo $_SESSION['dashboard']['disk_usage_chart_sub_background_color']['text']; ?>'],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['disk_usage_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['disk_usage_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const system_status_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: system_status_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
circumference: 180,
|
||||
rotation: 270,
|
||||
plugins: {
|
||||
chart_counter_2: {
|
||||
chart_text: '<?php echo $percent_disk_usage; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-disk_usage']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter_2],
|
||||
};
|
||||
|
||||
const system_status_chart = new Chart(
|
||||
system_status_chart_context,
|
||||
system_status_chart_config
|
||||
document.getElementById('system_status_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: ['<?php echo $percent_disk_usage; ?>', 100 - '<?php echo $percent_disk_usage; ?>'],
|
||||
backgroundColor: [system_status_chart_background_color,
|
||||
'<?php echo $_SESSION['dashboard']['disk_usage_chart_sub_background_color']['text']; ?>'],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['disk_usage_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['disk_usage_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
circumference: 180,
|
||||
rotation: 270,
|
||||
plugins: {
|
||||
chart_counter_2: {
|
||||
chart_text: '<?php echo $percent_disk_usage; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-disk_usage']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter_2],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -60,52 +60,45 @@
|
|||
//add doughnut chart
|
||||
?>
|
||||
<div style='display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 20px;'>
|
||||
<div style='width: 175px; height: 175px;'><canvas id='new_messages_chart'></canvas></div>
|
||||
<canvas id='new_messages_chart' width='175px' height='175px'></canvas>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
var new_messages_chart_context = document.getElementById('new_messages_chart').getContext('2d');
|
||||
|
||||
const new_messages_chart_data = {
|
||||
datasets: [{
|
||||
data: ['<?php echo $messages['new']; ?>', 0.00001],
|
||||
backgroundColor: [
|
||||
'<?php echo $_SESSION['dashboard']['new_messages_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['new_messages_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['new_messages_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['new_messages_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const new_messages_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: new_messages_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $messages['new']; ?>',
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-new_messages']; ?>',
|
||||
fontFamily: chart_text_font
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
};
|
||||
|
||||
const new_messages_chart = new Chart(
|
||||
new_messages_chart_context,
|
||||
new_messages_chart_config
|
||||
document.getElementById('new_messages_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: ['<?php echo $messages['new']; ?>', 0.00001],
|
||||
backgroundColor: [
|
||||
'<?php echo $_SESSION['dashboard']['new_messages_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['new_messages_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['new_messages_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['new_messages_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $messages['new']; ?>',
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-new_messages']; ?>',
|
||||
fontFamily: chart_text_font
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -83,50 +83,44 @@
|
|||
//add doughnut chart
|
||||
?>
|
||||
<div style='display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 20px;'>
|
||||
<div style='width: 175px; height: 175px;'><canvas id='missed_calls_chart'></canvas></div>
|
||||
<canvas id='missed_calls_chart' width='175px' height='175px'></canvas>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var missed_calls_chart_context = document.getElementById('missed_calls_chart').getContext('2d');
|
||||
|
||||
const missed_calls_chart_data = {
|
||||
datasets: [{
|
||||
data: ['<?php echo $num_rows; ?>', 0.00001],
|
||||
backgroundColor: [
|
||||
'<?php echo $_SESSION['dashboard']['missed_calls_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['missed_calls_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['missed_calls_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['missed_calls_chart_border_Width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const missed_calls_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: missed_calls_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $num_rows; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-missed_calls']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
};
|
||||
|
||||
const missed_calls_chart = new Chart(
|
||||
missed_calls_chart_context,
|
||||
missed_calls_chart_config
|
||||
document.getElementById('missed_calls_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: ['<?php echo $num_rows; ?>', 0.00001],
|
||||
backgroundColor: [
|
||||
'<?php echo $_SESSION['dashboard']['missed_calls_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['missed_calls_chart_sub_background_color']['text']; ?>'
|
||||
],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['missed_calls_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['missed_calls_chart_border_Width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $num_rows; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-missed_calls']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
|
|
@ -85,48 +85,42 @@
|
|||
//add doughnut chart
|
||||
?>
|
||||
<div style='display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 20px;'>
|
||||
<div style='width: 175px; height: 175px;'><canvas id='recent_calls_chart'></canvas></div>
|
||||
<canvas id='recent_calls_chart' width='175px' height='175px'></canvas>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var recent_calls_chart_context = document.getElementById('recent_calls_chart').getContext('2d');
|
||||
|
||||
const recent_calls_chart_data = {
|
||||
datasets: [{
|
||||
data: ['<?php echo $num_rows; ?>', 0.00001],
|
||||
backgroundColor: ['<?php echo $_SESSION['dashboard']['recent_calls_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['missed_calls_chart_sub_background_color']['text']; ?>'],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['recent_calls_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['recent_calls_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
};
|
||||
|
||||
const recent_calls_chart_config = {
|
||||
type: 'doughnut',
|
||||
data: recent_calls_chart_data,
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $num_rows; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-recent_calls']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
};
|
||||
|
||||
const recent_calls_chart = new Chart(
|
||||
recent_calls_chart_context,
|
||||
recent_calls_chart_config
|
||||
document.getElementById('recent_calls_chart').getContext('2d'),
|
||||
{
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: ['<?php echo $num_rows; ?>', 0.00001],
|
||||
backgroundColor: ['<?php echo $_SESSION['dashboard']['recent_calls_chart_main_background_color']['text']; ?>',
|
||||
'<?php echo $_SESSION['dashboard']['missed_calls_chart_sub_background_color']['text']; ?>'],
|
||||
borderColor: '<?php echo $_SESSION['dashboard']['recent_calls_chart_border_color']['text']; ?>',
|
||||
borderWidth: '<?php echo $_SESSION['dashboard']['recent_calls_chart_border_width']['text']; ?>',
|
||||
cutout: chart_cutout
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
chart_counter: {
|
||||
chart_text: '<?php echo $num_rows; ?>'
|
||||
},
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '<?php echo $text['label-recent_calls']; ?>'
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [chart_counter],
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<?php
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue