@php
    use App\Classes\StatusUser;
  @endphp

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

          $(document).on('change', '#jobs', function() {

              var val = $(this).val();

              var main_oskar = $('#main_ockar');

              var ti_head = $('#title_head');

  
              console.log(val);

              $.ajax({
                  type: "GET",

                  url: "{{ route('list-vacancies', ['categories' => $categories->id]) }}",

                  data: "job="+val,
                  success: function (data) {

                      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) {

                      },
  
                      headers: {
                          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                      },
  
                      error: function (data) {
                          data = JSON.stringify(data);
                          console.log('Error: ' + data);
                      }
                  });

              }

          });

          $(document).on('click', '.ask_comment', function() {

               var this_ = $(this);

              $('#modal_user_id').val(this_.attr('data-uid'));
              $('#modal_to_user_id').val(this_.attr('data-tuid'));
              $('#modal_vacancy').val(this_.attr('data-vacancy'));

          });

          $(document).on('click', '.ask_percent', function() {
              $('#modal_vacancy')
                  .val($(this).attr('data-vacancy'))
                  .trigger('change');

          });

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

  
              $.ajax({
                  type: "GET",
                  url: "{{ route('list-vacancies', ['categories' => $categories->id]) }}",
                  data: "sort="+val_+"&block=1",
                  success: function (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');

  
              if (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) && ($Name_categori !== ''))
                      <h2 class="main__vacancies-title">Категория вакансий {{ $Name_categori }}</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"
                      >
                          Показано <span id="firstItem">{{ $Query->firstItem() }}</span> – <span id="lastItem">{{ $Query->lastItem() }}</span> из <span id="Query_count">@isset($Query_count) {{ $Query_count }} @else 0 @endisset</span> результатов поиска
                      </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" data-id="{{ $Q->id }}">
                              <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 (isset($Q->employer->name_company)) {{ $Q->employer->name_company }} @else Не определена @endif</span>

                              </div>

                              <div class="main__employer-page-two-item-text">
                                  <div class="main__employer-page-two-item-text-name">
                                      <h3>@if (!empty($Q->name)) {{ $Q->name }}@else Не указано @endif </h3>
                                  </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-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)
                                          <?php

                                              if (\App\Classes\Tools::getWorkerProfilePercent(Auth()->user()->workers[0]) >= 50) {

                                                  $buttonId = 'ask_comment';
                                              } else {
                                                  $buttonId = 'ask_percent';
                                              }
                                          ?>
                                          <button type="button"
                                                  data-fancybox
                                                  data-src="#{{$buttonId}}"
                                                  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 {{ $buttonId }}">
                                              Откликнуться
                                          </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', strtotime($Q->updated_at)) }}</div>
                                  @guest
                                      <button type="button"
                                              data-fancybox
                                              data-src="#favorite_noauth"
                                              data-options='{"touch":false,"autoFocus":false}'
                                              class="like main__employer-page-two-item-bottom-like">
                                          <svg>
                                              <use xlink:href="{{ asset('images/sprite.svg#heart') }}"></use>
                                          </svg>
                                      </button>
                                  @else

                                      <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>
                                  @endguest
                              </div>

                          </div>

                          @php $i++ @endphp
                      @endforeach
                      <div style="margin-top: 20px">

                          {{ $Query->onEachSide(0)->appends($_GET)->links('paginate') }}

                      </div>

                  </div>

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