<?php
session_start();
if(isset($_SESSION['halaman']) && !empty($_SESSION['halaman'])) { 
}
if(($_SESSION['halaman']=="admin"))
{
 
}
else
{
  header("location: ../../../login");  
}
include("../header.php");
include '../../../config/koneksi.php';

    
        
?>
                
<!DOCTYPE html>
<html>
    <head>
        <title></title>
         <link rel="stylesheet" href="../../../plugins/daterangepicker/daterangepicker.css">
  <!-- iCheck for checkboxes and radio inputs -->

<link rel="stylesheet" href="../../../plugins/fontawesome-free/css/all.min.css">
  <!-- SweetAlert2 -->
  <link rel="stylesheet" href="../../../plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css">
  <!-- Toastr -->
  <link rel="stylesheet" href="../../../plugins/toastr/toastr.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="../../../dist/css/adminlte.min.css">
    <!-- Select2 -->
  <link rel="stylesheet" href="../../../plugins/select2/css/select2.min.css">
  <link rel="stylesheet" href="../../../plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
   <link rel="stylesheet" href="../../../plugins/summernote/summernote-bs4.min.css">
<!-- Ekko Lightbox -->
 <!-- Ekko Lightbox -->
  <link rel="stylesheet" href="../../../plugins/ekko-lightbox/ekko-lightbox.css">
 
            <script type="text/javascript">

                function tampil() {
                    $('#tampil_data').html('<table style="width:100%"><tr><td style="text-align:center"><i  class="fas fa-10x   fa-spin">🌀</i><br><i class="fas fa-4x">🤔</i></td></tr></table>');
                    $.ajax({
                        type: 'GET',
                        url: 'tampil.php',
                        data: {
                             kode_sub_skpd: $("#kode_sub_skpd").val(),
                             bulan: $("#bulan").val()
                        },
                        success: function (data) {
                            $('#tampil_data').html(data);
                          
                        }
                    });
                };

 </script>  
  

 <script>
  
    function simpanfile(){
          $('#tampil_data').html('<table style="width:100%"><tr><td style="text-align:center"><i  class="fas fa-10x   fa-spin">🌀</i><br><i class="fas fa-4x">🤔</i></td></tr></table>');
    const file = $('#file').prop('files')[0];

          let formData = new FormData();
          formData.append('file', file);
         
          formData.append('file', $('#file').val());
          
          $.ajax({
              type: 'POST',
              url: "upload_aksi.php",
              data: formData,
              cache: false,
              processData: false,
              contentType: false,
              success: function (msg) {
                  alert(msg);
                  $("#file").val("");
                  tampil();
              },
              error: function () {
                  alert("Data Gagal Diupload");
                  $('#file').val('');
                  tampil();
              }
          });
        };
    
</script>


<script>
  
    function simpanfile2(){

          $('#tampil_data').html('<table style="width:100%"><tr><td style="text-align:center"><i  class="fas fa-10x   fa-spin">🌀</i><br><i class="fas fa-4x">🤔</i></td></tr></table>');
    const file = $('#file').prop('files')[0];


          let formData = new FormData();
          formData.append('file', file);
         
          formData.append('file', $('#file').val());
          formData.append('bulan', $('#bulan').val());
          
          $.ajax({
              type: 'POST',
              url: "upload_aksi2.php",
              data: formData,
              cache: false,
              processData: false,
              contentType: false,
              success: function (msg) {
                  alert(msg);
                  $("#file").val("");
                  tampil();
              },
              error: function () {
                  alert("Data Gagal Diupload");
                  $('#file').val('');
                  tampil();
              }
          });
        };
    
</script>



  <script >
     function simpanb() {
          e.preventDefault();
          $.ajax({
              url: 'upload_aksi.php',
              type: 'post',
              data: $("#forminput").serialize(),             
              success: function(data) {               
             tampilparenti();
            $("modal-simpan").hide();

              }
          });
     }
 </script>

  <script type="text/javascript">
     var myWindow;

     
    
  
     function openpeta1() {
      var id_datai = $("#id_datai").val();
      var tahun_awal = $("#tahun_awal").val();
      var tahun_akhir = $("#tahun_akhir").val();
      
      myWindow = window.open("peta/tampil.php?id_datai="+id_datai+"&tahun_awal="+tahun_awal+"&tahun_akhir="+tahun_akhir+"&stylei=streets-v12", "_blank", "width=1200, height=2800,top=1,left=50%");
    }

 </script>

  <script type="text/javascript">
    function mulai(){
setInterval(hitungdata, 1000);
                function hitungdata() {
                    $.ajax({
                        type: 'POST',
                        url: 'hitung.php',
                        data: {
                          kode_sub_skpd: $("#kode_sub_skpd").val(),
                             bulan: $("#bulan").val()
                        },
                        success: function (data) {
                            $('#tampil_hitung').html(data);
                          
                        }
                    });
                };
}
 </script>  
    </head>
    <body onload="tampil(),mulai()">
        
  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1 id="stat"></h1>
          </div>
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item active"></li>
            </ol>
          </div>
        </div>
      </div><!-- /.container-fluid -->
    </section>
        <section class="content">
      <div class="container-fluid">
       <div > 
             
