<link rel="stylesheet" href="_lib/morris.css">		
<script src="_lib/jquery.js"></script>
<script src="_lib/raphael-min.js"></script>
<script src="_lib/morris.min.js"></script>
<?php
include 'config/koneksi.php';
include '_lib/fungsi_indotgl.php';	
$month_sel = date("Y-m");
$month_num = date("m");

$result = mysql_query("SELECT 
bulan, masuk, putus, minutasi, FLOOR((@sisa_tahun_lalu := @sisa_tahun_lalu + (masuk - minutasi))-(masuk - minutasi)) AS sisa FROM
(SELECT @sisa_tahun_lalu := (SELECT SUM(CASE WHEN YEAR(perkara.tanggal_pendaftaran)<=YEAR(NOW()) AND (YEAR(perkara_putusan.tanggal_minutasi)>=YEAR(NOW()) OR (perkara_putusan.tanggal_minutasi IS NULL OR perkara_putusan.tanggal_minutasi='')) THEN 1 ELSE 0 END) AS sisa
FROM perkara LEFT JOIN perkara_putusan ON perkara.perkara_id=perkara_putusan.perkara_id 
WHERE YEAR(perkara.tanggal_pendaftaran)<=YEAR(NOW())-1 AND (YEAR(perkara_putusan.tanggal_minutasi)>=YEAR(NOW()) OR (perkara_putusan.tanggal_minutasi IS NULL OR perkara_putusan.tanggal_minutasi='')) AND perkara.alur_perkara_id <> 114)) AS sisa_tahun_lalu,
(SELECT
DATE_FORMAT(perkara.tanggal_pendaftaran,'%Y-%m') AS bulan, 
SUM(CASE WHEN YEAR(perkara.tanggal_pendaftaran)>=YEAR(NOW()) THEN 1 ELSE 0 END) AS masuk
FROM perkara LEFT JOIN perkara_putusan ON perkara.perkara_id=perkara_putusan.perkara_id 
WHERE YEAR(perkara.tanggal_pendaftaran)>=YEAR(NOW()) AND perkara.alur_perkara_id <> 114 
GROUP BY YEAR(perkara.tanggal_pendaftaran), MONTH(perkara.tanggal_pendaftaran)) AS A
INNER JOIN 
(SELECT
DATE_FORMAT(perkara_putusan.tanggal_putusan,'%Y-%m') bulan, 
SUM(CASE WHEN YEAR(perkara_putusan.tanggal_putusan)=YEAR(NOW()) THEN 1 ELSE 0 END) AS putus
FROM perkara LEFT JOIN perkara_putusan ON perkara.perkara_id=perkara_putusan.perkara_id 
WHERE YEAR(perkara_putusan.tanggal_putusan)=YEAR(NOW()) AND perkara.alur_perkara_id <> 114 
GROUP BY YEAR(perkara_putusan.tanggal_putusan), MONTH(perkara_putusan.tanggal_putusan)) AS B
USING (bulan)
INNER JOIN 
(SELECT
DATE_FORMAT(perkara_putusan.tanggal_minutasi,'%Y-%m') bulan, 
SUM(CASE WHEN YEAR(perkara_putusan.tanggal_minutasi)=YEAR(NOW()) THEN 1 ELSE 0 END) AS minutasi
FROM perkara LEFT JOIN perkara_putusan ON perkara.perkara_id=perkara_putusan.perkara_id 
WHERE YEAR(perkara_putusan.tanggal_minutasi)=YEAR(NOW()) AND perkara.alur_perkara_id <> 114 
GROUP BY YEAR(perkara_putusan.tanggal_minutasi), MONTH(perkara_putusan.tanggal_minutasi)) AS C
USING (bulan)");
$rows = array();
while($tableRow = mysql_fetch_assoc($result)) {
	$rows[] = $tableRow;
}

foreach ($rows as $label):		
	$l_sisa[] = $label['sisa'];
	$l_masuk[] = $label['masuk'];
	$l_putus[] = $label['putus'];
	$l_minut[] = $label['minutasi'];
endforeach;
$arr_l = array(max($l_sisa),max($l_masuk),max($l_putus),max($l_minut));
$max_h = max($arr_l);
for ($h=0; $h<=$max_h+100; $h+=100){
	if ($h > $max_h){
		$max_stat = $h/5;
	}
}
$max = max($arr_l);
for ($i=0; $i<=$max+$max_stat; $i+=$max_stat){
	if ($i > $max){
		$max_key = $i;
	}
}
//print json_encode($rows);

$query = mysql_query("SELECT 
C.masuk_tahun_2016 AS masuk_tahun_2016,
C.putus_tahun_2016 AS putus_tahun_2016, 
C.dirput_tahun_2016 AS dirput_tahun_2016,
C.masuk_tahun_2017 AS masuk_tahun_2017,
C.putus_tahun_2017 AS putus_tahun_2017, 
C.dirput_tahun_2017 AS dirput_tahun_2017,
C.masuk_tahun_2018 AS masuk_tahun_2018,
C.putus_tahun_2018 AS putus_tahun_2018, 
C.dirput_tahun_2018 AS dirput_tahun_2018,
C.masuk_tahun_2019 AS masuk_tahun_2019,
C.putus_tahun_2019 AS putus_tahun_2019, 
C.dirput_tahun_2019 AS dirput_tahun_2019,
C.masuk_tahun_2020 AS masuk_tahun_2020,
C.putus_tahun_2020 AS putus_tahun_2020, 
C.dirput_tahun_2020 AS dirput_tahun_2020,
C.masuk_tahun_2021 AS masuk_tahun_2021,
C.putus_tahun_2021 AS putus_tahun_2021, 
C.dirput_tahun_2021 AS dirput_tahun_2021,
C.masuk_tahun_2022 AS masuk_tahun_2022,
C.putus_tahun_2022 AS putus_tahun_2022, 
C.dirput_tahun_2022 AS dirput_tahun_2022,
(SELECT VALUE FROM sys_config WHERE id = 62) AS nama_PA,
(SELECT VALUE FROM sys_config WHERE id = 80) AS versi_SIPP,
(ROUND(SUM(C.dirput_tahun_2016)*100/SUM(C.putus_tahun_2016),2)) AS persentase_dirput_2016,
(ROUND(SUM(C.dirput_tahun_2017)*100/SUM(C.putus_tahun_2017),2)) AS persentase_dirput_2017,
(ROUND(SUM(C.dirput_tahun_2018)*100/SUM(C.putus_tahun_2018),2)) AS persentase_dirput_2018,
(ROUND(SUM(C.dirput_tahun_2019)*100/SUM(C.putus_tahun_2019),2)) AS persentase_dirput_2019,
(ROUND(SUM(C.dirput_tahun_2020)*100/SUM(C.putus_tahun_2020),2)) AS persentase_dirput_2020,
(ROUND(SUM(C.dirput_tahun_2021)*100/SUM(C.putus_tahun_2021),2)) AS persentase_dirput_2021,
(ROUND(SUM(C.dirput_tahun_2022)*100/SUM(C.putus_tahun_2022),2)) AS persentase_dirput_2022
FROM (SELECT
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2016' THEN 1 ELSE 0 END) AS masuk_tahun_2016,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2016' THEN 1 ELSE 0 END) AS putus_tahun_2016,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2016' AND YEAR(C.tgl_masuk)>='2016' THEN 1 ELSE 0 END) AS dirput_tahun_2016,
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2017' THEN 1 ELSE 0 END) AS masuk_tahun_2017,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2017' THEN 1 ELSE 0 END) AS putus_tahun_2017,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2017' AND YEAR(C.tgl_masuk)>='2017' THEN 1 ELSE 0 END) AS dirput_tahun_2017,
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2018' THEN 1 ELSE 0 END) AS masuk_tahun_2018,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2018' THEN 1 ELSE 0 END) AS putus_tahun_2018,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2018' AND YEAR(C.tgl_masuk)>='2018' THEN 1 ELSE 0 END) AS dirput_tahun_2018,
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2019' THEN 1 ELSE 0 END) AS masuk_tahun_2019,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2019' THEN 1 ELSE 0 END) AS putus_tahun_2019,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2019' AND YEAR(C.tgl_masuk)>='2019' THEN 1 ELSE 0 END) AS dirput_tahun_2019,
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2020' THEN 1 ELSE 0 END) AS masuk_tahun_2020,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2020' THEN 1 ELSE 0 END) AS putus_tahun_2020,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2020' AND YEAR(C.tgl_masuk)>='2020' THEN 1 ELSE 0 END) AS dirput_tahun_2020,
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2021' THEN 1 ELSE 0 END) AS masuk_tahun_2021,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2021' THEN 1 ELSE 0 END) AS putus_tahun_2021,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2021' AND YEAR(C.tgl_masuk)>='2021' THEN 1 ELSE 0 END) AS dirput_tahun_2021,
SUM(CASE WHEN YEAR(A.tanggal_pendaftaran)='2022' THEN 1 ELSE 0 END) AS masuk_tahun_2022,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2022' THEN 1 ELSE 0 END) AS putus_tahun_2022,
SUM(CASE WHEN YEAR(B.tanggal_putusan)='2022' AND YEAR(C.tgl_masuk)>='2021' THEN 1 ELSE 0 END) AS dirput_tahun_2022
FROM perkara AS A 
LEFT JOIN perkara_putusan AS B ON A.perkara_id=B.perkara_id
LEFT JOIN dirput_antrian AS C ON B.perkara_id=C.perkara_id AND C.status = '1'
WHERE A.alur_perkara_id <> 114) AS C") or die("Query failed with error: ".mysql_error());
$row = mysql_fetch_assoc($query);
$namaPN = $row['nama_PA'];
$versiSIPP = $row['versi_SIPP'];
$masuk_tahun_2016 = $row['masuk_tahun_2016'];
$masuk_tahun_2017 = $row['masuk_tahun_2017'];
$masuk_tahun_2018 = $row['masuk_tahun_2018'];
$masuk_tahun_2019 = $row['masuk_tahun_2019'];
$masuk_tahun_2020 = $row['masuk_tahun_2020'];
$masuk_tahun_2021 = $row['masuk_tahun_2021'];
$masuk_tahun_2022 = $row['masuk_tahun_2022'];

