@extends('admin.layouts.app')
@section('content')

@php // true or false
$checkPromoterAppliedThisEvent = checkPromoterAppliedThisEvent(Auth::guard("web")->user(), $event)
@endphp


{{-- apply event modal --}}
@if($checkUserInEventNow['is_event_now'] == false)
@if(!$checkPromoterAppliedThisEvent)
<div class="modal fade" id="applyEventModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header modal-colored-header bg-success p-3">
                <h4 class="modal-title text-white" id="success-header-modalLabel">
                    Apply event
                </h4>
            </div>
            <div class="modal-body">
                <p>
                    Are you sure apply {{ $event->name }} event !
                </p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-label-dark" data-bs-dismiss="modal">
                    Close
                </button>
                <a href="{{ route('promoter.events.apply', $event) }}" type="button" class="btn btn-success" onclick="loadingBtn(this)">Confirm</a>
            </div>
        </div>
    </div>
</div>
@endif
@endif


<div class="row">
    <h4 class="text-start mb-4">Event Details</h1>
        <div class="col">
            <div class="card shadow-lg">
                <div class="row g-0">
                    <div class="col-md-6 position-relative">
                        @if($checkUserInEventNow['is_event_now'] == false)
                        @if($checkPromoterAppliedThisEvent)
                        <button class="btn btn-warning" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);" disabled>
                            You are applied this event, please wait our response
                        </button>
                        @else
                        <a href="javascript: void(0);" data-bs-toggle='modal' data-bs-target='#applyEventModal' class="btn btn-success" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);">
                            Apply on this event
                        </a>
                        @endif
                        @endif
                        <img src="{{ asset($event->image->path ?? 'images/default-event.jpg') }}" class="img-fluid rounded-start" alt="{{ $event->name }}" style="height: 100%; object-fit: cover;">
                    </div>
                    <div class="col-md-6">
                        <div class="card-body">
                            <h3 class="card-title text-primary">{{ $event->name }}</h3>
                            <p class="card-text">{{ $event->description }}</p>
                            <div class="mb-2">
                                <p class="card-text text-secondary">Event Type: <strong class="text-purple">{{ $event->eventType->type }}</strong></p>
                                <p class="card-text text-secondary">Date: <strong class="text-success">{{ $event->start_date }} to {{ $event->end_date }}</strong></p>
                                <p class="card-text text-secondary">Time: <strong class="text-info">{{ $event->start_time }} to {{ $event->end_time }}</strong></p>
                                <p class="card-text text-secondary">Location: <strong class="text-warning">{{ $event->city->name }}, {{ $event->country->name }}</strong></p>
                                <p class="card-text text-secondary">Address: <strong class="text-danger">{{ $event->address }}</strong></p>
                                <p class="card-text text-secondary">Uniform Requirements: <strong class="text-primary">{{ $event->uniform_requirements }}</strong></p>
                                <p class="card-text text-secondary">Hourly Rate: <strong class="text-dark">${{ number_format($event->hourly_rate, 2) }}</strong></p>
                                <p class="card-text text-secondary">Additional Info: <strong class="text-muted">{{ $event->additional_info }}</strong></p>
                                <p class="card-text text-secondary">Required Skills:</p>
                                <ol class="list-group list-group-numbered">
                                    @foreach ($event->required_skills as $skill)
                                    <li class="list-group-item"><strong class="text-dark">{{ $skill->name }}</strong></li>
                                    @endforeach
                                </ol>
                            </div>
                            <a href="{{ route('promoter.events.index') }}" class="btn btn-outline-primary">Back to Events</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</div>

@endsection