{{View::make('layout.header')}}

    <style>

      .profile-info-left {

          border-right: 2px dashed #ccc;

      }

      .personal-info {

          list-style: none;

          margin-bottom: 0;

          padding: 0;

      }

      .personal-info li {

          margin-bottom: 4px;

       

      }

      .personal-info li .title {

          color: #4f4f4f;

          float: left;

          font-weight: 500;

          margin-right: 30px;

          width: 30%;

      }

      .personal-info li .text {

          color: #8e8e8e;

          display: block;

          overflow: hidden;

      }

    </style>

    

    <!-- BEGIN: Content-->

    <div class="app-content content ">

        <div class="content-overlay"></div>

        <div class="header-navbar-shadow"></div>

        <div class="content-wrapper">

            <div class="content-header row">

                <div class="content-header-left col-md-9 col-12 mb-2">

                    <div class="row breadcrumbs-top">

                        <div class="col-12">

                            <h2 class="content-header-title float-left mb-0">E-Leave</h2>

                            <div class="breadcrumb-wrapper">

                                <ol class="breadcrumb">

                                    <li class="breadcrumb-item">Employee

                                    </li>

                                    <li class="breadcrumb-item active"><a href="#">Personal Information</a>

                                    </li>

                                </ol>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="content-header-right text-md-right col-md-3 col-12 d-md-block">

                    <div class="form-group breadcrumb-right">

                        <div class="dropdown">

                            <a onclick="getPermission()" class="btn-icon btn btn-primary btn-round btn-sm dropdown-toggle waves-effect waves-float waves-light" type="button" >

                            

                            <svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-edit-2"><circle cx="12" cy="12" r="3"></circle><path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z"></path></svg>

                            </a>

                            </div>

                    </div>

                </div>

            </div>

            <div class="content-body">

            <form id="personal-info">

            @csrf

              <section id="multiple-column-form">

              <div class="card">

              <div class="card-header ptitle" style="color:#fff;">

                        <h4 class="card-title" style="color:#fff;">Personal Informations</h4>

                       <!-- <a class="edit-icon" href="{{url('e-leave/update-personal-information?update=personal_info')}}" style="color:#fff;"><i class="fa fa-pencil"></i></a>-->

                      </div>

                <div class="card-body mt-2">

               

                 <div class="row">

                <div class="col-md-12">

                <div class="profile-view">

               

                <div class="profile-basic">

                <div class="row">

               

                <div class="col-md-12 mb-2">

                <img src="{{asset('storage/profile/'.$personal->profile_photo_file)}}" style="width:100px; height:100px; border-radius:50%;">

                </div>

                <div class="col-md-6">

                <ul class="profile-info-left personal-info">

                  <li>

                  <div class="title">Employee Code:</div>

                  <div class="text">{{ $personal->employee_code ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Employee Number:</div>

                  <div class="text">{{ $personal->employee_no ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Employee Name:</div>

                  <div class="text">{{ $personal->name ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Branch:</div>

                  <div class="text">

                  @foreach($branches as $branch)

                  @if($userPay->branch_id == $branch->id)

                    {{ $branch->name }}

                    @break

                  

                  @endif

                  @endforeach

                </div>

                  </li><br>

                  <li>

                  <div class="title">Department:</div>

                  <div class="text">

                  @foreach($departments as $department)

                  @if($userPay->department_id == $department->id)

                    {{ $department->name }}

                    @break

                  @endif

                  

                  @endforeach

                </div>

                  </li><br>

                  <li>

                  <div class="title">Employee Type:</div>

                  <div class="text">

                  @foreach($employeeTypes as $type)

                  @if($personal->employee_type == $type->id)

                    {{ $type->employee_type }}

                    @break

                  @endif

                  

                  @endforeach

                    

                  </div>

                  </li><br>

                  <li>

                  <div class="title">Address:</div>

                  <div class="text">{{ $personal->address ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Postcode:</div>

                  <div class="text">{{ $personal->postal_code ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Town:</div>

                  <div class="text">{{ $personal->town ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Nationality:</div>

                  <div class="text">{{ $personal->nationality ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">State:</div>

                  <div class="text">{{ $personal->state ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Phone No.:</div>

                  <div class="text"><a href="">{{ $personal->phone_no ?? '' }}</a></div>

                  </li><br>

                  <li>

                  <div class="title">Date of Birth:</div>

                  <div class="text"></div>

                  </li><br>



                  <li>

                  <div class="title">Highest Education:</div>

                  <div class="text">{{ $personal->highest_education ?? '' }}</div>

                  </li><br>

                  </ul>

                </div>

                <div class="col-md-6">

                  <ul class="personal-info">

                 

                  <li>

                  <div class="title">Working Experience:</div>

                  <div class="text">{{ $personal->working_experience ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">I/C No. (Old):</div>

                  <div class="text">{{ $personal->ic_no_old ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">I/C No. (New):</div>

                  <div class="text">{{ $personal->ic_no_new ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Designation:</div>

                  <div class="text">

                  @foreach($designations as $designation)

                  @if($personal->designation == $designation->designation)

                    {{ $designation->designation }}

                  @break

                  @endif

                  

                  @endforeach

                  </div>

                  </li><br>

                  <li>

                  <div class="title">I/C Color:</div>

                  <div class="text">{{ $personal->ic_color ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Passport No:</div>

                  <div class="text">{{ $personal->passport_no ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Gender:</div>

                  <div class="text">

                    @if($personal->sex == 1)

                    Male

                    @endif

                    @if($personal->sex == 0)

                    Female

                    @endif

                  </div>

                  </li><br>

                  <li>

                  <div class="title">Race:</div>

                  <div class="text">

                  {{ $personal->race }}

                  </div>

                  </li><br>

                  <li>

                  <div class="title">Bumiputra:</div>

                  <div class="text">

                  @if($personal->bumiputra == 1)

                    Yes

                    @endif

                    @if($personal->bumiputra == 0)

                    No

                    @endif

                  </div>

                  </li><br>

                  <li>

                  <div class="title">Marital Status:</div>

                  <div class="text">

                  @if($personal->marital_status == '0')

                    Single

                     @endif

                  @if($personal->marital_status == '1')

                    Married

                     @endif

                  @if($personal->marital_status == 'Single')

                    Single 

                     @endif

                  @if($personal->marital_status == 'Married')

                    Married

                     @endif

                    @if($personal->marital_status == 'Other')

                    Married

                     @endif

                    @if($personal->marital_status == '2')

                    Other

                    @endif

                  </div>

                  </li><br>

                  <li>

                  <div class="title">EmailID:</div>

                  <div class="text">{{ $personal->email_id ?? '' }}</div>

                  </li><br>

                  <li>

                  <div class="title">Blood Group:</div>

                  <div class="text">{{ $personal->blood_group ?? '' }}</div>

                  </li>

                  </ul>

                </div>

                </div>

                </div>

                </div>

                </div>

                </div>

                </div>

                </div>

           

              </section>

              <section id="multiple-column-form">

                <div class="row">

                  <div class="col-12 col-md-6">

                    <div class="card" style="height:100%;">

                      <div class="card-header ptitle" style="color:#fff;">

                        <h4 class="card-title" style="color:#fff;">Spouse Particular</h4>

                        <!--<a class="edit-icon" href="{{url('e-leave/update-personal-information?update=spouse_particular')}}" style="color:#fff;"><i class="fa fa-pencil"></i></a>-->

                      

                      </div>

                      <br>

                      <div class="card-body">

                          <div class="row">

                            <div class="col-md-12">

                              <ul class="personal-info">

                                  <li>

                                    <div class="title">Spouse Name:</div>

                                    <div class="text">{{ $spouse->spouse_name ?? '' }}</div>

                                  </li><br>

                                  <li>

                                    <div class="title">Sp. I/C No:</div>

                                    <div class="text">{{ $spouse->spouse_ic_no ?? '' }}</div>

                                  </li><br>

                                  <li>

                                    <div class="title">No. of children:</div>

                                    <div class="text">{{ $spouse->no_children ?? '' }}</div>

                                  </li><br>

                                  <li>

                                    <div class="title">Spouse Working:</div>

                                    <div class="text">

                                    @if($spouse->spouse_working == 1)

                                      Yes

                                    @endif

                                    @if($spouse->spouse_working == 0)

                                      No

                                    @endif

                                    </div>

                                  </li>

                              </ul>

                            </div>

                       

                            

                          </div>

                      </div>

                    </div>

                  </div>

                  <div class="col-12 col-md-6">

                    <div class="card" style="height:100%;">

                      <div class="card-header ptitle" style="color:#fff;">

                        <h4 class="card-title" style="color:#fff;">Permanent Address/Contact</h4>

                        <!--<a class="edit-icon" href="{{url('e-leave/update-personal-information?update=address_contact')}}" style="color:#fff;"><i class="fa fa-pencil"></i></a>-->

                      

                      </div>

                      <br>

                      <div class="card-body">

                          <div class="row">

                          <div class="col-md-12">

                              <ul class="personal-info">

                                  <li>

                                    <div class="title">Name:</div>

                                    <div class="text">{{ $address->name ?? '' }}</div>

                                  </li><br>

                                  <li>

                                    <div class="title">Phone No.:</div>

                                    <div class="text">{{ $address->phone_no ?? '' }}</div>

                                  </li><br>

                                  <li>

                                    <div class="title">Address:</div>

                                    <div class="text">{{ $address->address ?? '' }}</div>

                                  </li><br>

                                  <li>

                                    <div class="title"><br></div>

                                    <div class="text">

                                   

                                    </div>

                                  </li>

                              </ul>

                            </div>

                           

                          </div>

                      </div>

                    </div>

                  </div>

                </div>

              </section> 

            </form>  

          

           <!-- <center> <button type="button" onclick="saveInfo()" class="btn btn-primary">Save Profile</button> </center>     -->                              



            </div>

        </div>

    </div>

    <script type="text/javascript">

    

        function getPermission(){

           

            $.ajax({

                type:'get',

                url:'{{ route('getPermissionGroupOfEmployee')}}',

                success:function(data) {

                    window.location.href = "{{ url('e-leave/update-personal-information?update=personal_info')}}";

                   

                }

            });

        }



        function changePassword(e){

            var passwordForm = $("#password-section");

            var data = passwordForm.serialize();

            $( '#old-error' ).html('');

            $( '#new-error' ).html('');

            $( '#con-date-error' ).html('');

            $.ajax({

                url:'{{route('change-password')}}',

                type:'POST',

                data:data,

                success:function(e){

                    window.location.reload();

                },

                error:function(w){

                    if(w.responseJSON.errors)

                    {

                        if(w.responseJSON.errors.current_password){

                            $( '#old-error' ).html( w.responseJSON.errors.current_password[0] );

                        }

                        if(w.responseJSON.errors.new_password){

                            $( '#new-error' ).html( w.responseJSON.errors.new_password[0] );

                        }

                        if(w.responseJSON.errors.confirm_password){

                            $( '#con-error' ).html( w.responseJSON.errors.confirm_password[0] );

                        }



                    }

                }

            });

        };



        function upload()

        {

            let formData = new FormData();

            var d = $('#profile-picture')[0].files[0];

            formData.append('_token', '{{ csrf_token() }}');

            formData.append('file', d);

            $.ajax({

                url:'{{route("upload-profile")}}',

                type:'POST',

                data:formData,

                processData: false,

                contentType: false,

                success:function(e){

                    window.location.reload();



                },

                error:function(w){



                }

            });

        }

        function saveInfo(e){

            var personalForm = $("#personal-info");

            var data = personalForm.serialize();

            

            $.ajax({

                url:'{{route('update-personal-info')}}',

                type:'POST',

                data:data,

                success:function(e){

                  window.location.reload();

                },

                error:function(w){

                    if(w.responseJSON.errors)

                    {



                    }

                }

            });

        };



    </script>

    <!-- END: Content-->

    {{View::make('layout.footer')}}