simak/app/pelunasan/main.php

<script type="text/javascript">
  var userTarget = "";
var exit = false;
$('.input-daterange').datepicker({
  format: "dd/mm/yyyy",
  weekStart: 1,
  orientation: "bottom auto",
  autoclose: true,
  showOnFocus: true,
  maxViewMode: 'days',
  keepEmptyValues: true,
  templates: {
    leftArrow: '&lt;',
    rightArrow: '&gt;'
  }
});
$('.input-daterange').focusin(function(e) {
  userTarget = e.target.name;
});
$('.input-daterange').on('changeDate', function(e) {
  if (exit) return;
  if (e.target.name != userTarget) {
    exit = true;
    $(e.target).datepicker('clearDates');
  }
  exit = false;
});
var thn_dpa=$('#thn_dpa').val();
</script>
<?php 
include('../koneksi.php');
$thn=$_POST['thn_dpa'];
?>

<br>
<br>
<br>
<br>
<p class="judul_page"><i class="mdi mdi-buffer m-r-5"></i>Pelunasan</p>


<div class="input-group my-group">

<select id="c4" name="c4" class="selectpicker form-control" style="width:15%;background-color:#f3f3f3;border-color:#f3f3f3;">
    <option value="ALL">ALL</option>
    <option value="FUNGSIONAL">FUNGSIONAL</option>
    <option value="SUBSIDI">SUBSIDI</option>
  </select>

  <select id="c1" name="c1" class="selectpicker form-control" style="width:8%;background-color:#f3f3f3;border-color:#f3f3f3;" 
  data-content="KPA" rel="popover" data-placement="top" data-trigger="hover">    
    <option></option>
    <?php 
                                    $d=pg_query("SELECT DISTINCT a1.id,a1.inisial
                                    FROM pekerjaan p
                                    INNER JOIN sub_kegiatan s ON (p.sub_kegiatan_id=s.id)
                                    INNER JOIN vr_realisasi r ON (r.pekerjaan_id=p.id)
                                    INNER JOIN vr_pelunasan l ON (l.vr_realisasi_id=r.id)
                                    INNER JOIN kpa a1 ON (s.kpa_id=a1.id)
                                    WHERE s.thn='$thn'  AND l.tanggal_setor IS NOT NULL
                                    ");
                                    while($r=pg_fetch_array($d)) { 

    ?>
    <option value="<?php echo $r[0];?>"><?php echo $r[1];?></option>
    <?php } ?>
  </select>
  <select id="c2" name="c2" class="selectpicker form-control" style="width:20%;background-color:#f3f3f3;border-color:#f3f3f3;">      
    <option value="ALL">ALL</option>
    <option value="NON UANG MUKA">NON UANG MUKA</option>
    <option value="UANG MUKA">UANG MUKA</option>
  </select>
  <select id="c3" name="c3" class="selectpicker form-control" style="width:17%;background-color:#f3f3f3;border-color:#f3f3f3;">
    <option value="ALL">ALL</option>
    <option value="NON FARMASI">NON FARMASI</option>
    <option value="FARMASI">FARMASI</option>
  </select>
    <div class="input-group input-daterange" style="width:40%;" name="pd1" id="pd1">
  <input type="text" id="tgl_mulai1" name="start" class="form-control" style="border-radius: 0px;border-color:#f3f3f3;text-align: center; " data-content="Tanggal Setor" rel="popover" data-placement="top" data-trigger="hover">
  <span class="input-group-addon">s/d</span>
  <input type="text" id="tgl_selesai1" name="finish" class="form-control" style="border-radius: 0px;border-color:#f3f3f3;text-align: center;"  data-content="Tanggal Setor" rel="popover" data-placement="top" data-trigger="hover">
  </div>
  <span class="input-group-btn">
    <button type="button" id="excel" name="excel" class="btn btn-success"><i class="fa fa-arrow-down m-r-5"></i>EXCEL</button>
  </span>
</div>
<br>


<div id="tabel_laporan"></div>

<div id="modal_sub" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                <div class="modal-dialog modal-full">
                                    <div class="modal-content">
                                        <div class="modal-header no-border">
                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                            <h4 class="modal-title" id="myModalLabel">Sub Kegiatan</h4>
                                        </div>
                                        <div class="modal-body" id="modal_body_sub"></div>
                                        <div class="modal-footer no-border">
                                            <button type="button" class="btn btn-default waves-effect" data-dismiss="modal" id="keluar_sub">Keluar</button>
                                        </div>
                                    </div>
                                </div>
                            </div>

<div id="modal_verifikasi" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                <div class="modal-dialog modal-full">
                                    <div class="modal-content">
                                        <div class="modal-header no-border">
                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                            <h4 class="modal-title" id="myModalLabel">Verifikasi</h4>
                                        </div>
                                        <div class="modal-body" id="modal_body_verifikasi"></div>
                                        <div class="modal-footer no-border">
                                            <button type="button" class="btn btn-default waves-effect" data-dismiss="modal" id="keluar_verifikasi">Keluar</button>
                                            <!--<button type="button" class="btn btn-teal waves-effect waves-light" id="simpan_verifikasi">Simpan</button>-->
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div id="modal_ba" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                <div class="modal-dialog modal-lg">
                                    <div class="modal-content">
                                        <div class="modal-header no-border">
                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                            <h4 class="modal-title" id="myModalLabel">Berita Acara</h4>
                                        </div>
                                        <div class="modal-body" id="modal_body_ba"></div>
                                        <div class="modal-footer no-border">
                                            <button type="button" class="btn btn-default waves-effect" data-dismiss="modal" id="keluar_ba">Keluar</button>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div id="modal_pelunasan" class="modal fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                <div class="modal-dialog">
                                    <div class="modal-content">
                                        <div class="modal-header no-border">
                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                            <h4 class="modal-title" id="myModalLabel">Pelunasan</h4>
                                        </div>
                                        <div class="modal-body" id="modal_body_pelunasan"></div>
                                        <div class="modal-footer no-border">
                                            <button type="button" class="btn btn-default waves-effect" data-dismiss="modal" id="keluar_pelunasan">Keluar</button>
                                            <button type="button" class="btn btn-teal waves-effect waves-light" id="simpan_pelunasan">Simpan</button>
                                        </div>
                                    </div>
                                </div>
                            </div>

							<div id="modal_cnv" class="modal fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                <div class="modal-dialog">
                                    <div class="modal-content">
                                        <div class="modal-header no-border">
                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                            <h4 class="modal-title" id="myModalLabel">Conversasi Data Hutang</h4>
                                        </div>
                                        <div class="modal-body" id="modal_body_cnv"></div>
                                        <div class="modal-footer no-border">
                                            <button type="button" class="btn btn-default waves-effect" data-dismiss="modal" id="keluar_cnv">Keluar</button>
                                            <button type="button" class="btn btn-teal waves-effect waves-light" id="simpan_cnv">Simpan</button>
                                        </div>
                                    </div>
                                </div>
                            </div>


<script>
$('select[name="c1"]').popover();
$('input[name="start"]').popover();
$('input[name="finish"]').popover();


var thn=$("#thn_dpa option:selected").text();
var axx = $('#c1').val();
var bxx = $('#c2').val();
var cxx = $('#c3').val();
var axxx = $('#c4').val();
var m = $('#tgl_mulai1').val();
var s = $('#tgl_selesai1').val();
$('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});

$('#simpan_cnv').click(function(){
  var x = confirm("Anda yakin ingin meng-conversasi ?");
     if (x) { 
		var vr_pelunasan_id = $('#vr_pelunasan_id_cnv').val();
		var sub_kegiatan_id = $('#sub_kegiatan_id_baru').val();
     var st_buku = $('#st_buku_cnv').val();
     var st_termin = $('#st_termin_cnv').val();
     var no_sp = $('#no_sp_cnv').val();
     var pekerjaan_id = $('#pekerjaan_id_cnv').val();
     	var key = 'conversasi';
     	$.ajax({
        type: "POST",
        url: "app/pelunasan/crud.php",
        data: 'vr_pelunasan_id='+vr_pelunasan_id
        +'&sub_kegiatan_id='+sub_kegiatan_id
        +'&st_buku='+st_buku
        +'&st_termin='+st_termin
        +'&no_sp='+no_sp
        +'&pekerjaan_id='+pekerjaan_id
        +'&key='+key,
        success: function(data){ 
            $('#modal_cnv').modal('hide');
            $('body').removeClass('modal-open');
            $('.modal-backdrop').remove();  
            alert('Conversasi sukses..');
            $('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});
        }
        });
     } else {}
});

$('#simpan_pelunasan').click(function(){
  var vr_pelunasan_id = $('#vr_pelunasan_id').val();
  var idx_kwi_bend = $('#idx_kwi_bend').val();
  var jenis_pph_bend = $('#jenis_pph_bend').val();
  var no_kwi_bend = $('#no_kwi_bend').val();
  var inisial_bend = $('#inisial_bend').val();
  var jenis_pembayaran = $('#jenis_pembayaran').val();
  var tanggal_lunas = $('#tanggal_lunas').val();
  var thn=$('#thn_dpa').val();
  var adm_perben=$('#cek_nama').val();
  var kpac=$('#kpac').val();
  var bulan = $('#bulan').val();
  var status_um = $('#status_um').val();
  var kode_perben = $('#kode_perben').val();
  var kode_subsidi = $('#kode_subsidi').val();
  var key = 'simpan_pelunasan';
  $.ajax({
        type: "POST",
        url: "app/pelunasan/crud.php",
        data: 'vr_pelunasan_id='+vr_pelunasan_id
        +'&idx_kwi_bend='+idx_kwi_bend
        +'&jenis_pph_bend='+jenis_pph_bend
        +'&no_kwi_bend='+no_kwi_bend
        +'&inisial_bend='+inisial_bend
        +'&jenis_pembayaran='+jenis_pembayaran
        +'&tanggal_lunas='+tanggal_lunas
  		+'&thn='+thn
  		+'&adm_perben='+adm_perben
        +'&kpac='+kpac
		+'&bulan='+bulan
  		+'&status_um='+status_um
        +'&kode_perben='+kode_perben
  		+'&kode_subsidi='+kode_subsidi
        +'&key='+key,
        success: function(data){
            $('#modal_pelunasan').modal('hide');
            $('body').removeClass('modal-open');
            $('.modal-backdrop').remove();  
            alert('Pelunasan sukses..');
            $('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});
        }
      });
});
 
$('#c1').change(function(){
  var axx = $('#c1').val();
  var bxx = $('#c2').val();
  var cxx = $('#c3').val();
  var axxx = $('#c4').val();
  var m = $('#tgl_mulai1').val();
  var s = $('#tgl_selesai1').val();
  $('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});
 });

 $('#c2').change(function(){
  var axx = $('#c1').val();
  var bxx = $('#c2').val();
  var cxx = $('#c3').val();
  var axxx = $('#c4').val();
  var m = $('#tgl_mulai1').val();
  var s = $('#tgl_selesai1').val();
  $('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});
 });

 $('#c3').change(function(){
  var axx = $('#c1').val();
  var bxx = $('#c2').val();
  var cxx = $('#c3').val();
  var axxx = $('#c4').val();
  var m = $('#tgl_mulai1').val();
  var s = $('#tgl_selesai1').val();
  $('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});
 });

 $('#c4').change(function(){
  var axx = $('#c1').val();
  var bxx = $('#c2').val();
  var cxx = $('#c3').val();
  var axxx = $('#c4').val();
  var m = $('#tgl_mulai1').val();
  var s = $('#tgl_selesai1').val();
  $('#tabel_laporan').load('app/pelunasan/tabel.php',{axxx:axxx,axx:axx,bxx:bxx,cxx:cxx,m:m,s:s,thn:thn});
 });

 $('#tgl_selesai1').change(function(){
  $('#c1').trigger('change');
 });

 $('#excel').click(function(){
    var w = 600;
    var h = 300;
    var thn=$('#thn_dpa').val();
    var axx = $('#c1').val();
    var bxx = $('#c2').val();
    var cxx = $('#c3').val();
    var axxx = $('#c4').val();
    var m = $('#tgl_mulai1').val();
    var s = $('#tgl_selesai1').val();
    var left = Number((screen.width/2)-(w/2));
    var tops = Number((screen.height/2)-(h/2));      
    window.open('app/pelunasan/excel_setor.php?axx='+axx+"&bxx="+bxx+"&cxx="+cxx+"&thn="+thn+"&m="+m+"&s="+s+"&axxx="+axxx,'newwin','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+tops+', left='+left);
});

</script>