@extends('layouts.pegawai')
@section('title', 'Home '.strtoupper(App\IPR::where('name', $ipr->name)->pluck('name')[0]))
@section('home', 'm-menu__item--active')
@section(App\Cluster::where('id', $ipr->cluster_id)->pluck('name')[0], 'm-menu__item--active')
@section(App\IPR::where('name', $ipr->name)->pluck('name')[0], 'm-menu__item--active')
@section('css')
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.6.1/css/buttons.dataTables.min.css">
<style>
   .range_inputs {
      display: none;
   }
</style>
@endsection
@section('content')
@role(['super_admin', 'pegawai'])
@if(Auth::user()->hasRole('super_admin') || (Auth::user()->hasRole('pegawai') && Auth::user()->ipr_id == App\IPR::where('name', 'hijrah')->pluck('id')[0]))
<div class="row">
   <div class="col-lg-12">
      <div class="m-portlet m-portlet--mobile">
         <div class="m-portlet__body">
            <div class="m-portlet__head-caption">
               <div class="m-portlet__head-title">
                  <h3 class="m-portlet__head-text">
                     Permohonan {{ App\IPR::where('name', 'hijrah')->pluck('display_name')[0] }}
                     <br>
               </div>
            </div>
            <div class="datatable">
                <div class="col-md-12">
                  <form class="pull-right" id="search_form" style="margin-top: 15px;">
                     <div class="input-group">
                        @if(Auth::user()->hasRole('super_admin') || $is_permission_own || $is_permission_all)
                       
                        @endif
                        <div class="" style="margin-right:5px">
                           <a href=" {{route('addPayment', $data->id)}} " id="export_file" class="btn btn-info m-btn m-btn--custom m-btn--icon m-btn--air m-btn--pill" style="padding:.75rem 1rem">
                              <span>
                                 <i class="la la-file-excel-o"></i>
                                 <span>
                                    Pembayaran Baru
                                 </span>
                              </span>
                           </a>
                        </div>
                        <div class="" style="margin-right:5px">
                           <a href="#" id="export_file" onclick="exportFile();return false;" class="btn btn-info m-btn m-btn--custom m-btn--icon m-btn--air m-btn--pill" style="padding:.75rem 1rem">
                              <span>
                                 <i class="la la-file-excel-o"></i>
                                 <span>
                                    Export
                                 </span>
                              </span>
                           </a>
                        </div>
                        <div id="permohonan_range" style="background: #fff; cursor: pointer; padding: 10px 10px; border: 1px solid #ebedf2;">
                           <i class="fa fa-calendar"></i>&nbsp;<span></span> <i class="fa fa-caret-down"></i>
                        </div>
                        <input type="hidden" id="status" value="{{$status}}" />
                        <input type="hidden" id="from_date" value="" />
                        <input type="hidden" id="to_date" value="" />
                        <select class="form-control" id="filter_type" style="height:unset;padding:5px 5px;">
                           <option value="Kutipan_ID">Kutipan ID</option>
                           <option value="Pinjaman_id">Pinjaman ID</option>
                           <option value="Pegawai_Kutipan">Pegawai Kutipan</option>
                           <option value="Kod_Transaksi">Kod Transaksi</option>
                           <option value="semua" selected="selected">Semua</option>
                        </select>
                        <input type="text" class="form-control" id="q" placeholder="Carian..." style="height:unset;padding:5px 5px;">
                        <button type="button" class="btn btn-default" id="filter"><span class="fa fa-search"></span></button>
                     </div>
                  </form>
               </div>
                <table class="table table-striped" id="permohonan_table">
                  <thead>
                     <tr>
                        <th>Kutipan ID</th>
                        <th>Pinjaman id</th>
                        <th>Pegawai Kutipan</th>
                        <th>Tarikh Kutipan</th>
                        <th>Tarikh Bayaran</th>
                        <th>Kod_Transaksi</th>
                        <th>Jumlah Bayaran</th>
                        <th width="10%"></th>
                     </tr>
                  </thead>
                </table>
            </div>
         </div>
      </div>
   </div>
</div>


@endif
@endrole
@endsection

@section('js')
@role(['super_admin','admin', 'pegawai'])
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js"></script>

<script src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.print.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>

