@extends('front.layouts.master')
@section('title', 'Create Job')
@push('post_styles')
    <link rel="stylesheet" href="{{ asset('backend/assets/css/style.css') }}">
    <link rel="stylesheet" href="{{ asset('backend/admin/css/custom.css') }}">
@endpush
@section('content')
    @php
        $breadcrumbOption = getThemeOption('breadcrumb') ?? [];
        $breadcrumbImg = $breadcrumbOption['breadcrumb_img'] ?? null;
        $breadcrumbColor = $breadcrumbOption['breadcrumb_color'] ?? '#f1f1f1';
    @endphp
    <div class="breadcrumb-section mb-50">
        <div class="breadcrumb-wrap"
            style="
            @if ($breadcrumbImg) background-image: url('{{ asset('storage/theme-options/' . $breadcrumbImg) }}'); @endif
            background-color: {{ $breadcrumbColor }};
            background-size: cover;
            background-position: center;
         ">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="breadcrumb-content">
                            <ul>
                                <li>
                                    <a href="{{ route('company.dashboard') }}">{{ translate('Company Dashboard') }}</a>
                                </li>
                                <li>{{ translate('Create A Job') }}</li>
                            </ul>
                            <h1>{{ translate('Create A Job') }}</h1>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="dashboard-area company-dashboard mb-50">
        <div class="container">
            <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('company.job.information') }}" method="POST"
                                    data-prefix="parimary-information">
                                    @csrf
                                    <input type="hidden" value="" id="primaryId" name="id">
                                    <input type="hidden" value="{{ authCheck()->company?->id }}" id="company_id"
                                        name="company_id">

                                    <div class="form-card row">
                                        <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="text" inputmode="numeric" 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" type="checkbox"
                                                            data-vacancy="" 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->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">
                                            <div class="col-sm-2">
                                                <label for="#job_deadline">{{ translate('Application Deadline') }}
                                                    <span>*</span> </label>
                                            </div>
                                            <div class="col-sm-9">
                                                <div class="form-inner">
                                                    <input type="date" id="job_deadline" min="{{ date('Y-m-d') }}" 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('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 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>(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" style="height: 148px">
                                                            <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('company.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 mb-1">
                                                    <div class="form-check me-3">

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

                                                        <label class="form-check-label" for="custom">
                                                            <input class="form-check-input salary_mode" type="radio"
                                                                value="negotiable" name="salary_mode" id="custom">

                                                            {{ translate('Negotiable') }}</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') }}">
                                                            {{ 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('company.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="{{ translate('Enter Your Qualification') }}">
                                                </div>
                                                <span class="text-danger error-text education_id_err"></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-12 row mb-25">
                                        <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>

                                    <div class="col-12 row mb-3">
                                        <div class="col-sm-2">
                                            <label>{{ translate('Skills') }} <span>*</span></label>
                                        </div>
                                        <div class="col-sm-9 skill-list">

                                            <select name="skill[]" class="skill-data-ajax" multiple="true">
                                                <option value=""></option>
                                            </select>
                                            <span class="text-danger error-text skill_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('company.job.information') }}" method="POST"
                                    data-prefix="additional-filed">
                                    @csrf

                                    <div class="additionalId">

                                    </div>

                                    <div class="col-12 row mb-25">

                                        <div class="col-sm-2 text-end">
                                            <p class="job-custom-title">{{ translate('Job Custom Field') }}</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('company.job.information') }}" method="POST"
                                    data-prefix="preview" class="mt-3">
                                    @csrf
                                    <div class="previewId">

                                    </div>
                                    <div class="previewContent"></div>
                                    @if(totalAvailableFeaturedJobs() >= 1)
                                    <label class="job-promote">
                                    <input type="checkbox" name="job_featured"> {{ translate('Do you want to promote the job as a featured job?') }} </label> @endif
                                    <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('company.all.job') }}">{{ translate('Go to Job Listings') }}</a>
                                        </div>
                                    </div>
                                </div>
                            </fieldset>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @include('front.pages.jobs.modal')
    </div>
@endsection
@push('post_scripts')
    <script src="{{ asset('backend/admin/js/custom.js') }}?v=1.2"></script>
    @include('js.admin.jobcreate')
@endpush