@extends('layouts/eims_layout')
@section('title', '| ' . $pageTitle)
@section('content')
    @include('successMsg')

    <div class="row add-data-form">
        <div class="col-md-10 col-md-offset-1" style="padding-bottom: 2%">
            <div class="viewTitle">
                <div class="panel-heading" style="padding-bottom:0; ">
                    <div class="panel-title"> {{ $pageTitle }} Generate</div>
                </div>
            </div>
            <div class=" panel panel-default panel-border">

                <div class="panel-body">
                    <div class="row">
                        {{Form::open(['url' => '/','id' => 'academicExamResultSearchForm', 'autocomplete' => 'off'])}}
                        {{-- program_medium_id --}}
                        <div class="col-md-2 ">
                            <div class="form-group">
                                {!! Form::label('program_medium_id', $programLabel . ': <sup class="text-danger">*</sup>',['class' => 'control-label'],false) !!}

                                <div class="">
                                    {!! Form::select('program_medium_id', $programs ?? [],request()->program_medium_id ?? null, [
                                    'class' => 'form-control custom-select2',
                                    'placeholder' => "Select $programLabel",
                                    'id' => 'program_medium_id',
                                    'required' => true,
                                    ]) !!}
                                    <p id='program_medium_id_error' style="min-height:3px;"></p>
                                </div>
                            </div>
                        </div>
                        {{-- session --}}
                        <div class="col-sm-2">
                            <div class="form-group">
                                {!! Form::label('session_id', 'Session: <sup class="text-danger">*<sup>', ['class' => ' control-label'], false) !!}
                                <div class="">
                                    {!! Form::select('session_id', $sessions ?? [], request()->session_id ?? null, [
                                    'class' => 'form-control custom-select2',
                                    'placeholder' => 'Select Session',
                                    'id' => 'session_id',
                                    'required' => true,
                                    ]) !!}
                                    <p id='session_id_error' style="min-height:3px;"></p>
                                </div>
                            </div>
                        </div>

                        {{-- semester_class_id --}}
                        <div class="col-md-2">
                            <div class="form-group ">
                                {!! Form::label('semester_class_id', $semesterClassLabel . '<sup class="text-danger">*</sup>', ['class' => 'control-label'], false) !!}

                                <div class="">
                                    {!! Form::select('semester_class_id', $semesterClasses ?? [], $admissionExam->semester_class_id ?? null, [
                                    'class' => 'form-control custom-select2',
                                    'placeholder' => "Select $semesterClassLabel",
                                    'id' => 'semester_class_id',
                                    'required' => true,
                                    ]) !!}
                                    <p id='semester_class_id_error' style="min-height:3px;"></p>
                                </div>
                            </div>
                        </div>

                        @if($companyType !== 'UNV')
                            <div class="col-md-2">
                                {{-- semester_class_id --}}
                                <div class="form-group ">
                                    {!! Form::label( 'semester_class_group_id', 'Group' . '<sup class="text-danger">*</sup>',
                                    ['class' => 'control-label'], false) !!}
                                    <div class="">
                                        {!! Form::select('semester_class_group_id', $semesterClassGroupType ?? [],  null, [
                                        'class' => 'form-control custom-select2',
                                        'placeholder' => 'Select Group',
                                        'id' => 'semester_class_group_id',
                                        'required' => true,
                                        ]) !!}
                                        <p id='semester_class_group_id_error' style="min-height:3px;"></p>
                                    </div>
                                </div>
                            </div>
                        @endif

                        {{-- section --}}
                        <div class="col-md-2">
                            <div class="form-group">
                                {!! Form::label('section_id', 'Section', ['class' => ' control-label'], false) !!}
                                <div class="">
                                    {!! Form::select('section_id', $sections ?? [], null, [
                                    'class' => 'form-control custom-select2',
                                    'placeholder' => 'Select Section',
                                    'id' => 'section_id',
                                    ]) !!}
                                    <p id='section_id_error' style="min-height:3px;"></p>
                                </div>
                            </div>
                        </div>

                        {{-- admission_exam_activity_id --}}
                        <div class="col-sm-2">
                            <div class="form-group ">
                                {!! Form::label('academic_exam_id', 'Academic Exam: <sup class="text-danger">*<sup>', ['class' => ' control-label'], false) !!}
                                <div class="">
                                    {!! Form::select('academic_exam_id', $academicExamActivities ?? [], null, [
                                    'class' => 'form-control custom-select2',
                                    'placeholder' => 'Select Academic Exam',
                                    'id' => 'academic_exam_id',
                                    'required' => true,
                                    ]) !!}
                                    <p id='academic_exam_id_error' style="min-height:3px;"></p>
                                </div>
                            </div>
                        </div>


                        <div class="col-md-12 text-right">
                            <div class="form-group">
                                <button type="submit" class="btn btn-info" id="searchButton">Search</button>
                            </div>
                        </div>
                        {{Form::close()}}
                    </div>

                    <div class="row">
                        {!! Form::open(['id' => 'academicExamResultGenerationForm', 'method' => 'POST']) !!}
                        {{ Form::hidden('program_medium_id', null, ['id' => 'program_medium_id_hidden']) }}
                        {{ Form::hidden('session_id', null, ['id' => 'session_id_hidden']) }}
                        {{ Form::hidden('semester_class_id', null, ['id' => 'semester_class_id_hidden']) }}
                        {{ Form::hidden('semester_class_group_id', null, ['id' => 'semester_class_group_id_hidden']) }}
                        {{ Form::hidden('section_id', null, ['id' => 'section_id_hidden']) }}
                        {{ Form::hidden('academic_exam_id', null, ['id' => 'academic_exam_id_hidden']) }}

                        {{-- Table Section --}}
                        <div id="academicExamResultGenerationTable"></div>

                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
            <div class="viewTitle"></div>
        </div>
    </div>
    <script type="text/javascript">
        const companyType = '{{ $companyType }}';
        const behaviourStatus = {{ Js::from($behaviourStatus) }};
        const coCurricularActivitiesStatus = {{ Js::from($coCurricularActivitiesStatus) }};


        $(document).ready(function () {
            // on change program_medium_id get session_id and semester_class_id
            $('#program_medium_id').change(function () {
                const program_medium_id = $(this).val();
                const url = "{{ route('eims_faculty_department_program_session_semester_section_course_subject_option_change') }}";

                $('#session_id, #semester_class_id').empty().prepend(`<option value="">Loading...</option>`);

                $.post(url, {
                    _token: '{{ csrf_token() }}',
                    program_medium_id: program_medium_id,
                }).done(function (response) {
                    $('#session_id').empty().prepend(`<option value="">Select Session</option>`);
                    response.sessionListByProgramChange.forEach(value => {
                        $('#session_id').append(`<option value="${value.id}">${value.name}</option>`);
                    });

                    $('#semester_class_id').empty().prepend(`<option value="">Select {{$semesterClassLabel}}</option>`);
                    response.semesterClassListByProgramChange.forEach(value => {
                        $('#semester_class_id').append(`<option value="${value.id}">${value.name}</option>`);
                    });
                }).fail(function () {
                    $('#session_id, #semester_class_id').empty().prepend(`<option value="">Select Session</option>`);
                });
            });

            // Function to get sections based on semester_class_id and semester_class_group_id
            function getSections() {
                const semester_class_id = $('#semester_class_id').val();
                const semester_class_group_id = $('#semester_class_group_id').val();
                const url = "{{ route('eims_get_sections') }}";

                $('#section_id').empty().prepend(`<option value="">Loading...</option>`);

                $.post(url, {
                    _token: '{{ csrf_token() }}',
                    semester_class_id: semester_class_id,
                    semester_class_group_id: semester_class_group_id,
                }).done(function (response) {
                    $('#section_id').empty().prepend(`<option value="">Select Section</option>`);
                    response.forEach(value => {
                        $('#section_id').append(`<option value="${value.id}">${value.name}</option>`);
                    });
                });
            }

            // on change semester_class_id or change semester_class_group_id get section
            $('#semester_class_id, #semester_class_group_id').change(getSections);

            // Function to get academic exams based on session_id and semester_class_id
            function getAcademicExams() {
                const academicExamIdField = $('#academic_exam_id');
                const session_id = $('#session_id').val();
                const semester_class_id = $('#semester_class_id').val();
                const url = "{{ route('eims_get_academic_exams') }}";

                academicExamIdField.empty().prepend(`<option value="">Loading...</option>`);

                $.post(url, {
                    _token: '{{ csrf_token() }}',
                    session_id: session_id,
                    semester_class_id: semester_class_id,
                }).done(function (response) {
                    response.forEach(value => {
                        academicExamIdField.append(`<option value="${value.id}">${value.eims_academic_exam_activities.name}</option>`);
                    });
                });

                academicExamIdField.empty().prepend(`<option value="">Select Academic Exam</option>`).change();
            }

            // on change session_id or change semester_class_id get academic_exam_id
            $('#session_id, #semester_class_id').change(getAcademicExams);

            // on academicExamResultSearchForm submit ajax request
            $('#academicExamResultSearchForm').submit(function (e) {
                e.preventDefault();
                const programIdHiddenField = $('#program_medium_id_hidden').empty();
                const sessionIdHiddenField = $('#session_id_hidden').empty();
                const semesterClassIdHiddenField = $('#semester_class_id_hidden').empty();
                const semesterClassGroupIdHiddenField = $('#semester_class_group_id_hidden').empty();
                const sectionIdHiddenField = $('#section_id_hidden').empty();
                const academicExamIdHiddenField = $('#academic_exam_id_hidden').empty();

                const academicExamResultGenerationTable = $('#academicExamResultGenerationTable').empty();


                $.post(`{{ url()->current() }}`, $(this).serialize())
                    .done(function (response) {
                        programIdHiddenField.val($('#program_medium_id').val());
                        sessionIdHiddenField.val($('#session_id').val());
                        semesterClassIdHiddenField.val($('#semester_class_id').val());
                        semesterClassGroupIdHiddenField.val($('#semester_class_group_id').val());
                        sectionIdHiddenField.val($('#section_id').val());
                        academicExamIdHiddenField.val($('#academic_exam_id').val());

                        const {student_academic_exam_marks, course_subjects} = response.data;

                        const table = student_academic_exam_marks.length ? `
                        <table class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th rowspan="2">SL</th>
                                    <th rowspan="2">Shift</th>
                                    <th rowspan="2">Section</th>
                                    <th rowspan="2">Student Name</th>
                                    <th rowspan="2">Roll No</th>
                                    <th colspan="${course_subjects.length}">Subjects</th>
                                    <th rowspan="2">Total Mark</th>
                                    <th rowspan="2">Highest Mark</th>
                                    <th rowspan="2">Grade (Point)</th>
                                    <th rowspan="2">Behaviour</th>
                                    <th rowspan="2">Co-Curricular Activities</th>
                                    <th rowspan="2" class="text-small">Edit</th>
                                </tr>
                                <tr>
                                    ${course_subjects.map(value => `<th class="text-small">${value.name}-${value.course_subject_code}</th>`).join(' ')}
                                </tr>
                            </thead>
                            <tbody style="color: #0c0c0c">
                                ${student_academic_exam_marks.map((student, index) => `
                                <tr>
                                    <td>${index + 1}</td>
                                    <td>${student.shift_name}</td>
                                    <td>${student.section_name}</td>
                                    <td>${student.name}</td>
                                    <td>
                                        <input type="hidden" name="student_ids[]" value="${student.id}">
                                    ${student.roll_no}
                                    </td>
                                    ${course_subjects.map(subject => {
                                        
                                const {
                                    general_course_subject_ids,
                                    selective_compulsory_course_subject_ids,
                                    selective_optional_course_subject_ids
                                } = student.eims_student_course_subject_enroll;

                                // Check if student.eims_academic_exam_marks is an object and convert to array
                                let exam_marks_array = typeof student.eims_academic_exam_marks === 'object' && !Array.isArray(student.eims_academic_exam_marks)
                                    ? Object.values(student.eims_academic_exam_marks)
                                    : student.eims_academic_exam_marks;

                                // Now you can use exam_marks_array
                                let exam_mark = exam_marks_array.find(mark => mark.course_subject_id === subject.id);

                                if (general_course_subject_ids.includes(subject.id) || selective_compulsory_course_subject_ids.includes(subject.id)) {
                                    return `
                                    <td class="${exam_mark ? '' : 'text-danger'}">
                                        ${exam_mark
                                        ? (exam_mark.total_marks == null || exam_mark.total_marks === '' || exam_mark.is_attendance === 0)
                                            ? `0.00`
                                            : `${exam_mark.total_marks}`
                                        : 'Please Submit Mark First'}
                                    </td>`;
                                } else if (selective_optional_course_subject_ids.includes(subject.id)) {
                                    return `
                                    <td>
                                        ${exam_mark
                                        ? (exam_mark.total_marks == null || exam_mark.total_marks === '' || exam_mark.is_attendance === 0)
                                            ? `0.00`
                                            : `${exam_mark.total_marks}`
                                        : 'Please Submit Mark First'}
                                    </td>`;
                                } else {
                                    return `<td></td>`;
                                }
                            }).join('')}
                                    <td>${student.total_marks}</td>
                                    <td>${student.highest_mark}</td>
                                    <td>
                                    ${student.letter_grade} (${student.grade_point})
                                    </td>
                                    <td class="text-nowrap text-small" style="text-align: left">
                                        ${Object.keys(behaviourStatus).map(key => `
                                        <label>
                                            <input type="radio" name="behaviour_status[${student.id}]" value="${behaviourStatus[key]}" ${student.behaviour_status === key ? 'checked' : ''} required>
                                            ${key}
                                            <span class="error-message" id="behaviour_status_${student.id}_error"></span>
                                        </label>`).join('<br>')}
                                    </td>
                                    <td class="text-nowrap text-small" style="text-align: left">
                                        ${Object.keys(coCurricularActivitiesStatus).map(key => `
                                        <label>
                                            <input type="radio" name="co_curricular_activities_status[${student.id}]" value="${coCurricularActivitiesStatus[key]}" ${student.co_curricular_activities_status === key ? 'checked' : ''} required>
                                            ${key}
                                        </label>`).join('<br>')}
                                    </td>
                                    <td >
                                        <a href="${encodeURI(`{{ route('eims_academic_exam_student_wise_marks_submission_create') }}?student_id=${encodeURIComponent(student.id)}&program_medium_id=${encodeURIComponent(student.program_id)}&session_id=${encodeURIComponent(student.session_id)}&semester_class_id=${encodeURIComponent(student.semester_class_id)}&academic_exam_activities_id=${encodeURIComponent(student.academic_exam_activities_id)}`)}"
                                        class="btn btn-info btn-sm"><i class="fas fa-edit"></i></a>
                                    </td>
                                </tr>`).join('')}
                            </tbody>
                        </table>
                        <div class="col-md-12 text-right" style="padding-top: 2%">
                            <div class="form-group">
                                <button type="submit" class="btn btn-info" >Submit</button>
                            </div>
                        </div>
                        `
                            : `<div class="bg-warning">No data found</div>`;

                        academicExamResultGenerationTable.html(table);

                    })
                    .catch(function (error) {
                        const {responseTitle, responseText, responseStatus} = error.responseJSON;

                        Swal.fire({
                            title: responseTitle,
                            text: responseText,
                            icon: responseStatus,

                        });
                    });
            });

            $('#academicExamResultGenerationForm').submit(function (e) {
                e.preventDefault();
                const form = $(this);
                const url = "{{ route('eims_academic_exam_result_store') }}";

                $.post(url, form.serialize()).done(function (response) {
                    console.log(response);
                    const {responseTitle, responseText, responseStatus} = response;

                    Swal.fire({
                        title: responseTitle,
                        text: responseText,
                        icon: responseStatus,
                        showConfirmButton: true,
                    }).then(() => {
                        location.reload();
                    });

                }).catch(function (error) {
                    const {responseTitle, responseText, responseStatus} = error.responseJSON;

                    Swal.fire({
                        title: responseTitle,
                        text: responseText,
                        icon: responseStatus,
                        showConfirmButton: true,
                    });
                });
            });
        });
    </script>

@endsection