$putus_tahun_2016 = $row['putus_tahun_2016'];
$putus_tahun_2017 = $row['putus_tahun_2017'];
$putus_tahun_2018 = $row['putus_tahun_2018'];
$putus_tahun_2019 = $row['putus_tahun_2019'];
$putus_tahun_2020 = $row['putus_tahun_2020'];
$putus_tahun_2021 = $row['putus_tahun_2021'];
$putus_tahun_2022 = $row['putus_tahun_2022'];

$dirput_tahun_2016 = $row['dirput_tahun_2016'];
$dirput_tahun_2017 = $row['dirput_tahun_2017'];
$dirput_tahun_2018 = $row['dirput_tahun_2018'];
$dirput_tahun_2019 = $row['dirput_tahun_2019'];
$dirput_tahun_2020 = $row['dirput_tahun_2020'];
$dirput_tahun_2021 = $row['dirput_tahun_2021'];
$dirput_tahun_2022 = $row['dirput_tahun_2022'];

$sisa_dirput_2016 = $putus_tahun_2016 - $dirput_tahun_2016;
$sisa_dirput_2017 = $putus_tahun_2017 - $dirput_tahun_2017;
$sisa_dirput_2018 = $putus_tahun_2018 - $dirput_tahun_2018;
$sisa_dirput_2019 = $putus_tahun_2019 - $dirput_tahun_2019;
$sisa_dirput_2020 = $putus_tahun_2020 - $dirput_tahun_2020;
$sisa_dirput_2021 = $putus_tahun_2021 - $dirput_tahun_2021;
$sisa_dirput_2022 = $putus_tahun_2022 - $dirput_tahun_2022;

