@extends('layouts.app')

@section('title', 'Senarai '.strtoupper(App\IPR::where('name', $ipr->name)->pluck('name')[0]))
@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>
    .form-control[disabled] {
        border: 0px;
        background: transparent;
    }
</style>  
@endsection
@section('content')
@role(['super_admin','principal_admin','admin'])
    @if(Auth::user()->hasRole('super_admin') || Auth::user()->hasRole('principal_admin') || (Auth::user()->hasRole('admin') && Auth::user()->ipr_id == App\IPR::where('name', 'sewa')->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">Senarai {{ App\IPR::where('name', 'sewa')->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('admin') || $is_permission_own || $is_permission_all)
                                        <div class="" style="margin-right:5px">
                                            <a href="{{ url('admin/permohonan/sewa/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>
                                                        Lokasi
                                                    </span>
                                                </span>
                                            </a>
                                        </div>
                                        @endif
                                        @if(Auth::user()->hasRole('admin') || Auth::user()->hasRole('principal_admin') || $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="status">Status</option>
                                            <option value="status_myidentity">Status Rekod</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" style="overflow-x: auto !important;width: 100% !important;">
                                <thead>
                                    <tr>
                                        <th>Id Permohonan</th>
                                        <th>Nama Pemohon</th>
                                        <th>No. Identiti</th>
                                        <th>Tarikh Permohonan</th>
                                        <th>Status</th>
                                        <th>Status Rekod</th>
                                        <th>Tarikh Kematian</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: {{ date('d/m/Y') }}</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="watermark">
                        <img src="{{ asset('img/logo.png') }}" class="watermark-logo">
                        <div class="watermark-text">{{ Auth::user()->username }}</div>
                    </div>
                    <div class="m-form__section m-form__section--first">
                        <h5 style="color: #f4516c">
                        Lokasi Skim Smart Sewa:
                        </h5>
                        <br>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                                Lokasi:
                            </label>
                            <input type="text" class="form-control" id="m_lokasi" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                                Kadar Sewa:
                            </label>
                            <input type="text" class="form-control" id="m_kadarsewa" readonly>
                        </div>
                        </div>
                    </div>
                    <div class="m-form__section m-form__section--first">
                        <h5 style="color: #f4516c">
                        Maklumat Pemohon:
                        </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">
                                Taraf Perkahwinan:
                            </label>
                            <input type="text" class="form-control" id="m_tarafperkahwinan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                                Warganegara:
                            </label>
                            <input type="text" class="form-control" id="m_warganegarapemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                            No.Kad Pengenalan / No.Polis / No.Tentera:
                            </label>
                            <input type="text" class="form-control" id="m_nokadpengenalanpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                                No Tel Bimbit:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonbimbitpemohon" readonly>
                        </div>
                        <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">
                                No Tel Rumah:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonrumahpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                                Emel: 
                            </label>
                            <input type="text" class="form-control" id="m_emel" readonly>
                        </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 class="m-form__section m-form__section--first">
                        <h5 style="color: #f4516c" id="m_hide">
                        Maklumat Pasangan:
                        </h5>
                        <br>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide1">
                                Nama:
                            </label>
                            <input type="text" class="form-control" id="m_namapasangan" nama="m_namapasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide2">
                                Tarikh Lahir:
                            </label>
                            <input type="text" class="form-control" id="m_tarikhlahirpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide3">
                                Umur:
                            </label>
                            <input type="text" class="form-control" id="m_umurpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide4">
                                Warganegara:
                            </label>
                            <input type="text" class="form-control" id="m_warganegarapasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide5">
                            No.Kad Pengenalan / No.Polis / No.Tentera:
                            </label>
                            <input type="text" class="form-control" id="m_nokadpengenalanpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide6">
                                No Tel Bimbit:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonbimbitpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide7">
                            Emel:
                            </label>
                            <input type="text" class="form-control" id="m_emelpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hide8">
                                No Tel Rumah:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonrumahpasangan" readonly>
                        </div>
                        </div>
                    </div>
                    <div class="m-form__section m-form__section--first ">
                        <h5 style="color: #f4516c" id="m_hidejobl">
                        Maklumat Pekerjaan Pemohon:
                        </h5>
                        <br>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejobl1">
                                Nama Syarikat:
                            </label>
                            <input type="text" class="form-control" id="m_namasyarikatpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejobl2">
                                Jawatan:
                            </label>
                            <input type="text" class="form-control" id="m_jawatanpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejobl3">
                                Alamat:
                            </label>
                            <input type="text" class="form-control" id="m_alamatpejabatpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejobl4">
                                No Telefon Pejabat:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonpejabatpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejobl5">
                                No Telefon/Fax:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonfaxpemohon" readonly>
                        </div>
                        </div>
                    </div>
                    <div class="m-form__section m-form__section--first">
                        <h5 style="color: #f4516c"  id="m_hidejob">
                        Maklumat Pekerjaan Pasangan:
                        </h5>
                        <br>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejob1">
                                Nama Syarikat:
                            </label>
                            <input type="text" class="form-control" id="m_namasyarikatpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejob2">
                                Jawatan:
                            </label>
                            <input type="text" class="form-control" id="m_jawatanpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejob3">
                                Alamat:
                            </label>
                            <input type="text" class="form-control" id="m_alamatpejabatpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejob4">
                                No Telefon Pejabat:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonpejabatpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejob5">
                                No Telefon/Fax:
                            </label>
                            <input type="text" class="form-control" id="m_notelefonfaxpasangan" readonly>
                        </div>
                        </div>
                    </div>
                    <div class="m-form__section m-form__section--first">
                        <h5 style="color: #f4516c">
                        Maklumat Pendapatan Bulanan:
                        </h5>
                        <br>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejobl6">
                                Pendapatan Pemohon:
                            </label>
                            <input type="text" class="form-control" id="m_pendapatanpemohon" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label" id="m_hidejob6">
                                Pendapatan Pasangan:
                            </label>
                            <input type="text" class="form-control" id="m_pendapatanpasangan" readonly>
                        </div>
                        <div class="col-md-6">
                            <label for="recipient-name" class="form-control-label">
                                Jumlah Pendapatan:
                            </label>
                            <input type="text" class="form-control" id="m_jumlahpendapatan" readonly>
                        </div>
                        </div>
                    </div>
                    <hr class="modal-hr maklumat_kemahiran">
                    <div class="m-form__section m-form__section--middle maklumat_ahli_keluarga">
                        <h5 style="color: #f4516c">
                        Maklumat Pegangan Harta Pemohon:
                        </h5>
                        <br>
                        <h5 style="color: #f4516c">
                        Rumah:
                        </h5>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <table class="table">
                                <thead>
                                    <tr>
                                    <th>Jenis Rumah</th>
                                    </tr>
                                </thead>
                                    <tbody id="m_rumah_input"></tbody>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th>Alamat</th>
                                    </tr>
                                </thead>
                                    <tbody id="m_rumah_input1"></tbody>
                            </table>
                        </div>
                        </div>
                        <h5 style="color: #f4516c">
                        Kereta:
                        </h5>
                        <div class="form-group row">
                        <div class="col-md-4">
                            <table class="table">
                                <thead>
                                    <tr>
                                    <th>Jenis Kenderaan</th>
                                    </tr>
                                </thead>
                                    <tbody id="m_jenis_kenderaan"></tbody>
                            </table>
                        </div>
                        <div class="col-md-4">
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th>No Pendaftaran</th>
                                    </tr>
                                </thead>
                                    <tbody id="m_no_pendaftaran"></tbody>
                            </table>
                        </div>
                        <div class="col-md-4">
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th>Pemilikan</th>
                                    </tr>
                                </thead>
                                    <tbody id="m_pemilikan"></tbody>
                            </table>
                        </div>
                        </div>
                    </div>
                    <hr class="modal-hr kursus_usahawan">
                    <div class="m-form__section m-form__section--middle bantuan_diterima">
                        <h5 style="color: #f4516c">
                        Maklumat Kesihatan Pemohon:
                        </h5>
                        <br>
                        <h5 style="color: #f4516c">
                        Masalah Kesihatan:
                        </h5>
                        <div class="form-group row">
                        <div class="col-md-6">
                            <table class="table">
                                <thead>
                                    <tr>
                                    <th>Jenis Penyakit</th>
                                    </tr>
                                </thead>
                                    <tbody id="m_penyakit"></tbody>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th>Dokumen</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                    <td class="form-control">
                                    Rujuk Senarai Dokumen
                                    </td>
                                    </tr> 
                                    </tbody>
                            </table>
                        </div>
                        </div>
                        <h5 style="color: #f4516c">
                        Kecacatan:
                        </h5>
                        <div class="col-lg-12">
                        <table id="bantuantable" class="table order table-responsive">
                            <thead>
                                <tr>
                                    <th></th>
                                    <th>Kad OKU</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                            <tr>
                            <td>Sila Lampirkan Kad OKU (Jika Ada)</td>
                            <td>
                            <input type="text" class="form-control" id="m_kad_oku" readonly>
                            </td>
                            <td></td>
                            </tr>
                            </tbody>
                        </table>
                        </div>
                    </div>
                    <hr class="modal-hr kursus_usahawan">
                    <div class="m-form__section m-form__section--middle bantuan_diterima">
                        <h5 style="color: #f4516c">
                        Maklumat Tanggungan / Butiran Ahli Keluarga:
                        </h5>
                        <br>
                        <div class="col-lg-12">
                        <table id="bantuantable" class="table order table-responsive">
                            <thead>
                                <tr>
                                    <th>No Kad Pengenalan</th>
                                    <th>Nama</th>
                                    <th>Hubungan</th>
                                    <th>Status Pekerjaan</th>
                                    <th>Pendapatan</th>
                                    <th>Komitmen Lain</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody id="m_keluarga_input"></tbody>
                        </table>
                        </div>
                    </div>
                    <hr class="modal-hr">
                    <div class="m-form__section m-form__section--middle ">
                        <h5 style="color: #f4516c">
                            Senarai Dokumen Dimuatnaik
                        </h5>
                        <br>
                        <div class="form-group row" id="documentlist"> 
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="d-flex mr-auto">
                        <div id="myidentity-area"></div>
                    </div>
                
                    <a class="btn btn-primary btn-cetak" target="_blank">
                                    Cetak
                    </a>
        
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">
                        Tutup
                    </button>
                </div>
            </div>
            </div>
        </div>
        
        <div class="modal fade" id="status_myidentity" tabindex="-1" role="dialog" aria-labelledby="statusMyidentity" 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">
                            Status Rekod<br>
                            <small>
                                <i>Tarikh Kemaskini: <span id="my_updated_at"></span></i>
                            </small>
                        </h4>
                        </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="watermark">
                            <img src="{{ asset('img/logo.png') }}" class="watermark-logo">
                            <div class="watermark-text">{{ Auth::user()->username }}</div>
                        </div>
                        <div class="m-form__section m-form__section--middle">
                            <h5 style="color: #f4516c">Status:</h5><br />
                            <div class="form-group row">
                                <div class="col-md-12">
                                    <label class="form-control-label" id="my_status"></label>
                                </div>
                            </div>
                            <div id="maklumat_diri">
                            <hr>
                            <h5 style="color: #f4516c">Maklumat Diri:</h5><br />
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Nama:
                                    </label>
                                    <input type="text" class="form-control" id="my_nama" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        No. Kad Pengenalan:
                                    </label>
                                    <input type="text" class="form-control" id="my_ic" readonly>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Alamat Tetap:
                                    </label>
                                    <textarea class="form-control" id="my_alamat" readonly></textarea>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Alamat Surat-Menyurat:
                                    </label>
                                    <textarea class="form-control" id="my_alamat_surat" readonly></textarea>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Tarikh Mati:
                                    </label>
                                    <input type="text" class="form-control" id="my_tarikh_mati" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Tarikh Lahir:
                                    </label>
                                    <input type="text" class="form-control" id="my_tarikh_lahir" readonly>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Jantina:
                                    </label>
                                    <input type="text" class="form-control" id="my_jantina" readonly>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        No Telefon:
                                    </label>
                                    <input type="text" class="form-control" id="my_tel" readonly>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-md-6">
                                    <label class="form-control-label">
                                        Emel:
                                    </label>
                                    <input type="text" class="form-control" id="my_emel" readonly>
                                </div>
                            </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer" id="b_myidentity"></div>
                </div>
            </div>
        </div> 
        {{-- End Modal --}}
    @endif
@endrole

@endsection
@section('js')
@role(['super_admin','principal_admin','admin'])
    <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("2008-01-01");
        var end = moment();

        $(document).ready(function() {
            $('.oleh_admin, maklumat_pasangan').hide();

            var from_date = start.format('YYYY-MM-DD');
            var to_date = end.format('YYYY-MM-DD');

            $('#permohonan_table').dataTable({
                scrollX: true,
                processing: true,
                paging: true,
                pageLength: 15,
                lengthMenu: [[15, 30, 50, 100], [15, 30, 50, 100]],
                serverSide: true,
                ajax: {
                    url:'{{ url('admin/permohonan/sewa/list?status=') }}{{ $status }}',
                    data:{from_date:from_date, to_date:to_date}
                },
                searching: false,
                language: {
                    emptyTable: "Tiada Data"
                },
                columns: [
                    { data: 'id', name: 'id' },
                    { data: 'nama', name: 'profile.nama' },
                    { data: 'ic_pemohon', name: 'permohonan_sewa.ic_pemohon' },
                    { data: 'permohonan_sewa.created_at', name: 'permohonan_sewa.created_at' },
                    { data: 'status', name: 'status'},
                    { data: 'status_myidentity', name: 'status_myidentity' },
                    { data: 'tarikh_kematian', name: 'tarikh_kematian' },
                    { 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({
                scrollX: true,
                processing: true,
                paging: true,
                pageLength: 15,
                lengthMenu: [[15, 30, 50, 100], [15, 30, 50, 100]],
                serverSide: true,
                ajax: {
                    url:'{{ url('admin/permohonan/sewa/list') }}',
                    data:{status:status, from_date, to_date, q, filter_type}
                },
                searching: false,
                language: {
                    emptyTable: "Tiada Data"
                },
                columns: [
                    { data: 'id', name: 'id' },
                    { data: 'nama', name: 'profile.nama' },
                    { data: 'ic_pemohon', name: 'permohonan_sewa.ic_pemohon' },
                    { data: 'permohonan_sewa.created_at', name: 'permohonan_sewa.created_at' },
                    { data: 'status', name: 'status'},
                    { data: 'status_myidentity', name: 'status_myidentity' },
                    { data: 'tarikh_kematian', name: 'tarikh_kematian' },
                    { data: 'action', name: 'action', orderable: false, searchable: false }
                ],
            });
        });


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

        $(function() {
            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('admin/permohonan/sewa/export?_token=') }}{{csrf_token()}}&status='+status+'&from_date='+from_date+'&to_date='+to_date+'&q='+q+'&filter_type='+filter_type, '_blank');
        }
        
        function showDetail(x) {
            $('#sejarah_kemaskini').modal('hide');
            var data = {
                _token: '{{ csrf_token() }}',
                id: x
            };

            $.ajax({
                url: '{{ url('admin/permohonan/sewa/show') }}',
                type: 'POST',
                data: data,
                success: function(response) {
                    var permohonan_sewa = response.permohonan,
                        keluarga = response.ahli_keluarga,
                        profile = response.profile,
                        application_detail = response.application_detail,
                        jenis_rumah = response.jenis_rumah,
                        jenis_kenderaan = response.jenis_kenderaan,
                        jenis_penyakit = response.jenis_penyakit,
                        no_pendaftaran = response.no_pendaftaran,
                        alamat_application = response.alamat_application,
                        pemilikan = response.pemilikan,
                        document = response.document,
                        pasangan = response.pasangan,
                        url = '{{ url('admin/rumusan') }}?ipr=sewa&id='+x;

                    if(permohonan_sewa.oleh_admin) {
                        $('.oleh_admin').show();     
                    } else {
                        $('.oleh_admin').hide();
                    }

                    if(pasangan.length != 0) {
                        $('#m_hide').show();
                        $('#m_hide, #m_hide1, #m_hide2, #m_hide3, #m_hide4, #m_hide5, #m_hide6, #m_hide7, #m_hide8').show('slow');

                        // Maklumat Pasangan
                        $('#m_namapasangan').val(pasangan[0].nama).show('slow');
                        $('#m_tarikhlahirpasangan').val(pasangan[0].tarikh_lahir).show('slow');
                        $('#m_umurpasangan').val(pasangan[0].umur).show('slow');
                        if(pasangan[0].warganegara = true){
                        $('#m_warganegarapasangan').val('Malaysia').show('slow');
                        }
                        else{
                        $('#m_warganegarapasangan').val('Lain-Lain').show('slow');
                        }
                        $('#m_nokadpengenalanpasangan').val(pasangan[0].ic_pasangan).show('slow');
                        $('#m_notelefonbimbitpasangan').val(pasangan[0].no_tel_bimbit).show('slow');
                        $('#m_emelpasangan').val(pasangan[0].emel).show('slow');
                        $('#m_notelefonrumahpasangan').val(pasangan[0].no_tel_rumah).show('slow');

                    } else {
                        $('#m_hide, #m_hide1, #m_hide2, #m_hide3, #m_hide4, #m_hide5, #m_hide6, #m_hide7, #m_hide8').hide('slow');

                        $('#m_namapasangan').hide('slow');
                        $('#m_tarikhlahirpasangan').hide('slow');
                        $('#m_umurpasangan').hide('slow');
                        $('#m_warganegarapasangan').hide('slow');
                        $('#m_nokadpengenalanpasangan').hide('slow');
                        $('#m_notelefonbimbitpasangan').hide('slow');
                        $('#m_emelpasangan').hide('slow');
                        $('#m_notelefonrumahpasangan').hide('slow'); 

                    }

                    if(permohonan_sewa.syarikat_pasangan != null) {
                     $('#m_hidejob, #m_hidejob1, #m_hidejob2, #m_hidejob3, #m_hidejob4, #m_hidejob5, #m_hidejob6').show('slow');
                     // Maklumat Pekerjaan Pasangan
                     $('#m_namasyarikatpasangan').val(permohonan_sewa.syarikat_pasangan).show('slow');
                     $('#m_jawatanpasangan').val(permohonan_sewa.jawatan_pasangan).show('slow');
                     $('#m_alamatpejabatpasangan').val(permohonan_sewa.alamat_pej_pasangan).show('slow');
                     $('#m_notelefonpejabatpasangan').val(permohonan_sewa.tel_pej_pasangan).show('slow');
                     $('#m_notelefonfaxpasangan').val(permohonan_sewa.fax_pej_pasangan).show('slow');
                     $('#m_pendapatanpasangan').val(permohonan_sewa.pendapatan_pasangan).show('slow');
                    }
                    else{
                     $('#m_hidejob, #m_hidejob1, #m_hidejob2, #m_hidejob3, #m_hidejob4, #m_hidejob5, #m_hidejob6').hide('slow');
                     
                     $('#m_namasyarikatpasangan').hide('slow'); 
                     $('#m_jawatanpasangan').hide('slow'); 
                     $('#m_alamatpejabatpasangan').hide('slow'); 
                     $('#m_notelefonpejabatpasangan').hide('slow'); 
                     $('#m_notelefonfaxpasangan').hide('slow');
                     $('#m_pendapatanpasangan').hide('slow');

                    }

                    if(permohonan_sewa.syarikat_pemohon != null) {
                     $('#m_hidejobl, #m_hidejobl1, #m_hidejobl2, #m_hidejobl3, #m_hidejobl4, #m_hidejobl5, #m_hidejobl6').show('slow');
                    // Maklumat Pekerjaan Pemohon
                    $('#m_namasyarikatpemohon').val(permohonan_sewa.syarikat_pemohon).show('slow');
                    $('#m_jawatanpemohon').val(permohonan_sewa.jawatan_pemohon).show('slow');
                    $('#m_alamatpejabatpemohon').val(permohonan_sewa.alamat_pej_pemohon).show('slow');
                    $('#m_notelefonpejabatpemohon').val(permohonan_sewa.tel_pej_pemohon).show('slow');
                    $('#m_notelefonfaxpemohon').val(permohonan_sewa.fax_pej_pemohon).show('slow');
                    $('#m_pendapatanpemohon').val(permohonan_sewa.pendapatan_pemohon).show('slow');
                    }
                    else{
                     $('#m_hidejobl, #m_hidejobl1, #m_hidejobl2, #m_hidejobl3, #m_hidejobl4, #m_hidejobl5, #m_hidejobl6').hide('slow');
                    // Maklumat Pekerjaan Pemohon
                    $('#m_namasyarikatpemohon').hide('slow');
                    $('#m_jawatanpemohon').hide('slow');
                    $('#m_alamatpejabatpemohon').hide('slow');
                    $('#m_notelefonpejabatpemohon').hide('slow');
                    $('#m_notelefonfaxpemohon').hide('slow');
                    $('#m_pendapatanpemohon').hide('slow');
                    }

                    //document oku
                    $('#m_kad_oku').html('');
                    document.forEach(function(d) {
                       if (d.type == 'Salinan Kad OKU')
                           $('#m_kad_oku').val('Rujuk Senarai Dokumen');
                        else
                        $('#m_kad_oku').val('Tiada Dokumen');
                    });

                    $('#documentlist').html('');
                    html = '<table  class="table">' ;
                    html = html + '<tr>';
                    html = html + '<th width="80%">Jenis Fail</th>' ;
                    html = html + '<th width="20%">Lihat Fail</th>' ;
                    html = html + '</tr>';
                    document.forEach(function(d) {
                        path = "{{url('')}}"+d.filename;
                        html = html + '<tr>';
                        html = html + '<td>' + d.type + '</td>' ;
                        if(d.filename == '')
                            html = html + '<td> - Tiada Fail</td>';
                        else
                            html = html + '<td> - <a target="_blank" href="' + path + '">Klik Di Sini</a></td>';
                        
                        html = html + '</tr>'; 
                    });
                    html = html + '</table>';
                    $('#documentlist').append(html);

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

                    // Maklumat Peribadi
                    if (application_detail.length > 0) {
                        $('#m_lokasi').val(application_detail[0].lokasi);
                        $('#m_kadarsewa').val(application_detail[0].kadar_sewa);
                    }
                    $('#m_nama').val(profile.nama);
                    $('#m_tarafperkahwinan').val(profile.status_perkahwinan);
                    // $('#m_umurpemohon').val($years);
                    $('#m_warganegarapemohon').val(profile.warganegara);
                    $('#m_nokadpengenalanpemohon').val(profile.ic);
                    $('#m_notelefonbimbitpemohon').val(profile.tel_bimbit);
                    $('#m_jantina').val(profile.jantina);
                    $('#m_notelefonrumahpemohon').val(profile.tel_rumah);
                    $('#m_emel').val(profile.email);

                    // Maklumat Tempat Tinggal
                    $('#m_alamat').html([ 
                        profile.alamat_1+', ',
                        profile.alamat_2 ? profile.alamat_2+', ' : '',
                        profile.alamat_3 ? profile.alamat_3+', ' : '',
                        profile.poskod+', ',
                        profile.daerah+', ',
                        profile.negeri
                    ]);

                    // Maklumat Pendapatan
                    $('#m_jumlahpendapatan').val(permohonan_sewa.jumlah_pendapatan);

                    // Maklumat Harta

                  //   Rumah
                    $('#m_rumah_input').html('');
                    jenis_rumah.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.jenis_rumah != null?d.jenis_rumah:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_rumah_input').append(html);
                    });
                    $('#m_rumah_input1').html('');
                    alamat_application.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.alamat_application != null?d.alamat_application:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_rumah_input1').append(html);
                    });

                  //   Kereta
                    $('#m_jenis_kenderaan').html('');
                    jenis_kenderaan.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.jenis_kenderaan != null?d.jenis_kenderaan:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_jenis_kenderaan').append(html);
                    });
                    $('#m_no_pendaftaran').html('');
                    no_pendaftaran.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.no_pendaftaran != null?d.no_pendaftaran:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_no_pendaftaran').append(html);
                    });
                    $('#m_pemilikan').html('');
                    pemilikan.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.pemilikan != null?d.pemilikan:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_pemilikan').append(html);
                    });

                  //   Maklumat Kesihatan
                    $('#m_penyakit').html('');
                    jenis_penyakit.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.jenis_penyakit != null?d.jenis_penyakit:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_penyakit').append(html);
                    });
                    $('#m_dokumen').html('');
                    alamat_application.forEach(function(d) {

                        html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.alamat_application != null?d.alamat_application:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';
                            $('#m_dokumen').append(html);
                    });

                  //   Maklumat Kecacatan

                  //   Maklumat Keluarga
                  $('#m_keluarga_input').html('');
                  keluarga.forEach(function(d) {
                            html =
                            '<tr>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.ic != null?d.ic:'-')+'" 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.hubungan != null?d.hubungan:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.status != null?d.status:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.pendapatan != null?d.pendapatan:'-')+'" disabled>'+
                                '</td>'+
                                '<td>'+
                                    '<input type="text" class="form-control m-input" value="'+(d.komitmen != null?d.komitmen:'-')+'" disabled>'+
                                '</td>'+
                            '</tr>';

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

                  $('#myidentity-area').html(`<button type="button" onClick="showMyidentity('${permohonan_sewa.ic_pemohon}', '${x}')" class="btn btn-warning" id="myidentity_btn">Status Rekod</button>`);

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

        function showMyidentity(x, id){ 
            $('#maklumat_permohonan').modal('hide');

            var data = {
                _token: '{{ csrf_token() }}',
                id: x.trim()
            };
            $.ajax({
                url: "{{ url('myidentity/status') }}",
                type: 'POST',
                data: data,
                success: function(response) {
                    if (response.status){
                        $('#maklumat_diri').show();
                                                
                        //status myidentity
                        var status_myidentity = '';
                        if (response.data.status_rekod == 'A' || response.data.status_rekod == 'F' || response.data.status_rekod == '1') {
                            status_myidentity = 'Hidup';
                        } else if (response.data.status_rekod == 'B' || response.data.status_rekod == 'H' || response.data.status_rekod == '2') {
                            status_myidentity = 'Meninggal Dunia';
                        } else {
                            if (response.data.taraf_penduduk == 'M' || response.data.taraf_penduduk == 'P'){
                                status_myidentity = response.data.message
                            }else{
                                status_myidentity = response.data.message;  
                            }
                        }
                        $('#my_status').html(status_myidentity);
                        $('#my_updated_at').html(moment(response.data.updated_at, 'YYYY-MM-DD HH:mm:ss').format('DD/MM/YYYY'));
                        $('#my_nama').val(response.data.nama); 
                        $('#my_ic').val(response.data.ic_pemohon);
                        $('#my_alamat').val(response.data.alamat_tetap_1 + ',' + response.data.alamat_tetap_2 + ',' + response.data.alamat_tetap_3);
                        $('#my_alamat_surat').val(response.data.alamat_surat_1 + ',' + response.data.alamat_surat_1 + ',' + response.data.alamat_surat_2 + ',' + response.data.alamat_surat_3 + ',' + response.data.alamat_surat_4 + ',' + response.data.alamat_surat_5); 
                        $('#my_tarikh_mati').val(response.data.tarikh_mati);
                        $('#my_tarikh_lahir').val(response.data.tarikh_lahir);

                        // Jantina
                        var jantina = '';
                        switch (response.data.jantina) {
                            case 'L':
                                jantina = 'Lelaki';
                                break;
                        
                            case 'P':
                                jantina = 'Perempuan';
                                break;

                            case 'R':
                                jantina = 'Ragu';
                                break;

                            default:
                                jantina = '';
                                break;
                        }
                        $('#my_jantina').val(jantina);
                        $('#my_tel').val(response.data.tel_bimbit);
                        $('#my_emel').val(response.data.emel);
                        // TODO MAP OTHER VALUES TO ID
                    }
                    else{
                        $('#maklumat_diri').hide();
                        $('#my_status').html(response.message);
                    }
                    
                },
                error: function(response) {
                    $.alert({
                        type: 'red',
                        title: 'Whoops, looks like something went wrong!',
                        content: 'Please check with system admin.',
                        typeAnimated: true,
                        icon: 'fa fa-warning',
                        columnClass: 'col-md-6 col-md-offset-3',
                    });
                }
            });

            $('#b_myidentity').html(`<button type="button" class="btn btn-secondary" data-dismiss="modal" onClick="showDetail('${id}');">Kembali</button>`)
            $('#status_myidentity').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