<script>
  $(document).ready(function() {
      $('#permohonan_table').dataTable({
      processing: true,
      paging: true,
      pageLength: 15,
      lengthMenu: [
         [15, 30, 50, 100],
         [15, 30, 50, 100]
      ],
    //   serverSide: true,
      ajax: "{{ url('pegawai/permohonan/hijrah/payment/list/'.session('show_id')) }}",
      searching : false,
      language: {
         emptyTable: "Tiada Data",
         decimal: ",",
         thousands: "."
      },
      columns: [
        {
               data: 'Kutipan_ID',
               name: 'Kutipan_ID'
            },
            {
                  data: 'Pinjaman_id',
                  name: 'Pinjaman_id'
            },
            {
                  data: 'Pegawai_Kutipan',
                  name: 'Pegawai_Kutipan'
            },
            {
                  data: 'Tarikh_Kutipan',
                  name: 'Tarikh_Kutipan'
            },
            {
                  data: 'Tarikh_Bayaran',
                  name: 'Tarikh_Bayaran'
            },
            {
                  data: 'Kod_Transaksi',
                  name: 'Kod_Transaksi'
            },
            {
                  data: 'Jumlah_Bayaran',
                  name: 'Jumlah_Bayaran'
            },
            
            {
                  data: 'action',
                  name: 'action',
                  orderable: false,
                  searchable: false
            }
         ],

   });

   

});

   



   $('#search_form').submit(function (event) {
       event.preventDefault();
       $("#filter").trigger("click");
   });

   $('#filter').click(function(){
       var status = $('#status').val();
       var from_date = $('#from_date').val();
       var to_date = $('#to_date').val();
       var q = $('#q').val();
       var filter_type = $("#filter_type").val();

       $('#permohonan_table').dataTable().fnDestroy();
       $('#permohonan_table').dataTable({});
       $('#permohonan_table').dataTable().fnDestroy();
       $('#permohonan_table').dataTable({
           processing: true,
           paging: true,
           pageLength: 15,
           lengthMenu: [[15, 30, 50, 100], [15, 30, 50, 100]],
           serverSide: true,
           ajax: {
               url:"{{ url('pegawai/permohonan/hijrah/payment/list/'.session('show_id')) }}",
               data:{status:status, from_date:from_date, to_date:to_date, q:q, filter_type:filter_type}
           },
           searching: false,
           language: {
               emptyTable: "Tiada Data"
           },
           columns: [
            {
               data: 'Kutipan_ID',
               name: 'Kutipan_ID'
            },
            {
                  data: 'Pinjaman_id',
                  name: 'Pinjaman_id'
            },
            {
                  data: 'Pegawai_Kutipan',
                  name: 'Pegawai_Kutipan'
            },
            {
                  data: 'Tarikh_Kutipan',
                  name: 'Tarikh_Kutipan'
            },
            {
                  data: 'Tarikh_Bayaran',
                  name: 'Tarikh_Bayaran'
            },
            {
                  data: 'Kod_Transaksi',
                  name: 'Kod_Transaksi'
            },
            {
                  data: 'Jumlah_Bayaran',
                  name: 'Jumlah_Bayaran'
            },
            
            {
                  data: 'action',
                  name: 'action',
                  orderable: false,
                  searchable: false
            }
         ],
       });
   });

   $(function() {
       $(window).resize(function() {});
   });

   $(function() {
       var start = moment("2000-01-01");
       var end = moment();

       function cb(start, end) {
           $('#permohonan_range span').html(start.format('D MMMM YYYY') + ' - ' + end.format('D MMMM YYYY'));
           $('#from_date').val(start.format('YYYY-MM-DD'));
           $('#to_date').val(end.format('YYYY-MM-DD'));
       }

       $('#permohonan_range').daterangepicker({
            showDropdowns: true,
            minYear: 2008,
            maxYear: 2020,
            startDate: start,
            endDate: end,
            ranges: {
               'Semua': [start, end],
               'Hari Ini': [moment(), moment()],
               '7 Hari Terakhir': [moment().subtract(6, 'days'), moment()],
               'Bulan Ini': [moment().startOf('month'), moment().endOf('month')],
               'Tahun Ini': [moment().startOf('years'), moment().endOf('years')]
           },
            locale: {
               format: 'DD/MM/YYYY'
           },
           autoApply: true,
           opens: 'left'
       }, cb);

       cb(start, end);

   });

   function exportFile() {
       var status = $('#status').val();
       var from_date = $('#from_date').val();
       var to_date = $('#to_date').val();
       var q = $('#q').val();
       var filter_type = $('#filter_type').val();

       window.open('{{ url('pegawai/permohonan/hijrah/payment/export/') }}{{csrf_token()}}&status='+status+'&from_date='+from_date+'&to_date='+to_date+'&q='+q+'&filter_type='+filter_type, '_blank');
   }

   function showDetail(x) {
      var data = {
           _token: '{{ csrf_token() }}',
           id: x
       };

      $.ajax({
         url: '{{ url('pegawai/permohonan/hijrah/show')}}',
         type: 'POST',
         data: data,
         success: function(response) {
            url = '{{ url('pegawai/rumusan')}}/hijrah/'+x;

            var data = response.data;
            var permohonan = response.permohonan;
            var pasangan = response.pasangan;
            var anak = response.anak;
            var perniaagaan = response.perniaagaan;
            var kutipan = response.kutipan;
            var peserta_takaful = response.peserta_takaful;

            // Tarikh Permohonan
            $('#created_at').html(moment(response.data.tarikh_mohon, 'YYYY-MM-DD HH:mm:ss').format('DD/MM/YYYY'));

            // Maklumat Peserta
            $('#m_dun').val(permohonan.Dun);
            $('#m_parlimen').val(permohonan.Parlimen);
            $('#m_nama').val(permohonan.Nama_Peserta);
            $('#m_agama').val(permohonan.Agama);
            $('#m_kp').val(permohonan.NoKP_Peserta);
            $('#m_bangsa').val(permohonan.Bangsa);
            $('#m_jantina').val(permohonan.Jantina);
            $('#m_status_kahwin').val(permohonan.Status_Perkahwinan);
            $('#m_tempoh_mastautin').val(permohonan.Mastautin);
            $('#m_telefon').val(permohonan.No_Telefon_Bimbit);
            $('#m_negeri').val(permohonan.Negeri);
            $('#m_telefon_tetap').val(permohonan.No_Telefon_Tetap);
            $('#m_alamat').html(permohonan.Alamat_Rumah);
            $('#m_poskod').val(permohonan.Poskod);
            $('#m_daerah').val(permohonan.Daerah);


            // Maklumat Pasangan

            if(permohonan.Status_Perkahwinan == "BERKAHWIN") {
                $('.maklumat_pasangan_info').show();                    
            }else{
                $('.maklumat_pasangan_info').hide();                      
            }

            $('#m_nama_pasangan').val(pasangan.Nama_Pasangan);
            $('#m_kp_pasangan').val(pasangan.NoKP_Pasangan);
            $('#no_telefon_pasangan').val(pasangan.Telefon_Bimbit_Pasangan);
            $('#m_agama_pasangan').val(pasangan.Agama);
            $('#m_bangsa_pasangan').val(pasangan.Bangsa);

            $('#m_maklumat_anak').html('');
               anak.forEach(function(d) {
                  html =
                  '<tr>'+
                        '<td>'+
                           '<input type="text" class="form-control m-input" value="'+(d.Nama_Peserta)+'" disabled>'+
                        '</td>'+
                        '<td>'+
                           '<input type="text" class="form-control m-input" value="'+(d.NoKP_Anak)+'" disabled>'+
                        '</td>'+
                        '<td>'+
                           '<input type="text" class="form-control m-input" value="'+(d.Jantina)+'" disabled>'+
                        '</td>'+
                        '<td>'+
                           '<input type="text" class="form-control m-input" value="'+(d.Tarikh_Lahir)+'" disabled>'+
                        '</td>'+
                        '<td>'+
                           '<input type="text" class="form-control m-input" value="'+(d.Taraf_Pendidikan)+'" disabled>'+
                        '</td>'+
                        '<td>'+
                           '<input type="text" class="form-control m-input" value="'+(d.Nama_Kursus)+'" disabled>'+
                        '</td>'+
                  '</tr>';

                  $('#m_maklumat_anak').append(html);
               });

               // Maklumat Perniagaan
               $('#m_aktiviti').val(perniaagaan.Aktiviti_Perniagaan);
               $('#m_tempoh_niaga').val(perniaagaan.Tempoh_Niaga);
               $('#no_telefon_pasangan').val(perniaagaan.No_Pendaftaran_SSM);
               $('#m_no_ssm').val(perniaagaan.No_Pendaftaran_SSM);
               $('#m_alamat_perniagaan').html(perniaagaan.Alamat_Perniagaan);
               $('#m_jenis_premis').val(perniaagaan.Premis);
               $('#dun_niaga').val(perniaagaan.Dun);
               $('#parlimen_niaga').val(perniaagaan.Parlimen);


               // Tujuan Pinjaman 
               $('#m_nama_bank').val(perniaagaan.Nama_Bank);
               $('#m_tujuan_pinjaman').val(perniaagaan.Tujuan_Pinjaman);
               $('#m_no_akaun').val(perniaagaan.No_Akaun);
               $('#m_tempoh_bayar').val();
               $('#m_jumlah_mohon').val();

               // Maklumat Pendapatan Bulanan
               $('#m_Pendapatan_Aktiviti').val(parseFloat(perniaagaan.Pendapatan_Aktiviti).toFixed(2)? perniaagaan.Pendapatan_Aktiviti : '');
               $('#m_Pendapatan_Pasangan').val(parseFloat(perniaagaan.Pendapatan_Pasangan).toFixed(2) ? perniaagaan.Pendapatan_Pasangan : '');
               $('#m_Pendapatan_Lain').val(parseFloat(perniaagaan.Pendapatan_Lain).toFixed(2) ? perniaagaan.Pendapatan_Lain: '' );
               $('#m_Jumlah_Pendapatan').val(parseFloat(perniaagaan.Jumlah_Pendapatan).toFixed(2) ? perniaagaan.Jumlah_Pendapatan : '' );

               // Maklumat Pendapatan Bulanan
               $('#m_Perbelanjaan_Aktiviti').val(parseFloat(perniaagaan.Perbelanjaan_Aktiviti).toFixed(2) ? perniaagaan.Perbelanjaan_Aktiviti : '');
               $('#m_Perbelanjaan_Isi_Rumah').val(parseFloat(perniaagaan.Perbelanjaan_Isi_Rumah).toFixed(2) ? perniaagaan.Perbelanjaan_Isi_Rumah : '');
               $('#m_Perbelanjaan_Persekolahan').val(parseFloat(perniaagaan.Perbelanjaan_Persekolahan).toFixed(2) ? perniaagaan.Perbelanjaan_Persekolahan : '');
               $('#m_Perbelanjaan_Sewa').val(parseFloat(perniaagaan.Perbelanjaan_Sewa).toFixed(2) ? perniaagaan.Perbelanjaan_Sew : '');
               $('#m_Perbelanjaan_Hutang').val(parseFloat(perniaagaan.Perbelanjaan_Hutang).toFixed(2) ? perniaagaan.Perbelanjaan_Hutang : '');
               $('#m_Jumlah_Perbelanjaan').val(parseFloat(perniaagaan.Jumlah_Perbelanjaan).toFixed(2) ? perniaagaan.Jumlah_Perbelanjaan : '');


               // Maklumat Dokumen


               $('#maklumat_dokumen').html('');
                   
                     html =
                     '<tr>'+
                           '<td>Salinan Kad Pengenalan</td>'+
                           '<td> <a href="'+(data.salinan_ic)+'" download> Muat Turun </a> </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Surat Nikah/Surat Pendaftaran Pekahwinan/Surat Cerai </td>'+
                        ' <td> <a href="'+(data.surat_nikah_cerai)+'" download> Muat Turun </a> </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Kad Pengenalan Mykid, atau Sijil Kelahiran Anak</td>'+
                           '<td> <a href="'+(data.salinan_mykid)+'" download> Muat Turun </a> </td>'+
                     ' </tr>'+
                     '<tr>'+
                           '<td>Penyata Gaji 3 Bulan Terkini</td>'+
                        '<td> <a href="'+(data.penyata_gaji)+'" download> Muat Turun </a> </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Penyata Bank 1 Bulan</td>'+
                           '<td> <a href="'+(data.penyata_bank)+'" download> Muat Turun </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Pengesahan Pendapatan Terkini dari Pesuruhjaya Sumpah</td>'+
                           '<td> <a href="'+(data.salinan_pesuruhjaya_sumpah)+'" download> Muat Turun </a> </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Kad Orang Kurang Upaya (OKU)</td>'+
                           '<td> <a href="'+(data.salinan_kad_oku)+'" download> Muat Turun </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Surat Pengesahan Doktor</td>'+
                           '<td> <a href="'+(data.surat_pengesahah_doktor)+'" download> Muat Turun </a> </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Bil Elektrik & Bil Air terkini kediaman sekarang</td>'+
                           '<td> <a href="'+(data.salinan_bil)+'" download> Muat Turun </a> </td>'+
                     '</tr>'+
                     '<tr>'+
                           '<td>Salinan Daftar Undi (boleh ke website SPR untuk semakan)</td>'+
                           '<td> <a href="'+(data.salinan_daftar_undi)+'" download> Muat Turun </a> </td>'+
                     '</tr>';

                     $('#maklumat_dokumen').append(html);
               

            // Cetak
            $('.btn-cetak').attr('href', url);

         },
         error: function(response) {
            $.alert({
               type: 'red',
               title: 'Whoops, looks like something went wrong!',
               content: 'Please check your console.error().',
               typeAnimated: true,
               icon: 'fa fa-warning',
               columnClass: 'col-md-6 col-md-offset-3',
            });
         }
      });
      

      $('#maklumat_permohonan').modal('show');
}
   
</script>
@endrole
@endsection