$persentase_dirput_2016 = number_format($row['persentase_dirput_2016'],2, '.', '');
$persentase_dirput_2017 = number_format($row['persentase_dirput_2017'],2, '.', '');
$persentase_dirput_2018 = number_format($row['persentase_dirput_2018'],2, '.', '');
$persentase_dirput_2019 = number_format($row['persentase_dirput_2019'],2, '.', '');
$persentase_dirput_2020 = number_format($row['persentase_dirput_2020'],2, '.', '');
$persentase_dirput_2021 = number_format($row['persentase_dirput_2021'],2, '.', '');
$persentase_dirput_2022 = number_format($row['persentase_dirput_2022'],2, '.', '');

$total_putus = $putus_tahun_2016 + $putus_tahun_2017 + $putus_tahun_2018 + $putus_tahun_2019 + $putus_tahun_2020 + $putus_tahun_2021 + $putus_tahun_2022;
$total_dirput = $dirput_tahun_2016 + $dirput_tahun_2017 + $dirput_tahun_2018 + $dirput_tahun_2019 + $dirput_tahun_2020 + $dirput_tahun_2021 + $dirput_tahun_2022;
$sisa_dirput = $total_putus - $total_dirput;
$total_persentase = number_format((($persentase_dirput_2016) + ($persentase_dirput_2017) + ($persentase_dirput_2018) + ($persentase_dirput_2019) + ($persentase_dirput_2020) + ($persentase_dirput_2021) + ($persentase_dirput_2022))/6,2, '.', ''); 

