@extends('layouts.admin')

@section('content')

<!-- start page title -->
<div class="row">
    <div class="col-12">
        <div class="page-title-box d-sm-flex align-items-center justify-content-between bg-galaxy-transparent">
            <h4 class="mb-sm-0">Itineraries</h4>
            <div class="page-title-right">
                <ol class="breadcrumb m-0">
                    <li class="breadcrumb-item"><a href="javascript: void(0);">Home</a></li>
                    <li class="breadcrumb-item active">Itineraries</li>
                </ol>
            </div>
        </div>
    </div>
</div>
<!-- end page title -->

@php
    // Check if the start and end dates are available
    $start_date = $journey->start_date ? \Carbon\Carbon::parse($journey->start_date) : null;
    $end_date = $journey->end_date ? \Carbon\Carbon::parse($journey->end_date) : null;

    // If there are no start and end dates, skip the itinerary display
    if (!$start_date || !$end_date) {
        $showItineraries = false;
    } else {
        $days = $start_date->diffInDays($end_date);
        $groupedItineraries = $itineraries->groupBy('date');
        $showItineraries = true;
    }
@endphp

<div class="row">
    <div class="col-lg-12">
        <div class="card">
            <div class="card-header border-0">
                <div class="row align-items-center gy-3">
                    <div class="col-sm">
                        <h5 class="card-title mb-0">Itineraries</h5>
                    </div>
                    <div class="col-sm-auto d-none">
                        <a href="{{ route('admin.itinerary.create', ['id'=>$user_id]) }}" class="btn btn-success">
                            <i class="ri-add-line align-bottom me-1"></i> Add Itinerary
                        </a>
                    </div>
                </div>
            </div>
            <div class="card-body">
                @if (!$showItineraries)
                    <div class="text-center text-muted">
                        <strong>No start or end date is set for the journey. Please set the dates to view itineraries.</strong>
                    </div>
                @else
                    <div class="row justify-content-start">
                        @for ($i = 0; $i <= $days; $i++)
                            @php
                                $currentDate = $start_date->copy()->addDays($i)->format('Y-m-d');
                                $dayItineraries = $groupedItineraries->get($currentDate, []);
                            @endphp

                            <div class="col-lg-4 col-md-4 col-sm-4 mb-4">
                                <div class="card border-light shadow-sm rounded">
                                    <div class="card-body p-4">
                                        <h5 class="text-center text-uppercase font-weight-bold mb-3" style="font-size: 16px;">
                                            Day {{ $i + 1 }} - {{ \Carbon\Carbon::parse($currentDate)->format('d M Y') }}
                                        </h5>

                                        <div class="itinerary-slots">
                                            @foreach ($dayItineraries as $key => $itinerary)
                                                <div class="itinerary-slot mb-3 p-3 border rounded bg-light">
                                                    <div class="d-flex justify-content-between">
                                                        <div><strong>Slot {{ $key + 1 }}:</strong></div>
                                                    </div>
                                                    <div><strong>Start Time:</strong> {{ \Carbon\Carbon::parse($itinerary->start_time)->format('H:i') }}</div>
                                                    <!--<div><strong>End Time:</strong> {{ \Carbon\Carbon::parse($itinerary->end_time)->format('H:i') }}</div>-->
                                                    <div><strong>Description:</strong> {{ $itinerary->description }}</div>
                                                </div>
                                            @endforeach

                                            @if ($dayItineraries && $dayItineraries->isEmpty())
                                                <div class="text-muted text-center" style="background-color: #f8d7da; color: #721c24; padding: 10px; border-radius: 5px;">
                                                    <strong>No itineraries available for this day.</strong>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endfor
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>

@endsection

@section('script')
<script>
    $(document).ready(function() {
        // Add any additional JavaScript you might need
    });
</script>
@endsection