@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)}}
                                Onsite Enrollment</h3>
                        </div>
                    </div>
                </div>

                <div class="card-body py-4">
                    <form id="StudentOnsiteEnrollmentForm" name="StudentOnsiteEnrollmentForm" class="pt-1">
                        {{ csrf_field() }}
                        @php
                            $enrollmentDataExtra= array();
                            $isSession = session()->has('onsiteInfoAfterSchoolStore');
                            if (session()->has('onsiteInfoAfterSchoolStore')){
                                $enrollmentDataExtra = session()->get('onsiteInfoAfterSchoolStore');
                            }
                            $isEdit = false;
                            if(session()->has('isEditAfterSchoolOnsite') && session()->get('isEditAfterSchoolOnsite') == true){
                               $isEdit = true;
                            }
                        @endphp
                        <div class="row">
                            <div class="row">
                                @if(isset(user()->assignedRole->name) && user()->assignedRole->name !== 'PARENT')
                                    <div class="col-sm-12 col-md-12 col-lg-12 mb-5">
                                        <div class="form-group">
                                            <label class="required form-label fs-6 fw-semibold"> Long Term Leave
                                            </label>
                                            <select name="long_term_leave" id="long_term_leave"
                                                    class="form-control form-control-sm form-control-solid"
                                                    data-control="select2"
                                                    data-placeholder="Select Long Term Leave" {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                                <option value="NO" {{($isSession && isset($enrollmentDataExtra['long_term_leave']) && $enrollmentDataExtra['long_term_leave'] == "NO") ? 'selected' : ''}}>
                                                    NO
                                                </option>
                                                <option value="YES" {{($isSession && isset($enrollmentDataExtra['long_term_leave']) && $enrollmentDataExtra['long_term_leave'] == "YES") ? 'selected' : ''}}>
                                                    YES
                                                </option>
                                            </select>
                                        </div>
                                    </div>
                                @endif

                                <div class="col-lg-12 mb-5" id="long_term_leave_div">
                                    <div class="form-group">
                                        @php
                                            $days_array = ['Mon','Tue','Wed','Thu','Fri'];

                                        $selected = array();
                                        if (($isSession && isset($enrollmentDataExtra['weekly_attendance']))){
                                            if ($enrollmentDataExtra['weekly_attendance']){
                                                $selected = $enrollmentDataExtra['weekly_attendance'];
                                            }
                                        }
                                        @endphp

                                        <label class="required form-label fs-6 fw-semibold">Weekly Attendance at YF <br>
                                            (minimum enrollment is 3 days per week. Please note that full time students
                                            will have enrollment priority)</label>
                                        <br>
                                        @foreach($days_array as $week_day)
                                            <div class="col-sm-12 col-md-12 col-lg-12 mt-1 fs-5 fw-semibold">
                                                <div class="radio-inline">
                                                    <label class="form-check form-check-custom form-check-solid text-hover-primary text-gray-600">
                                                        <input type="checkbox"
                                                               {{($isEdit == true) ? 'disabled readonly' : ''}}
                                                               name="weekly_attendance[]"
                                                               {{(isset($selected) && in_array($week_day,$selected)) ? 'checked' : ''}}
                                                               class="weekly_attendance form-check-input border border-gray-300"
                                                               value="{{$week_day}}"
                                                               id="week_{{$week_day}}">
                                                        <span> &nbsp; {{ $week_day }} </span>
                                                    </label>
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>
                                </div>
                                <div class="col-sm-12 col-md-6 col-lg-6 mb-5">
                                    <div class="form-group">
                                        <label class="required form-label fs-6 fw-semibold"> School district Attending
                                        </label>
                                        <select name="school_districts" id="school_districts"
                                                class="form-control form-control-sm form-control-solid"
                                                data-control="select2"
                                                data-placeholder="Select " {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                            <option value="">Select school district</option>
                                            @if(!empty($districts))
                                                @foreach($districts as $district)
                                                    <option value="{{$district->id}}" {{($isSession && isset($enrollmentDataExtra['school_districts']) && $enrollmentDataExtra['school_districts'] == $district->id) ? 'Selected' : NULL}}> {{$district->school_district_name}} </option>
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                </div>

                                @php
                                    if (($isSession && isset($enrollmentDataExtra['day_school']))){
                                        $selectedDaySchool = getSchoolDayAfterSchool($enrollmentDataExtra['day_school']);
                                    }
                                @endphp
                                <div class="col-sm-12 col-md-6 col-lg-6 mb-5 get_day_school">
                                    <div class="form-group">
                                        <label class="required form-label fs-6 fw-semibold"> Day School Attending
                                        </label>
                                        <select name="day_school" id="day_school"
                                                class="form-control form-control-sm form-control-solid"
                                                data-control="select2"
                                                data-placeholder="Select " {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                            <option value="{{$isSession && isset($selectedDaySchool) ? $selectedDaySchool->id : ''}}}}"
                                                    Selected> {{isset($selectedDaySchool->school_name) ? $selectedDaySchool->school_name : 'First select school district attending'}} </option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-12 col-md-6 col-lg-6 mb-5">
                                    <div class="form-group">
                                        <label class="required form-label fs-6 fw-semibold"> Transportation
                                        </label>
                                        <select name="transportation_service_from_yf"
                                                id="transportation_service_from_yf"
                                                class="form-control form-control-sm form-control-solid"
                                                data-control="select2"
                                                data-placeholder="Select Transportation Service from YF" {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                            <option value="YES" {{($isSession && isset($enrollmentDataExtra['transportation_service_from_yf']) && $enrollmentDataExtra['transportation_service_from_yf'] == "YES") ? 'selected' : ''}}>
                                                YES
                                            </option>
                                            <option value="NO" {{($isSession && isset($enrollmentDataExtra['transportation_service_from_yf']) && $enrollmentDataExtra['transportation_service_from_yf'] == "NO") ? 'selected' : ''}}>
                                                NO
                                            </option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-12 col-md-6 col-lg-6 mb-5">
                                    <div class="form-group">
                                        <label class="required form-label fs-6 fw-semibold"> Lunch
                                        </label>
                                        <select name="lunch_fee" id="lunch_fee"
                                                class="form-control form-control-sm form-control-solid"
                                                data-control="select2"
                                                data-placeholder="Select Lunch charges from YF" {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                            <option value="NO" {{($isSession && isset($enrollmentDataExtra['lunch_fee']) && $enrollmentDataExtra['lunch_fee'] == "NO") ? 'selected' : ''}}>
                                                NO
                                            </option>
                                            <option value="YES" {{($isSession && isset($enrollmentDataExtra['lunch_fee']) && $enrollmentDataExtra['lunch_fee'] == "YES") ? 'selected' : ''}}>
                                                YES
                                            </option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-12 col-md-6 col-lg-6 mb-5" id="foreign_language_div">
                                    <div class="form-group">
                                        <label class="required form-label fs-6 fw-semibold">Foreign Language</label>
                                        <select name="foreign_language" id="foreign_language"
                                                class="form-control form-control-sm form-control-solid"
                                                data-control="select2"
                                                data-placeholder="Select Language" {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                            <option value="">Select*</option>
                                            @if(!empty($languages))
                                                @foreach($languages as $language)
                                                    <option value="{{$language->name}}" {{($isSession && isset($enrollmentDataExtra['foreign_language']) && $enrollmentDataExtra['foreign_language'] == $language->name) ? 'Selected' : NULL}}> {{$language->name}} </option>
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                </div>

                                    @if(isset(user()->assignedRole->name) && user()->assignedRole->name !== 'PARENT')
                                    <div class="col-sm-12 col-md-6 col-lg-6 mb-5">
                                        <div class="form-group">
                                            <label class=" form-label fs-6 fw-semibold"> Flat Fee
                                            </label>
                                            <input type="number" name="flat_fee" id="flat_fee"
                                                   class="form-control form-control-sm form-control-solid"
                                                   value="{{($isSession && isset($enrollmentDataExtra['flat_fee'])) ? $enrollmentDataExtra['flat_fee'] : ''}}" {{($isEdit == true) ? 'disabled readonly' : ''}}>
                                        </div>
                                    </div>
                                @endif
                            </div>
                        </div>
                        <input type="hidden" name="student_id" value="{{$studentId}}">
                        <input type="hidden" name="enrollment_id"
                               value="{{($isSession && isset($enrollmentDataExtra['enrollment_id'])) ? $enrollmentDataExtra['enrollment_id'] : NULL}}">
                        <br>

                        <hr>
                        <div class="d-flex flex-stack">
                            <div class="mr-2">
                                <a href="{{ url('/after-school/'.encryptedId($studentId).'/onsite-form/') }}"
                                   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">
                                Next
                                <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 () {
            let transportation_service_from_yf = "{{ $isSession && isset($enrollmentDataExtra['transportation_service_from_yf']) }}";
            if(transportation_service_from_yf == 1){
                let selectedValue = "{{ isset($enrollmentDataExtra['transportation_service_from_yf'])?$enrollmentDataExtra['transportation_service_from_yf']:'' }}";
                let daySchool = $('#day_school').val();
                if (daySchool) {
                    getTransportationOptions(daySchool, selectedValue);
                }

            } else {
                $("#transportation_service_from_yf").empty();
            }

            $(document).on('click', '#SubmitForm', function (e) {
                $('.indicator-label').hide();
                $('.indicator-progress').show();
                let isEdit = false;
                @if(session()->has('isEditAfterSchoolOnsite') && session()->get('isEditAfterSchoolOnsite') == true)
                    isEdit = true;
                @endif
                if (isEdit) {
                    window.location.href = "{{ url('/after-school/'.encryptedId($studentId).'/onsite-summary') }}";
                    return;
                }
                var weekly_attendance = [];
                $.each($(".weekly_attendance:checked"), function () {
                    weekly_attendance.push($(this).val());
                });
                if (weekly_attendance.length < 3) {
                    let errorMessageForDays = 'You have to select at least three weekdays.'
                    toastr.error(errorMessageForDays);
                    $('.indicator-label').show();
                    $('.indicator-progress').hide();
                    return;
                }
                $.ajax({
                    type: 'POST',
                    url: '{{ url("/after-school/onsite-info-afterschool-store") }}',
                    processData: false,
                    contentType: false,
                    data: new FormData($('#StudentOnsiteEnrollmentForm')[0]),
                    dataType: 'json',

                    success: function (data) {
                        $('.indicator-label').show();
                        $('.indicator-progress').hide();
                        if (data.success) {
                            toastr.success(data.success);
                            setTimeout(function () {
                                window.location.href = "{{ url('/after-school/'.encryptedId($studentId).'/onsite-summary') }}";
                            }, 1500);

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

                            toastr.error(htmlError);
                        }
                    }
                });
            });


        });

        $('#long_term_leave').on("change", function () {
            if ($(this).val() == 'YES') {
                $("input.weekly_attendance").attr("disabled", true);
                $("input.weekly_attendance").prop("checked", false);
            } else {
                $("input.weekly_attendance").removeAttr("disabled");
            }
        });


        $('#school_districts').change(function () {
            var schoolDistrictID = $(this).val();
            if (schoolDistrictID) {
                $.ajax({
                    type: "GET",
                    url: "{{url('after-school/get-day-school-list')}}?school_district_id=" + schoolDistrictID,
                    success: function (res) {
                        if (res) {
                            $("#day_school").empty();
                            $("#day_school").append('<option value="">Select School</option>');
                            $.each(res.data, function (id, school_name) {
                                $("#day_school").append('<option value="' + id + '">' + school_name + '</option>');
                            });

                        } else {
                            $("#day_school").empty();
                        }
                    }
                });
            } else {
                $("#day_school").empty();
            }
        });

        $('#day_school').change(function () {
            var daySchool = $(this).val();
            if (daySchool) {
                let selectedValue = '';
                getTransportationOptions(daySchool, selectedValue);
            } else {
                $("#transportation_service_from_yf").empty();
            }
        });

        function getTransportationOptions(daySchool, selectedValue){
            $.ajax({
                type: "GET",
                url: "{{url('after-school/get-transportaion-options')}}?day_school_id=" + daySchool,
                success: function (res) {
                    if (res) {
                        $("#transportation_service_from_yf").empty();
                        $("#transportation_service_from_yf").append('<option value="">Select School</option>');
                        $.each(res.data, function (id, transportation) {
                            if(selectedValue == id){
                                $("#transportation_service_from_yf").append('<option value="' + id + '" selected>' + transportation + '</option>');

                            } else {
                                $("#transportation_service_from_yf").append('<option value="' + id + '">' + transportation + '</option>');
                            }
                        });

                    } else {
                        $("#transportation_service_from_yf").empty();
                    }
                }
            });
        }

    </script>
@endsection