@extends('admin.layouts.main')

@section('title')
Job - Roles and Responsibilities
@endsection

@section('content')

<main>
    <div class="two-col">

        @include("admin.common.sidebar")

        <div class="right-sec">

            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="javascript:void(0)">{{ @trans('job.recruitment') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"><a
                            href="{{ route('admin.jobs.index',['panel' => session('panel')])}}">{{ @trans('job.jobs')
                            }}</a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">{{ @trans('job.roles_responsibility') }}</li>

                </ol>
            </nav>

            <div class="form-sec">
                <div class="form-step">
                    <div class="step"><label>1. {{ @trans('job.job_info') }}</label></div>
                    <div class="step active"><label><i class="material-icons">trending_flat</i>2.
                            {{ @trans('job.role') }}</label></div>
                    <div class="step"><label><i class="material-icons">trending_flat</i>3.
                            {{ @trans('job.requirements') }}</label></div>
                    <div class="step"><label><i class="material-icons">trending_flat</i>4.
                            {{ @trans('job.prefered') }}</label></div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-xl-8 offset-xl-2 col-lg-10 offset-lg-1">
                            <div class="step-box">

                                <form method="post"
                                    action="{{ route('admin.jobs.store_description', ['panel' => session('panel')]) }}"
                                    id="frmDescription" autocomplete="off">
                                    @csrf

                                    <input type="hidden" name="id" value="{{ $id }}" />

                                    <div class="tab">
                                        <h2 class="form-sec-title">{{ @trans('job.role_info') }}</h2>
                                        <div class="row">
                                            <div class="col-md-4">
                                                <div class="form-group btm-arrow select">
                                                    <label class="control-label" for="job_type_id">{{
                                                        @trans('job.job_type') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <select class="form-control" id="job_type_id" name="job_type_id">
                                                        <option value="">{{ @trans('job.select') }}</option>
                                                        @foreach($jobTypes as $jobType)
                                                        <option value="{{ $jobType->id }}" @if($id && $job->job_type_id
                                                            == $jobType->id) selected="selected"
                                                            @endif>{{ $jobType->name }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group btm-arrow select">
                                                    <label class="control-label" for="job_level_id">{{
                                                        @trans('job.job_level') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <select class="form-control" id="job_level_id" name="job_level_id">
                                                        <option value="">{{ @trans('job.select') }}</option>
                                                        @foreach($jobLevels as $jobLevel)
                                                        <option value="{{ $jobLevel->id }}" @if($id && $job->
                                                            job_level_id == $jobLevel->id) selected="selected"
                                                            @endif>{{ $jobLevel->name }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="col-md-4">
                                                <div class="form-group input-group">
                                                    <label class="control-label" for="city_id">{{ @trans('job.city') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <select class="form-control select-two selectWithAjax" id="city_id"
                                                        name="city_id">
                                                        <option value="">Select City</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="col-md-4">
                                                <div class="form-group date">
                                                    <label class="control-label">{{ @trans('job.deadline') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <div class="input-group date">
                                                        <input type="text" class="form-control dateselect bg-white"
                                                            placeholder="Select Date" id="expires_at" name="expires_at"
                                                            readonly
                                                            value="@if($id){{ $job->expires_at_formatted}}@endif">
                                                        <div class=" input-group-addon">
                                                            <span class="material-icons">date_range</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="col-md-4">
                                                <div class="form-group select btm-arrow">
                                                    <label class="control-label">{{
                                                        @trans('job.no_of_reports')}}</label>
                                                    <select class="form-control" name="no_of_reports"
                                                        id="no_of_reports">
                                                        <option value="">Select</option>
                                                        @for($i=1; $i<=250;$i++) <option value="{{ $i }}" @if($id &&
                                                            $job->
                                                            no_of_reports == $i) selected @endif>{{ $i}}</option>
                                                            @endfor
                                                            <option value="251">250+</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.roles_responsibility')
                                                        }}
                                                    </label>
                                                    <textarea name="roles_responsibilities" id="roles_responsibilities"
                                                        class="form-control editor"
                                                        placeholder="Roles & Responsibilities">@if($id){{ $job->roles_responsibilities }}@endif</textarea>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.qualifications') }}
                                                    </label>
                                                    <textarea name="qualifications" id="qualifications"
                                                        class="form-control editor"
                                                        placeholder="Qualifications">@if($id){{ $job->qualifications }}@endif</textarea>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.experience') }}
                                                    </label>
                                                    <textarea name="experience" id="experience"
                                                        class="form-control editor"
                                                        placeholder="Experience">@if($id){{ $job->experience }}@endif</textarea>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.characteristics') }}
                                                    </label>
                                                    <textarea name="characteristics" id="characteristics"
                                                        class="form-control editor"
                                                        placeholder="Characteristics">@if($id){{ $job->characteristics }}@endif</textarea>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.reporting_to') }}
                                                    </label>
                                                    <textarea name="report_to" id="report_to"
                                                        class="form-control editor"
                                                        placeholder="Reporting To">@if($id){{ $job->reporting_to }}@endif</textarea>
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.driving_license') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <div class="custom-control custom-radio">
                                                        <input type="radio" class="custom-control-input"
                                                            id="have_liscence_yes" name="have_liscence" value="1"
                                                            @if($id && $job->have_liscence == 1) checked="checked"
                                                        @endif>
                                                        <label class="custom-control-label" for="have_liscence_yes">{{
                                                            @trans('job.yes') }}</label>
                                                    </div>
                                                    <div class="custom-control custom-radio">
                                                        <input type="radio" class="custom-control-input"
                                                            id="have_liscence_no" name="have_liscence" value="0" @if($id
                                                            && $job->have_liscence == 0) checked="checked" @endif>
                                                        <label class="custom-control-label" for="have_liscence_no">{{
                                                            @trans('job.no') }}</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{ @trans('job.open_to_expatriates') }}
                                                        <span class="required">*</span>
                                                    </label>
                                                    <div class="custom-control custom-radio">
                                                        <input type="radio" class="custom-control-input"
                                                            id="expatriates_ready_yes" name="expatriates_ready"
                                                            value="1" @if($id && $job->expatriates_ready == 1)
                                                        checked="checked" @endif>
                                                        <label class="custom-control-label"
                                                            for="expatriates_ready_yes">{{
                                                            @trans('job.yes') }}</label>
                                                    </div>
                                                    <div class="custom-control custom-radio">
                                                        <input type="radio" class="custom-control-input"
                                                            id="expatriates_ready_no" name="expatriates_ready" value="0"
                                                            @if($id && $job->expatriates_ready == 0) checked="checked"
                                                        @endif>
                                                        <label class="custom-control-label"
                                                            for="expatriates_ready_no">{{
                                                            @trans('job.no') }}</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="tab-btn">
                                            <div style="float: left;">
                                                @if(Session::has('editUrl'))
                                                <a class="btn btn-cncl"
                                                    href="{{ route('admin.jobs.show',['panel' => session('panel'),'id' => $job->id]) }}">{{
                                                    @trans('job.cancel') }}</a>
                                                @else
                                                <a class="btn btn-cncl"
                                                    href="{{ route('admin.jobs.index',['panel' => session('panel')]) }}">{{
                                                    @trans('job.cancel') }}</a>
                                                <a class="btn btn-cncl"
                                                    href="{{ route('admin.jobs.info',['panel' => session('panel'),'id' => $job->id]) }}">{{
                                                    @trans('job.prev') }}</a>
                                                @endif

                                            </div>
                                            <div style="float:right;">
                                                @if(Session::has('editUrl'))
                                                <button type="submit" id="nextBtn" class="btn step-btn">{{
                                                    @trans('job.save') }}</button>
                                                @else
                                                <button type="submit" id="nextBtn" class="btn step-btn">{{
                                                    @trans('job.save_next') }}</button>
                                                @endif
                                            </div>
                                        </div>
                                    </div>

                                </form>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</main>
@endsection

@push('pageJs')


{!! JsValidator::formRequest('App\Http\Requests\Job\StoreJobDescription', '#frmDescription') !!}

<script type="text/javascript">
    $(document).ready(function() {

        var myForm = $('#frmDescription');
        $.data(myForm[0], 'validator').settings.ignore = "null";

        tinymce.init({
            selector: 'textarea.editor',
            height: 300,
            menubar: false,
            branding: false,
            browser_spellcheck: true,
            toolbar: 'undo redo | bold italic underline strikethrough | link | alignleft aligncenter alignright alignjustify | bullist numlist  | removeformat | preview',
            plugins: [
                'link preview wordcount lists', 'paste'
            ],
            paste_auto_cleanup_on_paste: true,
            paste_remove_styles: true,
            paste_remove_styles_if_webkit: true,
            paste_strip_class_attributes: true,
            setup: function(editor) {
                editor.on('keyUp', function() {
                    tinyMCE.triggerSave();

                    if (!$.isEmptyObject(myForm.validate().submitted))
                        myForm.validate().form();
                });
            },

        });

        $('.selectWithAjax').on('change', function() {
            $(this).valid();
        });

        $('.selectWithAjax').select2({
            placeholder: 'Select an option',
            minimumInputLength: 3,
            ajax: {
                url: '{{route("city.ajaxSearch")}}',
                dataType: 'json',
                data: function(params) {
                    var query = {
                        search: params.term
                    }
                    return query;
                },
                processResults: function(response) {
                    return {
                        results: response,
                    };
                }
            }
        });

        @if($id && $job->city)
        var data = {
            id: "",
            text: ""
        };
        var newOption = new Option(data.text, data.id, true, true);
        $('.selectWithAjax').append(newOption).trigger('change');

        @endif

        var today = new Date();
        var $date = $('.dateselect').datepicker({
            autoHide: true,
            format: 'dd/mm/yyyy',
            zIndex: 2048,
            startDate: today.getDate() + '/' + (today.getMonth() + 1) + '/' + today.getFullYear(),
        });
        $('#expires_at').change(function() {
            $(this).valid();
        })

    });
</script>

@endpush