@extends('layouts.app')

@section('title', 'Permohonan '.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')
<style>
    .m-portlet__head-text {
        display: table-cell;
        vertical-align: middle;
        font-size: 1.3rem;
        font-weight: 500;
        font-family: Roboto;
    }

    .m-form .m-form__section.m-form__section--first,
    .m-form .m-form__section:first-child {
        margin-top: 40px !important;
    }

    .m-form.m-form--group-seperator-dashed .m-form__group {
        border-bottom: 0px !important;
    }

    .form-control {
        border: 1px solid #E6E7E8 !important;
        overflow: hidden !important;
        border-radius: .40rem !important;
        font-family: sans-serif, Arial !important;
        color: #575962 !important;
        font-size: 1rem !important;
        line-height: 1.25 !important;
        background-color: #fff !important;
    }

    .m-form .m-form__heading .m-form__heading-title {
        color: #716aca;
        font-weight: 500;
        font-size: 1.3rem;
    }

    .form-control:focus,
    .form-control:active {
        border-color: #3273dc !important;
        ;
        box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25) !important;
    }

    .hidethis {
        display: none;
    }

    .placeitrighthandside {
        text-align: right;
    }

    .col-lg-1.tablevisibility,
    .col-lg-7.tablevisibility,
    .col-lg-4.tablevisibility,
    .col-lg-10.tablevisibility,
    .tablevisibility {
        border: 2px solid #BCBEC0;
        border-collapse: collapse;
    }

    .col-lg-10.tablevisibility,
    .col-lg-1.tablevisibility {
        border: 2px solid #BCBEC0;
        border-collapse: collapse;
    }

    #rowmuatnaik2,
    #rowpadam2,
    #rowinputdokumenicon {
        padding-bottom: 4px;
        padding-top: 8px;
    }

    .tablebutton {
        font-family: 'Myriad Pro';
        font-weight: normal;
        font-size: 15px;
    }

    .btn-special {
        font-size: 24px;
        color: white;
        background-color: white;
        border: 0px solid white;
    }

    .labelwarning {
        color: red !important;
        font-size: 13px !important;
        font-family: 'Myriad Pro' !important;
        font-weight: normal !important;
    }

    /*Tooltip popup on mouse hover*/
    .tooltip {
        position: relative !important;
        display: inline-block !important;
        border-bottom: 0px dotted black;
        opacity: 1 !important;
    }

    /* Position the tooltip */
    .tooltip .tooltiptext {
        visibility: hidden !important;
        width: 700% !important;
        margin-left: -60px !important;
        background-color: #eee !important;
        color: black !important;
        text-align: left !important;
        border-radius: 0px !important;
        border-color: #E6E7E8 !important;
        padding: 0px 0px !important;
        opacity: 1 !important;
        ;
        transition: opacity 1s !important;
        border-top-width: 0px !important;
        border-top-style: solid !important;
        border-bottom-width: 0px !important;
        border-bottom-style: solid !important;
        border-right-width: 0px !important;
        border-right-style: solid !important;
        border-left-width: 0px !important;
        border-left-style: solid !important;
        position: absolute !important;
        z-index: 1 !important;
        top: -557px !important;
    }

    .tooltip:hover .tooltiptext {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* tooltip arrow position*/
    .tooltip .tooltiptext::after {
        content: "" !important;
        position: absolute !important;
        top: 101% !important;
        right: 91.8% !important;
        margin-top: -5px !important;
        border-width: 13px !important;
        border-style: solid !important;
        border-color: black transparent transparent transparent !important;
    }

    h5 {
        background-image: url("Information-icon2.png") !important;
        background-repeat: no-repeat !important;
        background-position: right !important;
        padding-right: 40px !important;
        margin-bottom: 5px !important;
        display: inline-block !important;
    }

    th {
        border: 2px solid #BCBEC0 !important;
        border-collapse: collapse !important;
        background-color: #414042;
        color: white;
        padding: 10px;
        font-family: 'Myriad Pro';
        font-weight: normal;
        margin-top: 15px;
        margin-bottom: 15px;
        font-size: 16px;
    }

    #tool {
        border: 2px solid #BCBEC0;
        border-collapse: collapse;
        text-align: left;
        font-family: 'Myriad Pro';
        font-weight: normal;
        padding: 5px !important;
        background-color: white;
        margin-top: 5px;
        margin-bottom: 5px;
    }