if ($row['persentase_dirput_2016'] <=50) {
	$warna_persentase_dirput_2016 = 'red';
} else if ($persentase_dirput_2016 >=75){
	$warna_persentase_dirput_2016 = '#9ACD32';
} else {
	$warna_persentase_dirput_2016 = '#f1c40f';
}

if ($row['persentase_dirput_2017'] <=50) {
	$warna_persentase_dirput_2017 = 'red';
} else if ($persentase_dirput_2017 >=75){
	$warna_persentase_dirput_2017 = '#9ACD32';
} else {
	$warna_persentase_dirput_2017 = '#f1c40f';
}

if ($row['persentase_dirput_2018'] <=50) {
	$warna_persentase_dirput_2018 = 'red';
} else if ($persentase_dirput_2018 >=75){
	$warna_persentase_dirput_2018 = '#9ACD32';
} else {
	$warna_persentase_dirput_2018 = '#f1c40f';
}

if ($row['persentase_dirput_2019'] <=50) {
	$warna_persentase_dirput_2019 = 'red';
} else if ($persentase_dirput_2019 >=75){
	$warna_persentase_dirput_2019 = '#9ACD32';
} else {
	$warna_persentase_dirput_2019 = '#f1c40f';
}

if ($row['persentase_dirput_2020'] <=50) {
	$warna_persentase_dirput_2020 = 'red';
} else if ($persentase_dirput_2020 >=75){
	$warna_persentase_dirput_2020 = '#9ACD32';
} else {
	$warna_persentase_dirput_2020 = '#f1c40f';
}

if ($row['persentase_dirput_2021'] <=50) {
	$warna_persentase_dirput_2021 = 'red';
} else if ($persentase_dirput_2021 >=75){
	$warna_persentase_dirput_2021 = '#9ACD32';
} else {
	$warna_persentase_dirput_2021 = '#f1c40f';
}

if ($row['persentase_dirput_2022'] <=50) {
	$warna_persentase_dirput_2022 = 'red';
} else if ($persentase_dirput_2022 >=75){
	$warna_persentase_dirput_2022 = '#9ACD32';
} else {
	$warna_persentase_dirput_2022 = '#f1c40f';
}

if ($total_persentase <=50) {
	$warna_total_persentase = 'red';
} else if ($total_persentase >=75){
	$warna_total_persentase = '#9ACD32';
} else {
	$warna_total_persentase = '#f1c40f';
}
?>

