@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');

              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('Выбор сделан!');

                      console.log(data);

                      main_oskar.html(data);

                      history.pushState({}, '', "{{ route('education') }}?sort="+val_+"@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).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 = $('#send_user_id');
               var to_user_id = $('#send_to_user_id');
               var vacancy = $('#send_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['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')

  @endsection

  @section('content')
      <section class="thing">
          <div class="container">

              <form class="thing__body" action="{{ route('list-vacancies', ['categories' => $Name_categori[0]->id]) }}" 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 }}">{{ $JT->name }}</option>
                              @endforeach
                          @endif
                      </select>
                  </div>
              </form>
          </div>
      </section>
      <main class="main">
          <div class="container">
              <div class="main__vacancies">

                  @if (isset($job))
                      <h2 class="main__vacancies-title">Категория вакансий {{ $job }}</h2>
                  @else
                      <h2 class="main__vacancies-title">Все категории</h2>
                  @endif

                  <div class="filters main__vacancies-filters">

                      <div class="filters__label" id="col-vo" name="col-vo">Показано @if ($Query_count < 3) {{$Query_count}} @else 3 @endif из @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 id="main_ockar" class="main__vacancies" name="main_ockar" style="width:100%;">

                  @foreach ($Query as $Q)

                  <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 (isset($Q->employer))
                              <img src="{{ asset(Storage::url($Q->employer->logo)) }}" alt="{{ $Q->employer->name }}">
                          @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 (isset($Q->jobs))
                              @foreach ($Q->jobs as $key => $j)
                                  <span class="main__employer-page-two-item-tag">#{{ $j->name }}</span>
                              @endforeach
                          @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_it_button">Откликнуться</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">{{ $Q->created_at }}</div>

                          <button type="button" data-val="{{ $Q->id }}"  class="like main__employer-page-two-item-bottom-like js-toggle js_vacancy_favorites <?=App\Classes\Cookies_vacancy::selected_vacancy($Q->id);?>">

                              <svg>

                                  <use xlink:href="{{ asset('images/sprite.svg#heart') }}"></use>

                              </svg>
                          </button>
                      </div>
                  </div>

                  @endforeach
                      <div style="margin-top: 20px">
                          {{ $Query->appends($_GET)->links('paginate') }}

                      </div>

                  </div><!-- конец -->

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