@extends('layouts.app')

@section('title')
    {{ __('modules')['home']['calendar'] }}
@endsection

@section('content')
  {{-- Imports --}}
    @php
      // Imports
        use \App\Helpers\Environment\SystemFeaturesHelper;
        use \App\Helpers\Environment\SystemParametersHelper;

      // Features
        $has_pax_pricing = SystemFeaturesHelper::getFeatureStatus('pax_pricing');
        $has_control_hours = SystemFeaturesHelper::getFeatureStatus('control_hours');
        $has_public_calendar = SystemFeaturesHelper::getFeatureStatus('public_calendar');
        $has_express_reservations = SystemFeaturesHelper::getFeatureStatus('express_reservations');

        $has_additional_pax_charge = SystemFeaturesHelper::getFeatureStatus('additional_pax_charge');

      // Parameters
        $express_tolerance_minutes = (int) SystemParametersHelper::getValueOf('hotel.express_tolerance_minutes');

      // Supports
        $has_many_agencies = count($agencies) > 3;
    @endphp

  {{-- Styles --}}
    <link href="{{ asset('css/components/tables/reservation-components.css') }}" rel="stylesheet">
    <link href="{{ asset('css/components/forms/reservation-form-modal.css') }}" rel="stylesheet">
    <link href="{{ asset('css/components/custom/harsiScrollBar.css') }}" rel="stylesheet">
    <link href="{{ asset('css/pages/particular/hotel-calendar.css') }}" rel="stylesheet">

  {{-- Body --}}
    {{-- Superior Cards --}}
    <section class="px-3 d-flex justify-content-between align-items-center">

        {{-- Payment Statuses --}}
        <div class="text-center card-legends w-33">

            {{-- Title --}}
            <h4 class="legend-titles">{{ __('entity_fields')['common']['payment_status'] }}</h4>

            {{-- Statuses --}}
            <div class="badges-container d-flex align-items-center justify-content-center g-2">

                {{-- Paid Balance --}}
                <div>
                    <span class="badge badge-pill dot-badge paid-badge"></span>
                    <span class="legend-texts">{{ __('neutral_words')['paid'] }}</span>
                </div>

                {{-- Advance Balance --}}
                <div>
                    <span class="badge badge-pill dot-badge advance-badge"></span>
                    <span class="legend-texts">{{ __('neutral_words')['advance'] }}</span>
                </div>

                {{-- Due Balance --}}
                <div>
                    <span class="badge badge-pill dot-badge due-badge"></span>
                    <span class="legend-texts">{{ __('neutral_words')['due'] }}</span>
                </div>

            </div>

        </div>

        {{-- Current Agencies --}}
        <div class="text-center card-legends w-58">

            {{-- Title --}}
            <h4 class="mb-2 legend-titles">{{ __('modules')['dashboard']['hotel']['agencies'] }}</h4>

            {{-- Agencies --}}
            <div class="flex-wrap d-flex justify-content-center align-items-center">

                {{-- None --}}
                <div class="w-33 @if($has_many_agencies) mb-2 @endif">
                    <img
                        src="{{ Auth::user()->profile_photo ?? asset('icons/close_modal.svg') }}"
                        alt="Ninguna Agencia"
                        class="img-fluid rounded-circle agency-legend-icon">
                    <span class="legend-texts"> {{ __('neutral_words')['none'] }}</span>
                </div>

                {{-- Agencies --}}
                @foreach ($agencies as $agency)
                    <div class="w-33 @if($has_many_agencies) mb-2 @endif">
                        <img
                            src="{{ $agency->agency_url_image }}"
                            alt="{{ $agency->agency_name }} Logo"
                            class="img-fluid rounded-circle agency-legend-icon">
                        <span class="legend-texts">{{ $agency->agency_name }}</span>
                    </div>
                @endforeach

            </div>

        </div>

    </section>

    {{-- Calendar Structures --}}
    <div class="px-3 pt-2 mt-4 mb-4">

        {{-- Interactions --}}
        <section class="mb-3 d-flex justify-content-between align-items-end">

            {{-- Tabs --}}
            @if ($has_express_reservations)
                <ul id="calendar-type-switch"
                    class="nav nav-tabs d-flex align-items-end g-1 w-58"
                >
                    <li class="nav-item">
                        <h4 class="mb-0 rounded legend-titles nav-link">{{ __('modules')['home']['calendar'] }}:</h4>
                    </li>
                    <li class="w-33 nav-item active">
                        <a id="normal-calendar-tab" href="#normal-calendar-block" data-toggle="tab"
                            class="py-1 nav-link sanserif active nav-rounded"
                        >
                            {{ __('neutral_words')['nights'] }}
                        </a>
                    </li>
                    <li class="w-33">
                        <a href="#express-calendar-block" data-toggle="tab"
                            class="py-1 nav-link sanserif nav-rounded"
                        >
                            {{ __('neutral_words')['express'] }}
                        </a>
                    </li>
                </ul>
            @endif

            {{-- Buttons --}}
            <div class="g-2 ms-auto d-flex">

                @if ($has_public_calendar)
                    <button onclick="copyCalendarLink()"
                        class="py-1 btn btn-secondary"
                    >
                        <i class="fas fa-share"></i>&nbsp;
                        {{ __('common_actions')['share'] }}
                    </button>
                @endif

            </div>

        </section>



        {{--Contenido--}}
        <section class="tab-content">

            <div class="tab-pane fade show active" id="normal-calendar-block">
                <div class="calendar-container">
                    <div id='normal-calendar'></div>
                </div>
            </div>

            @if ($has_express_reservations)
                <div class="tab-pane fade show" id="express-calendar-block">
                    <div class="calendar-container">
                        <div id='express-calendar'></div>
                    </div>
                </div>
            @endif

        </section>

    </div>

    {{-- Formularios de Reservas --}}
      {{-- Básico --}}
        @include('shared.utils.reservation-form.basic.base', ['is_external' => true])

      {{-- Avanzado (OTAs) --}}
        {{-- <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#advanced_form_modal">
            Launch
        </button> --}}
        @include('shared.utils.reservation-form.complex.base', ['is_external' => true])

  {{-- Imports --}}
        @include("hotel.calendar.complements.shared-calendar-scripts")
        @include("hotel.calendar.complements.normal-calendar-scripts")

        @if ($has_express_reservations)
            @include("hotel.calendar.complements.express-calendar-scripts")
        @endif
@endsection

@section('footer')
    @include('shared.components.footer.basic-footer')
@endsection
