@extends('layouts.dun')
@section('title', 'Permohonan BAUCAR')
@section('permohonan', '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(['dun'])

<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', 'baucer')->pluck('display_name')[0] }}
               </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('dun') || $is_permission_own || $is_permission_all)
                        <div class="" style="margin-right:5px">
                            <a href="{{ url('dun/permohonan/baucer/add') }}" 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-plus"></i>
                                    <span>
                                        Permohonan Baru
                                    </span>
                                </span>
                            </a>
                        </div>
                    @endif
                    @if(Auth::user()->hasRole('dun') || $is_permission_export)
                        <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>
                    @endif
                        <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="id_permohonan">Id Permohonan</option>
                        <option value="nama">Pemohon</option>
                        <option value="ic">No. Identiti</option>
                        <option value="perayaan">Perayaan</option>
                        <option value="status">Status</option>
                        <option value="alamat">Alamat</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>
                <div class="table-responsive">
                <table class="table table-striped" id="permohonan_table">
                    <thead>
                        <tr>
                        <th>Id Permohonan</th>
                        <th>Pemohon</th>
                        <th>No. Identiti</th>
                        <th>Perayaan</th>
                        <th>Tarikh Permohonan</th>
                        <th>Tarikh Terima Baucar</th>
                        <th>Status</th>
                        <th width="10%"></th>
                        </tr>
                    </thead>
                </table>
                </div>
            </div>
         </div>
      </div>
   </div>
</div>

