40 lines
1.2 KiB
PHP
40 lines
1.2 KiB
PHP
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
|
|
|
|
<div>
|
|
<h1>Total de Equipamentos: {{ $totalEquipments }}</h1>
|
|
<canvas id="myPieChart" width="400" height="400"></canvas>
|
|
</div>
|
|
|
|
<script>
|
|
// Obtenha o contexto do elemento canvas
|
|
var ctx = document.getElementById('myPieChart').getContext('2d');
|
|
|
|
// Dados do componente Livewire
|
|
var type1Count = {{ $type1Count }};
|
|
var type2Count = {{ $type2Count }};
|
|
var type3Count = {{ $type3Count }};
|
|
|
|
// Crie um novo gráfico circular
|
|
var myPieChart = new Chart(ctx, {
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: ['Nao Iniciados', 'Em progresso', 'Finalizadas'],
|
|
datasets: [{
|
|
data: [type1Count, type2Count, type3Count], // Dados do componente Livewire
|
|
backgroundColor: [
|
|
'rgba(255, 99, 132, 0.5)',
|
|
'rgba(54, 162, 235, 0.5)',
|
|
'rgba(255, 206, 86, 0.5)'
|
|
],
|
|
borderColor: [
|
|
'rgba(255, 99, 132, 1)',
|
|
'rgba(54, 162, 235, 1)',
|
|
'rgba(255, 206, 86, 1)'
|
|
],
|
|
borderWidth: 1
|
|
}]
|
|
}
|
|
});
|
|
</script>
|