@section('title', __('site.page_events_title'))

@section('head')
    <link rel="stylesheet" href="{{ assetv('/assets/css/pages/siteconfig.css') }}">
    <link rel="stylesheet" href="{{ assetv('/assets/css/pages/siteevents.css') }}">
@endsection

@php
    $breadcrumb = [
        ['label' => __('site.menu_item_3')],
        ['label' => __('site.menu_item_3_sub_6')],
    ];

    $base = 'https://' . $serverData->name . '/contents/' . session('siteID') . '/event/';

    $tabs = [
        '' => __('site.page_events_tab_all'),
        'next' => __('site.page_events_tab_next'),
        'past' => __('site.page_events_tab_past'),
    ];

    $months = [1 => 'jan', 'fev', 'mar', 'abr', 'mai', 'jun', 'jul', 'ago', 'set', 'out', 'nov', 'dez'];
@endphp

@include('includes/header-novo')

<main class="app-main">

    @include('includes.breadcrumb')

    <header class="page-head">
        <div>
            <h1 class="page-title">{{ __('site.page_events_h1') }}</h1>
            <p class="page-sub">{{ __('site.page_events_sub') }}</p>
        </div>
        <a class="btn btn--primary" href="{{ route('site.events.c') }}">
            <i class="fa-solid fa-plus"></i> {{ __('site.page_events_new_title') }}
        </a>
    </header>

    @include('includes.flash')

    <div class="evtlist"
         data-msg-delete-title="{{ __('site.page_events_alert_title') }}"
         data-msg-delete-text="{{ __('site.page_events_alert_text') }}"
         data-msg-delete-btn="{{ __('site.btn_remove') }}">

        <div class="ltools">
            <form class="ltools__search" method="GET" action="{{ route('site.events.r') }}">
                <i class="fa-solid fa-magnifying-glass"></i>
                <input class="input" type="text" name="s" value="{{ $s }}" autocomplete="off"
                       placeholder="{{ __('site.page_events_search') }}">
                @if($when)
                    <input type="hidden" name="when" value="{{ $when }}">
                @endif
            </form>

            <div class="ltabs">
                @foreach($tabs as $key => $label)
                    <a class="ltab {{ $when === $key ? 'is-on' : '' }}"
                       href="{{ route('site.events.r', array_filter(['when' => $key, 's' => $s])) }}">{{ $label }}</a>
                @endforeach
            </div>
        </div>

        @if($s)
            <div class="pfilter">
                <span>{{ __('site.search_results') }} <strong>{{ $s }}</strong></span>
                <a href="{{ route('site.events.r', array_filter(['when' => $when])) }}" title="{{ __('site.page_post_search_clear') }}">
                    <i class="fa-solid fa-xmark"></i>
                </a>
            </div>
        @endif

        @if($apiError)
            <div class="apierr">
                <span class="apierr__ico"><i class="fa-solid fa-plug-circle-xmark"></i></span>
                <p class="apierr__text">{{ $apiError }}</p>
            </div>
        @elseif($allEvents->count() == 0)
            <div class="cempty">
                <span class="apierr__ico"><i class="fa-solid fa-calendar-days"></i></span>
                <p class="apierr__text">{{ __('site.page_events_search_norec') }}</p>
            </div>
        @else
            <div class="evtgrid">
                @foreach($allEvents as $event)
                    @php
                        $start = \Carbon\Carbon::parse($event->date_start);
                        $end = \Carbon\Carbon::parse($event->date_end);
                        $over = $event->date_end < $today;
                        $range = $event->date_start !== $event->date_end;
                    @endphp

                    <article class="evtcard {{ $over ? 'is-over' : '' }}" data-id="{{ $event->id }}" data-name="{{ $event->name }}">
                        <span class="evtcard__cover">
                            @if($event->img)
                                <img src="{{ $base . $event->img }}" alt="" loading="lazy">
                            @endif
                            <i class="fa-solid fa-calendar-days evtcard__ph"></i>

                            {{-- dia e mês em bloco: é o dado que o cliente procura primeiro --}}
                            <span class="evtdate">
                                <strong>{{ $start->format('d') }}</strong>
                                <span>{{ $months[(int) $start->format('n')] }}</span>
                                @if($range)
                                    <em>{{ __('site.page_events_until') }} {{ $end->format('d/m') }}</em>
                                @endif
                            </span>

                            @if($over)
                                <span class="evtover">{{ __('site.page_events_over') }}</span>
                            @endif
                        </span>

                        <div class="evtcard__body">
                            <strong class="evtcard__name" title="{{ $event->name }}">{{ $event->name }}</strong>

                            <span class="evtcard__meta">
                                <i class="fa-solid fa-clock"></i>
                                {{ substr($event->time_start, 0, 5) }} {{ __('site.page_events_to') }} {{ substr($event->time_end, 0, 5) }}
                            </span>

                            @if($event->place)
                                <span class="evtcard__meta" title="{{ $event->place }}">
                                    <i class="fa-solid fa-location-dot"></i> {{ $event->place }}
                                </span>
                            @endif
                        </div>

                        <div class="cardacts">
                            <a class="cardact" href="{{ route('site.events.u', $event->id) }}">
                                <i class="fa-solid fa-pen"></i> {{ __('site.action_edit') }}
                            </a>
                            <button class="cardact cardact--del evtcard__del" type="button">
                                <i class="fa-solid fa-trash"></i> {{ __('site.btn_remove') }}
                            </button>
                        </div>

                        <form class="evtcard__form" method="POST" action="{{ route('site.events.d', $event->id) }}">@method('DELETE')</form>
                    </article>
                @endforeach
            </div>

            {{ $allEvents->links('vendor.pagination.painel') }}
        @endif
    </div>

</main>

@section('scripts')
    <script src="{{ assetv('/assets/js/site-events.js') }}"></script>
@endsection

@include('includes/footer-novo')