@extends('backoffice.dashboard')

@section('content')

@if(Auth::check())

<div class="container-fluid dashboard-inner-body-container">
  <div class="row">
    <div class="col-lg-12">
      <div class="block-card dashboard-card mb-4 px-0">

        <div class="block-card-header px-4 border-bottom-0 pb-0 d-flex justify-content-between">
          <h2 class="widget-title pb-0">طلبات التظاهرات الرياضية الوطنية</h2>
          <a class="btn btn-success font-weight-medium" href="{{ route('admin.manifestation.create') }}">
            <i class="la la-plus mr-1"></i> إضافة طلب
          </a>
        </div>

        <div class="block-card-header px-4 border-bottom-0 pb-0">
          <form method="GET" action="{{ route('admin.manifestation.index') }}">
            <div class="form-row align-items-center">
              <div class="col-auto" style="width: 200px;">
                <select class="form-control" name="search_option" onchange="showSearchInput(this.value)">
                  <option value="">اختر نوع البحث</option>
                  <option value="date" {{ request('search_option') == 'date' ? 'selected' : '' }}>تاريخ التقديم</option>
                  <option value="type_identite" {{ request('search_option') == 'type_identite' ? 'selected' : '' }}>نوع الهوية</option>
                </select>
              </div>
              <div class="col-auto" id="searchByDate" style="display:none; width: 180px;">
                <input type="date" class="form-control" name="date" value="{{ request('date') }}">
              </div>
              <div class="col-auto" id="searchByTypeIdentite" style="display:none; width: 200px;">
                <select class="form-control" name="type_identite">
                  <option value="">-- اختر نوع الهوية --</option>
                  @foreach($typesIdentite as $type)
                    <option value="{{ $type->id_type }}" {{ request('type_identite') == $type->id_type ? 'selected' : '' }}>
                      {{ $type->type_ar }}
                    </option>
                  @endforeach
                </select>
              </div>
              <div class="col-auto">
                <button type="submit" class="btn bg-rgb-primary1 font-weight-medium" style="width: 105px;">بحث</button>
                <a href="{{ route('admin.manifestation.index') }}" class="btn bg-rgb-primary1 font-weight-medium" style="width: 105px;">إعادة تعيين</a>
              </div>
            </div>
          </form>
        </div>

        <div class="block-card-body">
          @if(session('success'))
            <div class="alert alert-success alert-dismissible fade show" role="alert">
              {{ session('success') }}
              <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
            </div>
          @endif

          <div class="my-table table-responsive" style="direction: rtl; text-align: right;">
            <table class="table align-items-center table-flush mb-0 table-hover" style="direction: rtl; text-align: right;">
                <thead class="thead-light">
                    <tr>
                        <th>المعرف</th>
                        <th>رقم الملف</th>
                        <th>اسم الهيكل</th>
                        <th>اسم التظاهرة</th>
                        <th>التاريخ</th>
                        <th>الولاية</th>
                        <th>البلدية</th>
                        <th>الحالة</th>
                        <th width="15%">إجراءات</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($rows as $i => $row)
                    <tr>
                        <td>{{ $i + 1 }}</td>
                        <td>{{ $row->num_dossier }}</td>
                        <td>{{ $row->nom_organisme ?? '-' }}</td>
                        <td>{{ $row->nom_evenement ?? '-' }}</td>
                        <td>{{ $row->date_even ?? '-' }}</td>
                       
                        <td>{{ $row->gouvernorat ?? ($row->raw->evenementSportifs->first()?->gouvernorat->nom_ar ?? '-') }}</td>
                        <td>{{ $row->delegation ?? ($row->raw->evenementSportifs->first()?->delegation->nom_ar ?? '-') }}</td>
                        <td>
                          <span class="status-badge 
                            {{ $row->statut?->statut_ar == 'قبول' ? 'status-badge--success' : 
                              ($row->statut?->statut_ar == 'رفض' ? 'status-badge--danger' : 'status-badge--pending') }}">
                              {{ $row->statut?->statut_ar ?? 'في الانتظار' }}
                          </span>
                        </td>
                        <td class="text-center">
                            <div class="d-flex flex-wrap gap-2 justify-content-center">
                                <a href="{{ route('admin.manifestation.show', $row->id_demande) }}"
                                  class="btn-icon btn-icon--info" title="عرض">
                                    <i class="la la-eye"></i> 
                                </a>
                                @if($row->raw->id_type == 2)
                                  <a href="{{ route('admin.manifestation.edit', $row->id_demande) }}"
                                    class="btn-icon btn-icon--warning" title="تعديل">
                                      <i class="la la-edit"></i> 
                                  </a>

                                  <form action="{{ route('admin.manifestation.toggle_statut', $row->id_demande) }}" enctype="multipart/form-data"  method="POST" class="d-inline">
                                      @csrf
                                      @method('PATCH')
                                      <button type="button"
                                              onclick="confirmStatusChange10(this.closest('form'), '{{ $row->statut->statut_ar }}')"
                                              class="btn-icon btn-icon--secondary"
                                              title="تغيير الحالة" aria-label="تغيير الحالة">
                                          <i class="la la-toggle-on"></i>
                                      </button>
                                  </form>

                                  <form action="{{ route('admin.manifestation.destroy', $row->id_demande) }}" method="POST" style="display: inline;">
                                      @csrf
                                      @method('DELETE')
                                      <button type="submit"
                                          class="btn-icon btn-icon--danger"
                                          title="حذف"
                                          onclick="return confirm('هل أنت متأكد من الحذف؟')">
                                          <i class="la la-trash"></i> 
                                      </button>
                                  </form>
                              @endif

                            </div>
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="10" class="text-center">لا توجد طلبات تظاهرات رياضية.</td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

