@extends('layouts/guest/masters.master')

@section('opengraph')
<!-- Search Engine Optimization by Rank Math - http://s.rankmath.com/home -->
@endsection

@section('tittle','VOICES AND BEATS [ EVENTS MANAGEMENT ] | SUCESS-MESSAGE')

@section('content')  
  <div>
   <div class="bg-cover bg-liveband-stage">
    <div class="h-64 flex items-center justify-center bg-black bg-opacity-50">
      <h1 class="text-lg md:text-2xl font-opensans-bold text-white text-center">
        HOME &nbsp;&nbsp;>&nbsp;&nbsp;<span class="text-lime-500">EVENTS</span>
      </h1>
    </div>
   </div>

   <div class="grid sm:grid-cols-2 md:grid-cols-3 gap-10 px-3 py-5 md:px-20 md:py-10">
    @foreach($events as $event) 
     <div class="space-y-3">
      <div class="h-48 md:h-56 relative">
       @if($event->status != "open")
        <div class="absolute right-2 top-2 py-1 px-2 rounded-md border-2 border-white font-opensans-extrabold bg-red-500 text-white rotate-6 shadow-md">
           @if($event->status == "cancelled")
             CANCELLED
           @else
             CLOSED
           @endif  
        </div>
       @endif

        <img class="h-full w-full  rounded-md shadow-sm" src="{{ asset('assets/images/'.$event->image) }}">
        <div class="ticket-price overflow-x-auto rounded-md bg-white absolute -bottom-3 left-3 right-3 text-sm">
            <table class="w-full border-collapse">
               <thead>
                <tr class="font-opensans-bold text-white bg-lime-500 divide-x divide-white">
                  <th class="w-10"></th>
                  <th class="w-20">KIDS</th>
                  <th class="w-20">ORD</th>
                  <th class="w-20">VIP</th>
                  <th class="w-20">TABLE</th>
                  <th class="w-20">TEN 4 EIGHT</th>
                </tr>  
               </thead>
              <tbody class="text-xs">  
              <tr class="divide-x divide-gray-500">
                <td class="text-sm font-opensans-bold text-left">EARLY</td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','kids')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ordinary')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','vip')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','table')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ten for eight')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
               </tr>
               <tr class="divide-x divide-gray-500">
                <td class="text-sm font-opensans-bold text-left">GATE</td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','kids')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ordinary')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','vip')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','table')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                   {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ten for eight')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
               </tr>
             </tbody>  
            </table>  
        </div>
      </div>

      <div class="tittle md:text-lg font-opensans-extrabold">
       <h1>
        <a href="/Events/{{ $event->id }}/{{ $event->tittle }}" class="hover:text-yellow-500">
           {{ $event->tittle }}
        </a>
       </h1>
      </div>

      <div class="text-sm text-gray-700">
        {!! Str::limit( $event->body , 250 , '...' ); !!}
      </div>

      <hr>

      <div class="flex justify-between space-x-5">
        <div class="flex space-x-3 items-center text-sm md:text-base">
          <div class="h-7 md:h-8 w-7 md:w-8 rounded-full bg-black flex items-center justify-center">
            <i class="fa fa-calendar-days text-white"></i>
          </div>
          <div class="text-xs md:text-sm text-gray-600">
            <div class="font-opensans-bold">
              When
            </div>
            <div class="">
              {{ $event->date->format('d M, Y') }}
            </div>
          </div>
        </div>

        <div class="flex space-x-2 items-center text-sm md:text-base">
          <div class="h-7 md:h-8 w-7 md:w-8 rounded-full bg-black flex items-center justify-center">
            <i class="fa fa-map-marker-alt text-white"></i>
          </div>
          <div class="text-xs md:text-sm text-gray-600">
            <div class="font-opensans-bold">
              Location
            </div>
            <div class="text-xs md:text-sm">
              {{ $event->venue }}
            </div>
          </div>
        </div>
      </div>

      <hr>
      
      <div class="flex space-x-5 justify-between font-opensans-bold text-sm">
         <div class="text-sm">
           @if($event->status == "open")
            <a href="/Events/Buy-Ticket/{{ $event->id }}/{{ $event->tittle }}" class="py-1 md:py-2 px-5 block hover:bg-black bg-lime-500 text-white rounded-2xl">
              BUY TICKET
            </a>
           @else
            <span class="py-1 md:py-2 px-5 flex items-center justify-center bg-gray-300  text-gray-600 rounded-2xl cursor-not-allowed">
             BUY TICKET
            </span> 
           @endif 
         </div>
         
         <div class="bg-black text-white rounded-2xl hover:bg-lime-500 text-sm">
          <a href="/Events/{{ $event->id }}/{{ $event->tittle }}" class="py-1 md:py-2 px-5 block">
            VIEW MORE
          </a>
         </div>
      </div>
     </div>
     @endforeach
     </div>
    </div>  


  </div> 
@endsection