@extends('layout.frontend', ['title' => 'Главная страница РекаМоре'])

@section('scripts')
    <script>
        console.log('Test system');
        $(document).on('click', '#button_send', function() {
            var field_login = $('#email');
            var field_pwd = $('#password');
            var login_val = field_login.val();
            var pwd_val = field_pwd.val();

            console.log('login: '+login_val+' password: '+pwd_val);

            $.ajax({
                type: "GET",
                url: "{{ route('login') }}",
                data: "email="+login_val+"&password="+pwd_val,
                success: function (data) {
                    console.log('Вход в систему');
                    let d = JSON.parse(data);
                    if(typeof d['REDIRECT'] !== "undefined") {
                        location.href = d['REDIRECT'];
                    }
                    if (typeof d['ERROR'] !== "undefined") {
                        $('#message_error').html(d['ERROR']);
                    }
                    console.log(d['REDIRECT']);
                    //$('#block_1').html(data);
                },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                error: function (data) {
                    data = JSON.stringify(data);
                    console.log('Error: ' + data);
                }
            });
        });
    </script>
@endsection

@section('content')
<section class="work">
    <div class="container">
        <img src="{{ asset('images/1.png') }}" alt="" class="work__pic">
        <div class="work__body">
            <div class="work__title">
                Работа в море /
                <span class="br">Работа на реке</span>
            </div>
            <div class="work__text">Профессиональная сеть морского сообщества «RekaMore.su» приветствует вас —
                тех, кто не представляет себе жизнь без моря, тех, кто готов связать свою жизнь с работой в
                сложных, но очень интересных условиях. </div>
            <div class="work__list">
                <div>Тысячи соискателей увидят Ваше объявление</div>
                <div>Десятки компаний выкладывают объявления каждый день</div>
            </div>
            <form class="search work__form" action="{{ route('search_vacancies') }}" method="GET">
                <input type="search" id="search" name="search" class="input" placeholder="Желаемая должность" required>
                <button type="submit" class="button button_light">Посмотреть вакансии</button>
                <span>
                    <svg>
                        <use xlink:href="{{ asset('images/sprite.svg#search') }}"></use>
                    </svg>
                </span>
            </form>
            <a href="{{ route('bd_resume') }}" class="button work__search">Я ищу сотрудника</a>
            <div class="work__get">
                <b>Скачать приложение</b>
                <a href="">
                    <img src="{{ asset('images/google.svg') }}" alt="">
                </a>
                <a href="">
                    <img src="{{ asset('images/apple.svg') }}" alt="">
                </a>
            </div>
        </div>
    </div>
</section>
<section class="numbers">
    <div class="container">
        <div class="numbers__body">
            <div class="numbers__item">
                <b>500+</b>
                <span>Резюме</span>
                Банальные, но неопровержимые выводы, а также элементы политического процесса лишь добавляют
                фракционных разногласий и призваны к ответу.
            </div>
            <div class="numbers__item">
                <b>1 000+</b>
                <span>Вакансий</span>
                В рамках спецификации современных стандартов, диаграммы связей заблокированы в рамках своих
                собственных рациональных ограничений.
            </div>
            <div class="numbers__item">
                <b>265</b>
                <span>Компаний</span>
                Но сторонники тоталитаризма в науке заблокированы в рамках своих собственных рациональных
                ограничений.
            </div>
        </div>
    </div>
</section>
<section class="vacancies">
    <div class="container">
        <div class="title">Новые вакансии</div>
        <div class="vacancies__body">
            <a class="vacancies__more button button_light js-parent-toggle" href="{{ route('vacancies') }}">Все должности</a>
            <div class="vacancies__list">
                @if ($categories->count())
                @foreach ($categories as $cat)
                <a href="#" class="vacancies__item">
                    <span style="border-color:#F4C4C2">
                        <b>{{ $cat->name }}</b>
                        <i>Вакансий: <span>{{ $cat->cnt }}</span></i>
                    </span>
                </a>
                @endforeach
                @else
                    Тут пока нет никаких вакансий
                @endif
            </div>
        </div>
    </div>
