@extends('layout.base')

@section('title', 'Planning - ' . $dates[0]['date']->format('d-m-Y'))

@php $planning_table = true; @endphp

@section('content')
<div class="row mb-2">
  <!-- <h3 class="booking-heading">Booking Details</h3> -->
</div>
<div class="row mb-2">
  <h3 class="booking-heading">Booking Details</h3>
</div>

<div class="row mb-4">
  <div class="col-sm d-flex justify-content-between">
    <div>
      <div class="btn-group mb-2 btns__week" role="group">
        <a href="{{ route('planning', ['date' => $dates[0]['date']->copy()->subDays(19)->toDateString()]) }}" class="btn btn-primary" id="btn__prev"><i class="fa fa-chevron-left"></i></a>
        <a href="{{ route('planning', ['date' => $dates[0]['date']->copy()->addDays(19)->toDateString()]) }}" class="btn btn-primary" id="btn__next"><i class="fa fa-chevron-right"></i></a>
      </div>

      <a href="{{ route('planning') }}" class="btn btn-secondary mb-2">Today</a>
    </div>
    <form action="{{ route('planning.change_date') }}" class="form-inline d-inline-flex  justify-content-center mb-2" method="POST">
      {{ csrf_field() }}
      <input class="form-control mr-2" name="goto_date" autocomplete="off" type="date" required value="{{ $dates[0]['date']->format('Y-m-d') }}">
      <button class="btn btn-primary my-2 my-sm-0" type="submit">Go</button>
    </form>

    <div>
      <!-- <a href="{{ route('export.email', ['date' => $dates[0]['date']->toDateString()]) }}" class="btn btn-secondary mb-2">Export email addresses</a> -->
      <!-- <a href="{{ route('print', ['date' => $dates[0]['date']->toDateString()]) }}" class="btn btn-secondary mb-2">Print <i class="fas fa-print fa-sm"></i></a> -->
      @can('add.booking')
      <a href="{{ route('booking.create') }}?date={{ $dates[0]['date']->toDateString() }}" class="btn btn-primary mb-2">New Booking</a>
      @endcan
    </div>
  </div>
</div>

<!-- <div class="row mb-2">
  <div class="col-sm d-flex justify-content-between">
    <textarea class="form-control" placeholder="Notes for this week..." id="weeklyNotes" data-date="{{ $dates[0]['date']->format('Y-m-d') }}" @isset($note) data-note-id="{{ $note->id }}" @endisset>@isset($note){{ $note->notes }}@endisset</textarea>
  </div>
</div> -->

<div id="planning__container" class="table-responsive">
  <table class="table table-bordered" id="planning__data">
    <thead>
      <tr class="text-center">
        <th>Accommodation</th>
        <th>Room</th>
        @foreach($dates as $date)
        <th class="day @if(Carbon\Carbon::now()->isSameDay($date['date'])) day__now @endif">
          {{ $date['day'] }}<br />{{ $date['date_str'] }}
        </th>
        @endforeach
      </tr>
    </thead>
    <tbody>
      @foreach($rooms as $room)
      <tr class="striped">
        <td class="text-center" rowspan="{{ $room->beds }}"><span class="roomname">{{ $room->name }}</span></td>
        @for($i=0; $i<$room->beds; $i++) {{-- loop through beds --}}
          @if ($i>0)
      <tr @if (in_array($i, $room->layout_splits)) class="layout-split" @endif>
        @endif
        <td><i class="fas fa-bed" title="bed {{ $i+1 }}"></i> @if($room->id==2) &nbsp; {{ $i+ 1001 }} @else &nbsp; {{ $i+1 }} @endif </td>
        @for($d=0; $d<20; $d++) {{-- loop through days for this bed --}} @php $date=$dates[$d]; @endphp @if(!$room->bookings->isEmpty() && $booking = $room->hasBooking($date['date'], $i+1))
          <td data-toggle="tooltip" data-placement="left" data-html="true" title="{{ $booking->tooltip }}" colspan="{{ $booking->toShow($dates) }}" class="booked @if ($booking->color()['luma'] > 180.0) reversed @endif" style="background-color: {{ $booking->color()['color'] }}">
            <a href="{{ route('booking.show', $booking->id) }}">
              {{ $booking->getGuest($i)->fullname }}
              <!-- {{ $booking }} -->
              @if ($booking->isFirst($i))
              (Rs. {{ $booking->basePrice }})
              @if (!$booking->extras->isEmpty())
              @foreach ($booking->extras as $extra)
              @isset($extra->icon)
              @if ($loop->first) &mdash; @endif
              {!! $extra->icon !!}
              @endisset
              @endforeach
              @endif
              @endif</a>
          </td>
          @php $d += ($booking->toShow($dates)-1) @endphp
          @elseif (!$room->bookings->isEmpty() && $room->isBookedAsWhole($date['date']))
          <td class="non-bookable"></td>
          @else
          @can('add.booking')
          <td>
            <a href="{{ route('booking.create', ['date' => $date['date']->toDateString(), 'room' => $room->id]) }}" class="book__link">
              <i class="fas fa-plus"></i>
            </a>
          </td>
          @else
          <td></td>
          @endcan
          @endif
          @endfor
      </tr>
      @endfor
      @endforeach
    </tbody>
  </table>
</div>

@endsection

<style>
  /* Style for smaller room names */
  .roomname {
    font-size: 10px;
    /* Adjust the font size as needed */
  }

  /* Style for smaller cells */
  td {
    font-size: 10px;
    /* Adjust the font size as needed */
    padding: 4px;
    /* Adjust the padding as needed */
  }

  .striped {
    /* Add additional styles for striped rows if needed */
  }

  .layout-split {
    /* Add additional styles for layout-split rows if needed */
  }

  /* Style for the table header (th) */
  th {
    font-size: 9px;
    /* Adjust the font size as needed */
    padding: 4px;
    /* Adjust the padding as needed */
  }

  /* Style for today's cell if you want to highlight it */
  .day__now {
    background-color: #ffcc00;
    /* Change the background color as needed */
  }

  /* Style for non-bookable cells if you want to distinguish them */
  .non-bookable {
    background-color: #ddd;
    /* Change the background color as needed */
  }

  .booking-heading {
    font-size: 24px;
    /* Adjust the font size to your preference */
    font-weight: bold;
    color: #333;
    /* Set the text color to your preference */
    text-transform: uppercase;
    /* Makes the text uppercase for emphasis */
    text-decoration: underline;
    /* Underlines the text */
    font-family: Arial, sans-serif;
    /* Choose a font family you like */
  }


  /* Add any other custom styles you need */
</style>