@extends('admin.master')
@section('title', 'Job Create')
@section('breadcrumb')
    <div class="breadcrumb-area">
        <h5>{{ translate('Dashboard') }}</h5>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">{{ translate('Dashboard') }}</a></li>
                <li class="breadcrumb-item active" aria-current="page"><a
                        href="{{ route('admin.job') }}">{{ translate('Job') }}</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ translate('Job Create') }}</li>
            </ol>
        </nav>
    </div>
@endsection
@section('main_content')
    <div class="main-content">
        <div class="row mb-35">
            <div class="page-title d-flex justify-content-between align-items-center">
                <h4></h4>
                <a href="{{ route('admin.job') }}" class="eg-btn btn--primary back-btn"> <img
                        src="{{ asset('backend/assets/images/icons/back.svg') }}" alt="back-icon">
                    {{ translate('Go Back') }}</a>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <div class="card  eg-card product-card">
                    <div id="msform">
                        <ul id="progressbar">
                            <li class="active" id="primary_job_information"><strong>{{translate('Primary Job Information')}}</strong></li>
                            <li id="more_job_information"><strong>{{translate('More Job Information')}}</strong></li>
                            <li id="canidate_information"><strong>{{translate('Candidate Requirements')}}</strong></li>
                            <li id="additional_filed"><strong>{{translate('Additional Filed')}}</strong></li>
                            <li id="preview"><strong>{{translate('Preview')}}</strong></li>
                            <li id="completed"><strong>{{translate('Completed')}}</strong></li>
                        </ul>
                        <fieldset>
                            <form action="{{ route('admin.job.information') }}" method="POST"
                                data-prefix="parimary-information">
                                @csrf
                                <input type="hidden" value="" id="primaryId" name="id">
                                <div class="form-card row">

                                <div class="col-12 row mb-3">
                                    <div class="col-sm-2">
                                        <label> {{ translate('Company Name') }} <span>*</span> </label>
                                    </div>
                                    <div class="col-sm-9">
                                        <div class="form-inner">
                                            <select name="company_id" class="form-control form-control-s-1 companyName"
                                                id="companyList">
                                                <option disabled value="">{{ translate('Select Comapny Name') }}</option>
                                                @foreach (companyAll() as $company)
                                                    <option value="{{ $company->id }}">{{ $company->company_name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label>{{translate('Job Title')}}<span>*</span></label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <input type="text" class="username-input" name="job_title"
                                                    placeholder="{{translate('Enter Job Title')}}">
                                                <span class="text-danger error-text job_title_err"></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('No. of Vacancies')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9 d-flex align-items-baseline">
                                            <div class="form-inner">
                                                <input type="number" maxlength="6" id="job_vacancy_input"
                                                    class="job-vacancy" name="job_vacancy"
                                                    placeholder="{{ translate('Enter Vacancy Number') }}">
                                                <span class="text-danger error-text job_vacancy_err"></span>
                                            </div>
                                            <div class="form-check ms-4">
                                                <label class="form-check-label" for="jobVacancy">
                                                    <input class="form-check-input jobVacancy" data-vacancy=""
                                                        type="checkbox" name="ch_vacancies" id="jobVacancy"> {{translate('NA')}}
                                                </label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row mb-25">
                                        <div class="col-sm-2">
                                            <label>{{translate('Job Category')}}<span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="row">
                                                <div class="col-sm-5">
                                                    <select name="category_id" class="form-control form-control-s-1"
                                                        id="jobCategory">
                                                        @foreach (jobCategory($status = 1) as $category)
                                                            <option value="{{ $category->id }}">
                                                                {{ $category->getTranslation('category_name') }}</option>
                                                        @endforeach
                                                    </select>
                                                    <span class="text-danger error-text category_id_err"></span>
                                                </div>
                                                <div class="col-sm-7">

                                                    <div class="row">
                                                        <div class="col-sm-3">
                                                            <label> {{translate('SubCategory')}}</label>
                                                        </div>
                                                        <div class="col-sm-9">
                                                            <select name="subcategory_id" id="jobSubCategory"
                                                                class="form-control form-control-s-1">
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row mb-25">
                                        <div class="col-sm-2">
                                            <label> {{translate('Job Type')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <select name="job_type_id[]" class="js-example-basic-multiple job-type"
                                                multiple="multiple" id="jobType">
                                                @foreach (jobType($status = 1) as $jobType)
                                                    <option value="{{ $jobType->getTranslation('job_type_name') }}">
                                                        {{ $jobType->getTranslation('job_type_name') }}</option>
                                                @endforeach
                                            </select>
                                            <span class="text-danger error-text job_type_id_err"></span>
                                        </div>
                                    </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('Application Deadline')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <input type="date"class="username-input" name="job_deadline">
                                                <span class="text-danger error-text job_deadline_err"></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row mb-25">
                                        <div class="col-sm-2">
                                            <label> {{translate('Resume Receiving Option')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="d-flex">
                                                <div class="form-check me-3">
                                                    <label class="form-check-label" for="onlineApply">
                                                        <input class="form-check-input" name="cv_receive_option"
                                                            type="checkbox" id="onlineApply" checked>
                                                         {{translate('Apply Online')}}
                                                    </label>
                                                </div>
                                                <div class="form-check">
                                                    <label class="form-check-label" for="emailApply">
                                                        <input class="form-check-input" name="cv_receive_email"
                                                            type="checkbox" id="emailApply">
                                                        {{translate('Email')}}
                                                    </label>
                                                </div>
                                            </div>
                                            <span class="text-danger error-text cv_receive_option_err"></span>
                                            <div class="emailApply-field row">
                                                <div class="col-sm-4 form-group">
                                                    <input id="receiving_email" type="email" name="applied_email"
                                                        placeholder="Write Email Address" class="form-control">
                                                    <span class="text-danger error-text applied_email_err"></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    {{-- <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('Job Image')}} <b>{{translate('(60px × 60px)')}}</b> <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <div class="form-inner file-upload mb-35">
                                                    <div class="dropzone-wrapper">
                                                        <div class="dropzone-desc">
                                                            <i class="glyphicon glyphicon-download-alt"></i>
                                                            <p>{{translate('Choose an image file or drag it here')}}</p>
                                                        </div>
                                                        <input type="file" name="job_image"
                                                            class="dropzone dropzone-image">
                                                        <span class="text-danger error-text job_image_err"></span>
                                                    </div>
                                                    <div class="preview-zone hidden">
                                                        <div class="box box-solid">
                                                            <div class="box-body"></div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div> --}}
                                </div>
                                <button type="button" class="job-btn action-button"> {{translate('Save & Continue')}} </button>
                            </form>
                        </fieldset>

                        <fieldset>
                            <form action="{{ route('admin.job.information') }}" method="POST"
                                data-prefix="more-information">
                                @csrf
                                <div class="information"></div>
                                <div class="form-card row">
                                    <div class="col-12 row mb-25">
                                        <div class="col-sm-2">
                                            <label>{{translate('Job Level')}}<span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <select name="job_level[]" class="js-example-basic-multiple job-type"
                                                multiple="multiple" id="jobLevel">
                                                @foreach (jobcareerLevel($status = 1) as $Level)
                                                    <option value="{{ $Level->id }}">
                                                        {{ $Level->getTranslation('name') }}</option>
                                                @endforeach
                                            </select>
                                            <span class="text-danger error-text job_level_err"></span>
                                        </div>
                                    </div>
                                    <div class="col-12 row mb-25">
                                        <div class="col-sm-2">
                                            <label>{{translate('Job Role')}}<span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <select name="job_role" class="job-role-data-ajax job-role" id="jobRole">

                                            </select>
                                            <span class="text-danger error-text job_role_err"></span>
                                        </div>
                                    </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('Job Description')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <textarea name="job_description" class="description"></textarea>
                                                <span class="text-danger error-text job_description_err"></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('Job Responsibilities')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <textarea name="job_responsibility" class="description"  rows="5"></textarea>
                                                <span class="text-danger error-text job_responsibility_err"></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('Extra Benefit')}}</label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <textarea name="extra_benefit" class="description" rows="10"></textarea>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row mb-25">
                                        <div class="col-sm-2">
                                            <label> {{translate('Salary')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="d-flex">
                                                <div class="form-check me-3">

                                                    <label class="form-check-label" for="range">
                                                         {{translate('Salary Range')}}
                                                        <input class="form-check-input salary_mode" type="radio"
                                                            value="range" name="salary_mode" id="range" checked>
                                                    </label>
                                                </div>
                                                <div class="form-check">

                                                    <label class="form-check-label" for="custom">{{translate('Negotiable')}}
                                                        <input class="form-check-input salary_mode" type="radio"
                                                            value="negotiable" name="salary_mode" id="custom">
                                                    </label>
                                                </div>
                                            </div>
                                            <span class="text-danger error-text salary_mode_err"></span>

                                            <div class="salary-field row">
                                                <div class="col-sm-4 form-group salary_range_part">
                                                    <label for="min_salary"> {{translate('Minimum Salary')}}</label>
                                                    <input id="min_salary" type="number" name="min_salary"
                                                        placeholder="{{translate('Minimum Salary')}}" class="form-control">
                                                    <span class="text-danger error-text min_salary_err"></span>
                                                </div>
                                                <div class="col-sm-4 form-group salary_range_part">
                                                    <label for="max_salary"> {{translate('Maximum Salary')}}<span>*</span></label>
                                                    <input id="max_salary" type="number"
                                                        name="max_salary"placeholder="{{translate('Maximum Salary')}}"
                                                        class="form-control">
                                                    <span class="text-danger error-text max_salary_err"></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row">
                                        <div class="col-sm-2">
                                            <label> {{translate('Salary Type')}}<span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">

                                                <select name="salary_type" class="form-control form-control-s-1">
                                                    <option disabled selected>{{translate('Select Salary Type')}}</option>
                                                    <option value="{{translate('monthly')}}"data-select2-id="6">{{ucfirst(translate('monthly'))}}</option>
                                                    <option value="{{translate('Project Basis')}}" >{{translate('Project Basis')}} </option>
                                                    <option value="{{translate('hourly')}}"> {{ucfirst(translate('hourly'))}} </option>
                                                    <option value="{{translate('yearly')}}"> {{ucfirst(translate('yearly'))}}</option>
                                                </select>
                                                <span class="text-danger error-text salary_type_err"></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 row mb-3">
                                        <div class="col-sm-2">
                                            <label> {{translate('Job Experience')}} <span>*</span> </label>
                                        </div>
                                        <div class="col-sm-9">
                                            <div class="form-inner">
                                                <select name="experience[]" class="js-example-basic-multiple"
                                                    multiple="true" id="job_experience">
                                                    @foreach (jobExperience($status = 1) as $experience)
                                                        <option value="{{ $experience->id }}">
                                                            {{ $experience->getTranslation('name') }} </option>
                                                    @endforeach
                                                </select>

                                                <span class="text-danger error-text experience_err"></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <button type="button" class="job-btn action-button"> {{translate('Save & Continue')}} </button>
                                <button type="button" class="previous action-button btn-success">{{translate('Previous')}}</button>
                            </form>
                        </fieldset>

                        <fieldset>
                            <form action="{{ route('admin.job.information') }}" method="POST" data-prefix="candidate">
                                @csrf
                                <div class="candidate"></div>
                                <div class="col-12 row">
                                    <div class="col-sm-2">
                                        <label> {{translate('Education Level')}} <span>*</span> </label>
                                    </div>
                                    <div class="col-sm-9">
                                        <div class="form-inner">
                                            <div class="input-area">
                                                <input type="text"
                                                    class="candidate_qualification"
                                                    name="education_id"
                                                    placeholder="Enter Your Qualification">
                                            </div>
                                            <span class="text-danger error-text education_id_err"></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12 row">
                                    <div class="col-sm-2">
                                        <label>{{translate('Skills')}} <span>*</span></label>
                                    </div>
                                    <div class="col-sm-9">
                                        <div class="form-inner">
                                            <select name="skill[]" class="skill-data-ajax" multiple="true">
                                                <option value=""></option>
                                            </select>
                                            <span class="text-danger error-text skill_err"></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12 row">
                                    <div class="col-sm-2">
                                        <label>{{translate('Gender')}} <span>*</span> </label>
                                    </div>
                                    <div class="col-sm-9">
                                        <div class="d-flex">
                                            <div class="form-check me-3">
                                                <input class="form-check-input" type="radio" value="{{translate('male')}}"
                                                    name="gender" id="male" ><label
                                                    class="form-check-label" for="male"> {{ucfirst(translate('Male'))}}</label>
                                            </div>
                                            <div class="form-check  me-3">
                                                <input class="form-check-input" type="radio" value="{{translate('female')}}"
                                                    name="gender"
                                                    id="female">
                                                <label class="form-check-label" for="female">{{ucfirst(translate('Female'))}}</label>
                                            </div>
                                            <div class="form-check ">
                                                <input class="form-check-input" type="radio" value="{{translate('both')}}"
                                                    name="gender" id="other">
                                                <label class="form-check-label" for="other"> {{ucfirst(translate('Both'))}}</label>
                                            </div>
                                        </div>
                                        <span class="text-danger error-text gender_err"></span>
                                    </div>
                                </div>

                                <button type="button" class="job-btn action-button"> {{translate('Save & Continue')}} </button>
                                <button type="button" class="previous action-button btn-success">{{translate('Previous')}}</button>
                            </form>
                        </fieldset>

                        <fieldset>
                            <form action="{{ route('admin.job.information') }}" method="POST"
                                data-prefix="additional-filed">
                                @csrf
                                <div class="additionalId">
                                </div>
                                <div class="col-12 row">
                                    <div class="col-sm-2 text-end">
                                        <p><b>{{translate('Job Custom Field')}}</b></p>
                                   </div>
                                    <div class="col-sm-10">
                                        <div class="add-custom-field-area">
                                        </div>
                                        <div class="add-field align-items-baseline">
                                            <button type="button" class="add-custom-filed add-btn eg-btn btn--primary ">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-plus-lg" viewBox="0 0 16 16"><path fill-rule="evenodd"
                                                    d="M8 2a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 2Z" />
                                               </svg>
                                            </button>
                                        </div>

                                    </div>
                                </div>
                                <button type="button" class="job-btn action-button"> {{translate('Save & Continue')}} </button>
                                <button type="button" class="previous action-button btn-success">{{translate('Previous')}}</button>
                            </form>
                        </fieldset>

                        <fieldset>
                            <form action="{{ route('admin.job.information') }}" method="POST" data-prefix="preview">
                                @csrf
                                <div class="previewId">

                                </div>
                                <div class="previewContent"></div>
                                <button type="button" class="job-btn action-button"> {{translate('Published')}} </button>
                                <button type="button" class="previous action-button btn-success">{{translate('Previous')}}</button>
                            </form>
                        </fieldset>

                        <fieldset>
                            <div class="form-card">
                                <br><br>
                                <h2 class="purple-text text-center"><strong> {{translate('SUCCESS')}}  !</strong></h2> <br>
                                <div class="row justify-content-center">
                                    <div class="col-3"> <img src="{{ asset('images/check-mark.svg') }}" class="fit-image">
                                    </div>
                                </div> <br><br>
                                <div class="row justify-content-center">
                                    <div class="col-7 text-center">
                                        <h5 class="purple-text text-center mb-3">{{translate('Your job has been posted successfully!')}}</h5>
                                        <a class="eg-btn btn--primary back-btn" href="{{ route('admin.job') }}"> {{translate('Go Job
                                            List')}}</a>
                                    </div>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                </div>
            </div>
        </div>

         @include('admin.pages.job.modal')
    </div>
@endsection

@push('post_scripts')
   <script src="{{ asset('frontend/assets/js/jquery-ui.js') }}"></script>
   <script src={{ asset('frontend/assets/js/tags.js') }}></script>+
    @include('js.admin.jobcreate');
@endpush