</section>
<section class="employer">
    <div class="container">
        <div class="title">Работодатели</div>
        <div class="swiper js-employer-swiper">
            <div class="swiper-wrapper">

                @if ($employers->count())
                    @php
                        $rec = 0;
                        $count = $employers->count();
                    @endphp
                    @foreach($employers as $emp)
                        @php $rec++ @endphp
                        @if (($rec==1) || ($rec==5) || ($rec==9) || ($rec==13) || ($rec==17))
                            <div class="swiper-slide">
                                <div class="employer__item">
                        @endif
                            @if (!empty($emp->logo))
                            <a href="{{ route('ad-employer', ['ad_employer' => $emp->id]) }}">
                                <img src="{{ asset(Storage::url($emp->logo)) }}" alt="{{ $emp->name_company }}">
                            </a>
                            @else
                                <a href="{{ route('ad-employer', ['ad_employer' => $emp->id]) }}">
                                    <img src="{{ asset('images/logo_emp.png') }}" alt="{{ $emp->name_company }}">
                                </a>
                            @endif
                        @if (($rec==4) || ($rec==8) || ($rec==12) || ($rec==16) || ($rec==20) || ($rec == $count))
                                </div>
                            </div>
                        @endif
                    @endforeach
                @else
                    <h5>Тут нет никаких записей</h5>
                @endif
            </div>
            <div class="swiper-pagination"></div>
        </div>
        <a href="{{ route('shipping_companies') }}" class="employer__more button button_light">Все работодатели</a>
    </div>
</section>
<section class="about">
    <div class="container">
        <div class="about__wrapper">
            <div class="title about__title">О нас</div>
            <div class="about__body">
                <div class="about__line"></div>
                <div class="about__item">
                    <b>Для работодателей</b>
                    <span>Наш ресурс позволит Вам за демократичную цену найти нужных специалистов в кратчайшие
                                сроки, подробнее об условиях можно узнать <a href="{{ route('page', ['pages' => 'Stoimost-razmescheniya']) }}">здесь</a>.</span>
                    <a class="about__button button button_whited" href="{{ route('bd_resume') }}">Поиск сотрудников</a>
                </div>
                <div class="about__item">
                    <b>Для сотрудников</b>
                    <span>Наше преимущество — это большой объем вакансий, более 70 судоходных компаний России и
                                СНГ ищут сотрудников через наши ресурсы</span>
                    <a class="about__button button button_whited" href="{{ route('vacancies') }}">Посмотреть вакансии</a>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="news">
    <div class="container">
        <div class="news__toper">
            <div class="title">Новости и статьи</div>
            <div class="navs">
                <button class="js-news-swiper-button-prev">
                    <svg class="rotate180">
                        <use xlink:href="{{ asset('images/sprite.svg#arrow') }}"></use>
                    </svg>
                </button>
                <button class="js-news-swiper-button-next">
                    <svg>
                        <use xlink:href="{{ asset('images/sprite.svg#arrow') }}"></use>
                    </svg>
                </button>
            </div>
        </div>
        <div class="swiper js-news-swiper">
            <div class="swiper-wrapper">
                @if ($news->count())
                    @foreach ($news as $new)
                    <div class="swiper-slide">
                        <div class="news__item">
                            <img src="{{ asset(Storage::url($new->image)) }}" alt="" class="news__item-pic">
                            <div class="news__item-body">
                                <time datetime="2023-05-01" class="news__item-date">{{ $new->created_at }}</time>
                                <span class="news__item-title">{{ $new->title }}</span>
                                <span class="news__item-text">{{ mb_strimwidth($new->text, 0, 100) }}</span>
                                <a href="#" class="news__item-more button button_light">Читать далее</a>
                            </div>
                        </div>
                    </div>
                    @endforeach
                @endif
            </div>
            <div class="swiper-pagination"></div>
        </div>
        <div class="news__all button button_light">Все новости</div>
    </div>
</section>
<section class="info">
    <div class="container">
        <img src="images/5.png" alt="" class="info__pic">
        <div class="info__body">
            <div class="title info__title">Мы в социальных сетях</div>
            <div class="info__item">
                <div class="info__text">Телеграм — Подпишитесь на наш телеграм канал и получайте уведомления о
                    новых вакансиях прямо на свой смартфон</div>
                <a href="#" class="info__link" style="background:#20A0E1">
                    <svg>
                        <use xlink:href="images/sprite.svg#tg"></use>
                    </svg>
                    Телеграм
                </a>
            </div>
            <div class="info__item">
                <div class="info__text">ВКонтакте — Лучшие вакансии за неделю выкладываем именно тут, информация
                    о судоходных компаниях, инструкции по работе с сайтом, конкурсы и многое другое</div>
                <a href="#" class="info__link" style="background:#2787F5">
                    <svg>
                        <use xlink:href="images/sprite.svg#vk"></use>
                    </svg>
                    ВКонтакте
                </a>
            </div>
        </div>
    </div>
</section>
@endsection