Non puoi selezionare più di 25 argomenti
Gli argomenti devono iniziare con una lettera o un numero, possono includere trattini ('-') e possono essere lunghi fino a 35 caratteri.
476 righe
23 KiB
476 righe
23 KiB
<!doctype html> |
|
<?php |
|
include '../../lib/api.php'; |
|
define('THIS_PERMISSION', GRUPPO_STATISTICHE); |
|
define('THIS_PERMISSION2', GRUPPO_REGIONE); |
|
include_once (ROOT . "layout/include_permission.php"); |
|
|
|
//$r = Domanda::getDisponibilita(); |
|
|
|
//Utils::print_array($r); |
|
|
|
//$totale_presentate = ($r['NUM_DOMANDE_SFRATTO'] + $r['NUM_DOMANDE']); |
|
$oggi = new DateTime(); |
|
?> |
|
<html lang="en"> |
|
<? include_once ROOT . 'layout/head.php'; ?> |
|
|
|
<body> |
|
<? include_once ROOT . 'layout/header.php'; ?> |
|
|
|
<? include_once ROOT . 'layout/menu.php'; ?> |
|
<main role="main" class="<?= $cssColumNavBar ?>"> |
|
<div class="container-fluid"> |
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
|
|
<nav aria-label="breadcrumb"> |
|
<ol class="breadcrumb"> |
|
<li class="breadcrumb-item"><a href="#">Home</a></li> |
|
<li class="breadcrumb-item active" aria-current="page">Statistiche</li> |
|
</ol> |
|
</nav> |
|
</div> |
|
</div> |
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
<h4 class="card-title">Statistiche al <?= $oggi->format('d-m-Y H:i:s') ?></h4> |
|
<div class="row"> |
|
<div class="col-sm-4"> |
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
<div class="card bg-warning mb-1"> |
|
<div class="card-header"> |
|
<h6 class="card-title">Utenti registrati</h6> |
|
</div> |
|
<div class="card-body"> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span class="badge badge-light"><i |
|
class="fas fa-male"></i> MASCHI</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="NUM_ACCOUNT_M"></span></h5> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span class="badge badge-light"><i |
|
class="fas fa-female"></i> FEMMINE</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="NUM_ACCOUNT_F"></span></h5> |
|
<hr> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span class="badge badge-light"><i class="fas fa-users"></i> TOTALE |
|
UTENTI</span> <span style="float:right" class="badge badge-light" |
|
id="NUM_ACCOUNT"></span></h5> |
|
|
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
<div class="card bg-success text-white mb-1"> |
|
<div class="card-header"> |
|
<h6 class="card-title">Numero di richieste</h6> |
|
</div> |
|
<div class="card-body"> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span |
|
class="badge badge-light"><?=$ICONE_STATI_RICHIESTE_SCONTI[RS_IN_ELABORAZIONE].' '.$STATI_RICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?></span> |
|
<span style="float:right" class="badge badge-light" |
|
id="NUM_IN_ELABORAZIONE"></span></h5> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span |
|
class="badge badge-light"><?=$ICONE_STATI_RICHIESTE_SCONTI[RS_PRESA_IN_CARICO].' '.$STATI_RICHIESTE_SCONTI[RS_PRESA_IN_CARICO]?></span> |
|
<span style="float:right" class="badge badge-light" |
|
id="NUM_PRESA_IN_CARICO"></span></h5> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span |
|
class="badge badge-light"><?=$ICONE_STATI_RICHIESTE_SCONTI[RS_APPROVATA].' '.$STATI_RICHIESTE_SCONTI[RS_APPROVATA]?></span> |
|
<span style="float:right" class="badge badge-light" |
|
id="NUM_APPROVATA"></span></h5> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span |
|
class="badge badge-light"><?=$ICONE_STATI_RICHIESTE_SCONTI[RS_EROGATA].' '.$STATI_RICHIESTE_SCONTI[RS_EROGATA]?></span> |
|
<span style="float:right" class="badge badge-light" |
|
id="NUM_EROGATA"></span></h5> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span |
|
class="badge badge-light"><?=$ICONE_STATI_RICHIESTE_SCONTI[RS_NON_APPROVATA].' '.$STATI_RICHIESTE_SCONTI[RS_NON_APPROVATA]?></span> |
|
<span style="float:right" class="badge badge-light" |
|
id="NUM_NON_APPROVATA"></span></h5> |
|
<hr> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span class="badge badge-light">TOTALE RICHIESTE</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="TOTALE_PRESENTATE"></span></h5> |
|
<hr> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span class="badge badge-light">PRIORITARI</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="NUM_PRIORITARI"></span></h5> |
|
<h5 |
|
style="border-bottom:1px <?=$COLOR_SRICHIESTE_SCONTI[RS_IN_ELABORAZIONE]?> dashed"> |
|
<span class="badge badge-light">RESIDENTI</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="NUM_RESIDENTI"></span></h5> |
|
|
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
</div> |
|
<div class="col-sm-8"> |
|
<div class="card bg-light mb-1"> |
|
<div class="card-header"> |
|
<h6 class="card-title">Sconti richiesti per provincia di residenza</h6> |
|
</div> |
|
<div class="card-body row"> |
|
<div class="col-sm-4"> |
|
<? foreach ($PROVINCE_SICILIA as $k => $p){?> |
|
<h5 style="border-bottom:1px #009900 dashed"><span |
|
class="badge prov-<?= strtolower($p['nome'])?>"><?=$p['nome']?></span> |
|
<span style="float:right" class="badge badge-light" |
|
id="CONTR_<?=$p['nome']?>">0,00</span><small><i |
|
class="fas fa-euro-sign float-right"></i></small></h5> |
|
<?}?> |
|
<hr /> |
|
<h5 style="border-bottom:1px #009900 dashed"><span |
|
class="badge bg-primary text-white">TOTALE</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="TOTALE_CONTRIBUTO">0,00</span><small><i |
|
class="fas fa-euro-sign float-right"></i></small></h5> |
|
<hr /> |
|
<h5 style="border-bottom:1px #009900 dashed"><span |
|
class="badge bg-primary text-white">PRIORITARI</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="TOT_PRIORITARI">0,00</span><small><i |
|
class="fas fa-euro-sign float-right"></i></small></h5> |
|
<h5 style="border-bottom:1px #009900 dashed"><span |
|
class="badge bg-primary text-white">RESIDENTI</span> <span |
|
style="float:right" class="badge badge-light" |
|
id="TOT_RESIDENTI">0,00</span><small><i |
|
class="fas fa-euro-sign float-right"></i></small></h5> |
|
|
|
</div> |
|
<div class="col-sm-8"> |
|
<canvas id="chartProvincie" width="350" height="350"></canvas> |
|
</div> |
|
|
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
</div> |
|
</div> |
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
<div class="card bg-light mb-1"> |
|
<div class="card-header"> |
|
<h6 class="card-title">Andamento giornaliero delle richieste di sconto inserite</h6> |
|
</div> |
|
<div class="card-body"> |
|
<canvas id="myChart2" width="1248" height="250"></canvas> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
<div class="card bg-light mb-1"> |
|
<div class="card-header"> |
|
<h6 class="card-title">Riepilogo delle richieste di sconto per compagnia aerea</h6> |
|
</div> |
|
<div class="card-body"> |
|
<canvas id="chartCompagnie" width="1248" height="250"></canvas> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="row"> |
|
<div class="col-sm-12"> |
|
<div class="card bg-light mb-1"> |
|
<div class="card-header"> |
|
<h6 class="card-title">Le 10 tratte più utilizzate</h6> |
|
</div> |
|
<div class="card-body"> |
|
<canvas id="chartTratte" width="1248" height="250"></canvas> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</main> |
|
|
|
<? include_once ROOT . 'layout/footer.php'; ?> |
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js" |
|
integrity="sha512-QSkVNOCYLtj73J4hbmVoOV6KVZuMluZlioC+trLpewV8qMjsWqlIQvkn1KGX2StWvPMdWGBqim1xlC8krl1EKQ==" |
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script> |
|
<script type="text/javascript"> |
|
$(document).ready(function() { |
|
var myChart2, config, chartProvincie; |
|
|
|
loadStats(); |
|
}); |
|
|
|
function loadStats(reload) { |
|
|
|
$('#loader').show(); |
|
$.ajax({ |
|
method: "POST", |
|
url: WS_CALL + '?module=analytics&action=load_statistiche', |
|
data: {}, |
|
success: function(result) { |
|
$('#loader').hide(); |
|
var res = eval(result); |
|
$.each(res[0], function(key, value) { |
|
$('#' + key).empty(); |
|
$('#' + key).html(value); |
|
}); |
|
|
|
$.each(res[0].provincie, function(key, value) { |
|
$('#CONTR_' + value.PROVINCIA).empty(); |
|
$('#CONTR_' + value.PROVINCIA).html(value.CONTRIBUTO_PROVINCIA); |
|
}); |
|
|
|
var lineChartData = { |
|
labels: res[0].datasets.labels, |
|
datasets: [{ |
|
label: 'N. Richieste', |
|
borderColor: 'rgb(4, 101, 0)', |
|
backgroundColor: 'rgb(4, 101, 0)', |
|
fill: false, |
|
borderWidth: 1, |
|
pointStyle: 'rectRot', |
|
pointRadius: 5, |
|
pointBorderColor: 'rgb(0, 0, 0)', |
|
data: res[0].datasets.N_RICHIESTE |
|
} |
|
/*,{ |
|
label: 'Sconti in €.', |
|
borderColor: 'rgb(0,5,101)', |
|
backgroundColor: 'rgb(0,5,101)', |
|
fill: false, |
|
borderWidth: 1, |
|
pointStyle: 'rectRot', |
|
pointRadius: 5, |
|
pointBorderColor: 'rgb(0, 0, 0)', |
|
data: res[0].datasets.SCONTI |
|
}*/ |
|
] |
|
}; |
|
const chartAreaBorder = { |
|
id: 'chartAreaBorder', |
|
beforeDraw(chart, args, options) { |
|
const { |
|
ctx, |
|
chartArea: { |
|
left, |
|
top, |
|
width, |
|
height |
|
} |
|
} = chart; |
|
ctx.save(); |
|
ctx.strokeStyle = options.borderColor; |
|
ctx.lineWidth = options.borderWidth; |
|
ctx.setLineDash(options.borderDash || []); |
|
ctx.lineDashOffset = options.borderDashOffset; |
|
ctx.strokeRect(left, top, width, height); |
|
ctx.restore(); |
|
} |
|
}; |
|
|
|
config = { |
|
type: 'line', |
|
data: lineChartData, |
|
options: { |
|
animations: { |
|
radius: { |
|
duration: 400, |
|
easing: 'linear', |
|
loop: (context) => context.active |
|
} |
|
}, |
|
hoverRadius: 12, |
|
hoverBackgroundColor: 'yellow', |
|
interaction: { |
|
intersect: false, |
|
mode: 'index' |
|
}, |
|
plugins: { |
|
legend: { |
|
labels: { |
|
usePointStyle: true |
|
} |
|
}, |
|
chartAreaBorder: { |
|
borderColor: 'red', |
|
borderWidth: 1, |
|
borderDash: [5, 5], |
|
borderDashOffset: 1 |
|
} |
|
}, |
|
responsive: true, |
|
hoverMode: 'index', |
|
stacked: false, |
|
title: { |
|
display: true, |
|
text: 'Andamento giornaliero delle richieste di sconto inserite' |
|
} |
|
}, |
|
plugins: [chartAreaBorder] |
|
}; |
|
|
|
|
|
const dataP = { |
|
labels: res[0].chardatasets.labels, |
|
datasets: [{ |
|
label: 'Dataset 1', |
|
data: res[0].chardatasets.datasets.data, |
|
backgroundColor: res[0].chardatasets.datasets.backgroundColor |
|
}] |
|
}; |
|
|
|
const dataC = { |
|
labels: res[0].compagnie.labels, |
|
datasets: [{ |
|
label: res[0].compagnie.datasetsR.label, |
|
data: res[0].compagnie.datasetsR.data, |
|
backgroundColor: res[0].compagnie.datasetsR.backgroundColor |
|
}, |
|
{ |
|
label: res[0].compagnie.datasetsS.label, |
|
data: res[0].compagnie.datasetsS.data, |
|
backgroundColor: res[0].compagnie.datasetsS.backgroundColor |
|
} |
|
] |
|
}; |
|
|
|
const dataT = { |
|
labels: res[0].tratte.labels, |
|
datasets: [{ |
|
label: res[0].tratte.datasets.label, |
|
data: res[0].tratte.datasets.data, |
|
backgroundColor: res[0].tratte.datasets.backgroundColor |
|
} |
|
] |
|
}; |
|
|
|
const configP = { |
|
type: 'pie', |
|
data: dataP, |
|
options: { |
|
responsive: true, |
|
plugins: { |
|
legend: { |
|
position: 'top' |
|
}, |
|
title: { |
|
display: false, |
|
text: 'Chart.js Pie Chart' |
|
} |
|
} |
|
} |
|
}; |
|
|
|
const configC = { |
|
type: 'bar', |
|
data: dataC, |
|
options: { |
|
responsive: true, |
|
plugins: { |
|
legend: { |
|
position: 'top', |
|
}, |
|
title: { |
|
display: false, |
|
text: 'Chart.js Bar Chart' |
|
} |
|
}, |
|
elements: { |
|
bar: { |
|
backgroundColor: colorize(false), |
|
borderColor: colorize(true), |
|
borderWidth: 2 |
|
} |
|
} |
|
}, |
|
}; |
|
|
|
const configT = { |
|
type: 'bar', |
|
data: dataT, |
|
options: { |
|
responsive: true, |
|
plugins: { |
|
legend: { |
|
position: 'top', |
|
}, |
|
title: { |
|
display: false, |
|
text: 'Chart.js Bar Chart' |
|
} |
|
}, |
|
elements: { |
|
bar: { |
|
backgroundColor: colorize(false), |
|
borderColor: colorize(true), |
|
borderWidth: 2 |
|
} |
|
} |
|
}, |
|
}; |
|
|
|
function colorize(opaque) { |
|
return (ctx) => { |
|
const v = ctx.parsed.y; |
|
const c = v < -50 ? '#D60000' |
|
: v < 0 ? '#F46300' |
|
: v < 50 ? '#0358B6' |
|
: '#44DE28'; |
|
|
|
return opaque ? c : Utils.transparentize(c, 1 - Math.abs(v / 150)); |
|
}; |
|
} |
|
|
|
|
|
if (!reload) { |
|
var ctx = document.getElementById('myChart2').getContext('2d'); |
|
var ctxP = document.getElementById('chartProvincie').getContext('2d'); |
|
var ctxC = document.getElementById('chartCompagnie').getContext('2d'); |
|
var ctxT = document.getElementById('chartTratte').getContext('2d'); |
|
myChart2 = new Chart(ctx, config); |
|
chartProvincie = new Chart(ctxP, configP); |
|
chartCompagnie = new Chart(ctxC, configC); |
|
chartTratte = new Chart(ctxT, configT); |
|
} else { |
|
myChart2.update(); |
|
chartProvincie.update(); |
|
chartCompagnie.update(); |
|
chartTratte.update(); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
}); |
|
} |
|
</script> |
|
|
|
</body> |
|
|
|
</html>
|