<!-- Page Heading -->

          <div class="d-sm-flex align-items-center justify-content-between mb-4">

            <h1 class="h3 mb-0 text-gray-800">PKA Periode <i class="periode_thn"></i></h1>

            <!-- <a href="#" class="d-none d-sm-inline-block btn btn-sm btn-primary shadow-sm"><i class="fas fa-download fa-sm text-white-50"></i> Generate Report</a> -->

          </div>

    <div class="card shadow mb-4">

      <div class="card-header py-3  bg-success">

      <h6 class="m-0 font-weight-bold text-light">Data Terkirim</h6>

      </div>

        <div class="card-body">



          <!-- Content Row -->

          <div class="row">



            <!-- Earnings (Monthly) Card Example -->

            <div class="col-xl-4 col-md-6 mb-4">

              <div class="card border-left-primary shadow h-100 py-2">

                <div class="card-body">

                  <div class="row no-gutters align-items-center">

                    <div class="col mr-2">

                      <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">Total Kegiatan </div>

                      <div class="h5 mb-0 font-weight-bold text-gray-800" id="tot_kegiatan"> </div>

                    </div>

                    <div class="col-auto">

                      <i class="fas fa-receipt fa-2x text-gray-500"></i>

                    </div>

                  </div>

                </div>

              </div>

            </div>



            <!-- Earnings (Monthly) Card Example -->

            <div class="col-xl-4 col-md-6 mb-4">

              <div class="card border-left-danger shadow h-100 py-2">

                <div class="card-body">

                  <div class="row no-gutters align-items-center">

                    <div class="col mr-2">

                      <div class="text-xs font-weight-bold text-danger text-uppercase mb-1">Pengeluaran </div>

                      <div class="h5 mb-0 font-weight-bold text-gray-800" id="pengeluaran"></div>

                    </div>

                    <div class="col-auto " >

                      <i class="fas fa-dollar-sign fa-2x text-gray-500"></i>

                    </div>

                  </div>

                </div>

              </div>

            </div>



            <!-- Earnings (Monthly) Card Example -->

            <div class="col-xl-4 col-md-6 mb-4">

              <div class="card border-left-success shadow h-100 py-2">

                <div class="card-body">

                  <div class="row no-gutters align-items-center">

                    <div class="col mr-2">

                      <div class="text-xs font-weight-bold text-success text-uppercase mb-1">Penerimaan</div>

                      <div class="row no-gutters align-items-center">

                        <div class="col-auto">

                          <div class="h5 mb-0 mr-3 font-weight-bold text-gray-800" id="penerimaan"></div>

                        </div>

                      </div>

                    </div>

                    <div class="col-auto">

                      <i class="fas fa-hand-holding-usd fa-2x text-gray-500"></i>

                    </div>

                  </div>

                </div>

              </div>

            </div>

          </div>

          <div class="modal-footer">

            <a href="javascript:void(0)" id="cetak_exel" class="d-none d-sm-inline-block btn btn-sm btn-success shadow-sm"><i class="fas fa-file-excel fa-sm text-white-50"></i> Export to Excel</a>

          </div>

          <input type="hidden" id="periode">

        </div>

      </div> 

    

                

        

<script type="text/javascript">

  $(document).ready(function(){

    var base_url = "<?=base_url()?>";

    var periode_thn_view = function(){

      jQuery.ajax({

        url: base_url+"dashboard/periode_thn_view",

        dataType:'json',

        success:function(response){  

          $(".periode_thn").html(response);

          $("#periode").val(response);

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('hide');

                        Command: toastr["error"](errorThrown, "Error");

                }     

      });

    }

    periode_thn_view();

    var tot_kegiatan = function(){

      jQuery.ajax({

        url: base_url+"dashboard/tot_kegiatan",

        dataType:'json',

        success:function(response){  

          // alert(response)

          $("#tot_kegiatan").html(response+" Kegiatan");

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('show');

                        Command: toastr["error"](errorThrown, "Error");

                }     

      });

    }

    tot_kegiatan();

    var pengeluaran = function(){

      jQuery.ajax({

        url: base_url+"dashboard/dashboard_pengeluaran",

        dataType:'json',

        success:function(response){

          // alert(response)

          // alert(formatRupiah(response,"Rp. "));      

          $("#pengeluaran").html(formatRupiah(response,"Rp. "));

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('hide');

                        Command: toastr["error"](errorThrown, "Error");

                }    

      });

    }

    pengeluaran();

    var penerimaan = function(){

      jQuery.ajax({

        url: base_url+"dashboard/dashboard_penerimaan",

        dataType:'json',

        success:function(response){

          // alert(response)

          // alert(formatRupiah(response,"Rp. "));      

          $("#penerimaan").html(formatRupiah(response,"Rp. "));

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('hide');

                        Command: toastr["error"](errorThrown, "Error");

                }   

      });

    }

    penerimaan();

    var tot_kegiatan_tersimpan = function(){

      jQuery.ajax({

        url: base_url+"dashboard/tot_kegiatan_tersimpan",

        dataType:'json',

        success:function(response){  

          // alert(response)

          $("#tot_kegiatan_tersimpan").html(response+" Kegiatan");

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('hide');

                        Command: toastr["error"](errorThrown, "Error");

                }     

      });

    }

    tot_kegiatan_tersimpan();

    var pengeluaran_tersimpan = function(){

      jQuery.ajax({

        url: base_url+"dashboard/dashboard_pengeluaran_tersimpan",

        dataType:'json',

        success:function(response){

          // alert(response)

          // alert(formatRupiah(response,"Rp. "));      

          $("#pengeluaran_tersimpan").html(formatRupiah(response,"Rp. "));

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('hide');

                        Command: toastr["error"](errorThrown, "Error");

                }    

      });

    }

    pengeluaran_tersimpan();

    var penerimaan_tersimpan = function(){

      jQuery.ajax({

        url: base_url+"dashboard/dashboard_penerimaan_tersimpan",

        dataType:'json',

        success:function(response){

          // alert(response)

          // alert(formatRupiah(response,"Rp. "));      

          $("#penerimaan_tersimpan").html(formatRupiah(response,"Rp. "));

        },

                error: function(jqXHR, textStatus, errorThrown) {

                  $('#loading').modal('hide');

                        Command: toastr["error"](errorThrown, "Error");

                }   

      });

    }

    penerimaan_tersimpan();

    $("#cetak_exel").click(function(){

      var periode = $("#periode").val();

      // window.open("http://www.dumetschool.com", "DUMET School", "height=700, width=500, scrollbars=yes");

      window.location = base_url+"Laporan_excel/cetak_excel_dashboard_user/"+periode.replace('/', '-');

    });

  })

</script>