@extends('layouts.app')
@section('css')
    <style>
        /* Variables */
        * {
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, sans-serif;
            font-size: 20px;
            -webkit-font-smoothing: antialiased;
            display: flex;
            width: 100vw;
        }

        form {
            width: 30vw;
            min-width: 100%;
            align-self: center;
            box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
            0px 2px 5px 0px rgba(50, 50, 93, 0.1), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.07);
            border-radius: 7px;
            padding: 40px;
        }

        .StripeElement {
            border-bottom: 1px solid rgba(50, 50, 93, 0.1);
            box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
            border-radius: 7px;
            padding: 10px;
        }

        .hidden {
            display: none;
        }

        button {
            background: #5469d4;
            font-family: Arial, sans-serif;
            color: #ffffff;
            border-radius: 4px;
            border: 0;
            padding: 12px 16px;
            font-size: 16px;
            font-weight: 600;
            cursor: pointer;
            display: block;
            transition: all 0.2s ease;
            box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
        }

        button:hover {
            filter: contrast(115%);
        }

        button:disabled {
            opacity: 0.5;
            cursor: default;
        }

        .spinner,
        .spinner:before,
        .spinner:after {
            border-radius: 50%;
        }

        .spinner {
            color: #ffffff;
            font-size: 22px;
            text-indent: -99999px;
            margin: 0px auto;
            position: relative;
            width: 20px;
            height: 20px;
            box-shadow: inset 0 0 0 2px;
            -webkit-transform: translateZ(0);
            -ms-transform: translateZ(0);
            transform: translateZ(0);
        }

        .spinner:before,
        .spinner:after {
            position: absolute;
            content: "";
        }

        .spinner:before {
            width: 10.4px;
            height: 20.4px;
            background: #5469d4;
            border-radius: 20.4px 0 0 20.4px;
            top: -0.2px;
            left: -0.2px;
            -webkit-transform-origin: 10.4px 10.2px;
            transform-origin: 10.4px 10.2px;
            -webkit-animation: loading 2s infinite ease 1.5s;
            animation: loading 2s infinite ease 1.5s;
        }

        .spinner:after {
            width: 10.4px;
            height: 10.2px;
            background: #5469d4;
            border-radius: 0 10.2px 10.2px 0;
            top: -0.1px;
            left: 10.2px;
            -webkit-transform-origin: 0px 10.2px;
            transform-origin: 0px 10.2px;
            -webkit-animation: loading 2s infinite ease;
            animation: loading 2s infinite ease;
        }
    </style>
