@extends('adminmodule::layouts.master')

@section('title', translate('review_list'))

@section('content')
    <div class="main-content">
        <div class="container-fluid">
            <div class="d-flex flex-wrap justify-content-between align-items-center mb-4 gap-3">
                <h2 class="fs-22 text-capitalize">{{ translate('review_list') }}</h2>

                <div class="d-flex align-items-center gap-2 text-capitalize">
                    <span class="text-muted">{{ translate('total_review') }} : </span>
                    <span class="text-primary fs-16 fw-bold">{{ $reviews->total() }}</span>
                </div>
            </div>

            <div class="card">
                <div class="card-body">
                    <div class="table-top d-flex flex-wrap gap-10 justify-content-between">
                        <form action="{{ route('admin.review.index') }}" method="GET"
                            class="search-form search-form_style-two">
                            <div class="input-group search-form__input_group">
                                <span class="search-form__icon">
                                    <i class="bi bi-search"></i>
                                </span>
                                <input type="search" name="search" value=""
                                    class="theme-input-style search-form__input"
                                    placeholder="Search" />
                            </div>
                            <button type="submit" class="btn btn-primary search-submit">
                                Search
                            </button>
                        </form>
                        <div class="d-flex flex-wrap gap-3">
                            <div class="col-sm-6 col-lg-4 col-xl-3">
                                <select name="rating" class="js-select">
                                    <option value="">{{ translate('all') }} {{ translate('rating') }}</option>
                                    @for ($rating = 5; $rating >= 1; $rating--)
                                        <option value="{{ $rating }}"
                                            {{ (string) request('rating') === (string) $rating ? 'selected' : '' }}>
                                            {{ $rating }} {{ translate('rating') }}
                                        </option>
                                    @endfor
                                </select>
                            </div>

                            <div class="review-filter-control">
                                <select name="given_by_type" class="js-select">
                                    <option value="">Given by all</option>
                                    <option value="{{ CUSTOMER }}"
                                        {{ request('given_by_type') === CUSTOMER ? 'selected' : '' }}>
                                        {{ translate('customer') }}
                                    </option>
                                    <option value="{{ DRIVER }}"
                                        {{ request('given_by_type') === DRIVER ? 'selected' : '' }}>
                                        {{ translate('driver') }}
                                    </option>
                                </select>
                            </div>

                            <div class="review-filter-control">
                                <select name="received_by_type" class="js-select">
                                    <option value="">Received by all</option>
                                    <option value="{{ CUSTOMER }}"
                                        {{ request('received_by_type') === CUSTOMER ? 'selected' : '' }}>
                                        {{ translate('customer') }}
                                    </option>
                                    <option value="{{ DRIVER }}"
                                        {{ request('received_by_type') === DRIVER ? 'selected' : '' }}>
                                        {{ translate('driver') }}
                                    </option>
                                </select>
                            </div>

                            <button type="submit" class="btn btn-outline-primary">
                                <i class="bi bi-funnel"></i>
                                {{ translate('filter') }}
                            </button>
                        </div>
                    </div>

                    <div class="table-responsive mt-3">
                        <table class="table table-borderless align-middle table-hover">
                            <thead class="table-light align-middle text-capitalize text-nowrap">
                                <tr>
                                    <th>{{ translate('SL') }}</th>
                                    <th>{{ translate('trip_ID') }}</th>
                                    <th>Given by</th>
                                    <th>Received by</th>
                                    <th>{{ translate('trip_type') }}</th>
                                    <th>{{ translate('rating') }}</th>
                                    <th>{{ translate('review') }}</th>
                                    <th>{{ translate('date') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($reviews as $key => $review)
                                    <tr>
                                        <td>{{ $reviews->firstItem() + $key }}</td>
                                        <td>
                                            @if ($review?->trip)
                                                <a
                                                    href="{{ route('admin.trip.show', ['type' => $review->trip_type ?? 'all', 'id' => $review->trip->id, 'page' => 'summary']) }}">
                                                    #{{ $review->trip->ref_id }}
                                                </a>
                                            @else
                                                <span class="text-muted">--</span>
                                            @endif
                                        </td>
                                        <td>
                                            @php($givenUser = $review?->givenUser)
                                            @if ($givenUser)
                                                <a
                                                    href="{{ $givenUser->user_type === DRIVER ? route('admin.driver.show', [$givenUser->id]) : route('admin.customer.show', [$givenUser->id]) }}">
                                                    {{ trim($givenUser->first_name . ' ' . $givenUser->last_name) ?: $givenUser->email ?? $givenUser->phone }}
                                                </a>
                                                <div class="text-muted small text-capitalize">
                                                    {{ translate($givenUser->user_type) }}</div>
                                            @else
                                                <span class="text-muted">--</span>
                                            @endif
                                        </td>
                                        <td>
                                            @php($receivedUser = $review?->receivedUser)
                                            @if ($receivedUser)
                                                <a
                                                    href="{{ $receivedUser->user_type === DRIVER ? route('admin.driver.show', [$receivedUser->id]) : route('admin.customer.show', [$receivedUser->id]) }}">
                                                    {{ trim($receivedUser->first_name . ' ' . $receivedUser->last_name) ?: $receivedUser->email ?? $receivedUser->phone }}
                                                </a>
                                                <div class="text-muted small text-capitalize">
                                                    {{ translate($receivedUser->user_type) }}</div>
                                            @else
                                                <span class="text-muted">--</span>
                                            @endif
                                        </td>
                                        <td class="text-capitalize">{{ translate($review->trip_type ?? 'N/A') }}</td>
                                        <td>
                                            <div class="d-flex align-items-center gap-2">
                                                {{ $review->rating }}
                                                <i class="bi bi-star-fill text-warning"></i>
                                            </div>
                                        </td>
                                        <td>
                                            <div class="max-w300 text-wrap">
                                                {{ $review->feedback ?: '--' }}
                                            </div>
                                        </td>
                                        <td class="text-nowrap">
                                            <div dir="ltr">
                                                {{ $review->created_at?->format('d F Y') }}<br>
                                                {{ $review->created_at?->format('h:i a') }}
                                            </div>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8">
                                            <div
                                                class="d-flex flex-column justify-content-center align-items-center gap-2 py-3">
                                                <img src="{{ asset('assets/admin-module/img/empty-icons/no-data-found.svg') }}"
                                                    alt="" width="100">
                                                <p class="text-center">{{ translate('no_data_available') }}</p>
                                            </div>
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    <div
                        class="table-bottom d-flex flex-column flex-sm-row justify-content-sm-between align-items-center gap-2">
                        <p class="mb-0"></p>
                        {{ $reviews->withQueryString()->links() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('css_or_js')
    <style>
        .review-list-toolbar {
            display: grid;
            grid-template-columns: minmax(280px, 1.4fr) repeat(3, minmax(150px, 0.8fr)) auto auto;
            gap: 10px;
            align-items: center;
        }

        .review-search-group {
            display: grid;
            grid-template-columns: minmax(180px, 1fr) auto;
            gap: 8px;
            min-width: 0;
        }

        .review-list-toolbar .search-form__input_group,
        .review-list-toolbar .search-form__input {
            width: 100%;
        }

        .review-filter-control {
            min-width: 0;
        }

        .review-filter-control .select2-container {
            width: 100% !important;
        }

        .review-list-toolbar .btn {
            min-height: 40px;
            white-space: nowrap;
        }

        @media (max-width: 1399px) {
            .review-list-toolbar {
                grid-template-columns: minmax(280px, 1fr) repeat(3, minmax(150px, 1fr));
            }

            .review-list-toolbar .btn {
                justify-self: start;
            }
        }

        @media (max-width: 991px) {
            .review-list-toolbar {
                grid-template-columns: 1fr 1fr;
            }

            .review-search-group {
                grid-column: 1 / -1;
            }
        }

        @media (max-width: 575px) {

            .review-list-toolbar,
            .review-search-group {
                grid-template-columns: 1fr;
            }

            .review-list-toolbar .btn {
                width: 100%;
                justify-self: stretch;
            }
        }
    </style>
@endpush