{{-- Modal --}}
        <div class="modal fade" id="maklumat_permohonan" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" style="background-color: rgba(0, 0, 0,.6)">
            <div class="modal-dialog modal-lg" role="document" style="max-width: 1000px;">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="exampleModalLabel">
                            Rumusan Permohonan <br>
                            <small>
                                <i>Tarikh Permohonan: <span id="m_tarikh_permohonan"></span></i>
                            </small>
                        </h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">
                                &times;
                            </span>
                        </button>
                    </div>
                    <div class="modal-body">
                    <div class="m-form__section m-form__section--first">
                            <h5 style="color: #f4516c">
                                Maklumat Permohonan:
                            </h5>
                            <br>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                    Status Permohonan:
                                    </label>
                                    <input type="text" class="form-control" id="m_status" readonly>
                                </div>
                                <div class="col-md-6" id="alasan">
                                    <label for="recipient-name" class="form-control-label">
                                    Alasan:
                                    </label>
                                    <input type="text" class="form-control" id="m_alasan" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label no_baucar">
                                    No Baucar:
                                    </label>
                                    <input type="text" class="form-control" id="m_no_baucar" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label tarikh_terima">
                                    Tarikh Terima:
                                    </label>
                                    <input type="text" class="form-control" id="m_tarikh_terima" readonly>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                    Bersempena Perayaan:
                                    </label>
                                    <input type="text" class="form-control" id="m_perayaan" readonly>
                                </div>
                            </div>
                        </div>
                        <hr class="modal-hr">
                        <div class="m-form__section m-form__section--first">
                            <h5 style="color: #f4516c">
                                Maklumat Tempat Mengundi (DUN):
                            </h5>
                            <br>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                    Kawasan Mengundi (DUN):
                                    </label>
                                    <input type="text" class="form-control" id="m_adun" readonly>
                                </div>
                            </div>
                        </div>
                        <hr class="modal-hr">
                        <div class="m-form__section m-form__section--first">
                            <h5 style="color: #f4516c">
                                Maklumat Peribadi:
                            </h5>
                            <br>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Nama:
                                    </label>
                                    <input type="text" class="form-control" id="m_nama" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Negeri Kelahiran:
                                    </label>
                                    <input type="text" class="form-control" id="m_negerikelahiran" readonly>
                                </div>
                            </div>
                            <div class="form-group row">
                            <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        No. Identiti:
                                    </label>
                                    <input type="text" class="form-control" id="m_ic" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Bangsa:
                                    </label>
                                    <div class="input-group m-input-group">
                                        <input type="text" class="form-control" id="m_bangsa" readonly>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group row">
                            <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Jantina:
                                    </label>
                                    <input type="text" class="form-control" id="m_jantina" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Umur:
                                    </label>
                                    <input type="text" class="form-control" id="m_umur" readonly>
                            </div>
                            </div>
                            <div class="form-group row">
                            <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Pendapatan Bulanan:
                                    </label>
                                    <div class="input-group m-input-group">
                                        <span class="input-group-addon">
                                            RM
                                        </span>
                                        <input type="text" class="form-control" id="m_pendapatan" readonly>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        No. Telefon Bimbit:
                                    </label>
                                    <input type="text" class="form-control" id="m_tel_bimbit" readonly>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Status Perkahwinan:
                                    </label>
                                    <input type="text" class="form-control" id="m_status_perkahwinan" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        E-mel:
                                    </label>
                                    <input type="text" class="form-control" id="m_emel" readonly>
                                </div>
                            </div>
                        </div>
                        <hr class="modal-hr maklumat_pasangan">
                        <div class="m-form__section m-form__section--middle maklumat_pasangan">
                            <h5 style="color: #f4516c">
                                Maklumat Pasangan:
                            </h5>
                            <br>
                            <div class="form-group row">
                                <div class="col-md-12">
                                    <table class="table">
                                        <thead>
                                            <tr>
                                                <th>No. Identiti</th>
                                                <th>Nama</th>
                                                <th>E-mel</th>
                                                <th>No Telefon Bimbit</th>
                                                <th>Pendapatan Bulanan</th>
                                            </tr>
                                        </thead>
                                        <tbody id="m_pasangan_input"></tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <hr class="modal-hr">
                        <div class="m-form__section m-form__section--middle">
                            <h5 style="color: #f4516c">
                                Maklumat Pendapatan:
                            </h5>
                            <br>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Jumlah Pendapatan Pemohon:
                                    </label>
                                    <div class="input-group m-input-group">
                                        <span class="input-group-addon">
                                            RM
                                        </span>
                                        <input type="text" class="form-control" id="m_pendapatan_pemohon" readonly>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Jumlah Pendapatan Pasangan:
                                    </label>
                                    <div class="input-group m-input-group">
                                        <span class="input-group-addon">
                                            RM
                                        </span>
                                        <input type="text" class="form-control" id="m_pendapatan_pasangan" readonly>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Jumlah Pendapatan Isi Rumah:
                                    </label>
                                    <div class="input-group m-input-group">
                                        <span class="input-group-addon">
                                            RM
                                        </span>
                                        <input type="text" class="form-control" id="m_pendapatan_isi_rumah" readonly>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr class="modal-hr">
                        <div class="m-form__section m-form__section--middle">
                            <h5 style="color: #f4516c">
                                Maklumat Tempat Tinggal:
                            </h5>
                            <br>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label for="recipient-name" class="form-control-label">
                                        Alamat:
                                    </label>
                                    <textarea type="text" class="form-control" id="m_alamat" readonly></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <div id="kemaskini_area" style="margin-left: 2rem;left: 0;position: absolute;"></div>
                        @if($is_permission_all || $is_permission_own)
                        <div id="pembatalan"></div>
                        @endif
                        <a class="btn btn-primary btn-cetak" target="_blank">
                            Cetak
                        </a>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">
                            Kembali
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal fade" id="sejarah_kemaskini" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" style="background-color: rgba(0, 0, 0,.6)">
            <div class="modal-dialog modal-lg" role="document" style="max-width: 1000px;">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="exampleModalLabel">
                            Sejarah Kemaskini Permohonan <br>
                            <small>
                                <i>ID Permohonan: <span id="m_id_permohonan"></span></i>
                            </small>
                        </h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">
                                &times;
                            </span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="datatable">
                            <table class="table table-striped">
                                <thead>
                                    <tr>
                                        <th width="10%">Bil</th>
                                        <th width="50%">Maklumat Kemaskini</th>
                                        <th>Tarikh Kemaskini</th>
                                        <th>Dikemaskini Oleh</th>
                                    </tr>
                                </thead>
                                <tbody id="m_sejarah_kemaskini"></tbody>
                            </table>
                        </div>
                    </div>
                    <div class="modal-footer" id="b_sejarah_kemaskini">
                    </div>
                </div>
            </div>
        </div>
        {{-- End Modal --}}

