Skip to content

Taufik Yulianto / esipkd

Go to a project
Commit 8772e736 by pindya
Options

revisi tampilan daftar penerimaan dan tampilan chart detail

1 parent 0edc25be
Inline Side-by-side
Showing 4 changed files with 195 additions and 6 deletions
esipkd/views/ranking_opd.py
......@@ -51,9 +51,9 @@ def view_rank(request):
opds = Unit.query().filter(Unit.level_id.between(3,4)).order_by(Unit.kode).all()
for op in opds:
if op.level_id==3:
data_dashboard['sopd'].append(dict(peringkat=0,kode=op.kode.strip(), level=op.level_id, unit=op.nama.strip(), nominal=0))
data_dashboard['sopd'].append(dict(peringkat=0,kode=op.kode.strip(), level=op.level_id, unit=op.nama.strip(), nominal=0, target=0, persen=0))
if op.level_id==4:
data_dashboard['sopd4'].append(dict(kode=op.kode.strip(), level=op.level_id, unit=op.nama.strip(), nominal=0))
data_dashboard['sopd4'].append(dict(kode=op.kode.strip(), level=op.level_id, unit=op.nama.strip(), nominal=0, target=0, persen=0))
##RANKING##
tanggal_berjalan = dates['day']
......@@ -77,6 +77,24 @@ def view_rank(request):
for unit4 in data_dashboard['sopd4']:
if sopd.kode.startswith(unit4['kode']):
unit4['nominal']+=sopd.jumlah
#QUERY INVOICE
invoices = DBSession.query(
ARInvoice.tgl_tetap.label('tanggal'),
ARInvoice.jumlah.label('jumlah'),
ARInvoice.rek_kode.label('rek_kode'),
Unit.kode.label('kode'),
Unit.nama.label('nama'),
).join(Unit, func.trim(Unit.kode) == func.trim(ARInvoice.unit_kode)).\
filter(ARInvoice.tahun_id==dates['year']).order_by(ARInvoice.unit_kode)\
.all()
for i in invoices:
#RANKING Target
for unit3 in data_dashboard['sopd']:
if i.kode.strip().startswith(unit3['kode']):
unit3['target']+=i.jumlah
##RANKING Persen
for unit3 in data_dashboard['sopd']:
unit3['persen'] = unit3['target']>0 and str(round((float(unit3['nominal'])/float(unit3['target']))*100,2)) or '0'
##SORT
data_dashboard['sopd'] = sorted(data_dashboard['sopd'], key = lambda i: (i['nominal']), reverse=True)
......@@ -84,7 +102,7 @@ def view_rank(request):
for opd in data_dashboard['sopd']:
i+=1
if i < 10:
data_dashboard['sopd10'].append(dict(peringkat=i+1, kode=opd['kode'], unit=opd['unit'], nominal=opd['nominal']))
data_dashboard['sopd10'].append(dict(peringkat=i+1, kode=opd['kode'], unit=opd['unit'], nominal=opd['nominal'], target=opd['target'], persen=opd['persen']))
opd['peringkat'] = i+1
......@@ -126,7 +144,7 @@ def view_det(request):
if not opds:
raise HTTPFound(location=request.route_url('home'))
for op in opds:
data_dashboard['sopd4'].append(dict(kode=op.kode.strip(), level=op.level_id, unit=op.nama.strip(), nominal=0))
data_dashboard['sopd4'].append(dict(kode=op.kode.strip(), level=op.level_id, unit=op.nama.strip(), nominal=0, target=0, persen=0))
unit_kode = 'kode' in params and params['kode'] or ''
unit_nama = 'unit' in params and params['unit'] or ''
......@@ -145,6 +163,24 @@ def view_det(request):
for unit4 in data_dashboard['sopd4']:
if sopd.kode.startswith(unit4['kode']):
unit4['nominal']+=sopd.jumlah
#QUERY INVOICE
invoices = DBSession.query(
ARInvoice.tgl_tetap.label('tanggal'),
ARInvoice.jumlah.label('jumlah'),
ARInvoice.rek_kode.label('rek_kode'),
Unit.kode.label('kode'),
Unit.nama.label('nama'),
).join(Unit, func.trim(Unit.kode) == func.trim(ARInvoice.unit_kode)).\
filter(ARInvoice.tahun_id==dates['year']).order_by(ARInvoice.unit_kode)\
.all()
for i in invoices:
#RANKING Target
for unit4 in data_dashboard['sopd4']:
if i.kode.strip().startswith(unit4['kode']):
unit4['target']+=i.jumlah
##RANKING Persen
for unit4 in data_dashboard['sopd4']:
unit4['persen'] = unit4['target']>0 and str(round((float(unit4['nominal'])/float(unit4['target']))*100,2)) or '0'
return dict(project='esipkd', dates=dates, data = data_dashboard, unit_kode=unit_kode, unit_nama=unit_nama, statusadmin=statusadmin)
else:
......
esipkd/views/templates/chart_det.pt
......@@ -121,6 +121,151 @@
<script type="text/javascript" src="/static/js/jquery-2.1.1.min.js"></script>
<script>
$(document).ready(function () {
$('canvas').click(function(){
window.location = $(this).attr('href');
return false;
});
//CHART
Chart.pluginService.register({
beforeRender: function (chart) {
if (chart.config.options.showAllTooltips) {
// create an array of tooltips
// we can't use the chart tooltip because there is only one tooltip per chart
chart.pluginTooltips = [];
chart.config.data.datasets.forEach(function (dataset, i) {
chart.getDatasetMeta(i).data.forEach(function (sector, j) {
chart.pluginTooltips.push(new Chart.Tooltip({
_chart: chart.chart,
_chartInstance: chart,
_data: chart.data,
_options: chart.options.tooltips,
_active: [sector]
}, chart));
});
});
// turn off normal tooltips
chart.options.tooltips.enabled = false;
}
},
afterDraw: function (chart, easing) {
if (chart.config.options.showAllTooltips) {
// we don't want the permanent tooltips to animate, so don't do anything till the animation runs atleast once
if (!chart.allTooltipsOnce) {
if (easing !== 1)
return;
chart.allTooltipsOnce = true;
}
// turn on tooltips
chart.options.tooltips.enabled = true;
Chart.helpers.each(chart.pluginTooltips, function (tooltip) {
tooltip.initialize();
tooltip.update();
// we don't actually need this since we are not animating tooltips
tooltip.pivot();
tooltip.transition(easing).draw();
});
chart.options.tooltips.enabled = false;
}
}
});
Chart.defaults.global.scaleLabel = function(label){
return label.value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
};
<tal:block tal:repeat="c data">
//LINE
var config = {
type: 'line',
data: {
labels: ['Jan','Feb','Mar','Apr','Mei','Jun','Jul','Agt','Sep','Okt','Nov','Des'],
datasets: [{
label: 'Target',
backgroundColor: "#264184",
borderColor: "#264184",
fill: false,
data: ${str(c['target']).replace('L','')},
},
{
label: 'Realisasi',
backgroundColor: "#15915b",
borderColor: "#15915b",
fill: false,
data: ${str(c['realisasi']).replace('L','')},
}]
},
options: {
responsive: true,
title: {
display: true,
text: '${c['kode']} ${c['nama']}'
},
showAllTooltips: false,
tooltips: {
enabled: true,
callbacks: {
title: function(tooltipItem, data) {
return '';
},
label: function(tooltipItem, data) {
return tooltipItem.yLabel.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
},
labelTextColor: function(tooltipItem, data) {
return 'rgba(0,0,0,0.8)';
},
displayColors: false,
borderWidth: 0,
},
backgroundColor: "rgba(0, 0, 0, 0)",
titleFontSize: 11,
mode: 'point'
},
hover: {
mode: 'nearest',
intersect: true
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: false,
},
gridLines: {
color: "rgba(0, 0, 0, 0)",
}
}],
yAxes: [{
display: false,
scaleLabel: {
display: true,
labelString: 'Value'
},
gridLines: {
color: "rgba(0, 0, 0, 0)",
},
ticks: {
beginAtZero: true,
callback: function(value, index, values) {
if(parseInt(value) >= 1000){
return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
} else {
return value;
}
}
}
}]
},
elements: {
line: {
tension: 0
}
}
}
};
var ctx = document.getElementById('chart${c['kode']}').getContext('2d');
BAR = new Chart(ctx, config);
</tal:block>
});
</script>
</div>
......
esipkd/views/templates/ranking/ranking_det.pt
......@@ -117,7 +117,9 @@
<tr>
<th style="text-align:center;">Kode Unit</th>
<th style="text-align:center;">Nama Unit</th>
<th style="text-align:center;">Nominal</th>
<th style="text-align:center;">Target</th>
<th style="text-align:center;">Realisasi</th>
<th style="text-align:center;">Persen</th>
</tr>
</thead>
<tbody>
......@@ -126,7 +128,9 @@
<tr class="header" title="klik untuk melihat daftar lengkap ranking" href="/ranking/det?date=${request.params['date']}&kode=${so4['kode']}&unit=${so4['unit']}">
<td style="text-align:left;">${so4['kode']}</td>
<td style="text-align:left;">${so4['unit']}</td>
<td style="text-align:right;">${'{:n}'.format(so4['target'])}</td>
<td style="text-align:right;">${'{:n}'.format(so4['nominal'])}</td>
<td style="text-align:right;">${so4['persen']}</td>
</tr>
</tal:block>
</tal:block>
......
esipkd/views/templates/ranking/ranking_opd.pt
......@@ -118,7 +118,9 @@
<th style="text-align:center;">No</th>
<th style="text-align:center;">Kode Unit</th>
<th style="text-align:center;">Nama Unit</th>
<th style="text-align:center;">Nominal</th>
<th style="text-align:center;">Target</th>
<th style="text-align:center;">Realisasi</th>
<th style="text-align:center;">Persen</th>
</tr>
</thead>
<tbody>
......@@ -128,7 +130,9 @@
<td style="text-align:center;">${so['peringkat']}</td>
<td style="text-align:left;">${so['kode']}</td>
<td style="text-align:left;">${so['unit']}</td>
<td style="text-align:right;">${'{:n}'.format(so['target'])}</td>
<td style="text-align:right;">${'{:n}'.format(so['nominal'])}</td>
<td style="text-align:right;">${so['persen']}</td>
</tr>
</tal:block>
</tal:block>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!