@extends('layouts.app')

@section('content')
    <main class="main">

        <div class="site-breadcrumb" style="background: url({{asset('assets/img/breadcrumb/01.jpg')}})">
            <div class="container">
                <h2 class="breadcrumb-title">پرواز با عرض کامل</h2>
                <ul class="breadcrumb-menu">
                    <li><a href="{{ route('index') }}">صفحه اصلی</a></li>
                    <li class="active">پرواز با عرض کامل</li>
                </ul>
            </div>
        </div>



        <div class="flight-booking flight-list py-120">
            <div class="container">
                <div class="row">


                        <div class="row">

                            @forelse($flights as $flight)
                                <div class="col-lg-12">
                                    <div class="flight-booking-item">
                                        <div class="flight-booking-wrapper">
                                            <div class="flight-booking-info">
                                                <div class="flight-booking-content">
                                                    <div class="flight-booking-airline">
                                                        <div class="flight-airline-img">
                                                            <img src="{{ asset('assets/img/flight/airline-7.png') }}" alt="{{ $flight->airline->name ?? '' }}">
                                                        </div>
                                                        <h5 class="flight-airline-name">{{ $flight->airline->name ?? '' }}</h5>
                                                    </div>
                                                    <div class="flight-booking-time">
                                                        <div class="start-time">
                                                            <div class="start-time-icon">
                                                                <i class="fal fa-plane-departure"></i>
                                                            </div>
                                                            <div class="start-time-info">
                                                                <h6 class="start-time-text">{{ $flight->start_time_fa }}</h6>
                                                                <span class="flight-destination">{{ $flight->airport->city ?? '' }}</span>
                                                            </div>
                                                        </div>
                                                        <div class="flight-stop">
                                                            <span class="flight-stop-number">بدون توقف</span>
                                                            <div class="flight-stop-arrow"></div>
                                                        </div>
                                                        <div class="end-time">
                                                            <div class="start-time-icon">
                                                                <i class="fal fa-plane-arrival"></i>
                                                            </div>
                                                            <div class="start-time-info">
                                                                <h6 class="end-time-text">{{ $flight->end_time_fa }}</h6>
                                                                <span class="flight-destination">{{ $flight->destinationAirport->city ?? '' }}</span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="flight-booking-duration">
                                                        <span class="duration-text">
                                                            {{ $flight->duration_hours }} ساعت
                                                            @if($flight->duration_minutes != 0)
                                                                {{ $flight->duration_minutes }}دقیقه
                                                            @else

                                                            @endif

                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="flight-booking-price">
                                                <div class="price-info">
                                                    <span class="price-amount">{{ number_format($flight->price) }} تومان</span>
                                                </div>
                                                <a href="{{ route('flight.show', $flight->id) }}" class="theme-btn">اکنون ثبت کن<i class="far fa-arrow-left"></i></a>
                                            </div>
                                        </div>
                                        <div class="flight-booking-detail">
                                            <div class="flight-booking-detail-header">
                                                <p>ظرفیت باقی‌مانده: {{ $flight->capacity }} صندلی</p>
                                                <a href="#flight-booking-collapse{{ $flight->id }}" data-bs-toggle="collapse" role="button" aria-expanded="false" aria-controls="flight-booking-collapse{{ $flight->id }}">
                                                    اطلاعات پرواز <i class="far fa-angle-down"></i>
                                                </a>
                                            </div>
                                            <div class="collapse" id="flight-booking-collapse{{ $flight->id }}">
                                                <div class="flight-booking-detail-wrapper">
                                                    <div class="row">
                                                        <div class="col-lg-12 col-xl-6">
                                                            <div class="flight-booking-detail-left">
                                                                <ul class="nav nav-tabs" id="flTab{{ $flight->id }}" role="tablist">
                                                                    <li class="nav-item" role="presentation">
                                                                        <button class="nav-link active" id="fl-tab{{ $flight->id }}" data-bs-toggle="tab" data-bs-target="#fl-tab-pane{{ $flight->id }}" type="button" role="tab" aria-controls="fl-tab-pane{{ $flight->id }}" aria-selected="true">
                                                                            {{ $flight->airport->city ?? '' }} - {{ $flight->destinationAirport->city ?? '' }}
                                                                        </button>
                                                                    </li>
                                                                </ul>
                                                                <div class="tab-content" id="flTabContent{{ $flight->id }}">
                                                                    <div class="tab-pane fade show active" id="fl-tab-pane{{ $flight->id }}" role="tabpanel" aria-labelledby="fl-tab{{ $flight->id }}" tabindex="0">
                                                                        <div class="flight-booking-detail-info">
                                                                            <div class="flight-booking-airline">
                                                                                <div class="flight-airline-img">
                                                                                    <img src="{{ asset('assets/img/flight/airline-7.png') }}" alt="{{ $flight->airline->name ?? '' }}">
                                                                                </div>
                                                                                <div class="flight-airline-info flex-grow-1">
                                                                                    <h5 class="flight-airline-name">{{ $flight->airline->name ?? '' }}</h5>
                                                                                    <span class="flight-airline-model">{{ $flight->flight_number }}</span>
                                                                                </div>
                                                                            </div>
                                                                            <div class="flight-booking-time">
                                                                                <div class="start-time">
                                                                                    <div class="start-time-icon">
                                                                                        <i class="fal fa-plane-departure"></i>
                                                                                    </div>
                                                                                    <div class="start-time-info">
                                                                                        <h6 class="start-time-text">{{ $flight->start_time_fa }}</h6>
                                                                                        <p class="flight-full-date">{{ $flight->full_date_fa }}</p>
                                                                                        <span class="flight-destination">{{ $flight->airport->city ?? '' }}</span>
                                                                                    </div>
                                                                                </div>
                                                                                <div class="flight-stop">
                                                                                    <span class="flight-stop-number">بدون توقف</span>
                                                                                    <div class="flight-stop-arrow"></div>
                                                                                    <div class="flight-booking-duration">
                                                                                        <span class="duration-text">{{ $flight->duration_hours }} ساعت {{ $flight->duration_minutes }} دقیقه</span>
                                                                                    </div>
                                                                                </div>
                                                                                <div class="start-time-info">
                                                                                    <h6 class="end-time-text">{{ $flight->end_time_fa }}</h6>
                                                                                         <p class="flight-full-date">{{ $flight->end_date_fa }}</p>
                                                                                    <span class="flight-destination">{{ $flight->destinationAirport->city ?? '' }}</span>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-12 col-xl-6">
                                                            <div class="flight-booking-detail-right">
                                                                <div class="flight-booking-detail-price">
                                                                    <h6 class="flight-booking-detail-price-title">قیمت هر صندلی</h6>
                                                                    <div class="flight-detail-price-amount">
                                                                        {{ number_format($flight->price) }} تومان
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @empty
                                <div class="col-12">
                                    <p>پروازی یافت نشد.</p>
                                </div>
                            @endforelse

                            <div class="pagination-area">
                                <div aria-label="Page navigation example">
                                    {{ $flights->links() }}
                                </div>
                                <div class="pagination-showing">
                                    <p>نمایش {{ $flights->firstItem() }} - {{ $flights->lastItem() }} از {{ $flights->total() }} پرواز</p>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

    </main>

@endsection