@endsection
@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)}} (Preschool TK Enrollment)</h3>
                        </div>
                    </div>
                </div>

                <div class="card-body py-0">
                    <div class="col-lg-12 col-sm-12 col-md-12 mb-1">
                        <h4 class="fw-semibold text-dark">Preview of Preschool TK Enrollment </h4>
                        <h6 class="mb-4 badge badge-success text-red"><span>PTK 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 cellpadding="1" cellspacing="1" class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th>Student Name</th>
                                            <th>Grade</th>
                                            <th>Days Attending</th>
                                            <th>School District</th>
                                            <th>Day School</th>
                                            <th>Transportation?(Y/N) </th>
                                            <th>Potty Training </th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    @php
                                        $checkedSourceId = 0;
                                        if (isset($enrollment->paymentSources) && $enrollment->paymentSources()->exists()) {
                                            $checkedSource = $enrollment->paymentSources()->first();
                                            $checkedSourceId = $checkedSource->pivot->payment_source_id;
                                        }

                                        $enrollmentDataExtra = [
                                            "long_term_leave" => isset($enrollment->preSchoolTk->long_term_leave) ? $enrollment->preSchoolTk->long_term_leave : '',
                                            "weekly_attendance" => isset($enrollment->preSchoolTk->weekly_attendance) ? json_decode($enrollment->preSchoolTk->weekly_attendance) : '',
                                            "school_districts" => isset($enrollment->preSchoolTk->school_districts) ? $enrollment->preSchoolTk->school_districts : '',
                                            "day_school" => isset($enrollment->preSchoolTk->day_school) ? $enrollment->preSchoolTk->day_school : '',
                                            "transportation_service_from_yf" => isset($enrollment->preSchoolTk->transportation_service_from_yf) ? $enrollment->preSchoolTk->transportation_service_from_yf : '',
                                            "lunch_fee" => isset($enrollment->preSchoolTk->lunch_fee) ? $enrollment->preSchoolTk->lunch_fee : '',
                                            "potty_training" => isset($enrollment->preSchoolTk->potty_training) ? $enrollment->preSchoolTk->potty_training : '',
                                            "flat_fee" => isset($enrollment->preSchoolTk->flat_fee) ? $enrollment->preSchoolTk->flat_fee : '',
                                            "student_id" => isset($enrollment->student_id) ? $enrollment->student_id : '',
                                            "enrollment_id" => isset($enrollment->id) ? $enrollment->id : "",
                                            "parent_id" => isset($enrollment->student->parent_id) ? $enrollment->student->parent_id : '',
                                            "payment_source_id" => $checkedSourceId,
                                            "payment_check" => isset($enrollment->payment_check) ? $enrollment->payment_check : '',
                                        ];

                                        $enrollmentData = [
                                            "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 : '',
                                        ];

                                        $days = array();
                                        if (isset($enrollmentDataExtra)){
                                            if (isset($enrollmentDataExtra['long_term_leave']) && $enrollmentDataExtra['long_term_leave'] == "YES"){
                                                $days = ['Mon','Tue','Wed','Thu','Fri'];

                                            }else{
                                                if ((isset($enrollmentDataExtra['weekly_attendance']))){
                                                    if ($enrollmentDataExtra['weekly_attendance']){
                                                        $days = $enrollmentDataExtra['weekly_attendance'];
                                                    }
                                                }
                                            }
                                        }

                                        if ((isset($enrollmentData['current_grade']))){
                                            $selectedGrade = getCurrentGradeAfterSchool($enrollmentData['current_grade']);
                                        }
                                        if ((isset($enrollmentDataExtra['day_school']))){
                                            $selectedDaySchool = getSchoolDayAfterSchool($enrollmentDataExtra['day_school']);
                                        }
                                        if ((isset($enrollmentDataExtra['school_districts']))){
                                            $selectedSchoolDistrict = getSchoolDistrictAfterSchool($enrollmentDataExtra['school_districts']);
                                        }
                                        $isEdit = false;
                                        if(session()->has('isEditPreSchoolTk') && session()->get('isEditPreSchoolTk') == true){
                                           $isEdit = true;
                                        }
                                    @endphp
                                    <tr>
                                        <td><div class="m_table_label">Student Name</div> <div class="table_value">{{ucwords($student->first_name).' '.ucwords($student->last_name)}}</div></td>
                                        <td><div class="m_table_label">Grade</div> <div class="table_value">{{isset($selectedGrade->name) ? $selectedGrade->name : NULL}}</div></td>
                                        <td><div class="m_table_label">Days Attending</div> <div class="table_value">{{implode(',',$days)}}</div></td>
                                        <td><div class="m_table_label">School District</div> <div class="table_value">{{isset($selectedSchoolDistrict->school_district_name) ? $selectedSchoolDistrict->school_district_name : NULL }} </div></td>
                                        <td><div class="m_table_label">Day School</div> <div class="table_value">{{isset($selectedDaySchool->school_name) ? $selectedDaySchool->school_name : NULL }}</div></td>
                                        <td><div class="m_table_label">item1</div> <div class="table_value">{{isset($enrollmentDataExtra['transportation_service_from_yf']) ? $enrollmentDataExtra['transportation_service_from_yf'] : NULL }}</div></td>
                                        <td><div class="m_table_label">Potty Training</div> <div class="table_value">{{isset($enrollmentDataExtra['potty_training']) ? $enrollmentDataExtra['potty_training'] : NULL }}</div></td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <br>
                    </div>
                </div>

                <div class="card-body py-2">
                    <form id="StudentElectiveEnrollmentForm" name="StudentElectiveEnrollmentForm" class="pt-1" style="box-shadow: none !important; padding:0px;">
                        {{ csrf_field() }}
                        <div class="card card-xxl-stretch ">
                            <input type="hidden" name="student_id" value="{{$studentId}}">
                            <input type="hidden" name="parent_id" value="{{$student->parent_id}}">
                            <input type="hidden" name="record_id" value="{{(isset($enrollmentData['record_id'])) ? $enrollmentData['record_id'] : NULL}}">

                            @php $cardInfo = App\Models\PaymentSources::where(['parent_id' => $student->parent_id, 'is_primary'=> 1])->first(); @endphp
                            @if(isset($enrollmentDataExtra['payment_check']) &&  $enrollmentDataExtra['payment_check'] === 'ZELLE_CHECK')
                                <input type="hidden" name="payment_check" value="ZELLE_CHECK">

                            @elseif(isset($enrollmentDataExtra['payment_check']) &&  $enrollmentDataExtra['payment_check'] === 'CREDIT_CARD')
                                <input type="hidden" name="payment_check" value="CREDIT_CARD">

                            @elseif(empty($enrollmentDataExtra['payment_check']) && !empty($cardInfo))
                                <input type="hidden" name="payment_check" value="{{ !empty($cardInfo->payment_check)?$cardInfo->payment_check:'ZELLE_CHECK' }}">

                            @else
                                <input type="hidden" name="payment_check" value="ZELLE_CHECK">
                            @endif

                        </div>
                    </form>

                    <div class="d-flex flex-stack py-8">
                        <div class="mr-2">
                            <a href="{{ url('/preschool/tk/'.encryptedId($studentId).'/onsite-info-preschool?record_id='.((isset($enrollmentData['record_id'])) ? $enrollmentData['record_id'] : NULL)) }}" 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>
                </div>
            </div>
        </div>
    </div>
@endsection

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

        $(function() {
            $(document).on('click', '#SubmitForm', function(e) {
                $('.indicator-label').hide();
                $('.indicator-progress').show();

                let isEdit = false;

                @if(session()->has('isEditPreSchoolTk') && session()->get('isEditPreSchoolTk') == true)
                    isEdit = true;
                @endif

                if (isEdit) {
                    if(program == 2){
                        window.location.href = "{{ url('/after-school/'.encryptedId($studentId).'/list') }}";
                        return;
                    } else {
                        window.location.href = "{{ url('/preschool/'.encryptedId($studentId).'/list') }}";
                        return;
                    }
                }

                $.ajax ({
                    type : 'POST',
                    url : '{{ url("preschool/tk/onsite-summary-store") }}',
                    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('Enrollment save successfully!');
                            setTimeout(function () {
                                window.location.href = "{{ url('/preschool/'.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);
                            if(program == 2){
                                setTimeout(function () {
                                    window.location.href = "{{ url('/after-school/'.encryptedId($studentId).'/list') }}";
                                }, 1500);

                            } else {
                                setTimeout(function () {
                                    window.location.href = "{{ url('/preschool/'.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