<div class="d-flex justify-content-between align-items-center mt-3">
                      {{ $demandes->links('pagination::bootstrap-5') }}
                    </div>
       
    </div>
</div>
</div>
</div>
</div>


<script>
    function showSearchInput(value) {
        document.getElementById('searchByDate').style.display = (value == 'date') ? 'block' : 'none';
        document.getElementById('searchByTypeIdentite').style.display = (value == 'type_identite') ? 'block' : 'none';
    }
</script>
<link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet">

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script src="{{ asset('assets/js/index.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>

<!-- Assure-toi d'avoir SweetAlert2 -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
async function confirmStatusChange10(form, currentStatus) {
    const formData = new FormData(form);

    // Étape 1️⃣ : الإدارة الفرعية
    const { value: id_statut } = await Swal.fire({
        title: 'تغيير الحالة من قبل الإدارة الفرعية',
        input: 'radio',
        inputOptions: { '1': 'قبول', '3': 'رفض' },
        inputValidator: (v) => !v && 'اختر الحالة الجديدة!',
        showCancelButton: true,
        confirmButtonText: 'التالي',
        cancelButtonText: 'إلغاء',
        reverseButtons: true
    });
    if (!id_statut) return;
    formData.append('id_statut', id_statut);

    if (id_statut == '3') {
        const { value: motif } = await Swal.fire({
            title: 'سبب الرفض من الإدارة الفرعية',
            input: 'textarea',
            inputPlaceholder: 'الرجاء إدخال سبب الرفض',
            inputValidator: (v) => !v && 'يجب إدخال سبب الرفض!',
            showCancelButton: true,
            confirmButtonText: 'تأكيد',
            cancelButtonText: 'إلغاء',
            reverseButtons: true
        });
        if (!motif) return;
        formData.append('commentaire_motif', motif);
        return submitFormData(form.action, formData);
    }

    // Étape 2️⃣ : الجامعة
    const { value: statut_id } = await Swal.fire({
        title: 'تغيير الحالة من قبل الجامعة',
        input: 'radio',
        inputOptions: { '1': 'قبول', '3': 'رفض' },
        inputValidator: (v) => !v && 'اختر الحالة!',
        showCancelButton: true,
        confirmButtonText: 'التالي',
        cancelButtonText: 'إلغاء',
        reverseButtons: true
    });
    if (!statut_id) return;
    formData.append('statut_id', statut_id);

    if (statut_id == '3') {
        const { value: motif2 } = await Swal.fire({
            title: 'سبب الرفض من الجامعة',
            input: 'textarea',
            inputPlaceholder: 'الرجاء إدخال سبب الرفض',
            inputValidator: (v) => !v && 'يجب إدخال سبب الرفض!',
            showCancelButton: true,
            confirmButtonText: 'تأكيد',
            cancelButtonText: 'إلغاء',
            reverseButtons: true
        });
        if (!motif2) return;
        formData.append('commentaire_motif2', motif2);
        return submitFormData(form.action, formData);
    }

    // Étape 3️⃣ : اللجنة الوطنية المختلطة
    const { value: statut2_id } = await Swal.fire({
        title: 'تغيير الحالة من قبل اللجنة الوطنية المختلطة',
        input: 'radio',
        inputOptions: { '1': 'قبول', '3': 'رفض' },
        inputValidator: (v) => !v && 'اختر الحالة!',
        showCancelButton: true,
        confirmButtonText: 'التالي',
        cancelButtonText: 'إلغاء',
        reverseButtons: true
    });
    if (!statut2_id) return;
    formData.append('statut2_id', statut2_id);

    if (statut2_id == '3') {
        const { value: motif3 } = await Swal.fire({
            title: 'سبب الرفض من اللجنة الوطنية المختلطة',
            input: 'textarea',
            inputPlaceholder: 'الرجاء إدخال سبب الرفض',
            inputValidator: (v) => !v && 'يجب إدخال سبب الرفض!',
            showCancelButton: true,
            confirmButtonText: 'تأكيد',
            cancelButtonText: 'إلغاء',
            reverseButtons: true
        });
        if (!motif3) return;
        formData.append('commentaire_motif3', motif3);
        return submitFormData(form.action, formData);
    }

    // Étape 4️⃣ : إدراج الترخيص (fichier réel)
    const { value: file } = await Swal.fire({
        title: 'أضف الترخيص (PDF أو صورة)',
        html: '<input type="file" id="fileInput" class="swal2-input" accept=".pdf,.jpg,.png,.jpeg">',
        showCancelButton: true,
        confirmButtonText: 'رفع الملف',
        cancelButtonText: 'تخطي',
        reverseButtons: true,
        preConfirm: () => {
            const input = document.getElementById("fileInput");
            return input.files.length > 0 ? input.files[0] : null;
        }
    });

    if (file) {
        formData.append('file', file); // 🔥 vrai fichier
    }

    submitFormData(form.action, formData);
}

// 🔹 Envoi du FormData avec Fetch
async function submitFormData(url, formData) {
    const response = await fetch(url, {
        method: 'POST',
        body: formData,
        headers: {
            'X-CSRF-TOKEN': document.querySelector('input[name="_token"]').value,
            'X-HTTP-Method-Override': 'PATCH'
        }
    });

    if (response.ok) {
        Swal.fire({
            icon: 'success',
            title: 'تم تحديث الحالة بنجاح',
            confirmButtonText: 'حسناً'
        }).then(() => location.reload());
    } else {
        Swal.fire({
            icon: 'error',
            title: 'حدث خطأ أثناء الحفظ',
            confirmButtonText: 'موافق'
        });
    }
}
</script>




@else
<script> window.location.href = "{{ route('admin') }}"; </script>
@endif

@endsection