Skip to content

aa.gusti / eis

Go to a project
Commit ff036114 by Ari Agung Prasetiyo
Options

mockup realtime piutang

1 parent d785e561
Inline Side-by-side
Showing 1 changed file with 42 additions and 31 deletions
eispajak/views/templates/realtime_piutang.pt
...@@ -12,17 +12,24 @@ ...@@ -12,17 +12,24 @@
<div metal:fill-slot="content"> <div metal:fill-slot="content">
<!-- Main Title --> <!-- Main Title -->
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-2">
<img src="${home}/eis/static/bapend.png" class="icon-rounded" alt="" align="left">
</div>
<div class="col-md-8">
<div class="text-center" style="margin-bottom: 20px; padding: 15px 0;"> <div class="text-center" style="margin-bottom: 20px; padding: 15px 0;">
<h2 style="margin: 0; font-weight: bold; color: #333; text-transform: uppercase; letter-spacing: 1px;"> <h2 style="margin: 0; font-weight: bold; color: #333; text-transform: uppercase; letter-spacing: 1px;">
LAPORAN REALTIME REALISASI PAJAK DAERAH LAPORAN REALTIME PIUTANG PAJAK DAERAH
</h2> </h2>
<h3 style="margin: 5px 0 0; font-weight: bold; color: #cc5200; text-transform: uppercase; letter-spacing: 1px;"> <h3 style="margin: 5px 0 0; font-weight: bold; color: #cc5200; text-transform: uppercase; letter-spacing: 1px;">
DATA DAN INFORMASI DATA DAN INFORMASI
</h3> </h3>
<h4 id="tanggalHariIni" style="margin: 5px 0 0; color: #003399; font-weight: bold;"></h4> <h4 id="tanggalHariIni" style="margin: 5px 0 0; color: #003399; font-weight: bold;"></h4>
</div> </div>
</div> </div>
<div class="col-md-2">
<img src="${home}/eis/static/img_logo.png" class="icon-rounded" alt="" align="left" width="
100">
</div>
</div> </div>
<div class="row hide"> <div class="row hide">
...@@ -85,30 +92,31 @@ ...@@ -85,30 +92,31 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-8"> <div class="col-md-12">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading">
<img src="${home}/eis/static/bapend.png" class="icon-rounded" alt="" align="left">
<h5 class="text-left bold">Target dan Realisasi per Pajak
<i class="fa fa-info-circle pull-right icon-color"></i>
</h5>
</div>
<div class="panel-body"> <div class="panel-body">
<table class="table table-bordered table-sm" id="table1"> <table class="table table-bordered table-sm" id="table1">
<thead> <thead>
<tr> <tr>
<th class="align-middle text-center">Kode</th> <th style="vertical-align: middle;text-align:center !important;" rowspan="2">Kode</th>
<th class="align-middle text-center">Uraian</th> <th style="vertical-align: middle;text-align:center !important;" rowspan="2">Jenis Pajak</th>
<th class="text-center">Target</th> <th style="vertical-align: middle;text-align:center !important;" rowspan="2">Jumlah Piutang</th>
<th class="text-center">Realisasi</th> <th class="text-center" colspan="3">Realisasi Penerimaan Piutang</th>
<th class="text-center">Selisih</th> <th style="vertical-align: middle;text-align:center !important;" rowspan="2">Sisa Piutang</th>
<th class="text-center">%</th> <th style="vertical-align: middle;text-align:center !important;" rowspan="2">% <br> Realisasi <br>Piutang</th>
</tr>
<tr>
<th style="vertical-align: middle;text-align:center !important;">Bulan Lalu</th>
<th style="vertical-align: middle;text-align:center !important;">Bulan Ini</th>
<th style="vertical-align: middle;text-align:center !important;">S/D Bulan ini</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr class="odd"> <tr class="odd">
<td class=""></td> <td class=""></td>
<td class=""></td> <td class=""></td>
<td class=""></td>
<td class=""></td>
<td class="right">0</td> <td class="right">0</td>
<td class="right">0</td> <td class="right">0</td>
<td class="right">0</td> <td class="right">0</td>
...@@ -117,6 +125,8 @@ ...@@ -117,6 +125,8 @@
</tbody> </tbody>
<tfoot> <tfoot>
<td colspan="2" class="text-right">Jumlah</td> <td colspan="2" class="text-right">Jumlah</td>
<td><span></span></td>
<td><span></span></td>
<td><span id="sum_target"></span></td> <td><span id="sum_target"></span></td>
<td><span id="sum_realisasi"></span></td> <td><span id="sum_realisasi"></span></td>
<td><span id="sum_sisa"></span></td> <td><span id="sum_sisa"></span></td>
...@@ -127,7 +137,7 @@ ...@@ -127,7 +137,7 @@
</div> </div>
</div> </div>
<!-- Gauge Chart Section --> <!-- Gauge Chart Section -->
<div class="col-md-4"> <div class="col-md-4 hide">
<div class="panel panel-default" id="gaugePanel" style="min-height: 500px;"> <div class="panel panel-default" id="gaugePanel" style="min-height: 500px;">
<div class="panel-heading" style="padding: 10px 15px;"> <div class="panel-heading" style="padding: 10px 15px;">
<h5 class="text-center bold" style="margin: 0;">REALISASI PAJAK DAERAH</h5> <h5 class="text-center bold" style="margin: 0;">REALISASI PAJAK DAERAH</h5>
...@@ -630,8 +640,7 @@ ...@@ -630,8 +640,7 @@
"searching": false, "searching": false,
"info": false, "info": false,
"autoWidth": false, "autoWidth": false,
"scrollX": true, "ordering":false,
"order": [[0, 'asc']],
"columnDefs": [ "columnDefs": [
{ className: 'text-center', width: "50px", targets: [0] }, { className: 'text-center', width: "50px", targets: [0] },
{ className: 'text-left', targets: [1] }, { className: 'text-left', targets: [1] },
...@@ -656,20 +665,22 @@ ...@@ -656,20 +665,22 @@
table.row.add([ table.row.add([
row.kode, row.kode,
row.nama, row.nama,
row.target, 0, //row.target,
row.realisasi, 0, //row.target,
row.sisa, 0, //row.target,
row.persen.toFixed(2) 0, //row.realisasi,
0, //row.sisa,
0, //row.persen.toFixed(2)
]); ]);
sum_target += row.target; sum_target = 0;//+= row.target;
sum_realisasi += row.realisasi; sum_realisasi = 0; //+= row.realisasi;
sum_sisa += row.sisa; sum_sisa = 0;//row.sisa;
sum_persen += row.persen; sum_persen = 0; row.persen;
}); });
$('#sum_target').html(sum_target.toLocaleString("id-ID")); $('#sum_target').html(sum_target.toLocaleString("id-ID"));
$('#sum_realisasi').html(sum_realisasi.toLocaleString("id-ID")); $('#sum_realisasi').html(sum_realisasi.toLocaleString("id-ID"));
$('#sum_sisa').html(sum_sisa.toLocaleString("id-ID")); $('#sum_sisa').html(sum_sisa.toLocaleString("id-ID"));
$('#sum_persen').html((sum_realisasi / sum_target * 100).toFixed(2)); $('#sum_persen').html(0);
// Update gauge with total values // Update gauge with total values
var gaugePercentage = (sum_realisasi / sum_target * 100); var gaugePercentage = (sum_realisasi / sum_target * 100);
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!