<br>
<div class="card">
  <div class="card-header " style="background-image: linear-gradient(white,lightgreen,white);">
    <h3 class="card-title">Realisasi</h3>
    <div class="card-tools">
      <!-- Collapse Button -->
      <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
    </div>
    <!-- /.card-tools -->
  </div>
  <!-- /.card-header -->
  <div class="card-body" style="background-image:linear-gradient(white,gray)">



        <table >
          <tr>
            <td style="width: 5%;"><label>Bulan</label></td>
            <td style="width: 300px">
              
          <select id="bulan" style="width: 200px" onchange="tampil()"> 
            <option value="<?php echo date("Y") ?>-01-01" >Januari <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-02-01" >Februari <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-03-01" >Maret <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-04-01" >April <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-05-01" >mei <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-06-01" >Juni <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-07-01" >Juli <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-08-01" >Agustus <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-09-01" >September <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-10-01" >Oktober <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-11-01" >November <?php echo date("Y")?></option>
            <option value="<?php echo date("Y") ?>-12-01" >Desember <?php echo date("Y")?></option>
          </select>
            </td>
          </tr>
            <tr>
              <td><label>SKPD</label></td>
              <td><select id="kode_sub_skpd" style="width: 100%;" onchange="tampil()">
          
      <?php
$sqlsubskpd  = mysqli_query($koneksi, "SELECT
kode_sub_skpd,sub_skpd from sub_skpd 
    ");
foreach ($sqlsubskpd as $rowsubskpd) {

    ?>
<option value="<?php echo $rowsubskpd["kode_sub_skpd"]?>"><?php echo $rowsubskpd["sub_skpd"]?></option>
    <?php 
  }
    ?>
        </select></td>

            </tr>
            <tr>
              <td></td><td><input type="file"  id="file" name="file"  accept=".csv"> <button  style="float:right;" onclick="simpanfile2(),mulai()" class="btn btn-info"  data-dismiss="modal">Upload Realisasi</button></td>
            </tr>
        </table>
 
        

          
      </div>


      
 
  </div>
    </div>

             
<div id="tampil_hitung">Hitung</div>
          
            <div id="loadhitung"></div>
                <div  id="tampil_data" >LOOAading</div>
            </div>
          
        
  </div>
  <!-- /.card-body -->
</div>
<!-- /.card -->




     
      


<!-- ./wrapper -->
         <footer class="main-footer">
    <strong></strong>
    BADAN PERENCANAAN PEMBANGUNAN DAERAH
    <div class="float-right d-none d-sm-inline-block">
      <b>By </b> eky
    </div>
  </footer>

  <!-- Control Sidebar -->
  <aside class="control-sidebar control-sidebar-dark">
 <?php 
 include("../samping.php");
 ?>
  </aside>
  <!-- /.control-sidebar -->

        <!-- DataTables  & Plugins -->
<script src="../../../plugins/datatables/jquery.dataTables.min.js"></script>
<script src="../../../plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
<script src="../../../plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
<script src="../../../plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
<script src="../../../plugins/datatables-buttons/js/dataTables.buttons.min.js"></script>
<script src="../../../plugins/datatables-buttons/js/buttons.bootstrap4.min.js"></script>
<script src="../../../plugins/jszip/jszip.min.js"></script>
<script src="../../../plugins/pdfmake/pdfmake.min.js"></script>
<script src="../../../plugins/pdfmake/vfs_fonts.js"></script>
<script src="../../../plugins/datatables-buttons/js/buttons.html5.min.js"></script>
<script src="../../../plugins/datatables-buttons/js/buttons.print.min.js"></script>
<script src="../../../plugins/datatables-buttons/js/buttons.colVis.min.js"></script>
   
<!-- SweetAlert2 -->
<script src="../../../plugins/sweetalert2/sweetalert2.min.js"></script>
<!-- Toastr -->
<script src="../../../plugins/toastr/toastr.min.js"></script>
<!-- AdminLTE App -->
<!-- Select2 -->
<script src="../../../plugins/select2/js/select2.full.min.js"></script>
<script src="../../../plugins/daterangepicker/daterangepicker.js"></script>


<script src="../../../plugins/moment/moment.min.js"></script>
<script src="../../../plugins/inputmask/jquery.inputmask.min.js"></script>
<!-- date-range-picker -->
<script src="../../../plugins/daterangepicker/daterangepicker.js"></script>
<!-- bootstrap color picker -->
<script src="../../../plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>

        <!-- Bootstrap 4 -->

<script src="../../../plugins/summernote/summernote-bs4.min.js"></script>
<!-- SweetAlert2 -->
     

<script src="../../../plugins/chart.js/Chart.min.js"></script>
<!-- Ekko Lightbox -->
<script src="../../../plugins/ekko-lightbox/ekko-lightbox.min.js"></script>

<script type="text/javascript">
  function tgladd(){
     $('#tgl_beritai').datetimepicker({
                        format: 'yyyy-MM-DD',
                        autoclose: true,
                    });
  }
</script>

        <script>
            $(function () {

                  $('#tgl_beritai').datetimepicker({
                        format: 'yyyy-MM-DD',
                        autoclose: true,
                    });
                   $('#tgl_beritau').datetimepicker({
                        format: 'yyyy-MM-DD',
                        autoclose: true,
                    });

                   $("#tahun_awal").select2();
                    $("#tahun_akhir").select2();


       })
            // DropzoneJS Demo Code End
</script>

  <script>

  $(function () {
    // Summernote
    $('#kode_sub_skpd').select2();
    $('#bulan').select2();
    $('#keti').summernote(
        {
            placeholder:'input data anda',
            height:200,
        });

   
    CodeMirror.fromTextArea(document.getElementById("keti"), {
      mode: "htmlmixed",
      theme: "monokai"
    });


  })
</script>
<script>
  $(function () {
    $(document).on('click', '[data-toggle="lightbox"]', function(event) {
      event.preventDefault();
      $(this).ekkoLightbox({
        alwaysShowClose: true
      });
    });

    $('.filter-container').filterizr({gutterPixels: 3});
    $('.btn[data-filter]').on('click', function() {
      $('.btn[data-filter]').removeClass('active');
      $(this).addClass('active');
    });
  })
</script>
    </body>
</html>
