@extends('layouts.app')

@section('title', 'Permohonan '.strtoupper($ipr->name))
@section('permohonan', 'm-menu__item--active')
@section($cluster->name, 'm-menu__item--active')
@section($ipr->name, 'm-menu__item--active')

@section('css')
@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" class="m-form m-form--label-align-right" action="{{ url('admin/permohonan/sade/edit/'.$permohonan->id) }}" method="POST">
                @csrf
                <input type="hidden" name="status" value="{{ $permohonan->status }}">
                <input type="hidden" name="jenis_meter_air" value="{{ $permohonan->jenis_meter_air }}">
                <div class="m-portlet__body">
                    <div class="m-form__section m-form__section--first">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Maklumat Permohonan:
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Status Permohonan:
                            </label>
                            <div class="col-lg-4">
                                <select class="form-control m-input" name="status" disabled>
                                    <option value="" hidden selected>Sila pilih status permohonan</option>
                                    <option value="0" @if($permohonan->status == -1) selected @endif>DIBATALKAN</option>
                                    <option value="0" @if($permohonan->status == 0) selected @endif>DITERIMA DAN SEDANG DIPROSES</option>
                                    <option value="1" @if($permohonan->status == 1) selected @endif>DITERIMA DAN SEDANG MENUNGGU SEMAKAN JMB/MC</option>
                                    <option value="2" @if($permohonan->status == 2) selected @endif>DISEMAK</option>
                                    <option value="3" @if($permohonan->status == 3) selected @endif>GAGAL</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="m-form__seperator m-form__seperator--dashed"></div>
                    <div class="m-form__section m-form__section--middle">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Maklumat Peribadi:
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                Jenis Meter Air:
                            </label>
                            <div class="col-lg-4">
                                <div class="m-radio-list">
                                    <label class="m-radio m-radio--solid m-radio--brand">
                                        <input type="radio" name="jenis_meter_air" id="jenis_meter_air" value="Individu" @if(strcasecmp($permohonan->jenis_meter_air, 'Individu')==0) checked @endif onclick="getJmb($(this).val())">
                                        Individu
                                        <span></span>
                                    </label>
                                    {{-- <label class="m-radio m-radio--solid m-radio--brand">
                                        <input type="radio" name="jenis_meter_air" id="jenis_meter_air" value="Pukal" @if(strcasecmp($permohonan->jenis_meter_air == 'Pukal')==0) checked @endif disabled>
                                        Pukal
                                        <span></span>
                                    </label> --}}
                                </div>
                            </div>
                            <label class="col-lg-2 col-form-label no_akaun_air">
                                <span style="color: red">* </span>Nombor Akaun Air
                                <i class="fa fa-question-circle-o"
                                    style="cursor: pointer; color: #f4516c"
                                    data-toggle="m-popover"
                                    data-trigger="focus"
                                    data-html="true"
                                    data-placement="top"
                                    data-content="<span class='m-form__help' style='color: #f4516c; font-weight: 500'>* 10 digit no. akaun air seperti yang tertera di dalam bil air</span><ul><li><span style='font-weight: 500'>028211XXXX (Baharu)</span></li><li><span style='font-weight: 500'>000027547XXXX (Lama)</span></li>">
                                </i> :
                            </label>
                            <div class="col-lg-4 no_akaun_air">
                                <input type="text" class="form-control m-input" id="no_akaun_air" name="no_akaun_air" placeholder="Masukkan no. akaun air 10 digit" value="{{ $permohonan->no_akaun_air }}" onblur="checkDuplicate($(this).val(),'no_akaun_air', '{{ $permohonan->no_akaun_air }}')" maxlength="10">
                                <small class="loading_no_akaun_air" style="color:#f4516c;display:none">Memeriksa...</small>
                                <small class="success_no_akaun_air" style="color:green;display:none">Ok</small>
                                <small class="exist_no_akaun_air" style="color:#f4516c;display:none">No. Akaun Air telah didaftar.</small>
                                <small class="length_no_akaun_air" style="color:#f4516c;display:none">No. Akaun Air mestilah 10 digit sahaja.</small>
                            </div>
                        </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 nama" name="nama" placeholder="Sila masukan nama" value="{{ $permohonan->nama }}" data-inputmask-regex="([a-zA-Z@/ ])+/g">
                            </div>
                            <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_type" name="ic_type" style="font-size: 13px; color: #575962; border-color: #ebedf2; background-color: #f4f5f8; display:none" onchange="getIc($(this).val())" readonly>
                                    <option value="1" @if($permohonan->ic_type == 1) selected @endif>No. K/P</option>
                                    <option value="2" @if($permohonan->ic_type == 2) selected @endif>No. Tentera</option>
                                    <option value="3" @if($permohonan->ic_type == 3) selected @endif>No. Polis</option>
                                </select>
                                <input type="text" class="form-control m-input" id="ic" name="ic" placeholder="Sila masukan No. Identiti" value="{{ $permohonan->ic_pemohon }}" data-inputmask-regex="([a-zA-Z0-9 ])+/g" maxlength="12" readonly>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>E-mel:
                            </label>
                            <div class="input-group m-input-group col-lg-4">
                                <select class="m-input email_type" name="email_type" onchange="emailFormat('{{ $permohonan->email }}');" style="font-size: 13px; color: #575962; border-color: #ebedf2; background-color: #f4f5f8">
                                    <option value="Pemohon" @if($permohonan->email_type == 'Pemohon') selected @endif>Pemohon</option>
                                    <option value="Wakil" @if($permohonan->email_type == 'Wakil') selected @endif>Wakil</option>
                                </select>
                                <input type="text" class="form-control m-input" name="email" placeholder="Sila masukan emel" value="{{ $permohonan->email }}" onblur="emailFormat('{{ $permohonan->email }}')">
                            </div>
                            <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="tel_bimbit" name="tel_bimbit" placeholder="Sila masukan no tel bimbit" value="{{ $permohonan->tel_bimbit }}" onblur="checkDuplicate($(this).val(),'tel_bimbit', '{{ $permohonan->tel_bimbit }}')">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-2"></div>
                            <div class="col-lg-4">
                                <small class="loading_email" style="color:#f4516c;display:none">Memeriksa...</small>
                                <small class="success_email" style="color:green;display:none">Ok</small>
                                <small class="format_email" style="color:#f4516c;display:none">Sila masukkan format emel yang betul.</small>
                                <small class="exist_email" style="color:#f4516c;display:none">Emel telah didaftar.</small>
                            </div>
                            <div class="col-lg-2"></div>
                            <div class="col-lg-4">
                                <small class="exist_tel_bimbit" style="color:#f4516c;display:none">No. Telefon telah didaftar.</small>
                                <small class="loading_tel_bimbit" style="color:#f4516c;display:none">Memeriksa...</small>
                                <small class="success_tel_bimbit" style="color:green;display:none">Ok</small>
                            </div>
                        </div>
                        <div class="form-group m-form__group row" style="padding-top: 0">
                            <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" onchange="getStatus($(this).val())">
                                    <option value="" hidden @if($permohonan->status_perkahwinan == '') selected @endif>Sila pilih status perkahwinan</option>
                                    <option value="Bujang" @if($permohonan->status_perkahwinan == 'Bujang') selected @endif>Bujang</option>
                                    <option value="Berkahwin" @if($permohonan->status_perkahwinan == 'Berkahwin') selected @endif>Berkahwin</option>
                                    <option value="Duda/Janda" @if($permohonan->status_perkahwinan == 'Duda/Janda') selected @endif>Duda/Janda</option>
                                </select>
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Pendapatan Bulanan:
                            </label>
                            <div class="input-group m-input-group col-lg-4">
                                <span class="input-group-addon">
                                    RM
                                </span>
                                <input type="number" class="form-control m-input" name="pendapatan" value="{{ number_format($permohonan->pendapatan_pemohon, 2, '.', '') }}" placeholder="Sila masukan pendapatan bulanan" oninput="total()">
                            </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 Pasangan
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <div class="col-lg-12">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th><span style="color: red">* </span>No. Identiti</th>
                                            <th><span style="color: red">* </span>Nama</th>
                                            <th>E-mel</th>
                                            <th>No Telefon Bimbit</th>
                                            <th><span style="color: red">* </span>Pendapatan Bulanan</th>
                                        </tr>
                                    </thead>
                                    <tbody id="pasangan_input">
                                        @if (count($pasangans) < 1)
                                                <tr>
                                                    <td>
                                                        <input type="text" class="form-control m-input pasangan_ic" id="pasangan_ic" name="pasangan_ic[]">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input nama" id="pasangan_nama" name="pasangan_nama[]" data-inputmask-regex="([a-zA-Z@/ ])+/g">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input" id="pasangan_emel" name="pasangan_emel[]" onblur="checkEmail($(this))">
                                                    </td>
                                                    <td>
                                                        <input type="text" class="form-control m-input pasangan_no_tel" id="pasangan_no_tel" name="pasangan_no_tel_bimbit[]">
                                                    </td>
                                                    <td>
                                                        <div class="input-group m-input-group col-lg-12">
                                                            <span class="input-group-addon">
                                                                RM
                                                            </span>
                                                            <input type="number" class="form-control m-input pasangan_pendapatan" id="pasangan_pendapatan" name="pasangan_pendapatan[]" placeholder="Jika ada" oninput="total()">
                                                        </div>
                                                    </td>
                                                </tr>
                                            @else
                                                @foreach ($pasangans as $pasangan)
                                                    <tr>
                                                        <td>
                                                            <input type="text" class="form-control m-input pasangan_ic" id="pasangan_ic" name="pasangan_ic[]" value="{{ $pasangan->ic_pasangan }}">
                                                        </td>
                                                        <td>
                                                            <input type="text" class="form-control m-input nama" id="pasangan_nama" name="pasangan_nama[]" value="{{ $pasangan->nama }}" data-inputmask-regex="([a-zA-Z@/ ])+/g">
                                                        </td>
                                                        <td>
                                                            <input type="text" class="form-control m-input" id="pasangan_emel" name="pasangan_emel[]" value="{{ $pasangan->emel }}" onblur="checkEmail($(this))">
                                                        </td>
                                                        <td>
                                                            <input type="text" class="form-control m-input pasangan_no_tel" id="pasangan_no_tel" name="pasangan_no_tel_bimbit[]" value="{{ $pasangan->no_tel_bimbit }}">
                                                        </td>
                                                        <td>
                                                            <div class="input-group m-input-group col-lg-12">
                                                                <span class="input-group-addon">
                                                                    RM 
                                                                </span>
                                                                @php
                                                                    if ($pasangan->pendapatan == null) {
                                                                        $pasangan_pendapatan = 0;
                                                                    } else {
                                                                        $pasangan_pendapatan = $pasangan->pendapatan;
                                                                    }
                                                                    $pendapatan_pasangan = str_replace(',', '', $pasangan_pendapatan);
                                                                @endphp
                                                                <input type="number" class="form-control m-input pasangan_pendapatan" id="pasangan_pendapatan" name="pasangan_pendapatan[]" value="{{ number_format($pendapatan_pasangan, 2, '.', '') }}" oninput="total()" placeholder="Jika ada">
                                                            </div>
                                                        </td>
                                                    </tr>
                                                @endforeach
                                            @endif
                                    </tbody>
                                    <tfoot>
                                        <tr>
                                            <td>
                                                <small class="ic_pasangan_wajib" style="color:#f4516c;display:none;">No. Identiti Pasangan adalah wajib.</small>
                                            </td>
                                            <td>
                                                <small class="nama_pasangan_wajib" style="color:#f4516c;display:none;">Nama Pasangan adalah wajib.</small>
                                            </td>
                                            <td></td>
                                            <td></td>
                                            <td>
                                                <small class="pendapatan_pasangan_wajib" style="color:#f4516c;display:none;">Pendapatan Pasangan adalah wajib.</small>
                                            </td>
                                            <td></td>
                                        </tr>
                                    </tfoot>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="m-form__seperator m-form__seperator--dashed"></div>
                    <div class="m-form__section m-form__section--middle">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Maklumat Pendapatan:
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                Jumlah Pendapatan Pemohon:
                            </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" name="pendapatan_pemohon" value="{{ $permohonan->pendapatan_pemohon }}"placeholder="Sila masukan jumlah pendapatan pemohon" readonly>
                            </div>
                            <label class="col-lg-2 col-form-label">
                                Jumlah Pendapatan Pasangan:
                            </label>
                            <div class="input-group m-input-group col-lg-4">
                                <span class="input-group-addon">
                                    RM
                                </span>
                                <input type="number" class="form-control m-input" name="pendapatan_pasangan" value="{{ $permohonan->pendapatan_pasangan }}"placeholder="Sila masukan jumlah pendapatan pasangan" readonly>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                Jumlah 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" name="pendapatan_isi_rumah" value="{{ $permohonan->pendapatan_isi_rumah }}"placeholder="Sila masukan jumlah pendapatan isi rumah" readonly>
                            </div>
                        </div>
                    </div>
                    <div class="m-form__seperator m-form__seperator--dashed"></div>
                    <div class="m-form__section m-form__section--middle">
                        <div class="m-form__heading">
                            <h3 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>Status Pemilikan Premis:
                            </label>
                            <div class="col-lg-4">
                                <div class="m-radio-list">
                                    <label class="m-radio m-radio--solid m-radio--brand">
                                        <input type="radio" name="status_pemilikan" value="Pemilik" @if($permohonan->status_pemilikan == 'Pemilik') checked @endif>
                                        Pemilik
                                        <span></span>
                                    </label>
                                    <label class="m-radio m-radio--solid m-radio--brand">
                                        <input type="radio" name="status_pemilikan" value="Penyewa" @if($permohonan->status_pemilikan == 'Penyewa') checked @endif>
                                        Penyewa
                                        <span></span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <div class="col-lg-6">
                                <div class="row">
                                    <label class="col-lg-4 col-form-label" style="text-align:right"><span style="color: red">* </span>Alamat:</label>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control m-input" name="alamat_1" placeholder="Sila masukan alamat"  value="{{ $permohonan->alamat_1 }}">
                                        <span class="m-form__help" style="color: #f4516c; font-weight: 500">
                                            * Alamat adalah seperti yang tertera di dalam bil air
                                        </span>
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-lg-4 col-form-label"></label>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control m-input" name="alamat_2" placeholder="Sila masukan alamat"  value="{{ $permohonan->alamat_2 }}">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-lg-4 col-form-label"></label>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control m-input" name="alamat_3" placeholder="Sila masukan alamat"  value="{{ $permohonan->alamat_3 }}">
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="row">
                                    <label class="col-lg-4 col-form-label" style="text-align:right">
                                        <span style="color: red">* </span>Poskod:
                                    </label>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control m-input" id="poskod" name="poskod" placeholder="Sila masukan poskod"  value="{{ $permohonan->poskod }}">
                                    </div>
                                </div>
                                <div class="row">
                                    <label class="col-lg-4 col-form-label" style="text-align:right">
                                        <span style="color: red">* </span>Negeri:
                                    </label>
                                    <div class="col-lg-8">
                                        <select class="form-control m-input" id="negeri" name="negeri" readonly>
                                            <option value="" hidden selected>Sila pilih negeri</option>
                                            <option value="Johor" @if($permohonan->negeri == "Johor") selected @endif>Johor</option>
                                            <option value="Kedah" @if($permohonan->negeri == "Kedah") selected @endif>Kedah</option>
                                            <option value="Kelantan" @if($permohonan->negeri == "Kelantan") selected @endif>Kelantan</option>
                                            <option value="Melaka" @if($permohonan->negeri == "Melaka") selected @endif>Melaka</option>
                                            <option value="Negeri Sembilan" @if($permohonan->negeri == "Negeri Sembilan") selected @endif>Negeri Sembilan</option>
                                            <option value="Pahang" @if($permohonan->negeri == "Pahang") selected @endif>Pahang</option>
                                            <option value="Penang" @if($permohonan->negeri == "Penang") selected @endif>Penang</option>
                                            <option value="Perak" @if($permohonan->negeri == "Perak") selected @endif>Perak</option>
                                            <option value="Perlis" @if($permohonan->negeri == "Perlis") selected @endif>Perlis</option>
                                            <option value="Selangor" @if($permohonan->negeri == "Selangor") selected @endif>Selangor</option>
                                            <option value="Terengganu" @if($permohonan->negeri == "Terengganu") selected @endif>Terengganu</option>
                                            <option value="Sabah" @if($permohonan->negeri == "Sabah") selected @endif>Sabah</option>
                                            <option value="Sarawak" @if($permohonan->negeri == "Sarawak") selected @endif>Sarawak</option>
                                            <option value="W.P. Kuala Lumpur" @if($permohonan->negeri == "W.P. Kuala Lumpur") selected @endif>W.P. Kuala Lumpur</option>
                                            <option value="W.P. Labuan" @if($permohonan->negeri == "W.P. Labuan") selected @endif>W.P. Labuan</option>
                                            <option value="W.P. Putrajaya" @if($permohonan->negeri == "W.P. Putrajaya") selected @endif>W.P. Putrajaya</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="m-form__seperator m-form__seperator--dashed maklumat_jmb"></div>
                    <div class="m-form__section m-form__section--last maklumat_jmb">
                        <div class="m-form__heading">
                            <h3 class="m-form__heading-title">
                                Maklumat Badan Pengurusan Bersama (JMB) / <br> Perbadanan Pengurusan (MC):
                            </h3>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Nama JMB/MC:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_nama" name="jmb_nama" placeholder="Sila masukan nama JMB/MC"  value="{{ isset($permohonan->nama_jmb) ? $permohonan->nama_jmb : '' }}" disabled>
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>E-mel JMB/MC:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_emel" name="jmb_emel" placeholder="Sila masukan e-mel JMB/MC"  value="{{ isset($permohonan->emel_jmb) ? $permohonan->emel_jmb : '' }}" disabled>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>No. Pendaftaran JMB/MC:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_no_pendaftaran" name="jmb_no_pendaftaran" placeholder="Sila masukan no. pendaftaran JMB/MC"  value="{{ isset($permohonan->no_pendaftaran_jmb) ? $permohonan->no_pendaftaran_jmb : '' }}" disabled>
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>No. Telefon JMB/MC:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_no_tel" name="jmb_no_tel" placeholder="Sila masukan no. tel JMB/MC"  value="{{ isset($permohonan->no_tel_jmb) ? $permohonan->no_tel_jmb : '' }}" disabled>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Nama Wakil JMB/MC:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_nama_wakil" name="jmb_nama_wakil" placeholder="Sila masukan nama wakil JMB/MC"  value="{{ isset($permohonan->nama_wakil_jmb) ? $permohonan->nama_wakil_jmb : '' }}" disabled>
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Jawatan Wakil JMB/MC:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_jawatan_wakil" name="jmb_jawatan_wakil" placeholder="Sila masukan jawatan wakil JMB/MC"  value="{{ isset($permohonan->jawatan_wakil_jmb) ? $permohonan->jawatan_wakil_jmb : '' }}" disabled>
                            </div>

                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>No. Akaun Pukal:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_no_akaun_pukal" name="jmb_no_akaun_pukal" placeholder="Sila masukan no. akaun pukal"  value="{{ isset($permohonan->no_akaun_pukal) ? $permohonan->no_akaun_pukal : '' }}" disabled>
                            </div>
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>No. Meter Pukal:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_no_meter_pukal" name="jmb_no_meter_pukal" placeholder="Sila masukan no. meter pukal"  value="{{ isset($permohonan->no_meter_pukal) ? $permohonan->no_meter_pukal : '' }}" disabled>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-2 col-form-label">
                                <span style="color: red">* </span>Tarikh Pengesahan:
                            </label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control m-input" id="jmb_tarikh_pengesahan" name="jmb_tarikh_pengesahan" placeholder="Sila pilih tarikh pengesahan"  value="{{ isset($permohonan->tarikh_pengesahan) ? $permohonan->tarikh_pengesahan : '' }}" readonly disabled>
                            </div>
                        </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="submitForm()">
                                    Hantar
                                </button>
                                <button type="reset" class="btn btn-secondary"  onclick="window.location='{{ url('admin/permohonan/sade') }}'">
                                    Kembali
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@section('js')
<script>
    var pasangan = {!! json_encode($pasangans->toArray()) !!}
    $(document).ready(() => {
        $(".nama").inputmask("Regex");
        $('.maklumat_pasangan, .maklumat_jmb, .email_error, .exist_no_akaun_air, .digit_no_akaun_air, .exist_ic, .exist_email, .exist_tel_bimbit').hide();
        getIc($('#ic_type option:selected').val());
        getStatus($('#status_perkahwinan option:selected').val());
        getJmb($('input[name="jenis_meter_air"]:checked').val());

        if ($('input[name="no_akaun_air"]').val() != '') {
            $no_akaun_air = '{{(empty($permohonan->no_akaun_air)?"a":$permohonan->no_akaun_air)}}';
            checkDuplicate($no_akaun_air, 'no_akaun_air', $no_akaun_air);
        }
        if ($('input[name="email"]').val() != '') {
            emailFormat('{{ $permohonan->email }}');
        }
        if ($('input[name="tel_bimbit"]').val() != '') {
            $tel_bimbit = '{{(empty($permohonan->tel_bimbit)?"a":$permohonan->tel_bimbit)}}';
            checkDuplicate($tel_bimbit, 'tel_bimbit', $tel_bimbit);
        }

        $("#poskod").inputmask({
            mask: "99999",
            placeholder: ""
        });
        /*$("#no_akaun_air").inputmask({
            mask: "9999999999",
            placeholder: ""
        });*/

        $("#permohonan_form").validate({
        rules: {
          no_akaun_air:
          {
            required: true,
            minlength:10,
            maxlength:10,
          },
        },
        messages: {
            no_akaun_air: {
            required: "Sila Masukkan No. Akaun Air",
            minlength: "Aksara tidak boleh kurang dari 10 angka",
            }
        },
      });
        $("#jmb_no_akaun_pukal").inputmask({
            mask: "999999999999999",
            placeholder: ""
        });
        $("#tel_bimbit, #jmb_no_tel").inputmask({
            mask: "9999999999999",
            placeholder: ""
        });
        $("#jmb_tarikh_pengesahan").datepicker({
            todayHighlight: !0,
            orientation: "bottom left",
            format: 'yyyy-mm-dd',
            templates: {
                leftArrow: '<i class="la la-angle-left"></i>',
                rightArrow: '<i class="la la-angle-right"></i>'
            },
        });

        total();
    });
    function getIc(x) {
        if(x == 1) {
            $("#ic").inputmask({ mask: "999999999999", placeholder: "" });
        } else {
            $("#ic").inputmask("Regex");
        }
    }

    function emailFormat(current_email) {
        $('.loading_email').hide();
        $('.success_email').hide();
        $('.format_email').hide();
        $('.exist_email').hide();

        if ($('input[name="email"]').val() != '') {
            var format_email = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

            if($('input[name="email"]').val().match(format_email)) {
                $('.format_email').hide();
                checkDuplicate($('input[name="email"]').val(), 'email', current_email);
            } else if($('input[name="email"]').val() == '') {
                $('.format_email').hide();
            } else {
                $('.format_email').show();
                $('input[name="email"]').focus();
            }
        }
    }

    function checkEmail(x) {
        var format_email = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

        x.next().remove();

        if(x.val().match(format_email)) {
            x.next().remove();
        } else if(x.val() == '') {
            x.next().remove();
        } else {
            x.after("<small style='color: #f4516c'>Sila masukkan format emel yang betul.</small>");
            x.focus();
        }
    }

    function checkDuplicate(x,y,current_data) {
        if(x) {
            // if email type wakil then no duplicate check
            if (y == 'email' && $('select[name="email_type"] option:selected').val() == 'Wakil') {
                $('.loading_'+y).hide();
                $('.exist_'+y).hide();
                $('.length_'+y).hide();
                $('.success_'+y).show();
                return;
            } else {
                var data = {
                    _token: '{{ csrf_token() }}',
                    field: y,
                    value: x,
                    current_data: current_data
                }
                $('.loading_'+y).show();
                $('.exist_'+y).hide();
                $('.length_'+y).hide();
                $('.success_'+y).hide();

                $.ajax({
                    url: '{{ url('admin/permohonan/sade/check') }}',
                    type: 'POST',
                    data: data,
                    success: function(response) {
                        if(response.status == 'error') {
                            $('.exist_'+y).show();
                            // $('input[name="'+y+'"]').focus();
                        } else if(response.status == 'length') {
                            $('.length_'+y).show();
                            // $('input[name="'+y+'"]').focus();
                        } else {
                            $('.success_'+y).show();
                        }
                        $('.loading_'+y).hide();
                    },
                    error: function(response) {
                        $.alert({
                            type: 'red',
                            title: 'Whoops, server error!',
                            content: 'Please try again or contact system admin.',
                            typeAnimated: true,
                            icon: 'fa fa-warning',
                            columnClass: 'col-md-6 col-md-offset-3',
                        });
                    }
                });
            }
        } else {
            $('.loading_'+y).hide();
            $('.exist_'+y).hide();
            $('.digit_'+y).hide();
            $('.success_'+y).hide();
        }
    }
    function getStatus(x) {
        if(x == ''){
            $('.maklumat_pasangan').hide('slow');
            $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', true);
        }
        else if(x == 'Berkahwin') {
            $('.maklumat_pasangan').show('slow');
            $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', false);
        } else if(x == 'Duda/Janda') {
            if(pasangan.length > 0) {
                $.alert({
                    type: 'red',
                    title: 'Gagal!',
                    content: 'Maklumat pasangan telah wujud dalam rekod. Sila padam maklumat pasangan terlebih dahulu.',
                    typeAnimated: true,
                    icon: 'fa fa-warning',
                });
                $('#status_perkahwinan').val('Berkahwin');
            } else {
                $('.maklumat_pasangan').hide('slow');
                $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', true);
            }
        } else {
            if(pasangan.length > 0) {
                $.alert({
                    type: 'red',
                    title: 'Gagal!',
                    content: 'Maklumat pasangan telah wujud dalam rekod. Sila padam maklumat pasangan terlebih dahulu.',
                    typeAnimated: true,
                    icon: 'fa fa-warning',
                });
                $('#status_perkahwinan').val('Berkahwin');
            } else {
                $('.maklumat_pasangan').hide('slow');
                $('#pasangan_ic, #pasangan_nama, #pasangan_emel, #pasangan_no_tel, #pasangan_pendapatan').attr('disabled', true);
            }
        }
    }
    function getJmb(x) {
        if(String(x).toUpperCase() == 'INDIVIDU') {
            $('.no_akaun_air').show('slow');
            $('#no_akaun_air').attr('disabled', false);
            $('.maklumat_jmb').hide('slow');
            $('#jmb_nama, #jmb_emel, #jmb_no_pendaftaran, #jmb_no_tel, #jmb_nama_wakil, #jmb_jawatan_wakil, #jmb_no_akaun_pukal, #jmb_no_meter_pukal, #jmb_tarikh_pengesahan').attr('disabled', true);
        } else {
            $('.no_akaun_air').hide('slow');
            $('#no_akaun_air').attr('disabled', true);
            $('.maklumat_jmb').show('slow');
            $('#jmb_nama, #jmb_emel, #jmb_no_pendaftaran, #jmb_no_tel, #jmb_nama_wakil, #jmb_jawatan_wakil, #jmb_no_akaun_pukal, #jmb_no_meter_pukal, #jmb_tarikh_pengesahan').attr('disabled', false);
        }
    }
    function total() {
        var pemohon = $('input[name="pendapatan"]').val() == '' ? 0 : $('input[name="pendapatan"]').val();
        var pasangan = 0;
        var total = 0;
        $('.pasangan_pendapatan').each(function(){
            pasangan += +$(this).val();
        });
        total = parseFloat(pemohon) + parseFloat(pasangan);

        $('input[name="pendapatan_pemohon"]').val(parseFloat(pemohon).toFixed(2));
        $('input[name="pendapatan_pasangan"]').val(parseFloat(pasangan).toFixed(2));
        $('input[name="pendapatan_isi_rumah"]').val(total.toFixed(2));
    }
    
    function submitForm() {
        function error() {
            $.confirm({
                title: 'Maklumat tidak lengkap?',
                content: 'Sila semak permohonan anda dahulu.',
                icon: 'fa fa-warning',
                type: 'red',
                buttons: { ok: { btnClass: 'btn-red' } }
            });
        }

        if($('input[name="jenis_meter_air"]:checked').val() == 'Individu') {
            if($('#no_akaun_air').val() == ''
                || $('input[name="nama"]').val() == ''
                || $('input[name="ic"]').val() == ''
                || ($('input[name="email"]').val() == '' && $('input[name="tel_bimbit"]').val() == '')
                || $('select[name="status_perkahwinan"] option:selected').val() == ''
                || $('input[name="pendapatan"]').val() == ''
                || $('input[name="alamat_1"]').val() == ''
                || $('input[name="poskod"]').val() == ''
                || $('select[name="negeri"] option:selected').val() == '') {

                error();
                return;
            }
        } else {
            if($('input[name="nama"]').val() == ''
                || $('input[name="ic"]').val() == ''
                || ($('input[name="email"]').val() == '' && $('input[name="tel_bimbit"]').val() == '' )
                || $('select[name="status_perkahwinan"] option:selected').val() == ''
                || $('input[name="pendapatan"]').val() == ''
                || $('input[name="alamat_1"]').val() == ''
                || $('input[name="poskod"]').val() == ''
                || $('select[name="negeri"] option:selected').val() == ''
                || $('#jmb_nama').val() == ''
                || $('#jmb_emel').val() == ''
                || $('#jmb_no_pendaftaran').val() == ''
                || $('#jmb_no_tel').val() == ''
                || $('#jmb_nama_wakil').val() == ''
                || $('#jmb_jawatan_wakil').val() == ''
                || $('#jmb_no_akaun_pukal').val() == ''
                || $('#jmb_no_meter_pukal').val() == ''
                || $('#jmb_tarikh_pengesahan').val() == '') {

                error();
                return;
            }
        }

        // Semak Maklumat Pasangan
        if ($('.maklumat_pasangan').is(":visible")) {
            var isError = false;
            $('input[name="pasangan_ic[]"]').each(function(i,v){
                if ($(this).val() == '') {
                    isError = true;
                    $('.ic_pasangan_wajib').show();
                } else {
                    $('.ic_pasangan_wajib').hide();
                }
            });
            $('input[name="pasangan_nama[]"]').each(function(i,v){
                if ($(this).val() == '') {
                    isError = true;
                    $('.nama_pasangan_wajib').show();
                } else {
                    $('.nama_pasangan_wajib').hide();
                }
            });
            $('input[name="pasangan_pendapatan[]"]').each(function(i,v){
                if ($(this).val() == '') {
                    isError = true;
                    $('.pendapatan_pasangan_wajib').show();
                } else {
                    $('.pendapatan_pasangan_wajib').hide();
                }
            });
            if (isError) {
                error();
                return;
            }
        }

        // check duplicate
        if ($(".success_no_akaun_air").is(":hidden") || $(".success_ic").is(":hidden")) {
            $.confirm({
                title: 'Maklumat semakan belum selesai',
                content: 'Sila pastikan semakan telah OK dan cuba lagi.',
                icon: 'fa fa-warning',
                type: 'red',
            buttons: { ok: { btnClass: 'btn-red' } }
            });
            return;
        } else if ($('input[name="email"]').val() != '' && $(".success_email").is(":hidden")) {
            $.confirm({
                title: 'Maklumat semakan belum selesai',
                content: 'Sila pastikan semakan Email telah OK dan cuba lagi.',
                icon: 'fa fa-warning',
                type: 'red',
            buttons: { ok: { btnClass: 'btn-red' } }
            });
            return;
        }  else if ($('input[name="tel_bimbit"]').val() != '' && $(".success_tel_bimbit").is(":hidden")) {
            $.confirm({
                title: 'Maklumat semakan belum selesai',
                content: 'Sila pastikan semakan No Telefon Bimbit telah OK dan cuba lagi.',
                icon: 'fa fa-warning',
                type: 'red',
            buttons: { ok: { btnClass: 'btn-red' } }
            });
            return;
        } else {
            $.confirm({
                title: 'Kemaskini Permohonan?',
                content: 'Anda pasti untuk teruskan?',
                icon: 'fa fa-spinner fa-spin',
                type: 'green',
                buttons: {
                    kemaskini: {
                        btnClass: 'btn-green',
                        action: function() {
                            $('#permohonan_form').submit();
                        }
                    },
                    kembali: {
                        btnClass: 'btn-red',
                        action: function() {
                        }
                    }
                }
            });
        }
    }
</script>
@endsection