added new graph instatkpi

This commit is contained in:
Claudio 2024-09-24 10:58:03 +02:00
parent 35825a2c23
commit 36811b9a7a
2 changed files with 131 additions and 19 deletions

View File

@ -154,6 +154,27 @@ while ($row = $productBySupplierResult->fetch_assoc()) {
];
}
// New Query: Distribution of analyses (for pie chart)
$analysisDistributionQuery = "
SELECT a.nameanalysisvoc AS analysisName, COUNT(DISTINCT rp.idreports, rp.idPart, rp.result_TestName) AS totalTests
FROM result_project rp
LEFT JOIN analysisvocabulary a ON rp.result_TestName = a.idanalysisvocabulary
LEFT JOIN reports r ON rp.idreports = r.idreports
LEFT JOIN products p ON r.idproducts = p.idproducts
$filters
GROUP BY rp.result_TestName
ORDER BY totalTests DESC
";
$analysisDistributionResult = $conn->query($analysisDistributionQuery);
$analysisDistribution = [];
while ($row = $analysisDistributionResult->fetch_assoc()) {
$analysisDistribution[] = [
'analysisName' => $row['analysisName'],
'totalTests' => $row['totalTests']
];
}
// Ora controlliamo se è una richiesta AJAX
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
// Rispondi ai dati aggiornati tramite AJAX
@ -170,7 +191,8 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
'otherReportsPie' => $otherReportsPie,
'topFailingAnalysis' => $topFailingAnalysis,
'worstSuppliers' => $worstSuppliers,
'productBySupplier' => $productBySupplier
'productBySupplier' => $productBySupplier,
'analysisDistribution' => $analysisDistribution // Distribuzione delle analisi per il grafico a torta
]);
exit; // Ferma l'esecuzione del resto dello script dopo aver risposto all'AJAX
}

View File

@ -388,6 +388,18 @@ include('parsedatachart.php');
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Analysis Distribution</h5>
<div id="analysisDistributionChart"></div> <!-- Il grafico verrà inserito qui -->
</div>
</div>
</div>
</div>
</div><!-- container -->
@ -404,13 +416,80 @@ include('parsedatachart.php');
</div>
<!-- END wrapper -->
<script>
$(document).ready(function() {
// Inizializza Select2 per il filtro supplier
$('#supplierFilter').select2({
placeholder: 'Select a supplier',
allowClear: true
});
// Define the horizontal bar chart for analysis distribution
var analysisBarChartOptions = {
series: [{
name: 'Total Tests',
data: [] // Initially empty, will be filled via AJAX
}],
chart: {
type: 'bar',
height: 500
},
plotOptions: {
bar: {
horizontal: true,
columnWidth: '100%',
endingShape: 'rounded'
}
},
dataLabels: {
enabled: true
},
stroke: {
show: true,
width: 2,
colors: ['transparent']
},
xaxis: {
title: {
text: 'Number of Tests'
}
},
yaxis: {
labels: {
show: true,
maxWidth: 700, // Increased max width for labels
style: {
fontSize: '12px',
colors: ['#000']
}
},
title: {
text: 'Analysis Name'
}
},
fill: {
opacity: 1,
colors: ['#004d00']
},
tooltip: {
y: {
formatter: function(val) {
return val + " tests";
}
}
},
title: {
text: 'Analysis Distribution',
align: 'center'
},
grid: {
padding: {
left: 10 // Increased left padding for more label space
}
}
};
// Create the initial chart
var analysisBarChart = new ApexCharts(document.querySelector("#analysisDistributionChart"), analysisBarChartOptions);
analysisBarChart.render();
</script>
<script>
$(document).ready(function() {
// Funzione per aggiornare i dati con AJAX
function updateData() {
var startDate = $('#startDate').val();
@ -426,7 +505,6 @@ include('parsedatachart.php');
supplier: supplier
},
success: function(response) {
// Assicurati di fare il parsing della risposta JSON
var data = JSON.parse(response);
// Aggiorna le cards con i nuovi dati
@ -438,19 +516,30 @@ include('parsedatachart.php');
$('#failedTests').text(data.failedTests);
$('#failedTestsPercent').text('(' + data.failedTestsPercent.toFixed(2) + '%)');
// Aggiorna il grafico dei report (Pie Chart)
chart.updateSeries([data.failReportsPie, data.passReportsPie, data.otherReportsPie]);
// Aggiorna il grafico della distribuzione delle analisi
if (data.analysisDistribution && data.analysisDistribution.length > 0) {
// Ordina i dati per numero di test e prendi solo i primi 15
var sortedData = data.analysisDistribution.sort(function(a, b) {
return b.totalTests - a.totalTests;
}).slice(0, 15); // Prendi solo le prime 15 analisi
// Mostra i filtri attivi
var filterText = '';
if (startDate && endDate) {
filterText += 'Date: ' + startDate + ' to ' + endDate + ' ';
var analysisLabels = sortedData.map(function(item) {
return item.analysisName;
});
var analysisCounts = sortedData.map(function(item) {
return parseInt(item.totalTests, 10); // Converte il conteggio dei test in numeri interi
});
// Aggiorna il grafico a barre verticali
analysisBarChart.updateOptions({
xaxis: {
categories: analysisLabels // Aggiorna le etichette
}
});
analysisBarChart.updateSeries([{
data: analysisCounts // Aggiorna i dati del grafico
}]);
}
if (supplier) {
filterText += 'Supplier: ' + $('#supplierFilter option:selected').text();
}
$('#filterDisplay').text(filterText);
$('#activeFilters').show();
},
error: function() {
alert('Error retrieving data.');
@ -477,6 +566,7 @@ include('parsedatachart.php');
});
</script>
<script>
document.getElementById('totalProducts').innerText = <?php echo $totalProducts; ?>;
document.getElementById('totalReports').innerText = <?php echo $totalReports; ?>;