</style>
@endsection
@section('content')
<div class="row">
    <div class="col-lg-10">
        <div class="m-portlet">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <span class="m-portlet__head-icon m--hide">
                            <i class="la la-gear"></i>
                        </span>
                        <h3 class="m-portlet__head-text">
                            {{ $ipr->display_name }}
                        </h3>
                    </div>
                </div>
            </div>
            <form id="permohonan_form" enctype="multipart/form-data" class="m-form m-form--label-align-right" action="{{ url('dun/permohonan/bbbr/edit/'.$permohonan->id.'') }}" method="POST">
                @csrf
                <input type="hidden" name="akuan_1" value="">
                <input type="hidden" name="akuan_2" value="">

                <div class="m-portlet__body">
                    <div class="m-form__section m-form__section--middle maklumatpemohon">
                        <div class="m-form__heading">
                            <h3 id="maklumatpemohon" class="m-form__heading-title">
                                Maklumat Pemohon:
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Nama:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="nama" name="nama" value="{{ $profile->nama }}">
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Negeri Kelahiran:
                            </label>
                            <div class="col-lg-4">
                            @if($profile->negerikelahiran==1)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Selangor">
                            @elseif($profile->negerikelahiran==2)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Perak">
                            @elseif($profile->negerikelahiran==3)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Melaka">
                            @elseif($profile->negerikelahiran==4)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Kedah">
                            @elseif($profile->negerikelahiran==5)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Perlis">
                            @elseif($profile->negerikelahiran==6)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Negeri Sembilan">
                            @elseif($profile->negerikelahiran==7)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Sabah">
                            @elseif($profile->negerikelahiran==8)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Kelantan">
                            @elseif($profile->negerikelahiran==9)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Pahang">
                            @elseif($profile->negerikelahiran==10)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Terengganu">
                            @elseif($profile->negerikelahiran==11)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="W.P. Kuala Lumpur">
                            @elseif($profile->negerikelahiran==12)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Pulau Pinang">
                            @elseif($profile->negerikelahiran==13)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Sarawak">
                            @elseif($profile->negerikelahiran==14)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="Johor">
                            @elseif($profile->negerikelahiran==15)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="W.P. Labuan">
                            @elseif($profile->negerikelahiran==16)
                            <input type="text" class="form-control m-input" id="negeri_kelahiran" name="negeri_kelahiran" value="W.P. Putrajaya">
                            @endif
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>No Identiti:
                            </label>
                            <div class="input-group m-input-group col-lg-4">
                                <select class="m-input" id="ic_pemohon" name="ic_type" style="font-size: 13px; color: #575962; border-color: #ebedf2; background-color: #f4f5f8" readonly>
                                    <option value="1" @if($profile->ic_type == '1') selected @endif >No. K/P</option>
                                    <option value="2" @if($profile->ic_type == '2') selected @endif>No. Tentera</option>
                                    <option value="3" @if($profile->ic_type == '3') selected @endif>No. Polis</option>
                                </select>
                                <input type="text" class="form-control m-input" id="nokadpengenalanpemohon" name="ic" placeholder="Sila masukan no kad pengenalan" value="{{ $profile->ic }}" data-inputmask-regex="^(01)[0-9]{8,9}$" maxlength="12" readonly>
                            </div>

                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Status Perkahwinan:
                            </label>
                            <div class="col-lg-4">
                                <select class="form-control m-input" id="status_perkahwinan" name="status_perkahwinan">
                                    <option value="" hidden selected>Sila pilih status perkahwinan</option>
                                    <option value="Bujang" @if($profile->status_perkahwinan == 'Bujang') selected @endif>Bujang</option>
                                    <option value="Berkahwin" @if($profile->status_perkahwinan == 'Berkahwin') selected @endif>Berkahwin</option>
                                    <option value="Duda/Janda" @if($profile->status_perkahwinan == 'Duda/Janda') selected @endif>Duda/Janda</option>

                                </select>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-2"></div>
                            <div class="col-lg-4">
                                <small class="exist_ic" style="color:#f4516c;display:none">No. K/P / No. Tentera / No. Polis telah didaftar.</small>
                                <small class="loading_ic" style="color:#f4516c;display:none">Memeriksa...</small>
                                <small class="success_ic" style="color:green;display:none">Ok</small>
                                <small class="length_ic" style="color:#f4516c;display:none">No. Identiti mestilah 12 digit sahaja.</small>
                            </div>
                            <div class="col-lg-2"></div>
                            <div class="col-lg-4"></div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>No Telefon Bimbit:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="notelefonbimbitpemohon" name="tel_bimbit" value="{{ $profile->tel_bimbit }}">
                            </div>
                            <label class="col-lg-2 col-form-label">
                                No Telefon Rumah:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="notelefonrumahpemohon" name="tel_rumah" value="{{ $profile->tel_rumah }}" placeholder="Sila masukkan no telefon rumah">
                            </div>
                        </div>
                    </div>
                    <div class="m-form__section m-form__section--middle maklumattempattinggal">
                    <div class="m-form__heading">
                        <h3 id="maklumattempattinggal" class="m-form__heading-title">
                           Maklumat Tempat Tinggal:
                        </h3>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Alamat:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="alamat_1" name="alamat_1" value="{{ $profile->alamat_1 }}" placeholder="Sila masukkan alamat">
                        </div>
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Poskod:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="poskod" name="poskod" value="{{ $profile->poskod }}" placeholder="Sila masukkan poskod">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="alamat_2" value="{{ $profile->alamat_2 }}" name="alamat_2">
                        </div>
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Daerah:
                        </label>
                        <div class="col-lg-4">
                        <input type="text" class="form-control m-input" id="daerah" value="{{ $profile->daerah }}" name="daerah">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="alamat_3"  value="{{ $profile->alamat_3 }}" name="alamat_3">
                        </div>
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Negeri:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="negeri"  value="{{ $profile->negeri }}" name="negeri">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Bandar:
                        </label>
                        <div class="col-lg-4">
                           <input type="text" class="form-control m-input" id="bandar" name="bandar" value="{{ $profile->bandar }}" placeholder="Sila masukkan bandar">
                        </div>
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Status Kediaman:
                        </label>
                        <div class="col-lg-4">
                            <select id="statuskediaman" name="statuskediaman" class="form-control m-input">
                                <option value="" hidden selected>Sila pilih status kediaman</option>
                                <option value="Rumah Sendiri" @if($permohonan->bbbr_status_kediaman == 'Rumah Sendiri') selected @endif>Rumah Sendiri</option>
                                <option value="Rumah Pusaka" @if($permohonan->bbbr_status_kediaman == 'Rumah Pusaka') selected @endif>Rumah Pusaka</option>
                                <option value="Menyewa" @if($permohonan->bbbr_status_kediaman == 'Menyewa') selected @endif>Menyewa</option>
                                <option value="Setinggan" @if($permohonan->bbbr_status_kediaman == 'Setinggan') selected @endif>Setinggan</option>
                                <option value="Menumpang" @if($permohonan->bbbr_status_kediaman == 'Menumpang') selected @endif>Menumpang</option>
                                <option value="Lain-Lain" @if($permohonan->bbbr_status_kediaman == 'Lain-Lain') selected @endif>Lain-Lain</option>
                           </select>
                           <input type="text" class="form-control m-input hidethis" id="statuskediamanlainlain" name="statuskediamanlainlain" placeholder="Sila nyatakan status kediaman">
                        </div>
                     </div>
                     <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Status Pemilikan Tanah/Tapak:
                        </label>
                        <div class="col-lg-4">
                            <select id="statuspemilikantanahtapak" name="statuspemilikantanahtapak" class="form-control m-input">
                                <option value="" hidden selected>Sila pilih status pemilikan tanah tapak</option>
                                <option value="Pemilik" @if($permohonan->bbbr_status_tapak == 'Pemilik') selected @endif>Pemilik</option>
                                <option value="Penyewa" @if($permohonan->bbbr_status_tapak == 'Penyewa') selected @endif>Penyewa</option>
                                <option value="Lain-Lain" @if($permohonan->bbbr_status_tapak == 'Lain-Lain') selected @endif>Lain-Lain</option>
                           </select><br />
                           <input type="text" class="form-control m-input hidethis" id="statuspemilikantanahtapaklainlain" name="statuspemilikantanahtapaklainlain" placeholder="Sila nyatakan status pemilikan tanah tapak">
                           </div>
                     </div>
                    </div>
                    <div class="m-form__seperator m-form__seperator--dashed maklumat_pasangan"></div>
                    <div class="m-form__section m-form__section--middle maklumat_pasangan">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Maklumat Ahli Keluarga
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <div class="col-lg-12">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th>Nama</th>
                                            <th>Umur</th>
                                            <th>Hubungan</th>
                                            <th>Status(Nyatakan sama ada masih belajar,bekerja,OKU atau menganggur)</th>
                                            <th>Pendapatan (RM)</th>
                                            <th>Tinggal Bersama(Ya/Tidak)</th>
                                            <th width="10%"></th>
                                        </tr>
                                    </thead>
                                    <tbody id="ahli_keluarga_input">
                                        @if (count($ahlikeluarga) < 1) 
                                            <tr>
                                                <td>
                                                    <input type="text" class="form-control m-input keluarga_nama" name="keluarga_nama[]" data-inputmask-regex="([a-zA-Z@/ ])+/g">
                                                </td>
                                                <td>
                                                    <input type="text" class="form-control m-input keluarga_umur" name="keluarga_umur[]">
                                                </td>
                                                <td>
                                                    <input type="text" class="form-control m-input keluarga_hubungan" name="keluarga_hubungan[]">
                                                </td>
                                                <td>
                                                    <select name="keluarga_status[]" class="form-control m-input keluarga_status" required>
                                                        <option value="" hidden selected>Sila pilih status</option>
                                                        <option value="Belajar">Belajar</option>
                                                        <option value="Bekerja">Bekerja</option>
                                                        <option value="Menganggur">Menganggur</option>
                                                        <option value="OKU">OKU</option>
                                                    </select>
                                                </td>
                                                <td>
                                                    <input type="number" class="form-control m-input keluarga_pendapatan" name="keluarga_pendapatan[]" oninput="total()">
                                                </td>
                                                <td>
                                                    <select name="keluarga_tinggal_bersama[]" class="form-control m-input keluarga_tinggal_bersama">
                                                        <option value="true">Ya</option>
                                                        <option value="false">Tidak</option>
                                                    </select>
                                                </td>
                                                <td></td>
                                            </tr>
                                        @else
                                            @foreach ($ahlikeluarga as $keluarga)
                                                <tr>
                                                    <td>
                                                        <input type="text" class="form-control m-input keluarga_nama" name="keluarga_nama[]" value="{{ $keluarga->nama }}" data-inputmask-regex="([a-zA-Z@/ ])+/g">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input keluarga_umur" name="keluarga_umur[]" value="{{ $keluarga->umur }}">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input keluarga_hubungan" name="keluarga_hubungan[]" value="{{ $keluarga->hubungan }}">
                                                    </td>
                                                    <td>
                                                        <select name="keluarga_status[]" class="form-control m-input keluarga_status" required>
                                                            <option value="" hidden selected>Sila pilih status</option>
                                                            <option value="Belajar" @if($keluarga->status == 'Belajar') selected @endif>Belajar</option>
                                                            <option value="Bekerja" @if($keluarga->status == 'Bekerja') selected @endif>Bekerja</option>
                                                            <option value="Menganggur" @if($keluarga->status == 'Menganggur') selected @endif>Menganggur</option>
                                                            <option value="OKU" @if($keluarga->status == 'OKU') selected @endif>OKU</option>
                                                        </select>
                                                    </td>
                                                    <td>
                                                        <input type="number" class="form-control m-input keluarga_pendapatan" name="keluarga_pendapatan[]"  value="{{ $keluarga->pendapatan }}" oninput="total()">
                                                    </td>
                                                    <td>
                                                        <select name="keluarga_tinggal_bersama[]" class="form-control m-input">
                                                            <option value="true" @if ($keluarga->tinggal_bersama == true) selected @endif >Ya</option>
                                                            <option value="false" @if ($keluarga->tinggal_bersama == false) selected @endif >Tidak</option>
                                                        </select>
                                                    </td>
                                                    <td>
                                                        <div class="btn-sm btn btn-danger m-btn m-btn--icon m-btn--pill" onclick="ahli_delete({{ $keluarga->id }},1)">
                                                                <span>
                                                                    <i class="la la-trash-o"></i>
                                                                    <span>Padam</span>
                                                                </span>
                                                        </div>
                                                    </td>
                                                    <td></td>
                                                </tr>
                                            @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                            <div class="col-lg-12">
                                <div class="btn btn btn-sm btn-success m-btn m-btn--icon m-btn--pill m-btn--wide" onclick="keluarga_add()">
                                    <span>
                                        <i class="la la-plus"></i>
                                        <span>
                                            Tambah
                                        </span>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>


                    <div class="m-form__seperator m-form__seperator--dashed maklumat_bantuan"></div>
                    <div class="m-form__section m-form__section--middle maklumat_bantuan">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Maklumat Bantuan Yang Di Terima
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <div class="col-lg-12">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th>Jenis Bantuan</th>
                                            <th>Pemberi Bantuan</th>
                                            <th>Tarikh Terima</th>
                                            <th>Tarikh Akhir Bantuan</th>
                                            <th width="10%"></th>
                                        </tr>
                                    </thead>
                                    <tbody id="bantuan_input">
                                        @if (count($bantuan) < 1) 
                                            <tr>
                                                <td>
                                                    <input type="text" class="form-control m-input " id="jenis_bantuan" name="jenis_bantuan[]">
                                                </td>
                                                <td>
                                                    <input type="text" class="form-control m-input " id="pemberi_bantuan" name="pemberi_bantuan[]">
                                                </td>
                                                <td>
                                                    <input type="date" class="form-control m-input tarikh_terima" id="tarikh_terima" name="tarikh_terima[]">
                                                </td>
                                                <td>
                                                    <input type="date" class="form-control m-input tarikh_akhir" id="tarikh_akhir" name="tarikh_akhir[]">
                                                </td>
                                                <td></td>
                                            </tr>
                                        @else
                                            @foreach ($bantuan as $bantuan)
                                                <tr>
                                                    <td>
                                                        <input type="text" class="form-control m-input " name="jenis_bantuan[]" value="{{ $bantuan->bbbr_jenis_bantuan }}">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input " name="pemberi_bantuan[]" value="{{ $bantuan->bbbr_pemberi_bantuan }}">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input tarikh_terima" name="tarikh_terima[]" value="{{ $bantuan->bbbr_tkh_terima_bantuan }}" readonly>
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input tarikh_akhir" name="tarikh_akhir[]"  value="{{ $bantuan->bbbr_tkh_akhir_bantuan }}" readonly>
                                                    </td>
                                                    <td>
                                                        
                                                    <div class="btn-sm btn btn-danger m-btn m-btn--icon m-btn--pill" onclick="bantuan_delete({{ $bantuan->id }},1)">
                                                                <span>
                                                                    <i class="la la-trash-o"></i>
                                                                    <span>Padam</span>
                                                                </span>
                                                        </div>
                                                        </td>
                                                    <td></td>
                                                </tr>
                                            @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                            <div class="col-lg-12">
                                <div class="btn btn btn-sm btn-success m-btn m-btn--icon m-btn--pill m-btn--wide" onclick="bantuan_add()">
                                    <span>
                                        <i class="la la-plus"></i>
                                        <span>
                                            Tambah
                                        </span>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="m-form__seperator m-form__seperator--dashed maklumatpendapatanpemohon"></div>
                    <div class="m-form__section m-form__section--middle maklumatpendapatanpemohon">
                        <div class="m-form__heading">
                            <h3 id="maklumatpendapatanpemohon" class="m-form__heading-title">
                                Maklumat Pendapatan Pemohon:
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Status Pekerjaan:
                            </label>
                            <div class="col-lg-4">
                            <input type="text" class="form-control m-input" id="pekerjaan_pemohon" name="pekerjaan_pemohon" value="{{ $profile->jenis_pekerjaan }}">
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Bilangan Ahli Isi Rumah:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="bil_ahli_rumah" name="bil_ahli_rumah" value="{{ $permohonan -> bil_ahli_rumah }}">
                            </div>
                        </div>

                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Pendapatan Permohon:
                            </label>
                            <div class="input-group m-input-group col-lg-4">
                                <span class="input-group-addon">
                                    RM
                                </span>
                                <input type="text" class="form-control m-input" id="pendapatan_pemohon" name="pendapatan_pemohon" value=" {{  $profile->pendapatan }} " oninput="total()"> 
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Pendapatan Isi Rumah:
                            </label>
                            <div class="input-group m-input-group col-lg-4">
                                <span class="input-group-addon">
                                    RM
                                </span>
                                <input type="text" class="form-control m-input" id="pendapatan_isi_rumah" name="pendapatan_isi_rumah" value="{{ $permohonan->pendapatan_isi_rumah }}" readonly>
                            </div>
                        </div>
                    </div>
                    
                    <div class="m-form__seperator m-form__seperator--dashed lampirandokumen"></div>
                    <div class="m-form__section m-form__section--last lampirandokumen">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Senarai Semak Dokumen:
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <div class="col-lg-12">
                                <table class="table  order table-responsive">
                                    <thead>
                                        <tr>
                                            <th width="70%">Dokumen</th>
                                            <th width="30%">Muat Naik</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($senarai_dokumen as $type)
                                        @if($document->contains('type', $type))
                                            @foreach($document as $dokumen)
                                                @if($type == $dokumen->type)
                                                <tr>
                                                    <td><strong>{{ $dokumen->type }} </strong>
                                                        <p>
                                                            @if($dokumen->filename != '')
                                                                <a href="{{ url($dokumen->filename) }}" target="_blank">{{ explode("/", $dokumen->filename)[5] }}</a>
                                                            @elseif($dokumen->filename === '')
                                                                <p style="font-size: 12px; color: red;">Tiada dokumen {{ $dokumen->type }} dimuatnaik.</p>
                                                            @endif
                                                        </p>
                                                    </td>
                                                    <td>
                                                        <input class="form-control m-input" type="file" name="dokumen[]">
                                                        <label for="dokumen_1" style="font-size: small; color: blue;">Kemaskini Dokumen</label>
                                                        <input class="form-control m-input" type="hidden" value="{{ $dokumen->type }}" name="dokumen_title[]">
                                                    </td>
                                                </tr>
                                                @endif
                                            @endforeach
                                        @else
                                        <tr>
                                            <td><strong>{{ $type }} </strong>
                                                <p style="font-size: 12px; color: red;">Tiada dokumen {{ $type }} dimuatnaik.</p>
                                            </td>
                                            <td>
                                                <input class="form-control m-input" type="file" name="dokumen[]">
                                                <label for="dokumen_1" style="font-size: small; color: blue;">Kemaskini Dokumen</label>
                                                <input class="form-control m-input" type="hidden" value="{{ $type }}" name="dokumen_title[]">
                                            </td>
                                        </tr>
                                        @endif
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="form-group m-form__group row">
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Bantuan Yang Dipohon:
                        </label>
                        <div class="col-lg-4">
                           <select id="bantuanyangdipohon" name="bantuanyangdipohon" class="form-control m-input" readonly>
                              <option value="" hidden selected>Sila pilih bantuan yang dipohon</option>
                              <option value="Baik Pulih" @if($permohonan->bantuan_dipohon == 'Baik Pulih') selected @endif >Baik Pulih</option>
                              <option value="Bina Rumah" @if($permohonan->bantuan_dipohon == 'Bina Rumah') selected @endif >Bina Rumah</option>
                           </select>
                        </div>
                     </div>
                    <div class="m-form__seperator m-form__seperator--dashed lampirangambarrumah"></div>
                        <div class="m-form__section m-form__section--last lampirangambarrumah">
                            <div class="m-form__heading">
                                <h3 class="m-form__heading-title">
                                    Lampiran Gambar Rumah:
                                </h3>
                            </div>
                            <div class="form-group m-form__group row">
                                <div class="col-lg-12">
                                    <table class="table  order table-responsive">
                                        <thead>
                                            <tr>
                                                <th width="70%">Gambar Rumah</th>
                                                <th width="30%">Muat Naik</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        @foreach($gambar_rumah as $type)
                                            @if($document->contains('type', $type))
                                                @foreach($document as $dokumen)
                                                    @if($type == $dokumen->type)
                                                    <tr>
                                                        <td><strong>{{ $dokumen->type }} </strong>
                                                            <p>
                                                                @if($dokumen->filename != '')
                                                                    <a href="{{ url($dokumen->filename) }}" target="_blank">{{ explode("/", $dokumen->filename)[5] }}</a>
                                                                @elseif($dokumen->filename === '')
                                                                    <p style="font-size: 12px; color: red;">Tiada dokumen {{ $dokumen->type }} dimuatnaik.</p>
                                                                @endif
                                                            </p>
                                                        </td>
                                                        <td>
                                                            <input class="form-control m-input" type="file" name="dokumen[]">
                                                            <label for="dokumen_1" style="font-size: small; color: blue;">Kemaskini Dokumen</label>
                                                            <input class="form-control m-input" type="hidden" value="{{ $dokumen->type }}" name="dokumen_title[]">
                                                        </td>
                                                    </tr>
                                                    @endif
                                                @endforeach
                                            @else
                                            <tr>
                                                <td><strong>{{ $type }} </strong>
                                                    <p style="font-size: 12px; color: red;">Tiada dokumen {{ $type }} dimuatnaik.</p>
                                                </td>
                                                <td>
                                                    <input class="form-control m-input" type="file" name="dokumen[]">
                                                    <label for="dokumen_1" style="font-size: small; color: blue;">Kemaskini Dokumen</label>
                                                    <input class="form-control m-input" type="hidden" value="{{ $type }}" name="dokumen_title[]">
                                                </td>
                                            </tr>
                                            @endif
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group m-form__group row pelan_lokasi">
                        <label class="col-lg-2 col-form-label">
                           <span style="color: red">* </span>Pelan Lokasi Rumah:
                        </label>
                        <div class="col-lg-4 pelan_lokasi">
                            @foreach($pelan_lokasi as $type)
                                @if($document->contains('type', $type))
                                    @foreach($document as $dokumen)
                                        @if($type == $dokumen->type)
                                        <tr>
                                            <td><strong>{{ $dokumen->type }} </strong>
                                                <p>
                                                    @if($dokumen->filename != '')
                                                        <a href="{{ url($dokumen->filename) }}" target="_blank">{{ explode("/", $dokumen->filename)[5] }}</a>
                                                    @elseif($dokumen->filename === '')
                                                        <p style="font-size: 12px; color: red;">Tiada dokumen {{ $dokumen->type }} dimuatnaik.</p>
                                                    @endif
                                                </p>
                                            </td>
                                            <td>
                                                <input class="form-control m-input" type="file" name="dokumen[]">
                                                <label for="dokumen_1" style="font-size: small; color: blue;">Kemaskini Dokumen</label>
                                                <input class="form-control m-input" type="hidden" value="{{ $dokumen->type }}" name="dokumen_title[]">
                                            </td>
                                        </tr>
                                        @endif
                                    @endforeach
                                @else
                                <tr>
                                    <td><strong>{{ $type }} </strong>
                                        <p style="font-size: 12px; color: red;">Tiada dokumen {{ $type }} dimuatnaik.</p>
                                    </td>
                                    <td>
                                        <input class="form-control m-input" type="file" name="dokumen[]">
                                        <label for="dokumen_1" style="font-size: small; color: blue;">Kemaskini Dokumen</label>
                                        <input class="form-control m-input" type="hidden" value="{{ $type }}" name="dokumen_title[]">
                                    </td>
                                </tr>
                                @endif
                            @endforeach
                        </div>
                        <div class="col-lg-8"></div>
                    </div>
                </div>
                <div class="m-portlet__foot m-portlet__foot--fit">
                    <div class="m-form__actions m-form__actions">
                        <div class="row">
                            <div class="col-lg-5"></div>
                            <div class="col-lg-6">
                                <button type="button" class="btn btn-primary" onclick="validate()">
                                    Hantar
                                </button>
                                <button type="reset" class="btn btn-secondary" onclick="window.location='{{ url('dun/permohonan/bbbr') }}'">
                                    Kembali
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>


