@extends('dashboard.layouts.app')

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card h-100 border-0 shadow-sm overflow-hidden p-3">
                    <div
                        class="card-header border-bottom py-3 px-5 d-flex align-items-center flex-wrap justify-content-between gap-3">
                        <h5 class="mb-0">
                            {{ $sort === 'low' ? 'Low Purchased Courses' : 'High Purchased Courses' }}
                        </h5>
                        <form action="{{ route('courses.high-purchased') }}" method="GET">
                            <div class="d-flex align-items-center gap-2">
                                <label class="text-secondary fw-medium" for="sort">Sort</label>
                                <select name="sort" id="sort" class="form-select form-select-sm w-auto"
                                    onchange="this.form.submit()">
                                    <option value="high" {{ $sort !== 'low' ? 'selected' : '' }}>High purchases first
                                    </option>
                                    <option value="low" {{ $sort === 'low' ? 'selected' : '' }}>Low purchases first
                                    </option>
                                </select>

                                <label class="text-secondary fw-medium ms-3" for="per_page">Per Page</label>
                                <select name="per_page" id="per_page" class="form-select form-select-sm w-auto"
                                    onchange="this.form.submit()">
                                    @foreach ([5, 10, 25, 50, 100] as $count)
                                        <option value="{{ $count }}"
                                            {{ request('per_page', 10) == $count ? 'selected' : '' }}>
                                            {{ $count }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </form>
                    </div>

                    <div class="text-center table table-bordered table-sm table bordered-table sm-table mb-0">
                        <table class="text-center table table-bordered table-sm table bordered-table sm-table mb-0">
                            <thead>
                                <tr>
                                    <th>#</th>
                                    <th>Course (EN)</th>
                                    <th>Course (AR)</th>
                                    <th>Purchase Count</th>
                                    <th>Gross Revenue</th>
                                    <th>Net Revenue</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($courses as $course)
                                    <tr>
                                        <td>{{ ($courses->currentPage() - 1) * $courses->perPage() + $loop->iteration }}</td>
                                        <td>{{ $course->track->name_en ?? '—' }}</td>
                                        <td>{{ $course->track->name_ar ?? '—' }}</td>
                                        <td>{{ number_format($course->count_id) }}</td>
                                        <td>{{ number_format($course->gross_revenue, 2) }}</td>
                                        <td>{{ number_format($course->net_revenue, 2) }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="6" class="text-center">No purchased courses found.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    <div class="m-2">
                        {{ $courses->links('pagination::bootstrap-5') }}
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection