@extends('layouts.app')
@section('content')

    @include('layouts.toolbar')

    <div id="kt_content_container" class="d-flex flex-column-fluid align-items-start container-xxl">
        <div class="content flex-row-fluid" id="kt_content">
            <div class="card">
                <div class="card-header border-0 pt-6">
                    <div class="card-title">
                        <div class="d-flex align-items-center position-relative my-1">
                            <h3 class="fw-semibold text-dark mb-7"
                                style="font-weight: bolder !important;">{{ucwords($student->first_name).' '.ucwords($student->last_name)}}
                                Elective Enrollment</h3>
                        </div>
                    </div>
                </div>

                <div class="card-body py-4">
                    <form id="StudentElectiveEnrollmentForm" name="StudentElectiveEnrollmentForm" class="pt-1">
                        {{ csrf_field() }}
                        @php

                            $enrollmentDataForm = [
                    "default_enrollment" => isset($enrollment->default_enrollment) ? $enrollment->default_enrollment : "",
                    "enrollment_start_date" => isset($enrollment->enrollment_start_date) ? $enrollment->enrollment_start_date : "",
                    "enrollment_end_date" => isset($enrollment->enrollment_end_date) ? $enrollment->enrollment_end_date : "",
                    "previous_grade" => isset($enrollment->previous_grade) ? $enrollment->previous_grade : "",
                    "current_grade" => isset($enrollment->current_grade) ? $enrollment->current_grade : "",
                    "addon_grades" => isset($enrollment->addon_grades) ? $enrollment->addon_grades : '',
                    "student_id" => isset($enrollment->student_id) ? $enrollment->student_id : '',
                    "record_id" => isset($enrollment->id) ? $enrollment->id : '',
                ];
                $checkedSourceIds = array();
                if (isset($enrollment->electiveClasses) && $enrollment->electiveClasses()->exists()) {
                    $checkedSourceIds = $enrollment->electiveClasses()->pluck('class_code')->toArray();
                }
                $enrollmentData = [
                    "student_id" => isset($enrollment->student_id) ? $enrollment->student_id : "",
                    "class_codes" => $checkedSourceIds
                ];
                                $isEdit = false;
                                if(session()->has('isEditAfterSchoolElective') && session()->get('isEditAfterSchoolElective') == true){
                                   $isEdit = true;
                                }
                        @endphp
                        <div class="col-lg-12 col-sm-12 col-md-12 mb-1">
                            <h4 class="fw-semibold text-dark">Preview of After School Enrollment </h4>
                            <h6 class="mb-4 badge badge-success text-red"><span>Elective Classes Details</span>
                            </h6>
                        </div>

                        <div class="col-lg-12 col-sm-12 col-md-12 mb-1">
                            <div class="card notice rounded border-gray-300 border">
                                <div class="card-body">
                                    <table class="table table-striped table-bordered">
                                        <thead>
                                        <th>Classes Attending</th>
                                        <th>Timing</th>
                                        </thead>
                                        <tbody>
                                        @if(isset($activities) && $activities->count())
                                            @foreach($activities as $activity)
                                                <tr>
                                                    <td>
                                                        <div class="m_table_label">Classes Attending</div>
                                                        <div class="table_value">{{$activity->class_title}}</div>

                                                    </td>
                                                    <td>
                                                        <div class="m_table_label">Timing</div>
                                                        <div class="table_value">
                                                            @if(isset($activity->monday))

                                                            @endif
                                                            {{isset($activity->monday) ? weekTimeFormat("Mon",$activity->monday) : ''}}

                                                            @if(isset($activity->tuesday))

                                                            @endif
                                                            {{isset($activity->tuesday) ? weekTimeFormat("Tue",$activity->tuesday) : ''}}

                                                            @if(isset($activity->wednesday))

                                                            @endif
                                                            {{isset($activity->wednesday) ? weekTimeFormat("Wed",$activity->wednesday) : ''}}

                                                            @if(isset($activity->thursday))

                                                            @endif
                                                            {{isset($activity->thursday) ? weekTimeFormat("Thu",$activity->thursday) : ''}}

                                                            @if(isset($activity->friday))

                                                            @endif
                                                            {{isset($activity->friday) ? weekTimeFormat("Fri",$activity->friday) : ''}}
                                                        </div>


                                                    </td>
                                                </tr>
                                            @endforeach
                                        @else
                                            <tr>
                                                <td colspan="4">No data is added.</td>
                                            </tr>
                                        @endif

                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <br>
                        </div>
                        <input type="hidden" name="student_id" value="{{$studentId}}">
                        <input type="hidden" name="record_id"
                               value="{{$enrollmentDataForm['record_id']}}">
                        @if(count($enrollmentData['class_codes']))
                            @foreach($enrollmentData['class_codes'] as $class)
                                <input type="hidden" name="class_codes[]"
                                       value="{{$class}}">
                            @endforeach
                        @endif

                        <br>

                        <div class="d-flex flex-stack">
                            <div class="mr-2">
                                <a href="{{ url('after-school/'.encryptedId($studentId).'/elective-classes?record_id='.(isset($enrollment->id) ? $enrollment->id : '')) }}"
                                   class="btn btn-lg btn-light-primary me-3">
                                    <span class="svg-icon svg-icon-4 me-1"><svg width="24" height="24"
                                                                                viewBox="0 0 24 24" fill="none"
                                                                                xmlns="http://www.w3.org/2000/svg">
                                    <rect opacity="0.5" x="6" y="11" width="13" height="2" rx="1"
                                          fill="currentColor"></rect>
                                    <path d="M8.56569 11.4343L12.75 7.25C13.1642 6.83579 13.1642 6.16421 12.75 5.75C12.3358 5.33579 11.6642 5.33579 11.25 5.75L5.70711 11.2929C5.31658 11.6834 5.31658 12.3166 5.70711 12.7071L11.25 18.25C11.6642 18.6642 12.3358 18.6642 12.75 18.25C13.1642 17.8358 13.1642 17.1642 12.75 16.75L8.56569 12.5657C8.25327 12.2533 8.25327 11.7467 8.56569 11.4343Z"
                                          fill="currentColor"></path>
                                    </svg>
                                    </span>
                                    Back
                                </a>
                            </div>

                            <div>
                                <button type="button" class="btn btn-lg btn-success me-3 d-inline-block"
                                        id="SubmitForm">
                            <span class="indicator-label">
                                Confirm
                                <span class="svg-icon svg-icon-3 ms-2 me-0"><svg width="24" height="24"
                                                                                 viewBox="0 0 24 24" fill="none"
                                                                                 xmlns="http://www.w3.org/2000/svg">
                                <rect opacity="0.5" x="18" y="13" width="13" height="2" rx="1"
                                      transform="rotate(-180 18 13)"
                                      fill="currentColor"></rect>
                                <path d="M15.4343 12.5657L11.25 16.75C10.8358 17.1642 10.8358 17.8358 11.25 18.25C11.6642 18.6642 12.3358 18.6642 12.75 18.25L18.2929 12.7071C18.6834 12.3166 18.6834 11.6834 18.2929 11.2929L12.75 5.75C12.3358 5.33579 11.6642 5.33579 11.25 5.75C10.8358 6.16421 10.8358 6.83579 11.25 7.25L15.4343 11.4343C15.7467 11.7467 15.7467 12.2533 15.4343 12.5657Z"
                                      fill="currentColor"></path>
                                </svg>
                                </span>
                            </span>
                                    <span class="indicator-progress">
                                Please wait... <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
                            </span>
                                </button>

                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script type="text/javascript">

        $(function () {
            $(document).on('click', '#SubmitForm', function (e) {
                $('.indicator-label').hide();
                $('.indicator-progress').show();
                $.ajax({
                    type: 'POST',
                    url: '{{ url("after-school/elective-info") }}',
                    processData: false,
                    contentType: false,
                    data: new FormData($('#StudentElectiveEnrollmentForm')[0]),
                    dataType: 'json',

                    success: function (data) {
                        if (data.success) {
                            $('.indicator-label').show();
                            $('.indicator-progress').hide();

                            toastr.success(data.success);
                            setTimeout(function () {
                                window.location.href = "{{ url('/after-school/'.encryptedId($studentId).'/list') }}";
                            }, 1500);

                        } else if (data.failure) {
                            $('.indicator-label').show();
                            $('.indicator-progress').hide();

                            let htmlError = '';
                            $.each(data.failure, function (index, value) {
                                htmlError += '<li>' + value + '</li>';
                            });

                            toastr.error(htmlError);

                        } else if (data.failure_enrollment) {
                            $('.indicator-label').show();
                            $('.indicator-progress').hide();

                            let htmlError = '';
                            $.each(data.failure, function (index, value) {
                                htmlError += '<li>' + value + '</li>';
                            });

                            toastr.error(htmlError);
                            setTimeout(function () {
                                window.location.href = "{{ url('/after-school/'.encryptedId($studentId).'/list') }}";
                            }, 1500);
                        }
                    },

                    error: function (xhr) {
                        toastr.error("Something went wrong. Please try again!");
                    },

                    complete: function () {
                        $('.indicator-label').show();
                        $('.indicator-progress').hide();
                    }
                });

            });
        });

    </script>
@endsection