@extends('app-new')

@push('head-script')
    <!-- BEGIN: Vendor CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/forms/wizard/bs-stepper.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/pickers/flatpickr/flatpickr.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/pickers/pickadate/pickadate.css">
    <!-- END: Vendor CSS-->

    <!-- BEGIN: Page CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/form-validation.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/core/menu/menu-types/vertical-menu.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/form-wizard.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-pickadate.css">
    <!-- END: Page CSS-->
@endpush

@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">{{trans('master/master.visitor_master')}}</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/{!! $alias !!}/home">{{trans('common/common.home')}}</a>
                    </li>
                    <li class="breadcrumb-item"><a href="/member/{!! $alias !!}/visitor">{{trans('master/master.visitor')}}</a>
                    </li>
                    <li class="breadcrumb-item active">
                    @if(isset($employee) && ($employee->id))
                    {{trans('master/master.edit_visitor')}}
                    @else
                    {{trans('master/master.add_new_visitor')}}
                    @endif
                    </li>
                </ol>
            </div>
        </div>
    </div>
@endpush

@section('content') 
    <!-- Vertical Wizard -->
    {!! Form::model($employee, ['method' => 'post', 'files' => 'true']) !!}
        <input type="hidden" name="organization_id" value="{{$organization->id}}">

        <section class="vertical-wizard">
            <div class="bs-stepper vertical vertical-wizard-example">
                <div class="bs-stepper-header">
                    <div class="step" data-target="#personal-info-vertical" role="tab" id="personal-info-vertical-trigger">
                        <button type="button" class="step-trigger">
                            <span class="bs-stepper-box">1</span>
                            <span class="bs-stepper-label">
                                <span class="bs-stepper-title">{{trans('master/master.visitor_info')}}</span>
                                <span class="bs-stepper-subtitle">{{trans('master/master.add_visitor_info')}}</span>
                            </span>
                        </button>
                    </div>
                    <div class="step" data-target="#account-details-vertical" role="tab" id="account-details-vertical-trigger">
                        <button type="button" class="step-trigger">
                            <span class="bs-stepper-box">2</span>
                            <span class="bs-stepper-label">
                                <span class="bs-stepper-title">{{trans('master/master.contact_info')}}</span>
                                <span class="bs-stepper-subtitle">{{trans('master/master.add_contact_info')}}</span>
                            </span>
                        </button>
                    </div>
                   
                    <div class="step" data-target="#images-vertical" role="tab" id="images-vertical-trigger">
                        <button type="button" class="step-trigger">
                            <span class="bs-stepper-box">3</span>
                            <span class="bs-stepper-label">
                                <span class="bs-stepper-title">{{trans('master/master.attachment_info')}}</span>
                                <span class="bs-stepper-subtitle">{{trans('master/master.add_attachment_info')}}</span>
                            </span>
                        </button>
                    </div>
                </div>
                <div class="bs-stepper-content">
                    <div id="personal-info-vertical" class="content position-relative" role="tabpanel" aria-labelledby="account-details-vertical-trigger">
                        <div class="content-header">
                            <h5 class="mb-0">{{trans('master/master.visitor_info')}}</h5>
                            <small class="text-muted">{{trans('master/master.enter_visitor_info')}}.</small>
                        </div>
                       
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="name">{{trans('master/master.name_of_visitor')}} <span class="mendatory-field text-danger">*</span></label>
                                <input type="text" id="name" name="name" class="form-control {{{$errors->has('name') ? 'error' : ''}}}" placeholder="Enter Your Name" value="{{ isset($employee) && $employee->name ? $employee->name : old('name') }}"/>
                                {!! $errors->first('name','<label id="basic-default-name-error" for="name" class="error">:message</label>')!!}
                              </div>
                              <div class="mb-1 col-md-6">
                                <label class="form-label" for="father_name">{{trans('master/master.fathers_husband_name')}} <span class="mendatory-field text-danger">*</span></label>
                                <input type="text" id="father_name" name="father_name" class="form-control {{{$errors->has('father_name') ? 'error' : ''}}}" placeholder="Enter Your Father's / Husband’s Name" value="{{ isset($employee) && $employee->father_name ? $employee->father_name : old('father_name') }}"/>
                                {!! $errors->first('father_name','<label id="basic-default-father_name-error" for="father_name" class="error">:message</label>')!!}
                              </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="mobile">{{trans('master/master.mobile')}} <span class="mendatory-field text-danger">*</span></label>
                                <input type="number" onkeydown="javascript: return event.keyCode == 69 ? false : true" onKeyPress="if(this.value.length==15) return false;" id="mobile" name="mobile" class="form-control {{{$errors->has('mobile') ? 'error' : ''}}}" placeholder="Enter Your mobile" value="{{ isset($employee) && $employee->mobile ? $employee->mobile : old('mobile') }}"/>
                                {!! $errors->first('mobile','<label id="basic-default-mobile-error" for="mobile" class="error">:message</label>')!!}
                            </div>
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="email">{{trans('master/master.email_id')}}</label>
                                <input type="text" id="email" name="email" class="form-control {{{$errors->has('email') ? 'error' : ''}}}" placeholder="Enter Your email" value="{{ isset($employee) && $employee->email ? $employee->email : old('email') }}"/>
                                {!! $errors->first('email','<label id="basic-default-email-error" for="email" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="nationality" class="required">{{trans('master/master.nationality')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-control select2 {{{ $errors->has('nationality') ? 'error' : '' }}}" id="nationality" name="nationality">
                                    <option value="">{{trans('common/common.select')}}</option>
                                    @foreach($nationalities as $nationality)
                                                <option value="{{$nationality}}"  @if(isset($employee->employeeDetail->nationality) && ($employee->employeeDetail->nationality == $nationality) || (old('nationality') == $nationality)) selected @endif>{{ucwords($nationality)}}</option>
                                            @endforeach
                                </select>
                                {!! $errors->first('nationality', '<label id="basic-default-name-error" for="nationality" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row"><br><br></div>
                        
                        <div class="content-footer position-absolute bottom-0 col-md-12">
                            <div class="d-flex justify-content-between content-footer">
                                <button type="button" class="btn btn-outline-secondary btn-prev" disabled>
                                    <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                    <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.previous')}}</span>
                                </button>
                                <button type="button" class="btn btn-primary btn-next">
                                    <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.next')}}</span>
                                    <i data-feather="arrow-right" class="align-middle ms-sm-25 ms-0"></i>
                                </button>
                            </div>
                        </div>
                    </div>


                    <div id="account-details-vertical" class="content position-relative" role="tabpanel" aria-labelledby="personal-info-vertical-trigger">
                        <div class="content-header">
                            <h5 class="mb-0">{{trans('master/master.contact_info')}}</h5>
                            <small>{{trans('master/master.enter_your_contact_info')}}.</small>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="company_name">{{trans('master/master.company_name')}}</label>
                                <input type="text" id="company_name" name="company_name" class="form-control {{{$errors->has('company_name') ? 'error' : ''}}}" placeholder="Enter Your company name" value="{{ isset($employee->employeeDetail) && $employee->employeeDetail->company_name ? $employee->employeeDetail->company_name : old('company_name') }}"/>
                                {!! $errors->first('company_name','<label id="basic-default-company_name-error" for="company_name" class="error">:message</label>')!!}
                            </div>
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="geo_address">{{trans('master/master.address_line')}}</label>
                                <input type="text" id="geo_address" name="geo_address" class="form-control {{{$errors->has('geo_address') ? 'error' : ''}}}" placeholder="Enter Address Line" value="{{ isset($employee) && $employee->geo_address ? $employee->geo_address : old('geo_address') }}"/>
                                {!! $errors->first('geo_address','<label id="basic-default-geo_address-error" for="geo_address" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="country_id" class="required">{{trans('master/master.country')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-control select2 {{{ $errors->has('country_id') ? 'error' : '' }}}" id="country_id" name="country_id" onchange="getState(this.value)">
                                    @foreach($countries as $country)
                                                    <option value="{{$country->id}}" @if(isset($employee->employeeDetail->country_id) && ($employee->employeeDetail->country_id == $country->id) || (old('country_id') == $country->id)) selected @elseif(Config::get('app.visitor_d_country')==$country->name) 
                                                        selected
                                                    @endif>
                                                    {{$country->name}}
                                                    </option>
                                                @endforeach
                                </select>
                                {!! $errors->first('country_id', '<label id="basic-default-name-error" for="country_id" class="error">:message</label>')!!}
                            </div>
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="state_id" class="required">{{trans('master/master.state')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-control select2 {{{ $errors->has('state_id') ? 'error' : '' }}}" id="state_id" name="state_id" onchange="getCity(this.value)">
                                    @foreach($states as $state)
                                            <option value="{{$state->id}}" @if(isset($employee->employeeDetail->state_id) && ($employee->employeeDetail->state_id == $state->id) || (old('state_id') == $state->id)) selected
                                            @endif>
                                                {{$state->name}}
                                            </option>
                                        @endforeach
                                </select>
                                {!! $errors->first('state_id', '<label id="basic-default-name-error" for="state_id" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="city_id" class="required">{{trans('master/master.city')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-control select2 {{{ $errors->has('city_id') ? 'error' : '' }}}" id="city_id" name="city_id">
                                   <option value="">{{trans('master/master.select_city')}}</option>
                                            @foreach($cities as $city)
                                            <option value="{{$city->id}}" @if(isset($employee->employeeDetail->city_id) && ($employee->employeeDetail->city_id == $city->id) || (old('city_id') == $city->id)) selected @endif>
                                                {{$city->name}}
                                            </option>
                                        @endforeach
                                </select>
                                {!! $errors->first('city_id', '<label id="basic-default-name-error" for="city_id" class="error">:message</label>')!!}
                            </div>
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="district">{{trans('master/master.district')}} <span class="mendatory-field text-danger">*</span></label>
                                <input type="text" id="district" name="district" class="form-control {{{$errors->has('district') ? 'error' : ''}}}" placeholder="Enter Your district" value="{{ isset($employee->employeeDetail) && $employee->employeeDetail->district ? $employee->employeeDetail->district : old('district') }}"/>
                                {!! $errors->first('district','<label id="basic-default-district-error" for="district" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="pincode">{{trans('master/master.pincode')}} <span class="mendatory-field text-danger">*</span></label>
                                <input type="number" onkeydown="javascript: return event.keyCode == 69 ? false : true" onKeyPress="if(this.value.length==6) return false;"  id="pincode" name="pincode" class="form-control {{{$errors->has('pincode') ? 'error' : ''}}}" placeholder="Enter Your pincode" value="{{ isset($employee->employeeDetail) && $employee->employeeDetail->pincode ? $employee->employeeDetail->pincode : old('pincode') }}"/>
                                {!! $errors->first('pincode','<label id="basic-default-pincode-error" for="pincode" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row"><br><br></div>
                        <div class="content-footer position-absolute bottom-0 col-md-12">
                            <div class="d-flex justify-content-between content-footer">
                                <button type="button" class="btn btn-outline-secondary btn-prev">
                                    <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                    <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.previous')}}</span>
                                </button>
                                <button type="button" class="btn btn-primary btn-next">
                                    <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.next')}}</span>
                                    <i data-feather="arrow-right" class="align-middle ms-sm-25 ms-0"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div id="images-vertical" class="content position-relative" role="tabpanel" aria-labelledby="images-vertical-trigger">
                        <div class="content-header">
                            <h5 class="mb-0">{{trans('common/common.attachment_info')}}</h5>
                            <!-- <small>Add Employee Selfie Image.</small> -->
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="vip">{{trans('master/master.select_id_proof')}}</label>
                                <select class="form-control select2" id="id_proof_type" name="id_proof_type">
                                    <option value="" >{{trans('master/master.select_id_proof')}}</option>
                                    @foreach($idProofTypes as $idProofType)
                                                <option value="{{$idProofType}}"  @if(isset($employee->employeeDetail->id_proof_type) && ($employee->employeeDetail->id_proof_type == $idProofType) || (old('id_proof_type') == $idProofType)) selected @endif>{{ucwords($idProofType)}}</option>
                                            @endforeach
                                </select>
                                {!! $errors->first('id_proof_type', '<label class="control-label" for="id_proof_no">:message</label>')!!}
                            </div>
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="id_proof_no">{{trans('master/master.id_proof_number')}}</label>
                                <input type="text" id="id_proof_no" name="id_proof_no" class="form-control {{{$errors->has('id_proof_no') ? 'error' : ''}}}" placeholder="Enter Your Id Proof" value="{{ isset($employee->employeeDetail->id_proof_no)  ? $employee->employeeDetail->id_proof_no : old('id_proof_no') }}"/>
                                {!! $errors->first('id_proof_no','<label id="basic-default-id_proof_no-error" for="id_proof_no" class="error">:message</label>')!!}
                            </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <label class="form-label" for="status">{{trans('common/common.status')}} <span class="mendatory-field text-danger">*</span></label>
                                <select class="form-control select2" id="status" name="status">
                                    @foreach($employeeStatus as $val)
                                                <option value="{{$val}}"  @if(isset($employee) && ($employee->status == $val) || (old('status') == $val)) selected @endif>{{ ucfirst($val) }}</option>
                                            @endforeach
                                </select>
                            </div>
                            <div class="mb-1 col-md-6" id="blockresion" style=" @if(isset($employee) && ($employee->status != 'block')) display: none ; @endif">
                                <label class="form-label" for="block_reason">{{trans('master/master.block_reason')}}</label>
                                <input type="text" id="block_reason" name="block_reason" class="form-control {{{$errors->has('block_reason') ? 'error' : ''}}}" placeholder="Enter Block Reason" value="{{ isset($employee->employeeDetail) && $employee->employeeDetail->block_reason ? $employee->employeeDetail->block_reason : old('block_reason') }}"/>
                                {!! $errors->first('block_reason','<label id="basic-default-block_reason-error" for="block_reason" class="error">:message</label>')!!}
                              </div>
                        </div>
                        <div class="row">
                            <div class="mb-1 col-md-6">
                                <div class="form-group {{{ $errors->has('id_proof_attachment') ? 'has-error' : '' }}}">
                                    <label>{{trans('master/master.verified_document')}}</label> 
                                    <div class="card-body">
                                        <div class="uploadedDocBox text-center">
                                            @if($employee->id_proof_attachment)
                                                @if($employee->getMedia('id_proof_attachment')->last()->mime_type=='application/pdf')
                                                    <a href="{!! $employee->id_proof_attachment !!}" target="_blank"><img id="id_upload_preview" src="/assets/img/pdf-icon.jpg" title="{!! $employee->id_proof_attachment !!}" alt="attachment" style="height: 200px; width:200px; object-fit: contain;"></a>
                                                @else
                                            <img id="id_upload_preview" src="{!! $employee->id_proof_attachment !!}" alt="id proof attachment" style="width:100%;height: 250px;object-fit: contain;" onerror="this.src='/assets/img/id-proof-sample.png'"/>
                                                @endif
                                            <a href="/{{$organization->alias}}/employee/{{$employee->id}}/delete-id" class="delIdProofAttachment">
                                                <img src="/assets/img/closered.svg">
                                            </a>
                                            
                                            @else
                                            <img id="id_upload_preview" src="https://via.placeholder.com/300x60?text=ID Proof Attachment" value="{{ old('id_proof_attachment') }}" alt="id proof attachment" style="width:100%;height: 250px;object-fit: contain;" onerror="this.src='/assets/img/id-proof-sample.png'"/> @endif
                                        </div>
                                        <div class="text-center" style="display:flex;justify-content:center;margin-top:10px">
                                            <input type="file" class="fileinput form-control" name="id_proof_attachment" accept="id_proof_attachment/*" id="inputIdFile" data-filename-placement="inside" title="Browse">
                                        </div>
                                        <br>
                                        <b>{{trans('master/master.max_size_limit')}}: 5MB</b><br />
                                        {!! $errors->first('id_proof_attachment', '<label class="control-label" for="id_proof_attachment">:message</label>')!!}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row"> 
                            <div class="col-md-6">
                                @if($employee->imagebase64code)
                                <div class="card-body">
                                    <label for="image" class="required">{{trans('master/master.visitor_selfie_image')}}
                                    </label>
                                    <div class="text-center" style="display:flex;justify-content:center;margin-top:10px">
                                        <img src="data:image/png;base64, {{ $employee->imagebase64code }}" style="height: 250px;"  onerror="this.src='/assets/img/default-profile-3.png'" />
                                    </div>
                                </div>
                                @endif
                            </div>
                        </div>
                       
                        <div class="row"><br><br>
                        </div>
                        <div class="content-footer position-absolute bottom-0 col-md-12">
                            <div class="d-flex justify-content-between content-footer">
                                <button type="button" class="btn btn-outline-secondary btn-prev">
                                    <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                    <span class="align-middle d-sm-inline-block d-none">{{trans('common/common.previous')}}</span>
                                </button>
                                <button type="submit" class="btn btn-success btn-submit" id="confirm-submit-text">{{trans('common/common.submit')}}</button>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>
        </section>


    {!! Form::close() !!}
    
    <!-- /Vertical Wizard -->
@endsection

@push('footer-script')
<!-- BEGIN: Page Vendor JS-->
<script src="/app-assets/vendors/js/forms/wizard/bs-stepper.min.js"></script>
<script src="/app-assets/vendors/js/forms/select/select2.full.min.js"></script>
<script src="/app-assets/vendors/js/forms/validation/jquery.validate.min.js"></script>
<script src="/app-assets/vendors/js/pickers/flatpickr/flatpickr.min.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/picker.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/picker.date.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/picker.time.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/legacy.js"></script>
<!-- END: Page Vendor JS-->
<!-- BEGIN: Page JS-->
    <script src="/app-assets/js/scripts/forms/form-wizard.js"></script>
    <script src="/app-assets/js/scripts/forms/form-validation.js"></script>
    <script src="/app-assets/js/scripts/forms/pickers/form-pickers.js"></script>
<!-- END: Page JS-->


<script type="text/javascript">
	function getCity (state_id) {
        var url = "/member/ajax/cities";
        $.ajax({
            url: url,
            type: "POST",
            data: {
                "_token": "{{ csrf_token() }}",
                "state_id": state_id},
            success: function (data) {
                op = '<option value="">Select City</option>';
                $.each(data,function(key,value){
                    if("{{ old('city_id') }}" == key)
					{
						op += '<option value='+key+' selected>'+value+'</option>';
					} else {
						op += '<option value='+key+'>'+value+'</option>';
					}
                    
                });
                $('#city_id').html(op);
            }
        });
    }
	
    function getState (country_id) {
        var url = "/member/ajax/states";
        $.ajax({
            url: url,
            type: "POST",
            data: {
                "_token": "{{ csrf_token() }}",
                "country_id": country_id},
            success: function (data) {
                op = '<option value="">Select State</option>';
                $.each(data,function(key,value){
                    if("{{ Config::get('app.visitor_d_state')}}"==value){
						op += '<option value='+key+' selected>'+value+'</option>';
					} else {
						op += '<option value='+key+'>'+value+'</option>';
					}
                    
                });
                $('#state_id').html(op);
				if ($('#country_id').val() && $('#state_id').val()) {
					getCity($('#state_id').val());
				}
            }
        });
    }
    

    function readURLimage(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function(e) {
                $('#image_upload_preview').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }
    function readURLid(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function(e) {
                $('#id_upload_preview').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

    $("#inputIdFile").change(function() {
        readURLid(this);
    });
    $("#inputImageFile").change(function() {
        readURLimage(this);
    });

    $('#status').change(function() {
        if (this.value=='block') {
            $("#blockresion").show();
        }else{
            $("#block_reason").val('');
            $("#blockresion").hide();
        }
    });

    $(document).ready(function() {
        if ($('#country_id').val()) {
            getState($('#country_id').val());
        }
    });
</script>


@endpush