@extends('backend.teacher_backend.teacher_dashboard')
@section('teacher')

<div class="container my-4">

    <h4 class="text-center text-purple-700 mb-4">
        📊 CBT Results
    </h4>


        {{-- ================= SUCCESS / ERROR MESSAGE ================= --}}
    @if(session('message'))
        <div class="alert alert-{{ session('alert-type') == 'error' ? 'danger' : 'success' }}">
            {{ session('message') }}
        </div>
    @endif

    
    {{-- ================= FILTER FORM ================= --}}
    <div class="card shadow-sm mb-4">
        <div class="card-header fw-bold bg-light">
            🔍 Filter Results
        </div>

        <div class="card-body">
            <form action="{{ route('teacher.cbt.results.fetch') }}" method="POST" id="results-filter-form">
                @csrf

                <div class="mb-3">
                    <label for="class_id" class="form-label fw-semibold">Class</label>
                    <select name="class_id" id="class_id" class="form-select" required>
                        <option value="">-- Select Class --</option>
                        @foreach($assignedClasses as $class)
                            <option value="{{ $class->id }}"
                                {{ isset($selectedClass) && $selectedClass == $class->id ? 'selected' : '' }}>
                                {{ $class->class_name }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="mb-3">
                    <label for="subject_id" class="form-label fw-semibold">Subject</label>
                    <select name="subject_id" id="subject_id" class="form-select" required>
                        <option value="">-- Select Subject --</option>

                        @if(isset($selectedSubject) && $selectedSubject)
                            @php
                                $teacher = Auth::user()->teacher;
                                $subjects = \App\Models\Subject::whereHas('assignedTeachers', function($q) use ($teacher, $selectedClass){
                                    $q->where('teacher_id', $teacher->id)
                                      ->where('student_classes_id', $selectedClass);
                                })->get();
                            @endphp

                            @foreach($subjects as $sub)
                                <option value="{{ $sub->id }}"
                                    {{ $sub->id == $selectedSubject ? 'selected' : '' }}>
                                    {{ $sub->subject_name }}
                                </option>
                            @endforeach
                        @endif
                    </select>
                </div>

                <button type="submit" class="btn btn-info">
                     Fetch Results
                </button>
            </form>
        </div>
    </div>
    {{-- ================= END FILTER FORM ================= --}}

    {{-- ================= RESULTS TABLE ================= --}}
    @if(isset($results) && $results->isNotEmpty())

        {{-- Selected Info --}}
        <div class="alert alert-info shadow-sm">
            <strong>Selected Class:</strong>
            {{ optional($results->first()->test->class)->class_name }} <br>

            <strong>Selected Subject:</strong>
            {{ optional($results->first()->test->subject)->subject_name }}
        </div>

        <div class="card shadow-sm">
  


            <div class="p-4">

    <button id="exportCSV"  type="button"
            class="btn btn-success">
        Export CSV
    </button>

    <button id="exportPDF"  type="button"
            class="btn btn-danger">
        Download PDF
    </button>

    <button type="button"
            class="btn btn-warning"
            onclick="confirmRetakeSelected()">

         Retake Selected

    </button>

    @if($results->count() > 0)
    <form id="retake-all-form"
          action="{{ route('teacher.cbt.retake.all') }}"
          method="POST"
          style="display:inline-block">

        @csrf

        <input type="hidden"
               name="class_id"
               value="{{ $selectedClass }}">

        <input type="hidden"
               name="subject_id"
               value="{{ $selectedSubject }}">

        <button type="button"
                class="btn btn-secondary"
                onclick="confirmRetakeAll()">

             Retake All

        </button>

    </form>
@endif
</div>




            <div class="card-body table-responsive">
                <table class="table table-bordered table-striped align-middle mb-0">
                    <thead class="table-light">
                        <tr>
                            <th>
                                <input type="checkbox" id="checkAll">
                            </th>
                            <th>#</th>
                            <th>Student Name</th>
                            <th>Class</th>
                            <th>Assessment Type</th>
                            <th>Score</th>
                            <th>Action</th>
                        </tr>
                    </thead>

                    <tbody>
                        @foreach($results as $key => $result)
                        <tr>
                            <td>
                              <input type="checkbox" class="student-checkbox" value="{{ $result->id }}">
                            </td>
                            <td>{{ $key + 1 }}</td>
                            <td>{{ ucwords(strtolower($result->student->name)) }}</td>
                            <td>{{ strtoupper($result->test->class->class_name) }}</td>
                            <td>{{ ucfirst($result->test->assessment_type) }}</td>
                            <td class="fw-bold">{{ $result->score }}</td>
                            <td>
                                <form id="retake-form-{{ $result->id }}"
                                      action="{{ route('teacher.cbt.retake', $result->id) }}"
                                      method="POST">
                                    @csrf

                                    <button type="button"
                                            class="btn btn-warning btn-sm"
                                            onclick="confirmRetake({{ $result->id }})">
                                        🔄 Retake
                                    </button>
                                </form>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>

                </table>
     <form id="retake-selected-form"
      action="{{ route('teacher.cbt.retake.selected') }}"
      method="POST">

    @csrf

    <div id="selectedAttempts"></div>

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

    @elseif(isset($results))
        <div class="alert alert-info mt-3">
            No results found for selected class and subject.
        </div>
    @endif

</div>



<script>
function confirmRetake(attemptId) {
    Swal.fire({
        title: 'Allow Retake?',
        text: "This will delete the student's attempt and answers.",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, allow retake!',
        cancelButtonText: 'Cancel'
    }).then((result) => {
        
    if (result.isConfirmed) {

    $.ajax({
        url: $('#retake-form-' + attemptId).attr('action'),
        type: 'POST',
        data: $('#retake-form-' + attemptId).serialize(),

        success: function () {

            Swal.fire(
                'Success',
                'Student can now retake the CBT.',
                'success'
            );

            $('#retake-form-' + attemptId)
                .closest('tr')
                .fadeOut();
        },

        error: function () {

            Swal.fire(
                'Error',
                'Operation failed.',
                'error'
            );

        }
    });

}
    });
}



// AJAX: Load subjects when class changes
$('#class_id').change(function () {

    let classId = $(this).val();
    let subjectSelect = $('#subject_id');

    subjectSelect.html('<option value="">Loading subjects...</option>');

    if (classId) {

        $.ajax({
            url: "{{ route('teacher.cbt.results.fetchSubjects', ':id') }}".replace(':id', classId),
            type: "GET",
            success: function(data){

                subjectSelect.html('<option value="">-- Select Subject --</option>');

                if(data.length === 0){
                    subjectSelect.html('<option value="">No subjects assigned to this class</option>');
                    return;
                }

                $.each(data, function(index, subject){

                    subjectSelect.append(
                        `<option value="${subject.id}">
                            ${subject.subject_name}
                        </option>`
                    );

                });

            },
            error: function(xhr){
                console.log(xhr.responseText);
                alert('Failed to load subjects.');
            }
        });

    } else {

        subjectSelect.html('<option value="">-- Select Subject --</option>');

    }

});



// EXPORT CSV
$('#exportCSV').click(function () {

    let classId = $('#class_id').val();
    let subjectId = $('#subject_id').val();

    let url =
    "{{ route('cbt.results.export.csv') }}"
    + "?class_id=" + classId
    + "&subject_id=" + subjectId;

    window.location.href = url;
});


// DOWNLOAD PDF
$('#exportPDF').click(function () {

    let classId = $('#class_id').val();
    let subjectId = $('#subject_id').val();

    let url =
    "{{ route('cbt.results.export.pdf') }}"
    + "?class_id=" + classId
    + "&subject_id=" + subjectId;

    window.open(url, '_blank');
});




// CHECK ALL
$('#checkAll').on('change', function () {

    $('.student-checkbox').prop(
        'checked',
        $(this).is(':checked')
    );

});



// RETAKE SELECTED
function confirmRetakeSelected() {

    let checked = [];

    $('.student-checkbox:checked').each(function () {

        checked.push($(this).val());

    });

    if (checked.length === 0) {

        Swal.fire(
            'No Student Selected',
            'Please select at least one student.',
            'warning'
        );

        return;
    }

    Swal.fire({
        title: 'Allow Retake?',
        text: 'Selected students will retake the CBT.',
        icon: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes, Continue'
    }).then((result) => {

        if (result.isConfirmed) {

            let container =
                $('#selectedAttempts');

            container.html('');

            checked.forEach(function(id){

                container.append(
                    `<input
                        type="hidden"
                        name="attempt_ids[]"
                        value="${id}">
                    `
                );

            });

            
            $.ajax({
    url: $('#retake-selected-form').attr('action'),
    type: 'POST',
    data: $('#retake-selected-form').serialize(),

    success: function () {

        Swal.fire(
            'Success',
            'Selected students can now retake.',
            'success'
        );

        $('.student-checkbox:checked')
            .closest('tr')
            .fadeOut();
    },

    error: function () {

        Swal.fire(
            'Error',
            'Operation failed.',
            'error'
        );

    }
});

        }

    });

}



// RETAKE ALL
function confirmRetakeAll() {

    Swal.fire({
        title: 'Retake ALL Students?',
        text: 'This will delete ALL attempts and answers for this CBT result.',
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#d33',
        cancelButtonColor: '#3085d6',
        confirmButtonText: 'Yes, Retake All!',
        cancelButtonText: 'Cancel'
    }).then((result) => {

        if (result.isConfirmed) {

            $.ajax({
    url: $('#retake-all-form').attr('action'),
    type: 'POST',
    data: $('#retake-all-form').serialize(),

    success: function () {

        Swal.fire(
            'Success',
            'All students can now retake.',
            'success'
        );

        $('table tbody').html(
            '<tr><td colspan="7" class="text-center text-success">All records removed successfully.</td></tr>'
        );
    },

    error: function () {

        Swal.fire(
            'Error',
            'Operation failed.',
            'error'
        );

    }
});

        }

    });

}
</script>

@endsection