<div class="main">
	<div class="dashboard">
		<center>
		<div class="statistik_title"><font color="#383838" size="3" face="Arial"><br><br>STATISTIK DIREKTORI PUTUSAN <?=$namaPN;?></div>
		<br><br>
		<div class="statistik1">	
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2016</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2016;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Dirput<br>Tahun 2016</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2016;?></font></h5>
			</div>
			<div class="box_ratioo">
			<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2016</font></h5>
			<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2016;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2017</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2017;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Dirput<br>Tahun 2017</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2017;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2017</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2017;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2018</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2018;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2018</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2018;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2018</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2018;?></font></h5>
			</div>
		</div>
		
		<div class="statistik1">
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2019</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2019;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Dirput<br>Tahun 2019</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2019;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2019</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2019;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2020</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2020;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Dirput<br>Tahun 2020</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2020;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2020</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2020;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2021</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2021;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Dirput<br>Tahun 2021</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2021;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2021</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2021;?></font></h5>
			</div>			
		</div>
		
		<div class="statistik1">
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Putus<br>Tahun 2022</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$putus_tahun_2022;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Dirput<br>Tahun 2022</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="orange" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$dirput_tahun_2022;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput<br>Tahun 2022</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#e74c3c" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput_2022;?></font></h5>
			</div>		
		</div>
		<br>

		<div class="statistik1">	
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2016</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2016;?></font></h5>
			</div>			
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2017</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2017;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2018</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2018;?></font></h5>
			</div>			
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2019</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2019;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2020</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2020;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2021</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2021;?></font></h5>
			</div>
			<div class="box_ratioo">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Perkara Masuk<br>Tahun 2022</font></h5>
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#9ACD32" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$masuk_tahun_2022;?></font></h5>
			</div>
		</div>
		<br>

		<div class="statistik1">
			<div class="box_ratio" style="border-radius:10px; background:orange;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Total Putus Sejak 2016</font></h5>
				<h5 align="center" style="margin: 8px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$total_putus;?></font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:#f1c40f;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Total Dirput Sejak 2016</font></h5>
				<h5 align="center" style="margin: 8px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$total_dirput;?></font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:#9ACD32;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Sisa Dirput Perkara</font></h5>
				<h5 align="center" style="margin: 8px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$sisa_dirput;?></font></h5>
			</div>
		</div>		
		<br>	
		<div class="statistik1">
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2016;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2016</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2016;?> %</font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2017;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2017</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2017;?> %</font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2018;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2018</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2018;?> %</font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2019;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2019</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2019;?> %</font></h5>
			</div>	
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2020;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2020</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2020;?> %</font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2020;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2021</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2021;?> %</font></h5>
			</div>	
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_persentase_dirput_2020;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Persentase 2022</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$persentase_dirput_2022;?> %</font></h5>
			</div>
			<div class="box_ratio" style="border-radius:10px; background:<?=$warna_total_persentase;?>!important;">
				<h5 align="center" style="margin: 3px auto 0px;"><font color="#383838" size="2" face="Century Gothic">Nilai Akhir</font></h5>
				<h5 align="center" style="margin: 6px auto 0px;"><font color="#FFF" size="5" face="Century Gothic" style="text-shadow: -1px 0 #393939, 0 1px #393939, 1px 0 #393939, 0 -1px #393939;"><?=$total_persentase;?> %</font></h5>
			</div>
		</div>
		
		</center>	
		<div>
		<center>
		<marquee style="margin-top:-10" width="70%"><font color="#006640;" size="3px" face="Century Gothic"><b><br><b><br>Untuk me-refresh Statistik dan Data Perkara silahkan tekan Ctrl + F5 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
		Disclaimer: Persentase Pada Aplikasi ini Belum Tentu Sama dengan Report Penilaian Badilag Dikarenakan Proses Singkronisasi atau Sebab Lain</b></font>
		</marquee>
		</center>
		</div>	
	</div>
</div>


<script>
var months = ["Jan", "Feb", "Mar", "Apr", "Mei", "Jun", "Jul", "Agu", "Sep", "Okt", "Nop", "Des"];

Morris.Line({
  element: 'morris-line-chart',
  data: <?php print json_encode($rows); ?>,
  xkey: 'bulan',
  ykeys: ['sisa', 'masuk', 'putus', 'minutasi'],
  labels: ['Sisa Lalu', 'Masuk', 'Putus', 'Minutasi'],
  lineColors: ['rgb(231, 76, 60)','rgb(241, 196, 15)','#9ACD32','rgb(46, 204, 113)'],
  ymax: 'auto[<?php echo $max_key;?>]',
  xLabelFormat: function(x) { // <--- x.getMonth() returns valid index
    var month = months[x.getMonth()];
    return month;
  },
  dateFormat: function(x) {
    var month = months[new Date(x).getMonth()];
    return month;
  },
});

</script>