{{-- Delete Modal --}}
<div class="modal fade" id="padam_permohonan" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" style="background-color: rgba(0, 0, 0,.6)">
   <div class="modal-dialog" role="document">
      <div class="modal-content">
         <div class="modal-header">
            <h5 class="modal-title"></h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
               <i aria-hidden="true" class="ki ki-close"></i>
            </button>
         </div>
         <div class="modal-body">
            <p>Modal body text goes here.</p>
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
         </div>
      </div>
   </div>
</div>
{{-- End Modal --}}


@endrole
@endsection

@section('js')
@role(['dun'])
<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>
    var start = moment("2020-01-01");
    var end = moment();

   $(document).ready(function() {
    var from_date = start.format('YYYY-MM-DD');
    var to_date = end.format('YYYY-MM-DD');

      $('#permohonan_table').dataTable({
      processing: true,
      paging: true,
      pageLength: 15,
      lengthMenu: [
         [15, 30, 50, 100],
         [15, 30, 50, 100]
      ],
      serverSide: true,
      ajax: '{{ url('dun/permohonan/baucer/list?status=')}}{{ $status }}',
      searching : false,
      language: {
         emptyTable: "Tiada Data"
      },
      columns: [
                    { data: 'id', name: 'id' },
                    { data: 'nama', name: 'nama' },
                    { data: 'ic_pemohon', name: 'ic_pemohon' },
                    { data: 'perayaan', name: 'perayaan' },
                    { data: 'tarikh_permohonan', name: 'tarikh_permohonan' },
                    { data: 'tarikh_terima', name: 'tarikh_terima' },
                    { data: 'status', name: 'status' },
                    { 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('dun/permohonan/baucer/list') }}',
               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: 'id', name: 'id' },
                    { data: 'nama', name: 'nama' },
                    { data: 'ic_pemohon', name: 'ic_pemohon' },
                    { data: 'perayaan', name: 'perayaan' },
                    { data: 'tarikh_permohonan', name: 'tarikh_permohonan' },
                    { data: 'tarikh_terima', name: 'tarikh_terima' },
                    { data: 'status', name: 'status' },
                    { data: 'action', name: 'action', orderable: false, searchable: false }
                ],
       });
   });

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

   $(function() {
       var start = moment("2008-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('dun/permohonan/baucer/export?_token=') }}{{csrf_token()}}&status='+status+'&from_date='+from_date+'&to_date='+to_date+'&q='+q+'&filter_type='+filter_type, '_blank');
   }

   function showDetail(id) {
            $('#sejarah_kemaskini').modal('hide');
            var data = {
                _token: '{{ csrf_token() }}', id
            };

            $.ajax({
                url: '{{ url('dun/permohonan/baucer/show') }}',
                type: 'POST',
                data: data,
                success: function(response) {
                    var permohonan_baucer = response.permohonan_baucer,
                        profile = response.profile,
                        pasangan = response.pasangan,
                        audit = response.audit,
                        dun = response.dun
                        url = '{{ url('dun/rumusan') }}?ipr=baucer&id='+id;

                    if(permohonan_baucer.oleh_admin !== null) {
                        $('.oleh_admin').show();
                    } else {
                        $('.oleh_admin').hide();
                    }

                    $('#m_alasan').hide();
                    $('#alasan').hide();
                    if(permohonan_baucer.status == '-1') {
                        $('#m_status').val("DIBATALKAN");
                        $('#m_no_baucar, .no_baucar').hide();
                        $('#m_tarikh_terima, .tarikh_terima').hide();
                    } 
                    else if(permohonan_baucer.status == '0' || permohonan_baucer.status == '1') {
                        $('#m_status').val("DITERIMA DAN SEDANG DIPROSES");
                        $('#m_no_baucar, .no_baucar').hide();
                        $('#m_tarikh_terima, .tarikh_terima').hide();
                    } 
                    else if(permohonan_baucer.status == '2') {
                        $('#m_status').val("LULUS");

                        if (permohonan_baucer.no_baucer == null || permohonan_baucer.no_baucer == '') {
                            $('#m_no_baucar, .no_baucar').show();
                            $('#m_tarikh_terima, .tarikh_terima').show();
                            $('#m_no_baucar').val('-');
                            $('#m_tarikh_terima').val('-');
                        } else {
                            $('#m_no_baucar, .no_baucar').show();
                            $('#m_tarikh_terima, .tarikh_terima').show();
                            $('#m_no_baucar').val(permohonan_baucer.no_baucer);
                            $('#m_tarikh_terima').val(permohonan_baucer.tarikh_terima);
                        }

                    } else if(permohonan_baucer.status == '3') {
                        $('#m_status').val("GAGAL");
                        
                        if (permohonan_baucer.alasan == null || permohonan_baucer.alasan == '') {
                            $('#m_alasan').show();
                            $('#alasan').show();
                            $('#m_alasan').val('TIDAK DINYATAKAN');
                        } else {
                            $('#m_alasan').show();
                            $('#alasan').show();
                            $('#m_alasan').val(permohonan_baucer.alasan);
                        }
                        
                        $('#m_no_baucar, .no_baucar').hide();
                        $('#m_tarikh_terima, .tarikh_terima').hide();
                    }

                    // Perayaan
                    $('#m_perayaan').val(permohonan_baucer.perayaan);

                    // Tarikh Permohonan
                    $('#m_tarikh_permohonan').html(moment(permohonan_baucer.tarikh_permohonan, 'YYYY-MM-DD HH:mm:ss').format('DD/MM/YYYY'));

                    // Maklumat Peribadi
                    $('#m_adun').val(dun.nama);
                    $('#m_nama').val(permohonan_baucer.nama);
                    $('#m_ic').val(permohonan_baucer.ic_pemohon);
                    
                    $('#m_bangsa').val(permohonan_baucer.kaum);
                    $('#m_jantina').val(permohonan_baucer.jantina);
                    
                    $('#m_umur').val(permohonan_baucer.umur);
                    $('#m_tel_bimbit').val(permohonan_baucer.no_telefon);
                    
                    $('#m_pendapatan').val(permohonan_baucer.pendapatan);
                    // $('#m_pendapatan').val(parseFloat(permohonan_baucer.pendapatan).toFixed(2));

                    // Maklumat Tempat Tinggal
                    $('#m_alamat').html([ permohonan_baucer.alamat ]);

                    if (profile !== null) {
                        if(profile.status_perkahwinan == 'Berkahwin') {
                            $('.maklumat_pasangan').show();
                        } else {
                            $('.maklumat_pasangan').hide();
                        }
                        $('#m_status_perkahwinan').val(profile.status_perkahwinan);
                        $('#m_tel_rumah').val(profile.tel_rumah);
                        $('#m_emel').val(profile.email);
                        $('#m_negerikelahiran').val(profile.negerikelahiran);

                        if(profile.negerikelahiran == '1')
                        {
                        $('#m_negerikelahiran').val("Selangor");
                        }
                        else if(profile.negerikelahiran == '2')
                        {
                        $('#m_negerikelahiran').val("Perak");
                        }
                        else if(profile.negerikelahiran == '3')
                        {
                        $('#m_negerikelahiran').val("Melaka");
                        }
                        else if(profile.negerikelahiran == '4')
                        {
                        $('#m_negerikelahiran').val("Kedah");
                        }
                        else if(profile.negerikelahiran == '5')
                        {
                        $('#m_negerikelahiran').val("Perlis");
                        }
                        else if(profile.negerikelahiran == '6')
                        {
                        $('#m_negerikelahiran').val("Negeri Sembilan");
                        }
                        else if(profile.negerikelahiran == '7')
                        {
                        $('#m_negerikelahiran').val("Sabah");
                        }
                        else if(profile.negerikelahiran == '8')
                        {
                        $('#m_negerikelahiran').val("Kelantan");
                        }
                        else if(profile.negerikelahiran == '9')
                        {
                        $('#m_negerikelahiran').val("Pahang");
                        }
                        else if(profile.negerikelahiran == '10')
                        {
                        $('#m_negerikelahiran').val("Terengganu");
                        }
                        else if(profile.negerikelahiran == '11')
                        {
                        $('#m_negerikelahiran').val("W.P. Kuala Lumpur");
                        }
                        else if(profile.negerikelahiran == '12')
                        {
                        $('#m_negerikelahiran').val("Pulau Pinang");
                        }
                        else if(profile.negerikelahiran == '13')
                        {
                        $('#m_negerikelahiran').val("Sarawak");
                        }
                        else if(profile.negerikelahiran == '14')
                        {
                        $('#m_negerikelahiran').val("Johor");
                        }
                        else if(profile.negerikelahiran == '15')
                        {
                        $('#m_negerikelahiran').val("W.P. Labuan");
                        }
                        else if(profile.negerikelahiran == '16')
                        {
                        $('#m_negerikelahiran').val("W.P. Putrajaya");
                        }
                    }

                    if (permohonan_baucer.program_id != null) {
                        if (permohonan_baucer.nama_pasangan !== null || permohonan_baucer.nama_pasangan !== '') {
                            $('.maklumat_pasangan').hide();
                            if (permohonan_baucer.pendapatan !== null) {
                                $('#m_pendapatan_pemohon').val(permohonan_baucer.pendapatan);
                            } else {
                                $('#m_pendapatan_pemohon').val('-');
                            }
                            if (permohonan_baucer.pendapatan_pasangan !== null) {
                                $('#m_pendapatan_pasangan').val(permohonan_baucer.pendapatan_pasangan);
                            } else {
                                $('#m_pendapatan_pasangan').val('-');
                            }
                            if (permohonan_baucer.pendapatan_isi_rumah !== null) {
                                $('#m_pendapatan_isi_rumah').val(permohonan_baucer.pendapatan_isi_rumah);
                            } else {
                                $('#m_pendapatan_isi_rumah').val('-');
                            }
                        } else {
                            $('.maklumat_pasangan').hide();
                            $('#m_pendapatan_pemohon').val('-');
                            $('#m_pendapatan_pasangan').val('-');
                            $('#m_pendapatan_isi_rumah').val('-');
                        }
                    } else {
                        // Maklumat Pasangan
                        var pendapatan_pasangan = 0;
                        $('#m_pasangan_input').html('');
                        pasangan.forEach(function(d) {
                            html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.ic_pasangan != null?d.ic_pasangan:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.nama != null?d.nama:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.emel != null?d.emel:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.no_tel_bimbit != null?d.no_tel_bimbit:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<div class="input-group m-input-group col-lg-12">'+
                                        '<span class="input-group-addon">'+
                                            'RM'+
                                        '</span>'+
                                        '<input type="number" class="form-control m-input" value="'+(d.pendapatan != null?(parseFloat(d.pendapatan).toFixed(2)):'')+'" disabled>'+
                                    '</div>'+
                                '</td>'+
                            '</tr>';

                            $('#m_pasangan_input').append(html);
                            if (d.pendapatan != null) {
                                pendapatan_pasangan = parseFloat(pendapatan_pasangan) + parseFloat(d.pendapatan);
                            }
                        });

                        // override maklumat from profile cause maklumat pendapatan empty
                        var total = 0;
                        total = parseFloat(profile.pendapatan) + parseFloat(pendapatan_pasangan);

                        $('#m_pendapatan_pemohon').val(parseFloat(permohonan_baucer.pendapatan).toFixed(2));
                        $('#m_pendapatan_pasangan').val(parseFloat(pendapatan_pasangan).toFixed(2));
                        $('#m_pendapatan_isi_rumah').val(parseFloat(total).toFixed(2));
                    }

                    $('#kemaskini_area').html('<button type="button" onClick="showAudit('+id+')" class="btn btn-primary" id="audit_btn">Sejarah Kemaskini</button>');

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

                    $('#pembatalan').html('');
                    if (permohonan_baucer.status == 2) {
                        $('#pembatalan').html('<button type="button" onClick="showCancel('+permohonan_baucer.ic_pemohon+');" class="btn btn-secondary" style="background:#f4516c;color:white;">Pembatalan</button>');
                        
                    }

                },
                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');
}

        function showCancel(ic) {
            $.confirm({
                title: 'Hantar Pembatalan?',
                content: 'Anda pasti untuk teruskan?',
                icon: 'fa fa-spinner fa-spin',
                type: 'green',
                buttons: {
                    hantar: {
                        btnClass: 'btn-green',
                        action: function() {
                            window.location.replace("baucer/batal?ic="+ic);
                        }
                    },
                    kembali: {
                        btnClass: 'btn-red',
                        action: function() {
                        }
                    }
                }
            });
        }

        function showAudit(id) {
            $('#maklumat_permohonan').modal('hide');
            $('#m_sejarah_kemaskini').html('');
            $('#m_id_permohonan').html(id);
            $('#b_sejarah_kemaskini').html('<button type="button" onClick="showDetail('+id+');" class="btn btn-secondary">Kembali</button>');

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

            $('#maklumat_permohonan').modal('hide');
            $.ajax({
                url: '{{ url('dun/permohonan/baucer/audit') }}',
                type: 'POST',
                data: data,
                success: function(response) {
                    var audit = response.audit;
                    
                    if (Array.isArray(audit) && audit.length) {
                        audit.forEach(function(d, i) {
                            var ori_data = JSON.parse(d.ori_data);
                            var new_data = JSON.parse(d.new_data);

                            var changes_maklumat = "";
                            for (var key in ori_data.permohonan) {
                                var item = key.replace(/_/g, " ").capitalize();
                                changes_maklumat = changes_maklumat + (changes_maklumat == '' ? '' : "<br/>");
                                if (key == 'pendapatan') {
                                    changes_maklumat = changes_maklumat + item + ': RM' + (parseFloat(ori_data.permohonan[key]).toFixed(2) ?? '') + ' → RM' + (parseFloat(new_data.permohonan[key]).toFixed(2) ?? '');
                                } else {
                                    if (item == 'Status') {
                                        var ori_status = (ori_data.permohonan[key]<=1?'Diproses':(ori_data.permohonan[key]==2?'Lulus':'Gagal'))
                                        var new_status = (new_data.permohonan[key]<=1?'Diproses':(new_data.permohonan[key]==2?'Lulus':'Gagal'))
                                        changes_maklumat = changes_maklumat + item + ': ' + ori_status + ' → ' + new_status;
                                    } else {
                                        changes_maklumat = changes_maklumat + item + ': ' + (ori_data.permohonan[key] ?? '') + ' → ' + (new_data.permohonan[key] ?? '');
                                    }
                                }
                            }

                            var changes_alamat = "";
                            for (var key in ori_data.alamat) {
                                var item = key.replace(/_/g, " ").capitalize();
                                changes_alamat = changes_alamat + (changes_alamat == '' ? '' : "<br/>");
                                changes_alamat = changes_alamat + item + ': ' + (ori_data.alamat[key] ?? '') + ' → ' + (new_data.alamat[key] ?? '');
                            }

                            var changes_kemaskini = "";
                            var changes_tambah = "";
                            for (var key in new_data.pasangan) {
                                if (ori_data.pasangan[key]) {
                                    changes_kemaskini = changes_kemaskini + (changes_kemaskini == '' ? '<b>Kemaskini Data Pasangan</b><br/>' : "<br/>");
                                    if (ori_data.pasangan[key]['ic_pasangan'] != new_data.pasangan[key]['ic_pasangan']) {
                                        changes_kemaskini = changes_kemaskini + 'IC: ' + (ori_data.pasangan[key]['ic_pasangan'] ?? '') + ' → ' + (new_data.pasangan[key]['ic_pasangan']+'<br/>' ?? '');
                                    }
                                    if (ori_data.pasangan[key]['nama'] != new_data.pasangan[key]['nama']) {
                                        changes_kemaskini = changes_kemaskini + 'Nama: ' + (ori_data.pasangan[key]['nama'] ?? '') + ' → ' + (new_data.pasangan[key]['nama']+'<br/>' ?? '');
                                    }
                                    if (ori_data.pasangan[key]['email'] != new_data.pasangan[key]['email']) {
                                        changes_kemaskini = changes_kemaskini + 'Email: ' + (ori_data.pasangan[key]['email'] ?? '') + ' → ' + (new_data.pasangan[key]['email']+'<br/>' ?? '');
                                    }
                                    if (ori_data.pasangan[key]['no_tel_bimbit'] != new_data.pasangan[key]['no_tel_bimbit']) {
                                        changes_kemaskini = changes_kemaskini + 'No. Tel Bimbit: ' + (ori_data.pasangan[key]['no_tel_bimbit'] ?? '') + ' → ' + (new_data.pasangan[key]['no_tel_bimbit']+'<br/>' ?? '');
                                    }
                                    if (ori_data.pasangan[key]['pendapatan'] != new_data.pasangan[key]['pendapatan']) {
                                        changes_kemaskini = changes_kemaskini + 'Pendapatan: RM' + (parseFloat(ori_data.pasangan[key]['pendapatan']).toFixed(2) ?? '') + ' → ' + ('RM'+parseFloat(new_data.pasangan[key]['pendapatan']).toFixed(2)+'<br/>' ?? '');
                                    }
                                } else {
                                    changes_tambah = changes_tambah + (changes_tambah == '' ? '<b>Tambah Data Pasangan</b><br/>' : "<br/>");
                                    changes_tambah = changes_tambah + 'IC: ' + (new_data.pasangan[key]['ic_pasangan']+'<br/>' ?? '');
                                    changes_tambah = changes_tambah + 'Nama: ' + (new_data.pasangan[key]['nama']+'<br/>' ?? '');
                                    changes_tambah = changes_tambah + 'Email: ' + (new_data.pasangan[key]['email']+'<br/>' ?? '');
                                    changes_tambah = changes_tambah + 'No. Tel Bimbit: ' + (new_data.pasangan[key]['no_tel_bimbit']+'<br/>' ?? '');
                                    changes_tambah = changes_tambah + 'Pendapatan: ' + ('RM'+parseFloat(new_data.pasangan[key]['pendapatan']).toFixed(2)+'<br/>' ?? '');
                                }
                            }

                            var changes_padam = "";
                            if (new_data.length > 0) {
                                for (var key in ori_data.pasangan) {
                                    changes_padam = changes_padam + (changes_padam == '' ? '<b>Padam Data Pasangan</b><br/>' : "<br/>");
                                    changes_padam = changes_padam + 'IC: ' + (ori_data.pasangan[key]['ic_pasangan']+'<br/>' ?? '');
                                    changes_padam = changes_padam + 'Nama: ' + (ori_data.pasangan[key]['nama']+'<br/>' ?? '');
                                    changes_padam = changes_padam + 'Email: ' + (ori_data.pasangan[key]['email']+'<br/>' ?? '');
                                    changes_padam = changes_padam + 'No. Tel Bimbit: ' + (ori_data.pasangan[key]['no_tel_bimbit']+'<br/>' ?? '');
                                    changes_padam = changes_padam + 'Pendapatan: ' + ('RM'+ori_data.pasangan[key]['pendapatan']+'<br/>' ?? '');
                                }
                            }

                            var changes = changes_maklumat+(changes_maklumat?'<br/>':'')+changes_alamat+(changes_alamat?'<br/>':'')+changes_kemaskini+(changes_kemaskini?'<br/>':'')+changes_tambah+(changes_tambah?'<br/>':'')+changes_padam;

                            html =
                            '<tr>'+
                                '<td>'+(i+1)+'</td>'+
                                '<td>'+changes+'</td>'+
                                '<td>'+ moment(d.created_at, 'YYYY-MM-DD HH:mm:ss').format('DD/MM/YYYY hh:mm A')+'</td>'+
                                '<td>'+d.name+'</td>'+
                            '</tr>';

                            $('#m_sejarah_kemaskini').append(html);
                        });
                    } else {
                        html =
                        '<tr>'+
                            '<td colspan=4>'+
                                '<input type="text" class="form-control m-input" value="Tiada Data" disabled style="text-align:center;">'+
                            '</td>'
                        '</tr>';

                        $('#m_sejarah_kemaskini').append(html);
                    }
                },
                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',
                    });
                }
            });

            $('#sejarah_kemaskini').modal('show');
        }

        String.prototype.capitalize = function() {
            return this.charAt(0).toUpperCase() + this.slice(1);
        }

        $('.modal').on("hidden.bs.modal", function (e) {
            if($('.modal:visible').length)
            {
                $('.modal-backdrop').first().css('z-index', parseInt($('.modal:visible').last().css('z-index')) - 10);
                $('body').addClass('modal-open');
            }
        }).on("show.bs.modal", function (e) {
            if($('.modal:visible').length)
            {
                $('.modal-backdrop.in').first().css('z-index', parseInt($('.modal:visible').last().css('z-index')) + 10);
                $(this).css('z-index', parseInt($('.modal-backdrop.in').first().css('z-index')) + 10);
            }
        });
    </script>
@endrole
@endsection