@php
  use App\Classes\StatusUser;
@endphp

@extends('layout.frontend', ['title' => 'Вакансии РекаМоре'])

@section('scripts')
    <script>
        console.log('Test system');
        $(document).on('change', '#jobs', function() {
            var val = $(this).val();
            var main_oskar = $('#main_ockar');
            var ti_head = $('#title_head');

            console.log('Code='+val);
            console.log('Click change...');
            $.ajax({
                type: "GET",
                url: "{{ route('list-vacancies', ['categories' => $categories->id]) }}",
                data: "job="+val,
                success: function (data) {
                    console.log('Выбор сделан!');

                    main_oskar.html(data);
                    history.pushState({}, '', "{{ route('list-vacancies', ['categories' => $categories->id]) }}?job="+val+"@if (isset($_GET['sort']))&sort={{ $_GET['sort'] }}@endif"+"@if (isset($_GET['page']))&page={{ $_GET['page'] }}@endif");
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                error: function (data) {
                    data = JSON.stringify(data);
                    console.log('Error: ' + data);
                }
            });

            if ((val == '') || (val == '0')) {
                title_head.html('Все категории');
            } else {
                $.ajax({
                    type: "GET",
                    url: "{{ route('list-vacancies', ['categories' => $categories->id]) }}?@if (isset($_GET['sort']))&sort={{ $_GET['sort'] }}@endif",
                    data: "job=" + val +"&title=1",
                    success: function (data) {

                        console.log(data);
                    },

                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    error: function (data) {
                        data = JSON.stringify(data);
                        console.log('Error: ' + data);
                    }
                });

            }
        });

        $(document).on('click', '.js_send_it_button', function() {
             var this_ = $(this);
             var code_user_id = this_.attr('data-uid');
             var code_to_user_id = this_.attr('data-tuid');
             var code_vacancy = this_.attr('data-vacancy');
             var user_id = $('#_user_id');
             var to_user_id = $('#_to_user_id');
             var vacancy = $('#_vacancy');

            console.log('Клик на кнопки...');

            user_id.val(code_user_id);
            to_user_id.val(code_to_user_id);
            vacancy.val(code_vacancy);
        });

        $(document).on('click', '.js_send_for_emp', function() {
            var this_ = $(this);
            var code_user_id = this_.attr('data-uid');
            var code_to_user_id = this_.attr('data-tuid');
            var code_vacancy = this_.attr('data-vacancy');
            var user_id = $('#send_user_id');
            var to_user_id = $('#send_to_user_id');
            var vacancy = $('#send_vacancy');

            console.log('code_to_user_id='+code_to_user_id);
            console.log('code_user_id='+code_user_id);
            console.log('code_vacancy='+code_vacancy);
            console.log('Клик на кнопке...');

            user_id.val(code_user_id);
            to_user_id.val(code_to_user_id);
            vacancy.val(code_vacancy);
        });

        $(document).on('change', '#sort_ajax', function() {
            var this_ = $(this);
            var val_ = this_.val();
            console.log('sort items '+val_);

            $.ajax({
                type: "GET",
                url: "{{ route('list-vacancies', ['categories' => $categories->id]) }}",
                data: "sort="+val_+"&block=1",
                success: function (data) {
                    console.log('Выбор сортировки');
                    console.log(data);
                    $('#main_ockar').html(data);
                    history.pushState({}, '', "{{ route('list-vacancies', ['categories' => $categories->id]) }}?sort="+val_+"@if (isset($_GET['job']))&job={{ $_GET['job'] }}@endif"+"@if (isset($_GET['page']))&page={{ $_GET['page'] }}@endif");
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                error: function (data) {
                    data = JSON.stringify(data);
                    console.log('Error: ' + data);
                }
            });
        });



        $(document).ready(function(){
            var sel = $('#select2-sort_ajax-container');
            var key = getUrlParameter('sort');
            console.log(sel);
            console.log(key);

            if (key !=='') {
                console.log(key);
                switch (key) {
                    case "default": sel.html('Сортировка (по умолчанию)'); break;
                    case "name_up": sel.html('По имени (возрастание)'); break;
                    case "name_down": sel.html('По дате (убывание)'); break;
                    case "created_at_up": sel.html('По дате (возрастание)'); break;
                    case "created_at_down": sel.html('По дате (убывание)'); break;
                }

            }
        });
    </script>
    @include('js.favorite-vacancy-45')
@endsection
@section('content')
    <section class="thing">
        <div class="container">
            <form class="thing__body" action="{{ route('list-vacancies', ['categories' => (!empty($Name_categori)) ? $Name_categori[0]->id : '0']) }}" method="POST">
                <ul class="breadcrumbs thing__breadcrumbs">
                    <li><a href="{{ route('index') }}">Главная</a></li>
                    <li><a href="{{ route('vacancies') }}">Вакансии</a></li>
                    <li><b>{{ isset($Name_categori[0]) ? $Name_categori[0]->name : 'Все категории' }}</b></li>
                </ul>
                <h1 class="thing__title">Вакансии</h1>
                <p class="thing__text">С другой стороны, социально-экономическое развитие не оставляет шанса для
                    существующих финансовых и административных условий.</p>
                <div class="select select_search thing__select">
                    <div class="select__icon">
                        <svg>
                            <use xlink:href="{{ asset('images/sprite.svg#search') }}"></use>
                        </svg>
                    </div>
                    <select class="js-select2" id="jobs" name="jobs">
                        <option value="0" selected>Выберите должность</option>
                        @if ($Job_title->count())
                            @foreach($Job_title as $JT)
                                <option value="{{ $JT->id }}" @if(isset($_GET['job']) && ($_GET['job'] == $JT->id)) selected @endif>{{ $JT->name }}</option>
                            @endforeach
                        @endif
                    </select>
                </div>
            </form>
        </div>
    </section>
    <main class="main">
        <div class="container">
            <div class="main__vacancies" >
                @if (isset($Name_categori[0]->name))
                    <h2 class="main__vacancies-title">Категория вакансий {{ $Name_categori[0]->name }}</h2>
                @else
                    <h2 class="main__vacancies-title" id="title_head" name="title_head">Все категории</h2>
                @endif
                <div class="filters main__vacancies-filters">
                    <div class="filters__label" id="col-vo" name="col-vo">Показано {{ $Query->firstItem() }} – {{ $Query->lastItem() }} из @isset($Query_count) {{ $Query_count }} @else 0 @endisset результатов поиска</div>
                    <div class="filters__body">
                        <div class="select filters__select">
                            <select class="js-select2" id="sort_ajax" name="sort_ajax">
                                <option value="default">Сортировка (по умолчанию)</option>
                                <option value="name_up">По имени (возрастание)</option>
                                <option value="name_down">По имени (убывание)</option>
                                <option value="created_at_up">По дате (возрастание)</option>
                                <option value="created_at_down">По дате (убывание)</option>
                            </select>
                        </div>
                    </div>
                </div>

                <div class="main__vacancies" style="width:100%;" id="main_ockar" name="main_oskar">
                @php $i = ($Query->currentPage() * $Query->perPage() - $Query->count() - 1) @endphp

                @foreach ($Query as $Q)
                    @foreach ($Reclama as $Rec)
                        @if ($Rec->position == $i)
                            <div class="main__vacancies-thing">
                                @if (!empty($Rec->image))
                                    <img src="{{ asset(Storage::url($Rec->image)) }}" alt="{{ $Rec->title }}" class="main__vacancies-thing-pic">
                                @else
                                    <img src="{{ asset('images/default_ship.jpg') }}" alt="{{ $Rec->title }}" class="main__vacancies-thing-pic">
                                @endif
                                <div class="main__vacancies-thing-body">
                                    <h2>{{ $Rec->title }}</h2>
                                    <div class="main__vacancies-thing-scroll">
                                        {!! $Rec->text !!}
                                    </div>
                                    <a href="{{ $Rec->link }}" class="button">Узнать больше</a>
                                </div>
                            </div>
                        @endif
                    @endforeach
                <div class="main__vacancies-item main__employer-page-two-item">

                    <a href="{{ route('list-vacancies', ['categories' => $categories->id]) }}" class="back main__employer-page-two-item-back">
                        <svg>
                            <use xlink:href="{{ asset('images/sprite.svg#back') }}"></use>
                        </svg>
                        <span>
                                Вернуться к списку вакансий
                        </span>
                    </a>

                    <div class="main__employer-page-two-item-toper">
                        @if (!empty($Q->employer->logo))
                            <img src="{{ asset(Storage::url($Q->employer->logo)) }}" alt="{{ $Q->employer->name }}">
                        @else
                            <img src="{{ asset('images/default_ship.jpg') }}" alt="{{ $Rec->title }}" class="main__vacancies-thing-pic">
                        @endif
                        <span>@if (!empty($Q->name)) {{ $Q->name }} @endif</span>
                    </div>

                    <div class="main__employer-page-two-item-text">
                        <div class="main__employer-page-two-item-text-name">Судоходная компания ведет набор
                            специалистов на следующие должности:</div>
                        <div class="main__employer-page-two-item-text-links">
                        @if (isset($Q->jobs))
                            @foreach ($Q->jobs as $key => $j)
                                <a>“{{ $j->name }}” <!--– з/п от if (isset($Q->jobs_code[$key]->min_salary)) { $Q->jobs_code[$key]->min_salary }} endif - if (isset($Q->jobs_code[$key]->max_salary)) { $Q->jobs_code[$key]->max_salary }} endif рублей (на руки)-->
                                </a>
                            @endforeach
                        @endif
                       </div>
                    </div>

                    <div class="main__employer-page-two-item-text">
                        <div class="main__employer-page-two-item-text-name">Мы предлагаем:</div>
                        <div class="main__employer-page-two-item-text-body">
                            {!! $Q->text !!}
                        </div>
                    </div>
                    <!--<div class="main__employer-page-two-item-text">
                        <div class="main__employer-page-two-item-text-name">Наши ожидания:</div>
                        <div class="main__employer-page-two-item-text-body">
                            !! $Q->description !!}
                        </div>
                    </div>
                    <div class="main__employer-page-two-item-text">
                        <div class="main__employer-page-two-item-text-name">Резюме направляйте на почту:</div>
                        <div class="main__employer-page-two-item-text-body">
                            !! $Q->contacts_emails !!}
                        </div>
                    </div>
                    <div class="main__employer-page-two-item-text">
                        <div class="main__employer-page-two-item-text-name">Или звоните:</div>
                        <div class="main__employer-page-two-item-text-body">
                            !! $Q->contacts_telephones !!}
                        </div>
                    </div>-->

                    <div class="main__employer-page-two-item-tags">
                        @if (!empty($Q->jobs_code[0]->position_ship))
                            <span class="main__employer-page-two-item-tag"> #{{ $Q->jobs_code[0]->position_ship }}</span>
                        @else
                            @if (isset($Q->jobs))
                                @foreach ($Q->jobs as $key => $j)
                                    <span class="main__employer-page-two-item-tag"> #{{ $j->name }}</span>
                                @endforeach
                            @endif
                        @endif
                    </div>
                    <div class="main__employer-page-two-item-buttons">
                        @guest
                            <button type="button" data-fancybox data-src="#question" data-options='{"touch":false,"autoFocus":false}'
                                    class="button main__employer-page-two-item-button">Откликнуться</button>
                        @else
                            @if (App\Classes\StatusUser::Status()==1)
                                <button type="button" data-fancybox data-src="#send" data-vacancy="{{ $Q->id }}" data-uid="{{ $uid }}" data-tuid="{{ $Q->employer->user_id }}"  data-options='{"touch":false,"autoFocus":false}'
                                    class="button main__employer-page-two-item-button js_send_for_emp">Откликнуться</button>
                            @else
                                <button type="button" data-fancybox data-src="#send2" data-vacancy="{{ $Q->id }}" data-uid="{{ $uid }}" data-tuid="{{ $Q->employer->user_id }}"  data-options='{"touch":false,"autoFocus":false}'
                                        class="button main__employer-page-two-item-button js_send_it_button">Откликнуться</button>
                            @endif
                        @endguest
                        <a href="{{ route('vacancie', ['vacancy' => $Q->id]) }}" class="button button_light main__employer-page-two-item-button">Подробнее</a>
                    </div>
                    <div class="main__employer-page-two-item-bottom">
                        <div class="main__employer-page-two-item-bottom-date">{{ date('d.m.Y H:i:s', strtotime($Q->created_at)) }}</div>
                        <button type="button" id="like{{ $Q->id }}" data-val="{{ $Q->id }}"   class="like main__employer-page-two-item-bottom-like js-toggle js_vac_favorite {{ \App\Classes\LikesClass::get_status_vacancy($Q) }}">
                            <svg>
                                <use xlink:href="{{ asset('images/sprite.svg#heart') }}"></use>
                            </svg>
                        </button>
                    </div>
                </div>
                        @php $i++ @endphp
                @endforeach
                    <div style="margin-top: 20px">
                        {{ $Query->onEachSide(0)->appends($_GET)->links('paginate') }}
                    </div><!-- конец -->

                </div>
            </div>
        </div>
    </main>
@endsection