@extends('layout.app')
@section('title')
    <title>I need a Chef</title>
    <meta name="description" content="Need a Chef or Cook?"/>
    <meta name="og:title" content="I need a Chef"/>
    <meta name="og:image" content="{{url('frontend/images/need-chef.png')}}"/>
@endsection
@section('content')
@php
          $msg = Session::get('msg') ?? null; 
        @endphp
    <section class="need-chef-banner" style="background: url('frontend/images/need-chef.png')">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
              <li class="breadcrumb-item"><a href="/">Home</a></li>
              <li class="breadcrumb-item active" aria-current="page">Recruitment</li>
            </ol>
        </nav>
        <div class="chef-banner-content">
            <h2>Hire a Chef</h2>
        </div>
    </section>
    <section class="hiring-chef">
        <div class="row">
            <div class="col-md-6">
                <div class="hiring-content">
                    <h5>Recruitment<hr></h5>
                    <h3>Need a Chef or Cook?</h3>
                    <p>Let us know via our enquiry form.</p>
                    <h6>What are the next steps?</h6>
                    <ul>
                        <li>Initial consultation to assess your needs, timelines and eligibility.</li>
                        <li>If required, we will set you up as a Standard Business Sponsor.</li>
                        <li>Candidate profiles are sent to you and you make your selections for the Skype/Zoom interviews.</li>
                        <li>Candidates are selected and the Contract of Employment is drafted.</li>
                        <li>We apply for the candidate’s visa which takes normally 3-4 months to come through.</li>
                        <li>The candidate resigns from their current post and makes plans to arrive in Australia.</li>
                        <li>Follow-ups with both the candidate and yourself to ensure everything is running smoothly.</li>
                        <li>Payment of recruitment fee after 14 days.</li>
                    </ul>
                </div>
            </div>
            <div class="col-md-6">
                <div class="chef-hire-form">
                    <form action="{{route('recruitment.vacancy')}}" method = "post">
                        @csrf
                       @include('errors.error')
                        
                        <h2>Please fill-up the form</h2>
                        <div class="mb-3">
                            <label for="">Full name</label>
                            <input type="text" class="form-control" placeholder="Your full name" name="full_name" id="" value = "{{old('full_name')}}">
                        </div>
                        <div class="mb-3">
                            <label for="">Company</label>
                            <input type="text" class="form-control" placeholder="Your company name" name="company" id="" value = "{{old('company')}}">
                        </div>
                        <div class="mb-3">
                            <label for="">Email address</label>
                            <input type="email" class="form-control" placeholder="Your email address" name="email" id="" value = "{{old('email')}}">
                        </div>
                        <div class="mb-3">
                            <label for="">No. of position</label>
                            <input type="text" class="form-control" placeholder="Required number of position" name="no_of_position" id="" value = "{{old('no_of_position')}}">
                        </div>
                        <div class="mb-3">
                            <label for="">Enquiry</label>
                            <textarea type="text" rows="3" class="form-control" placeholder="Your enquiries.." name="enquiry" id="">{{old('enquiry')}}</textarea>
                        </div>
                        @php
                            $code = Str::random(5);
                        @endphp
                        <div class="mb-5">
                            <label for="">Enter Captcha</label>
                            <div class="d-flex gap-3">
                                <div class="captcha-sec">
                                    <input id="captcha" type="text" name = "entered_captcha_code" class="form-control" placeholder="Enter Captcha as Shown" required>
                                    <input type = "hidden" id = "displayed_captcha_code" name = "displayed_captcha_code" value = "{{$code}}"/>
                                </div>
                                <div class="captch-field">
                                    <!-- name = "captcha_code" value = "{{$code}}" -->
                                    <input type = "text" id="captcha_code" readonly  name = "captcha_code" value = "{{$code}}"/>
                                    <a id = "refresh"><img src="{{url('frontend/icons/reset-icon.svg')}}" alt=""></a>
                                </div>
                            </div>
                        </div>
                        <button type="submit">Submit your enquiry</button>
                    </form>
                </div>
            </div>
        </div>
    </section>

    @section('script')
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
        <script>

     var php_var = "<?php echo $msg; ?>";
        if(php_var.length !== 0){
              Swal.fire({
                  title: 'Submitted!!',
                  text: php_var,
                  icon: 'success'
              })
        }
            $('#refresh').click(function(event){
                event.preventDefault();
                $.ajax({
                    type:'GET',
                    url:'refreshcaptcha',
                    success:function(data){
                        document.getElementById('captcha_code').readOnly
                                        = false;
                        document.getElementById('captcha_code').value = (data.captcha_code);
                        document.getElementById('displayed_captcha_code').value = (data.captcha_code);
                        document.getElementById('captcha_code').readOnly
                                        = true;
                    }
                });
            });
</script>
    @endsection
@endsection