@extends('admin.layout.app')

@section('content')

<div class="container-fluid py-4">

    {{-- Header --}}
    <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-3">

        <div>

            <h2 class="fw-bold mb-1">
                تقارير المحاضرات والمساجد
            </h2>

            <p class="text-muted mb-0">
                إحصائيات شاملة للمساجد والمديريات والمحاضرات
            </p>

        </div>

        {{-- Print Button --}}
        <div>

            <a href="{{ route('reports.print', request()->query()) }}" 
   target="_blank" 
   class="btn btn-danger rounded-3 px-4">
    <i class="fas fa-file-pdf me-1"></i> طباعة / PDF
</a>
        </div>

    </div>

    {{-- Filters --}}
    <div class="card border-0 shadow-sm mb-4 rounded-4 no-print">

        <div class="card-body">

            <form method="GET" action="{{ route('reports.index') }}">

                <div class="row g-3">

                    {{-- Mosque --}}
                    <div class="col-md-3">

                        <label class="form-label fw-bold">
                            المسجد
                        </label>

                        <select name="user_id" class="form-select">

                            <option value="">
                                كل المساجد
                            </option>

                            @foreach($mosques as $mosque)

                                <option
                                    value="{{ $mosque->id }}"
                                    {{ request('user_id') == $mosque->id ? 'selected' : '' }}
                                >
                                    {{ $mosque->user_name }}
                                </option>

                            @endforeach

                        </select>

                    </div>

                    {{-- Directorate --}}
                    <div class="col-md-3">

                        <label class="form-label fw-bold">
                            المديرية
                        </label>

                        <select name="directorate" class="form-select">

                            <option value="">
                                كل المديريات
                            </option>

                            @foreach($directories as $directory)

                                <option
                                    value="{{ $directory }}"
                                    {{ request('directorate') == $directory ? 'selected' : '' }}
                                >
                                    {{ $directory }}
                                </option>

                            @endforeach

                        </select>

                    </div>
    {{-- المجال --}}
                    <div class="col-md-2">

                        <label class="form-label fw-bold">
                            المجال
                        </label>

                        <select name="field" class="form-select">

                            <option value="">
                                كل المجالات
                            </option>

                            @foreach($fields as $field)

                                <option
                                    value="{{ $field }}"
                                    {{ request('field') == $field ? 'selected' : '' }}
                                >
                                    {{ $field }}
                                </option>

                            @endforeach

                        </select>

                    </div>

                    {{-- Type --}}
                    <div class="col-md-2">

                        <label class="form-label fw-bold">
                            النوع
                        </label>

                        <select name="type" class="form-select">

                            <option value="">
                                الكل
                            </option>

                            <option
                                value="خاطرة"
                                {{ request('type') == 'خاطرة' ? 'selected' : '' }}
                            >
                                خاطرة
                            </option>

                            <option
                                value="موعظة"
                                {{ request('type') == 'موعظة' ? 'selected' : '' }}
                            >
                                موعظة
                            </option>

                            <option
                                value="درس"
                                {{ request('type') == 'درس' ? 'selected' : '' }}
                            >
                                درس
                            </option>

                            <option
                                value="محاضرة"
                                {{ request('type') == 'محاضرة' ? 'selected' : '' }}
                            >
                                محاضرة
                            </option>

                        </select>

                    </div>

                    {{-- Rating --}}
                    <div class="col-md-2">

                        <label class="form-label fw-bold">
                            التقييم
                        </label>

                        <select name="rating" class="form-select">

                            <option value="">
                                الكل
                            </option>

                            <option value="ممتاز">ممتاز</option>
                            <option value="جيد جدًا">جيد جدًا</option>
                            <option value="جيد">جيد</option>
                            <option value="مقبول">مقبول</option>
                            <option value="ضعيف">ضعيف</option>

                        </select>

                    </div>

                    {{-- Buttons --}}
                    <div class="col-md-2 d-flex align-items-end gap-2">

                        <button class="btn btn-primary w-100 rounded-3">

                            <i class="fas fa-filter me-1"></i>

                            فلترة

                        </button>

                        <a
                            href="{{ route('reports.index') }}"
                            class="btn btn-secondary rounded-3"
                        >
                            <i class="fas fa-rotate-left"></i>
                        </a>

                    </div>

                </div>

            </form>

        </div>

    </div>

    {{-- Statistics --}}
    <div class="row g-4 mb-4">

        <div class="col-md-3">

            <div class="card border-0 shadow-sm rounded-4 h-100">

                <div class="card-body text-center">

                    <div class="mb-2 text-primary">

                        <i class="fas fa-book-open fa-2x"></i>

                    </div>

                    <h6 class="text-muted">
                        إجمالي المحاضرات
                    </h6>

                    <h2 class="fw-bold">
                        {{ $totalLectures }}
                    </h2>

                </div>

            </div>

        </div>

        <div class="col-md-3">

            <div class="card border-0 shadow-sm rounded-4 h-100">

                <div class="card-body text-center">

                    <div class="mb-2 text-success">

                        <i class="fas fa-users fa-2x"></i>

                    </div>

                    <h6 class="text-muted">
                        إجمالي الحضور
                    </h6>

                    <h2 class="fw-bold">
                        {{ $totalStudents }}
                    </h2>

                </div>

            </div>

        </div>

        <div class="col-md-3">

            <div class="card border-0 shadow-sm rounded-4 h-100">

                <div class="card-body text-center">

                    <div class="mb-2 text-warning">

                        <i class="fas fa-mosque fa-2x"></i>

                    </div>

                    <h6 class="text-muted">
                        عدد المساجد
                    </h6>

                    <h2 class="fw-bold">
                        {{ $totalMosques }}
                    </h2>

                </div>

            </div>

        </div>

        <div class="col-md-3">

            <div class="card border-0 shadow-sm rounded-4 h-100">

                <div class="card-body text-center">

                    <div class="mb-2 text-danger">

                        <i class="fas fa-star fa-2x"></i>

                    </div>

                    <h6 class="text-muted">
                        عدد التقييمات
                    </h6>

                    <h2 class="fw-bold">
                        {{ $avgRating }}
                    </h2>

                </div>

            </div>

        </div>

    </div>

    {{-- Reports Table --}}
    <div class="card border-0 shadow-sm rounded-4">

        <div class="card-header bg-white border-0 py-3">

            <h5 class="fw-bold mb-0">

                تقرير المساجد والمحاضرات

            </h5>

        </div>

        <div class="card-body">

            <div class="table-responsive">

                <table class="table table-bordered align-middle text-center">

                    <thead class="table-light">

                        <tr>

                            <th>#</th>

                            <th>المسجد</th>

                            <th>المديرية</th>

                            <th>عدد المحاضرات</th>

                            <th>عدد الحضور</th>

                            <th>آخر محاضرة</th>

                        </tr>

                    </thead>

                    <tbody>

                        @forelse($reports as $index => $row)

                            <tr>

                                <td>
                                    {{ $index + 1 }}
                                </td>

                                <td class="fw-bold">
                                    {{ $row->user_name }}
                                </td>

                                <td>
                                    {{ $row->directorate ?? '-' }}
                                </td>

                                <td>

                                    <span class="badge bg-primary px-3 py-2">

                                        {{ $row->lectures_count }}

                                    </span>

                                </td>

                                <td>

                                    <span class="badge bg-success px-3 py-2">

                                        {{ $row->students_count }}

                                    </span>

                                </td>

                                <td>

                                    {{ $row->last_lecture ?? '-' }}

                                </td>

                            </tr>

                        @empty

                            <tr>

                                <td colspan="6" class="text-center py-5">

                                    <div class="text-muted">

                                        لا توجد بيانات متاحة

                                    </div>

                                </td>

                            </tr>

                        @endforelse

                    </tbody>

                </table>

            </div>

        </div>

    </div>

</div>

{{-- Print Style --}}
<style>

@media print {

    .no-print,
    .btn,
    nav,
    aside,
    .sidebar,
    footer {
        display: none !important;
    }

    body {
        background: #fff !important;
    }

    .card {
        border: 1px solid #ddd !important;
        box-shadow: none !important;
    }

    table {
        font-size: 12px;
    }

}

</style>

@endsection