{{-- Modal --}}
<div class="modal fade" id="rumusan_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="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">
                        Negeri Kelahiran:
                     </label>
                     <input type="text" class="form-control" id="m_negeri_kelahiran" 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_ic" readonly>
                  </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 class="col-md-6">
                     <label for="recipient-name" class="form-control-label">
                        No. Telefon Rumah:
                     </label>
                     <input type="text" class="form-control" id="m_tel_rumah" readonly>
                  </div>
                  <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>
            </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 class="col-md-6">
                     <label for="recipient-name" class="form-control-label">
                        Status Kediaman
                     </label>
                     <input type="text" class="form-control" id="m_status_kediaman" readonly>
                  </div>
                  <div class="col-md-6">
                     <label for="recipient-name" class="form-control-label">
                        Status Pemilikan Tanah/Tapak:
                     </label>
                     <input type="text" class="form-control" id="m_status_pemilikan" readonly>
                  </div>
               </div>
            </div>
            <hr class="modal-hr">
            <div class="m-form__section m-form__section--middle">
               <h5 style="color: #f4516c">
                  Maklumat Pekerjaan Pemohon:
               </h5>
               <br>
               <div class="form-group m-form__group row">
                  <label class="col-lg-2 col-form-label">
                     <b>Pekerjaan Pemohon:</b>
                  </label>
                  <div class="col-lg-4">
                     <input type="text" class="form-control" id="m_pekerjaan_pemohon" readonly>
                  </div>
                  <label class="col-lg-2 col-form-label">
                     <b>Bilangan Ahli Isi Rumah:</b>
                  </label>
                  <div class="col-lg-4">
                     <input type="text" class="form-control" id="m_bil_rumah" readonly>
                  </div>
               </div>
               <div class="form-group m-form__group row">
                  <label class="col-lg-2 col-form-label">
                     <b>Pendapatan Pemohon:</b>
                  </label>
                  <div class="input-group m-input-group col-lg-4">
                     <span class="input-group-addon">
                        RM
                     </span>
                     <input type="text" class="form-control" id="m_pendapatan_pemohon" oninput="total()"  readonly>
                  </div>
                  <label class="col-lg-2 col-form-label">
                     <b>Pendapatan Isi Rumah:</b>
                  </label>
                  <div class="input-group m-input-group col-lg-4">
                     <span class="input-group-addon">
                        RM
                     </span>
                     <input type="text" class="form-control" id="m_pendapatan_isirumah" oninput="total()" readonly>
                  </div>
               </div>
            </div>
            <hr class="modal-hr maklumat_ahli_keluarga">
            <div class="m-form__section m-form__section--middle maklumat_ahli_keluarga">
               <h5 style="color: #f4516c">
                  Maklumat Ahli Keluarga (Termasuk Pemohon):
               </h5>
               <br>
               <div class="col-lg-12">
                  <table id="maklumattanggungantable" class="table order table-responsive">
                     <thead>
                        <tr>
                           <th>Nama</th>
                           <th>Umur (Tahun)</th>
                           <th>Hubungan</th>
                           <th>Status</th>
                           <th>Pendapatan (RM)</th>
                           <th>Tinggal Bersama</th>
                           <th></th>
                        </tr>
                     </thead>
                     <tbody id="m_keluarga_input"></tbody>
                  </table>
               </div>
            </div>
            <hr class="modal-hr bantuan_diterima">
            <div class="m-form__section m-form__section--middle bantuan_diterima">
               <h5 style="color: #f4516c">
                  Bantuan Yang Masih / Pernah Diterima:
               </h5>
               <br>
               <div class="col-lg-12">
                  <table id="bantuantable" class="table order table-responsive">
                     <thead>
                        <tr>
                           <th>Jenis Bantuan</th>
                           <th>Pemberi Bantuan Agensi/Individu</th>
                           <th>Tarikh Terima Bantuan</th>
                           <th>Tarikh Akhir Bantuan</th>
                           <th></th>
                        </tr>
                     </thead>
                     <tbody id="m_bantuan_input"></tbody>
                  </table>
               </div>
            </div>
            <div class="m-form__section m-form__section--end">
               <h5 style="color: #f4516c">
                  Perakuan Pemohon:
               </h5>
               <br>
               <div class="form-group m-form__group">
                  <div class="col-md-12">
                     <div class="alert m-alert m-alert--default" role="alert">
                        Sila ambil perhatian bahawa Akta Perlindungan Data Peribadi 2010 memberi anda hak tertentu ke atas penggunaan
                        data peribadi anda oleh pihak kami. Kerajaan Negeri Selangor dan Seksyen Sektoral, Unit Perancang Ekonomi Negeri (UPEN) Selangor memberi
                        keutamaan dalam hal melindungi data peribadi anda dan memastikan ianya terpelihara dengan mengambil langkah
                        tertentu seperti yang termaktub di dalam akta tersebut. Dengan mengemukakan dan menyediakan maklumat anda kepada
                        kami di dalam borang pendaftaran ini, anda membenarkan penggunaan maklumat peribadi yang dikumpulkan untuk memberikan
                        perkhidmatan kami, mengikut cara dan tujuan yang dinyatakan dalam nota privasi kami. Sila rujuk nota privasi
                        di laman sesawang <a href="https://www.selangor.gov.my/" target="_blank">www.selangor.gov.my</a>.
                     </div>
                     <label class="m-checkbox m-checkbox--success">
                        <input type="checkbox" id="m_akuan_1" name="m_akuan_1" value="true">
                        Setuju
                        <span></span>
                     </label>
                  </div>
               </div>
               <br>
               <div class="form-group m-form__group">
                  <div class="col-md-12">
                     <div class="alert m-alert m-alert--default" role="alert">
                        Saya dengan ini mengakui bahawa segala maklumat yang dinyatakan di dalam Borang Permohonan ini adalah BENAR
                        dan memberikan kebenaran kepada Kerajaan Negeri Selangor dan Unit Perancang Ekonomi Negeri (UPEN) Selangor untuk membuat semakan
                        data butir-butir peribadi saya bagi memproses permohonan ini.
                     </div>
                     <label class="m-checkbox m-checkbox--success">
                        <input type="checkbox" id="m_akuan_2" name="m_akuan_2" value="true">
                        Setuju
                        <span></span>
                     </label>
                  </div>
               </div>
            </div>
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-primary" onclick="submitForm()">
               Hantar
            </button>
            <button type="button" class="btn btn-secondary" data-dismiss="modal">
               Kemaskini
            </button>
         </div>
      </div>
   </div>
</div>
{{-- End Modal --}}
@endsection

@section('js')
<script>

    $('.keluarga_umur').inputmask({
      mask: "9999",
      placeholder: ""
   })

    $(document).ready(() => {
        // $('.maklumat_pasangan').hide();
        $(".nama").inputmask("Regex");
        // getStatus($('#status_perkahwinan option:selected').val());
        // getIc($('#ic_type option:selected').val());
        $("#poskod").inputmask({
            mask: "99999",
            placeholder: ""
        });
        $("#tel_bimbit, #jmb_no_tel").inputmask({
            mask: "9999999999999",
            placeholder: ""
        });
    });

    // function getIc(x) {
    //     if (x == 1) {
    //         $("#ic").inputmask({
    //             mask: "999999999999",
    //             placeholder: ""
    //         });
    //     } else {
    //         $("#ic").inputmask("Regex");
    //     }
    // }
    $(document).ready(function() {
        var permohonan = ;
        
        if (permohonan.bantuan_dipohon == 'Baik Pulih') {
            $('.lampirangambarrumah').show();
            $('.pelan_lokasi').hide();
        } else {
            $('.lampirangambarrumah').hide();
            $('.pelan_lokasi').show();
        }
    });

    $(document).ready(function() {
      $('#bantuanyangdipohon').on('change', function() {
         if (this.value == 'Baik Pulih') {
            $('.lampirangambarrumah').show('slow');
            $('.pelan_lokasi').hide('slow');
         } else {
            $('.lampirangambarrumah').hide('slow');
            $('.pelan_lokasi').show('slow');
         }
      });
   });

    $(document).ready(function() {
      $('#statuskediaman').on('change', function() {
         if (this.value == 'Lain-Lain') {
            $("#statuskediamanlainlain").show('slow');
         } else {
            $("#statuskediamanlainlain").hide('slow');
            $("#statuskediaman").val();
         }
      });
   });

    $(document).ready(function() {
        $('#statuspemilikantanahtapak').on('change', function() {
            if (this.value == 'Lain-Lain') {
                $("#statuspemilikantanahtapaklainlain").show('slow');
            } else {
                $("#statuspemilikantanahtapaklainlain").hide('slow');
                $("#statuspemilikantanahtapaklainlain").val();
            }
        });
    });

    function validate() {
        if ($('input[name="nama"]').val() == '' ||
            $('input[name="ic"]').val() == '' ||
            $('input[name="tel_bimbit"]').val() == '' ||
            $('select[name="status_perkahwinan"] option:selected').val() == '' ||
            $('select[name="negerikelahiran"] option:selected').val() == '' ||
            $('input[name="alamat_1"]').val() == '' ||
            $('input[name="poskod"]').val() == '' ||
            $('input[name="daerah"]').val() == '' ||
            $('input[name="bandar"]').val() == '' ||
            $('input[name="negeri"]').val() == '' ||
            $('input[name="perkerjaan_pemohon"]').val() == '' ||
            $('input[name="pendapatan_pemohon"]').val() == '' ||
            $('input[name="bil_ahli_rumah"]').val() == ''
        )

        {
            error();
            return;
        } else {
            
            showRumusan();
        }

        function error() {
            $.confirm({
                title: 'Maklumat tidak lengkap?',
                content: 'Sila semak permohonan anda terlebih dahulu.',
                icon: 'fa fa-warning',
                type: 'red',
                buttons: {
                    ok: {
                        btnClass: 'btn-red'
                    }
                }
            });
        }
    }

    function showRumusan() {
      // Maklumat Pemohon
      $('#m_nama').val($('input[name="nama"]').val());
      $('#m_negeri_kelahiran').val($('input[name="negeri_kelahiran"]').val());
      $('#m_ic').val($('input[name="ic"]').val());
      $('#m_tel_bimbit').val($('input[name="tel_bimbit"]').val());
      $('#m_status_perkahwinan').val($('select[name="status_perkahwinan"] option:selected').val());
      $('#m_tel_rumah').val($('input[name="tel_rumah"]').val());

      // Maklumat Tempat Tinggal
      $('#m_alamat').html([
         $('input[name="alamat_1"]').val() + ' ',
         $('input[name="alamat_2"]').val() ? $('input[name="alamat_2"]').val() + ' ' : ' ',
         $('input[name="alamat_3"]').val() ? $('input[name="alamat_3"]').val() + ' ' : ' ',
         $('input[name="poskod"]').val() + ', ',
         $('input[name="bandar"]').val() + ', ',
         $('input[name="daerah"]').val() + ', ',
         $('input[name="negeri"]').val() + '.',
      ]);
      if ($('#m_status_kediaman').val($('select[name="statuskediaman"] option:selected').val()) == 'Lain-Lain') {
        $('#m_status_kediaman').val( $('input[name="statuskediamanlainlain"]' ).val());
      } else {
        $('#m_status_kediaman').val( $('select[name="statuskediaman"] option:selected' ).val());
      }

      if ($('#m_status_pemilikan').val($('select[name="statuspemilikantanahtapak"] option:selected').val()) == 'Lain-Lain') {
        $('#m_status_pemilikan').val( $('input[name="statuspemilikantanahtapaklainlain"]' ).val());
      } else {
        $('#m_status_pemilikan').val( $('select[name="statuspemilikantanahtapak"] option:selected' ).val());
      }

      // Maklumat Pekerjaan Pemohon
      $('#m_pekerjaan_pemohon').val($('input[name="pekerjaan_pemohon"]').val());
      $('#m_bil_rumah').val($('input[name="bil_ahli_rumah"]').val());
      $('#m_pendapatan_pemohon').val($('input[name="pendapatan_pemohon"]').val());
      $('#m_pendapatan_isirumah').val($('input[name="pendapatan_isi_rumah"]').val());


      // Maklumat Ahli Keluarga

      var keluarga_nama = [],
         keluarga_umur = [],
         keluarga_hubungan = [],
         keluarga_status = [],
         keluarga_pendapatan = [],
         keluarga_bersama = [],
         data = [],
         html = '';

      $('input[name="keluarga_nama[]"]').each(function(i, v) {
         keluarga_nama.push($(this).val());
      });
      $('input[name="keluarga_umur[]"]').each(function(i, v) {
         keluarga_umur.push($(this).val());
      });
      $('input[name="keluarga_hubungan[]"]').each(function(i, v) {
         keluarga_hubungan.push($(this).val());
      });
      $('select[name="keluarga_status[]"]').each(function(i, v) {
         keluarga_status.push($(this).val());
      });
      $('input[name="keluarga_pendapatan[]"]').each(function(i, v) {
         keluarga_pendapatan.push($(this).val());
      });
      $('select[name="keluarga_tinggal_bersama[]"]').each(function(i, v) {
         keluarga_bersama.push($(this).val());
      });


      for (x = 0; x < keluarga_umur.length; x++) {
         data.push({
            keluarga_nama: keluarga_nama[x],
            keluarga_umur: keluarga_umur[x],
            keluarga_hubungan: keluarga_hubungan[x],
            keluarga_status: keluarga_status[x],
            keluarga_pendapatan: keluarga_pendapatan[x],
            keluarga_bersama: keluarga_bersama[x],
         })
      }

      $('#m_keluarga_input').html('');
      data.forEach(function(d) {
         html =
            '<tr>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.keluarga_nama + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.keluarga_umur + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.keluarga_hubungan + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.keluarga_status + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="number" class="form-control m-input" value="' + d.keluarga_pendapatan + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.keluarga_bersama + '" disabled>' +
            '</td>' +
            '</tr>';

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

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

      // Maklumat Bantuan

      var jenis_bantuan = [],
         pemberi_bantuan = [],
         tarikh_terima = [],
         tarikh_akhir = [],
         data = [],
         html = '';

      $('input[name="jenis_bantuan[]"]').each(function(i, v) {
         jenis_bantuan.push($(this).val());
      });
      $('input[name="pemberi_bantuan[]"]').each(function(i, v) {
         pemberi_bantuan.push($(this).val());
      });
      $('input[name="tarikh_terima[]"]').each(function(i, v) {
         tarikh_terima.push($(this).val());
      });
      $('input[name="tarikh_akhir[]"]').each(function(i, v) {
         tarikh_akhir.push($(this).val());
      });

      for (x = 0; x < jenis_bantuan.length; x++) {
         data.push({
            jenis_bantuan: jenis_bantuan[x],
            pemberi_bantuan: pemberi_bantuan[x],
            tarikh_terima: tarikh_terima[x],
            tarikh_akhir: tarikh_akhir[x],
         })
      }

      $('#m_bantuan_input').html('');
      data.forEach(function(d) {
         html =
            '<tr>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.jenis_bantuan + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.pemberi_bantuan + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.tarikh_terima + '" disabled>' +
            '</td>' +
            '<td>' +
            '<input type="text" class="form-control m-input" value="' + d.tarikh_akhir + '" disabled>' +
            '</td>' +
            '</tr>';

         $('#m_bantuan_input').append(html);
      });
      $('#rumusan_permohonan').modal('show');
   }

    function total() {
        var pemohon = $('input[name="pendapatan_pemohon"]').val() == '' ? 0 : $('input[name="pendapatan_pemohon"]').val();
        var keluarga = 0;
        var total = 0;
        $('.keluarga_pendapatan').each(function(){
            keluarga += +$(this).val();
        });
        total = parseFloat(pemohon) + parseFloat(keluarga);

        $('input[name="pendapatan_pemohon"]').val(parseFloat(pemohon).toFixed(2));
        $('input[name="keluarga_pendapatan"]').val(parseFloat(keluarga).toFixed(2));
        $('input[name="pendapatan_isi_rumah"]').val(total.toFixed(2));
    }

    function keluarga_add() {
        var html =
        '<tr>'+
            '<td>'+
                '<input type="text" class="form-control m-input keluarga_nama" name="keluarga_nama[]" data-inputmask-regex="([a-zA-Z@/ ])+/g">'+
            '</td>'+
            '<td>'+
                '<input type="text" class="form-control m-input keluarga_umur" name="keluarga_umur[]">'+
            '</td>'+
            '<td>'+
                '<input type="text" class="form-control m-input keluarga_hubungan" name="keluarga_hubungan[]">'+
            '</td>' +
            '<td>' +
            '<select id="keluarga_status" name="keluarga_status[]" class="form-control m-input" required>' +
                '<option value="" hidden selected>Sila pilih status</option>' +
                '<option value="Belajar">Belajar</option>' +
                '<option value="Bekerja">Bekerja</option>' +
                '<option value="Menganggur">Menganggur</option>' +
                '<option value="OKU">OKU</option>' +
            '</select>' +
            '</td>' +
            '<td>'+
                '<input type="number" class="form-control m-input keluarga_pendapatan" name="keluarga_pendapatan[]" oninput="total()">'+
            '</td>'+
            '<td>'+
                '<select id="keluarga_tinggal_bersama" name="keluarga_tinggal_bersama[]" class="form-control m-input">' +
                    '<option value="true">Ya</option>' +
                    '<option value="false">Tidak</option>' +
                '</select>' +
            '</td>'+
            '<td>'+
                '<div class="btn-sm btn btn-warning m-btn m-btn--icon m-btn--pill" onclick="ahli_delete_new($(this))">'+
                '<span>'+
                '<i class="la la-trash-o"></i>'+
                '<span>Padam</span>'+
                '</span>'+
                '</div>'+
            '</td>'+
        '</tr>';
        $('#ahli_keluarga_input').append(html);
        assign_js('keluarga');
    }
    function ahli_delete_new(x) {
        x.closest('tr').remove();
        total();
    }

    function ahli_delete(x,y) {
        if(y == 0) {
            x.closest('tr').remove();
        } else if(y == 1) {
            $.confirm({
                title: 'Padam maklumat ahli keluarga?',
                content: 'Anda pasti untuk teruskan?',
                icon: 'fa fa-warning',
                columnClass: 'col-md-6 col-md-offset-3',
                type: 'red',
                buttons: {
                    padam: {
                        btnClass: 'btn-red',
                        action: function() {
                            var data = {
                                _token: '{{ csrf_token() }}',
                                pasangan_id: x,
                                permohonan_id: '{{$permohonan->id}}'
                            };
                            $.ajax({
                                url: '{{ url('dun/permohonan/bbbr/delete-ahli/') }}',
                                type: 'POST',
                                data: data,
                                success: function(response) {
                                    if(response.status == 'success') {
                                        $.notify({
                                            title: 'Berjaya',
                                            message: '<b>'+response.message+'</b>',
                                            icon: 'icon la la-check',
                                        },{
                                            type: 'success',
                                            allow_dismiss: true,
                                            newest_on_top: true,
                                            spacing: 10,
                                            timer: 5000,
                                            placement: {
                                                from: 'top',
                                                align: 'right',
                                            },
                                            offset: {
                                                x: 30,
                                                y: 30,
                                            },
                                            delay: 1000,
                                            z_index: 10000,
                                            animate: {
                                                enter: 'animated bounce',
                                                exit: 'animated bounce',
                                            }
                                        });
                                        setTimeout(function(){ location.reload(); }, 2000);
                                    } else {
                                        $.alert(response.message);
                                    }
                                },
                                error: function(response) {
                                    $.alert(response.message);
                                }
                            });
                        }
                    },
                    kembali: {
                        btnClass: 'btn-grey',
                        action: function() {
                        }
                    }
                }
            });
        }
        total();
    }

    function bantuan_add() {
        var html =
        '<tr>'+
            '<td>'+
                '<input type="text" class="form-control m-input jenis_bantuan" name="jenis_bantuan[]">'+
            '</td>'+
            '<td>'+
                '<input type="text" class="form-control m-input pemberi_bantuan" name="pemberi_bantuan[]">'+
            '</td>'+
            '<td>'+
                '<input type="date" class="form-control m-input tarikh_terima" name="tarikh_terima[]">'+
            '</td>' +
            '<td>'+
                '<input type="date" class="form-control m-input tarikh_akhir" name="tarikh_akhir[]">'+
            '</td>'+
            '<td>'+
                '<div class="btn-sm btn btn-warning m-btn m-btn--icon m-btn--pill" onclick="bantuan_delete_new($(this))">'+
                '<span>'+
                '<i class="la la-trash-o"></i>'+
                '<span>Padam</span>'+
                '</span>'+
                '</div>'+
            '</td>'+
        '</tr>';
        $('#bantuan_input').append(html);
        assign_js('bantuan');
    }
    function bantuan_delete_new(x) {
        x.closest('tr').remove();
    }

    function bantuan_delete(x,y) {
        if(y == 0) {
            x.closest('tr').remove();
        } else if(y == 1) {
            $.confirm({
                title: 'Padam maklumat bantuan?',
                content: 'Anda pasti untuk teruskan?',
                icon: 'fa fa-warning',
                columnClass: 'col-md-6 col-md-offset-3',
                type: 'red',
                buttons: {
                    padam: {
                        btnClass: 'btn-red',
                        action: function() {
                            var data = {
                                _token: '{{ csrf_token() }}',
                                pasangan_id: x,
                                permohonan_id: '{{$permohonan->id}}'
                            };
                            $.ajax({
                                url: '{{ url('dun/permohonan/bbbr/delete-bantuan/') }}',
                                type: 'POST',
                                data: data,
                                success: function(response) {
                                    if(response.status == 'success') {
                                        $.notify({
                                            title: 'Berjaya',
                                            message: '<b>'+response.message+'</b>',
                                            icon: 'icon la la-check',
                                        },{
                                            type: 'success',
                                            allow_dismiss: true,
                                            newest_on_top: true,
                                            spacing: 10,
                                            timer: 5000,
                                            placement: {
                                                from: 'top',
                                                align: 'right',
                                            },
                                            offset: {
                                                x: 30,
                                                y: 30,
                                            },
                                            delay: 1000,
                                            z_index: 10000,
                                            animate: {
                                                enter: 'animated bounce',
                                                exit: 'animated bounce',
                                            }
                                        });
                                        setTimeout(function(){ location.reload(); }, 2000);
                                    } else {
                                        $.alert(response.message);
                                    }
                                },
                                error: function(response) {
                                    $.alert(response.message);
                                }
                            });
                        }
                    },
                    kembali: {
                        btnClass: 'btn-grey',
                        action: function() {
                        }
                    }
                }
            });
        };
    }

    function assign_js(x) {
        if(x == 'keluarga') {
            $(".keluarga_umur").inputmask({
                mask: "9999",
                placeholder: ""
            });
        } 
        if (x == 'bantuan') {
            $(".tarikh_terima").change(function() {
               if ($(this).val() != '') {
                  $(".tarikh_akhir").attr('min', $(this).val());
               }
            })
        }
    }

    function submitForm() {
        if ($('#m_akuan_1:checked').val() != 'true' || $('#m_akuan_2:checked').val() != 'true') {
            error();
        } else {
            $('input[name="akuan_1"]').val($('#m_akuan_1:checked').val());
            $('input[name="akuan_2"]').val($('#m_akuan_2:checked').val());
            $.confirm({
                title: 'Hantar Permohonan?',
                content: 'Anda pasti untuk teruskan?',
                icon: 'fa fa-spinner fa-spin',
                type: 'green',
                buttons: {
                    hantar: {
                        btnClass: 'btn-green',
                        action: function() {
                            $('#permohonan_form').submit();
                        }
                    },
                    kembali: {
                        btnClass: 'btn-red',
                        action: function() {}
                    }
                }
            });
        }

        function error() {
            $.confirm({
                title: 'Maklumat tidak lengkap?',
                content: 'Sila tanda perakuan pemohon sebelum hantar pemohonan.',
                icon: 'fa fa-warning',
                type: 'red',
                buttons: {
                    ok: {
                        btnClass: 'btn-red',
                        action: function() {}
                    }
                }
            });
        }
    }
</script>
@endsection