@extends('layouts.frontend')
@section('title', 'Personal Details')
@section('content')
<div class="clearfix"></div>
<section class="inner-content">
  <div class="clearfix"></div>
  <div class="container">
    <div class="form-block col-md-9 padding-left-none">
      <h2 class="product-title">Application</h2>
      @include('flash::message')
      @if(Session::get('success'))
        <div class="alert alert-success">
          {{Session::get('success')}}
        </div>
      @endif
        @if(Session::get('failure'))
          <div class="alert alert-danger">
            {{Session::get('failure')}}
          </div>
      @endif
      <form name="insuranceForm" class="form-horizontal"  id="insuranceForm" action="{{ url('webline-products/post-personal-details/'.$status) }}" method="post">
       {{ csrf_field() }}
        <div class="bg">

          <div class="steps-tabs">
            <ul >
              <li class="active">Personal Details <i class="fa fa-chevron-right" aria-hidden="true"></i></li>
              <li >Cover <i class="fa fa-chevron-right" aria-hidden="true"></i></li>
              <li >Bank Details <i class="fa fa-chevron-right" aria-hidden="true"></i></li>
              <li >Confirmation <i class="fa fa-chevron-right" aria-hidden="true"></i></li>
            </ul>
          </div>

          <!--personal fields added-->

          <div class="form-group">
            <!-- <label class="control-label col-sm-4">Home Post Code</label>
            <div class="col-sm-4 padding-right-none">
              <input name="postcode" class="form-control required " id="postcode" title="Please enter postcode" value="" maxLength="8" />
              <label for="postcode" generated="true" class="error"style="display:none"></label>
              <div class="clearfix"></div>
              <div class="small-btn2 margin-top-5">
                <a href="javascript:void(0)" id="btnPO">Find Address</a>
                <div class="ajxLoader"></div>
              </div>
            </div> -->
            <label class="control-label col-sm-4"><span class="asterisk">* </span>Home Post Code</label>
            <div class="col-sm-4 padding-right-none">
              <input name="postcode" class="form-control required " id="postcode" title="Please enter postcode" value="{{ old('postcode',  isset($personal_data->postcode) ? $personal_data->postcode : null) }}" maxLength="8" />
              <label for="postcode" generated="true" class="error"style="display:none"></label>
              <div class="clearfix"></div>
              <div class="small-btn2 margin-top-5"><a href="javascript:void(0)" id="btnPO">Find Address</a> <div class="ajxLoader"></div></div>
            </div>
          </div>

          <div class="form-group" id="POAddress" style="display:none;">
            <label class="control-label col-sm-4">Highlight the address that matches your selection and click &quot;Select&quot;</label>

            <div class="col-sm-4 padding-right-none">
              <div class="address-results"></div>
              <div class="small-btn2 margin-top-5"><a href="javascript:void(0)" id="btnPOFetch">Select</a>
              </div>
            </div>
          </div>
          @if($personal_data->postcode != '')
          <div class="form-group"  id="tblFullAddress" style="display:block; ">
          @else
          <div class="form-group"  id="tblFullAddress" style="display:none; ">
          @endif

            <label class="control-label col-sm-4">Address Information</label>
            <div class="col-sm-4 padding-right-none">
              <p id="CompleteAddress">
                @if($complete_address != '')
                    {!!$complete_address!!}
                @endif
              </p>
            </div>

            <input type="hidden" name="formattedPO" class="" id="fullPO" value="{{$personal_data->formattedPO}}" title="Address Information Required: Please Select Your Address"/>
            <input type="hidden" name="premise" class="" id="popremise" value="{{ $personal_data->premiseName }}" />
            <input type="hidden" name="line1" class="" id="poline1" value="{{ $personal_data->address1 }}" />
            <input type="hidden" name="line2" class="" id="poline2" value="{{ $personal_data->address2 }}" />
            <input type="hidden" name="line3" class="" id="poline3" value="{{ $personal_data->address3 }}" />
            <input type="hidden" name="line4" class="" id="poline4" value="{{ $personal_data->address4 }}" />
            <input type="hidden" name="town" class="" id="potown" value="{{ $personal_data->postaltown }}" />
            <input type="hidden" name="county" class="" id="pocounty" value="{{ $personal_data->county }}" />
          </div>

          <div class="form-group">
            <label class="control-label col-sm-4"><span class="asterisk">* </span>Email</label>
            <div class="col-sm-4 padding-right-none">
              <input name="email" type="text" class="form-control required" id="email" title="Please enter email" value="{{ old('email',  isset($personal_data->email) ? $personal_data->email : '') }}" maxLength=100 />
              <label for="email" generated="true" class="error"></label>
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4"><span class="asterisk">* </span>Contact Number</label>
            <div class="col-sm-4 padding-right-none">
              <input name="telephone" class="form-control required" id="telephone" title="Please enter phone" value="{{ old('telephone',  isset($personal_data->telephone) ? $personal_data->telephone : '') }}"/>
              <label for="telephone" generated="true" class="error" style="display:none;width:190px;"></label>

            </div>
          </div>

          <div class="form-group">
            <label class="control-label col-sm-4"><span class="asterisk">* </span>Employment Status</label>
            <div class="col-sm-8">
              <div class="radio">
                <div class="radio-inline padding-left-none">
                  <input name="emp_status" type="radio" id="emp1"  onclick="showEmployer()" value="Employed" checked="checked" />
                  <label for="emp1">Employed</label>
                </div>
                <div class="radio-inline">
                  <input type="radio" name="emp_status" id="emp2" value="Self-Employed"  onclick="showEmployer()" {{ ($personal_data->emp_status == 'Self-Employed' ? "checked":"") }} />
                  <label for="emp2">Self Employed</label>
                </div>
                <div class="radio-inline">
                  <input type="radio" name="emp_status" id="emp3" value="Contract Worker"  onclick="showEmployer()" {{ ($personal_data->emp_status == 'Contract Worker' ? "checked":"") }} />
                  <label for="emp3">Contractor</label>
                </div>
              </div>
            </div>
          </div>

          <div class="form-group" id="showEmployer">
            <label class="control-label col-sm-4"><span class="asterisk">* </span>Name of your employer</label>
            <div class="col-sm-4 padding-right-none">
              <input name="employer_name" class="form-control required" id="employer_name" title="Please Enter Employer" value="{{ old('employer_name',  isset($personal_data->employer_name) ? $personal_data->employer_name : '') }}" maxLength="50"/>
              <label for="employer_name" generated="true" class="error" style="display:none;"></label>
            </div>
          </div>

          <div class="clearfix"></div>


              @if ($product_details->id != $simple_income && $product_details->id != $instaprotect)
                <div class="form-group">
                  <label class="control-label col-sm-4"><span class="asterisk">* </span> <i class="fa fa-question-circle" aria-hidden="true"> </i> Are you transferring cover from another provider? </label>

                  <div class="col-sm-4 padding-right-none">
                    <div class="radio">
                      <div class="radio-inline padding-left-none">
                        <input name="transfer" id="transfer1" type='radio' value='Yes' onclick="javascript:currentprovider()" {{ ($personal_data->transfer == 'Yes' ? "checked":"") }} />
                        <label for="transfer1">Yes</label>
                      </div>
                      <div class="radio-inline">
                        <input type='radio' value='No' name="transfer"  id="transfer2" onclick="javascript:currentprovider()" {{ ($personal_data->transfer == 'No' || $personal_data->transfer == '' ? "checked":"") }} />
                        <label for="transfer2">No</label>
                      </div>
                    </div>
                  </div>
                </div>

                <div id="transfercover" class="form-group">
                    <label class="control-label col-sm-4"><span class="asterisk">* </span>Name of the current provider</label>
                    <div class="col-sm-4 padding-right-none">
                      <input name="current_provider" class="form-control required" id="current_provider"  title="Please Enter Current Provider"  value="{{ $personal_data->current_provider }}" maxlength="35">
                    </div>
                    <div class="clearfix"></div>
                    <br>
                    <label class="control-label col-sm-4"><span class="asterisk">* </span>Date on which the current policy was incepted </label>
                    <div class="col-sm-4 padding-right-none">
                      <input name="current_policy_date" class="form-control required" id="current_policy_date" value="{{ $personal_data->current_policy_date }}"   title="Please Enter Policy Date">
                    </div>

                </div>

              @endif


          <div class="form-group" >
            <div class="col-sm-12">
              <p>Policy Documents:</p>
              <ul class="links">

              @if(isset($documents) && !empty($documents))

                @foreach($documents as $webdoc)

                <li><a target="_blank" href="{{ $webdoc['AbsoluteURL']}}" >{{ $webdoc['Description']}}</a> <i class="fa fa-file-pdf-o" style="color:red" aria-hidden="true"></i></li>


                @endforeach
              @else
                <span>No documents found.</span>
              @endif

              </ul>
              <p></p>
            </div>
          </div>
          <!-- Declaration -->
          @if(isset($declaration_content) && !empty($declaration_content))
           <!--  <div class="form-group" id="declaration">
              <label class="control-label col-sm-12 text-left"><strong>Declaration</strong></label>
              <div class="col-sm-12">
                {!!$declaration_content!!}
              </div>
            </div> -->

            <div class="form-group" id="declaration">

            <label class="control-label col-sm-12 text-left"><strong>Declaration</strong></label>
            <div class="col-sm-12">
              <div style="height:300px;overflow:auto;border:5px solid #ccc;-moz-border-radius:5px;padding-left:10px;">
                {!!$declaration_content!!}
              </div><br />



            </div>

          </div>
          @endif
          <!-- // Declaration -->
          <input type="hidden" id="declaration_confirm_calidation" name="declaration_confirm_calidation" value="{{$declaration_confirm}}" >
          <!-- Declaration chackbox for weblline products -->
          @if(!empty($declaration_checkbox) && $declaration_checkbox != '')
          <div class="form-group">
            <div class="col-sm-12">
             {!! $declaration_checkbox !!}

            </div>
          </div>
          @else
          <input type="checkbox" name="declaration_confirm" id="declaration_confirm"  class="required"    {{ ($personal_data->declaration_confirm == 'on' ? "checked":"") }} /> I declare to the best of my knowledge and belief, that the statements made, are true and complete and recorded accurately in this application. I understand that if I do not give all requested information truthfully and accurately and this information affects your decision to insure me, it will mean that you will end my policy immediately or you will not pay me any benefit. I confirm that I have reviewed the declaration statements, Policy Wording and Key Facts Policy Summaries. For your own benefit and protection you should read these documents carefully. If you don't understand any point, please contact us for further information. The documents above contain important information relating to the policy that you are about to purchase and on which we will rely in the event of a claim.

           <div class="clearfix"></div>
          <label for="declaration_confirm" generated="true" class="error"style="display:none;"></label>
              <div class="clearfix"></div>
          @endif
          <!-- End Decaration checkbox -->

          <!-- <div class="form-group">
            <label class="control-label col-sm-12 text-left">
              <strong> <i class="fa fa-unlock-alt" aria-hidden="true"></i>Keeping you informed</strong>
            </label>
            <div class="col-sm-12">
              <p>We would like to keep you informed about products, services and additional benefits that we believe may be of interest to you. If you want us to do this, please tick this box.
                <input type=checkbox value='Y' name="marketingOptOut" id="marketingOptOut" {{ ($personal_data->marketingOptOut == 'Y' ? "checked":"") }} />
              </p>
              <label for="marketingOptOut" generated="true" class="error"style="display:none;"></label>
            </div>
          </div> -->

        </div><!-- class bg end-->

        <input type="hidden" name="product_id" id="product_id" value="{{ $product_details->id}}">
        <input type="hidden" name="quot_id" id="quot_id" value="{{ $quote_details['id']}}">

        <div class="form-btns">
            <button type="submit" class="medium-btn btn-default" >Continue</button>
        </div>
      </form>
    </div>


    <input type="hidden"  id="instaprotect" value="{{ $instaprotect}}">
    <input type="hidden"  id="best_mortgage" value="{{ $best_mortgage}}">
    <input type="hidden"  id="best_loan" value="{{ $best_loan}}">

    <input type="hidden" id="current_year" value="{{ $current_year }}">
    <input type="hidden" id="current_month" value="{{ $current_month }}">
    <input type="hidden" id="current_date" value="{{ $current_date }}">


    <div class="col-md-3 padding-none right-col border-left-none">
      @include('slices.frontend.get-a-quot.web-api-pages.right_top')
      @include('slices.frontend.get-a-quot.web-api-pages.right_bottom')

    </div>

  </div>
</section>

<div class="clearfix"></div>
@endsection
@section('page-script')
<script type="text/javascript" src="https://code.jquery.com/jquery-2.0.0.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script src="{{ URL::asset('assets/js/personal_details_add.js') }}"></script>
<!-- for date picker -->
<script src="{{ URL::asset('assets/plugins/datepicker/bootstrap-datepicker.js') }}"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<script type="text/javascript">


</script>
<style type="text/css">
  .asterisk{
    color: red;
  }

/*<!-- date picker Ui issue -->*/

  .ui-datepicker {
    width: 18.5em !important;
  }
</style>
@stop