@extends('admin/course-management/course-details/index')

@section('main-content-tab')
    <h1 class="fw-bolder text-dark mb-9">Update Eligibility Information</h1>
    <div class="d-flex justify-content-end">
        <button class="btn btn-xs btn-light-facebook rounded-btn" onclick="addNewAdmissionEligibility()" type="button">+ Add Admission Eligibility</button>
    </div>
    <form action="{{route('eligibility', ['institute_slug' => $institute_slug, 'course_slug' => $course_slug])}}" name="eligibility" class="form mb-15" method="POST" id="kt_contact_form">
        @csrf
        <input type="hidden" name="id" value="{{@$eligibilityData['id'] ?? ''}}" />
        <div class="row mb-5 mt-2">
            <div class="col-md-6">
                <label class="fs-5 fw-bold">Title (EN)</label>
                <input type="text" class="form-control form-control-solid" value="{{$eligibilityData['type'] ?? ''}}" placeholder="Enter Type" name="type" autocomplete="off"/>
            </div>
            <div class="col-md-6">
                <label class="fs-5 fw-bold">Title (BN)</label>
                <input type="text" class="form-control form-control-solid" value="{{$eligibilityData['type_bn'] ?? ''}}" placeholder="Enter Type" name="type_bn" autocomplete="off"/>
            </div>
        </div>
        <div class="d-flex justify-content-end">
            <button type="submit" class="btn btn-sm btn-success">Update</button>
        </div>
    </form>

    <div>
        <form action="{{route('admission-eligibility', ['institute_slug' => $institute_slug, 'course_slug' => $course_slug])}}" name="institute" class="form mb-15" method="POST" id="kt_contact_form">
            @csrf
            @if(!empty($admissionEligibilityData))
                @foreach($admissionEligibilityData as $eligibilityItem)
                    <h3 class="mb-5">Degree: {{strtoupper(@$eligibilityItem->degree->name)}}</h3>
                    <div class="row mb-5 mt-2">
                        <div class="col-md-6">

                            <div class="d-flex flex-column mb-5 fv-row">
                                <label class="fs-6 fw-bold">Requirement message (EN)</label>
                                <input type="text" class="form-control form-control-solid" value="{{$eligibilityItem['requirement'] ?? ''}}" placeholder="Enter Requirement (EN) *" name="requirement" autocomplete="off" disabled/>
                                {{--                        <textarea class="form-control form-control-solid" id="requirement_bn" name="requirement_bn" placeholder="Requirement" disabled>{{$eligibilityItem['requirement'] ?? ''}}</textarea>--}}
                                @if($errors->has('requirement'))
                                    <span class="text-danger">{{ $errors->first('requirement') }}</span>
                                @endif
                            </div>
                        </div>
                        <div class="col-md-6">

                            <div class="d-flex flex-column mb-5 fv-row">
                                <label class="fs-5 fw-bold">Requirement message (BN)</label>
                                <input type="text" class="form-control form-control-solid" value="{{$eligibilityItem['requirement_bn'] ?? ''}}" placeholder="Enter Requirement (BN)" name="requirement_bn" autocomplete="off" disabled/>
                                {{--                        <textarea class="form-control form-control-solid" id="requirement_bn" name="requirement_bn" placeholder="Requirement" disabled>{{$eligibilityItem['requirement_bn'] ?? ''}}</textarea>--}}
                                @if($errors->has('requirement_bn'))
                                    <span class="text-danger">{{ $errors->first('requirement_bn') }}</span>
                                @endif
                            </div>
                        </div>
                        <div class="col-md-6">

                            <div class="d-flex flex-column mb-5 fv-row">
                                <label class="form-label">Degree of Education</label>
                                <select name="education_course_type_id" id="education_course_type_id" class="form-select" onchange="getGroupByDegree(this.value)" disabled>
                                    <option value="" selected>Select Degree of Education</option>
                                    @foreach($education_types as $degree)
                                        <option value="{{$degree->id}}" {{$eligibilityItem['education_course_type_id'] == $degree->id ? 'selected' : ''}}>{{$degree->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-5">

                            <div class="d-flex flex-column mb-5 fv-row">
                                <label class="fs-5 fw-bold">Point (For Eligibility Cal.)</label>
                                <input type="number" class="form-control form-control-solid" value="{{$eligibilityItem['point'] ?? ''}}" placeholder="Enter Value" name="point" autocomplete="off" disabled/>
                                @if($errors->has('point'))
                                    <span class="text-danger">{{ $errors->first('point') }}</span>
                                @endif
                            </div>
                        </div>
                        <div class="col-md-1">
                            <div class="mb-5 fv-row">
                                <label class="fs-5 fw-bold">Action</label>
                                <a class="btn btn-icon btn-sm btn-light-info" title="Edit" onclick="editAdmissionEligibility('{{$institute_slug}}', '{{$course_slug}}', {{$eligibilityItem['id']}})" type="button"><i class="fa fa-edit"></i></a>
                                <a class="btn btn-icon btn-sm btn-light-danger" title="Delete" onclick="deleteAdmissionEligibility('{{$institute_slug}}', '{{$course_slug}}', {{$eligibilityItem['id']}})" type="button"><i class="fa fa-trash"></i></a>
                            </div>
                        </div>
                    </div>
                @endforeach
            @endif
        </form>
    </div>

    <hr/>

    <div>
        <h1 class="fw-bolder text-dark mb-9">Update Eligibility Requirement/Rule</h1>
        <form action="{{route('eligibility', ['institute_slug' => $institute_slug, 'course_slug' => $course_slug])}}" name="eligibility-rule" class="form mb-15" method="POST" id="kt_contact_form" enctype="multipart/form-data">
            @csrf
            <input type="hidden" name="id" value="{{@$eligibilityData['id'] ?? ''}}" />
            <div class="row mb-5 mt-2">
                <div class="col-md-6">
                    <div class="d-flex flex-column mb-5 fv-row">
                        <label class="fs-5 fw-bold">Title (EN)</label>
                        <input type="text" class="form-control form-control-solid" value="{{$eligibilityData['title'] ?? ''}}" placeholder="Enter Title" name="title" autocomplete="off"/>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="d-flex flex-column mb-5 fv-row">
                        <label class="fs-5 fw-bold">Title (BN)</label>
                        <input type="text" class="form-control form-control-solid" value="{{$eligibilityData['title_bn'] ?? ''}}" placeholder="Enter Title" name="title_bn" autocomplete="off"/>
                    </div>
                </div>
                <div class="col-md-6">

                    <div class="d-flex flex-column mb-5 fv-row">
                        <label class="form-label">Eligible For (Degree of Education)</label>
                        <select name="education_course_type_id[]" id="education_course_type_id" data-placeholder="Select a Option ..." data-control="select2" data-hide-search="true" class="form-select form-select-solid" multiple>
                            <option value=" " disabled>Select Degree of Education</option>
                            @if(!empty($education_types))
                                @foreach($education_types as $degree)
                                    <option value="{{$degree->id}}" {{ isset($eligibilityData['education_course_type_id']) && is_array($eligibilityData['education_course_type_id']) && in_array($degree->id, $eligibilityData['education_course_type_id']) ? 'selected' : '' }}>{{$degree->name}}</option>
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div>
                <div class="col-md-6">

                    <div class="d-flex flex-column mb-5 fv-row">
                        <label class="form-label">Documents</label>
                        <select name="document_type_id[]" id="document_type_id" data-placeholder="Select a Option ..." data-control="select2" data-hide-search="true" class="form-select form-select-solid" multiple>
                            <option value=" " disabled>Select Option</option>
                            @if(!empty($document_types))
                                @foreach($document_types as $type)
                                    <option value="{{$type->id}}" {{ isset($eligibilityData['document_type_id']) && is_array($eligibilityData['document_type_id']) && in_array($type->id, $eligibilityData['document_type_id']) ? 'selected' : '' }}>{{$type->name}}</option>
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="d-flex flex-column mb-5 fv-row">
                        <label class=" fs-5 fw-bold mb-2">Description (EN)</label>
                        <textarea name="description" id="description" class="summernote form-control form-control-solid" placeholder="Enter Description (EN)" autocomplete="off">
                    {{$eligibilityData ? $eligibilityData['description'] : ''}}
                </textarea>
                        @if($errors->has('description'))
                            <span class="text-danger">{{ $errors->first('description') }}</span>
                        @endif
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="d-flex flex-column mb-5 fv-row">
                        <label class="fs-5 fw-bold mb-2">Description (BN)</label>

                        <textarea name="description_bn" id="description" class="summernote form-control form-control-solid" placeholder="Enter Description (BN)" autocomplete="off">
                    {{$eligibilityData ? $eligibilityData['description_bn'] : ''}}
                </textarea>
                        @if($errors->has('description_bn'))
                            <span class="text-danger">{{ $errors->first('description_bn') }}</span>
                        @endif
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="d-flex flex-column mb-5 fv-row document_update_file-wrapper">
                        <label class="fs-5 fw-bold mb-2">Banner</label>
                        <input accept="image/*" type="file" id="banner" name="banner" class="form-control dropify" placeholder="Enter Banner">
                        @if($errors->has('banner'))
                            <span class="text-danger">{{ $errors->first('banner') }}</span>
                        @endif
                        <input type="hidden" id="file_removed" name="file_removed" value="0">
                    </div>
                </div>
            </div>
            <div class="d-flex justify-content-end">
                <button type="submit" class="btn btn-sm btn-success">Update</button>
            </div>
        </form>
    </div>
    <hr/>

<div class="modal fade custom-modal" tabindex="-1" id="kt_modal_add_admission_eligibility">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header bg--primary text-white">
                <h3 class="modal-title">Add new Admission Eligibility</h3>
                <button type="button" class="btn btn-icon btn-sm btn-secondary modal-close-btn" data-bs-dismiss="modal" aria-label="Close">
                    <i class="las la-times"></i>
                </button>
            </div>
            <div class="modal-body">
                <form id="task-add-form" action="{{route('admission-eligibility', ['institute_slug' => $institute_slug, 'course_slug' => $course_slug])}}" method="POST">
                    @csrf
                    <div class="row g-2 mb-4">
                        <div class="col-12">
                            <div class="">
                                <label class="form-label required">Degree of Education</label>
                                <select name="education_course_type_id" id="education_course_type_id" class="form-select" onchange="getGroupByDegree(this.value)" required>
                                    <option value="" selected>Select Degree of Education</option>
                                    @foreach($education_types as $degree)
                                        <option value="{{$degree->id}}">{{$degree->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-group">
                                <label for="time" class="form-label required">Requirement message</label>
                                <input type="text" class="form-control form-control-solid" id="requirement" name="requirement" placeholder="Enter requirement" required>
{{--                                <textarea class="form-control form-control-solid" id="requirement" name="requirement" placeholder="Requirement"></textarea>--}}
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-group">
                                <label for="time" class="form-label">Requirement message(BN)</label>
                                <input type="text" class="form-control form-control-solid" id="requirement_bn" name="requirement_bn" placeholder="Enter requirement">
{{--                                <textarea class="form-control form-control-solid" id="requirement_bn" name="requirement_bn" placeholder="Requirement"></textarea>--}}
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-group">
                                <label for="point" class="required form-label">Point (for eligibility cal.)</label>
                                <input type="number" class="form-control form-control-solid" id="point" name="point" placeholder="Enter point" step="any" min="0" required>
                            </div>
                        </div>
                    </div>

                    <div class="d-flex justify-content-center">
                        <button type="submit" class="btn btn-primary rounded-btn">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade custom-modal" tabindex="-1" id="kt_modal_edit_admission_eligibility">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header bg--primary text-white">
                <h3 class="modal-title">Update Admission Eligibility</h3>
                <button type="button" class="btn btn-icon btn-sm btn-secondary modal-close-btn" data-bs-dismiss="modal" aria-label="Close">
                    <i class="las la-times"></i>
                </button>
            </div>
            <div class="modal-body">
                <form id="status-edit-form" action="{{route('admission-eligibility', ['institute_slug' => $institute_slug, 'course_slug' => $course_slug])}}" method="POST">
                    @csrf
                    <input type="hidden" id="eligibility_id" name="id">
                    <div class="row g-2 mb-4">
                        <div class="col-12">
                            <div class="">
                                <label class="form-label">Select Degree</label>
                                <select name="education_course_type_id" id="update_education_course_type_id" class="form-select">

                                </select>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-group">
                                <label for="link" class="form-label">Requirement message(EN)</label>
                                <input type="text" class="form-control form-control-solid datepicker" id="update_requirement" name="requirement" placeholder="requirement">
{{--                                <textarea class="form-control form-control-solid" id="update_requirement" name="requirement" placeholder="details"></textarea>--}}
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-group">
                                <label for="link" class="form-label">Requirement message(BN)</label>
                                <input type="text" class="form-control form-control-solid datepicker" id="update_requirement_bn" name="requirement_bn" placeholder="requirement bn">
{{--                                <textarea class="form-control form-control-solid" id="update_requirement_bn" name="requirement_bn" placeholder="details"></textarea>--}}
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="form-group">
                                <label for="update_point" class="form-label">Point (For Eligibility Cal.)</label>
                                <input type="number" class="form-control form-control-solid datepicker" id="update_point" name="point" placeholder="Point" step="any" min="0">
                            </div>
                        </div>
                    </div>

                    <div class="d-flex justify-content-center">
                        <button type="submit" class="btn btn-primary rounded-btn">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('extra-extra-css')
<link rel="stylesheet" href="{{ asset('summernote/summernote.css') }}">
<link rel="stylesheet" href="{{ asset('css/dropify.min.css') }}">
@endsection


@section('extra-extra-script')
{{--<script src="{{ asset('js/popper.min.js') }}"></script>--}}
    <script src="{{ asset('js/jquery.validate.js') }}"></script>
    <script src="{{ asset('summernote/summernote.min.js') }}"></script>
    <script src="{{ asset('js/dropify.min.js') }}"></script>

<script type="text/javascript">
    // $(document).ready(function() {
    //     var drEvent = $('#banner').dropify();
    //     drEvent = drEvent.data('dropify');
    //     drEvent.resetPreview();
    //     drEvent.clearElement();
    // });

    $(document).ready(function() {
        var editData = {!! json_encode($eligibilityData) !!};
        if(editData && editData.banner)
        {
            var imageUrl = "{{URL::asset(@$eligibilityData->banner)}}";
            var drEvent = $('#banner').dropify(
                {
                    defaultFile: imageUrl
                });
            drEvent.on('dropify.afterClear', function(event, element) {
                console.log('text', event, element.clearButton)
            });

            drEvent = drEvent.data('dropify');
            drEvent.resetPreview();
            drEvent.clearElement();
            drEvent.settings.defaultFile = imageUrl;
            drEvent.destroy();
            drEvent.init();
        }
        else{
            var drEvent = $('#banner').dropify();
            drEvent = drEvent.data('dropify');
            drEvent.resetPreview();
            drEvent.clearElement();
        }
    });

    setTimeout(() => {
        let wrappers = document.querySelector('.document_update_file-wrapper .dropify-clear');
        wrappers.addEventListener('click', function() {
            // alert('File deleted');
            $('#file_removed').val('1');
        });
    }, 500);

</script>

    //validate form
    <script>
        $(function() {
            $("form[name='institute']").validate({
                ignore: ".note-editable.panel-body",
                rules: {
                    title:'required',
                    maximum_allowed_year:'required',
                },
                messages: {
                    title: "Title is required.",
                    maximum_allowed_year: "Maximum Allowed Year is required.",
                    description: "Description is required.",
                },
                submitHandler: function(form) {
                form.submit();
                }
            });
        });
        function addNewAdmissionEligibility() {
            $('#kt_modal_add_admission_eligibility').modal('show');
        }
        function editAdmissionEligibility(institute_slug, course_slug, id) {
            $.ajax({
                url: '{{ url('/course-details') }}/' + institute_slug + '/' + course_slug + '/eligibility-by-degree/' + id,
                method: 'GET',
                success: function(returnData) {
                    var data = returnData.data;

                    $('#eligibility_id').val(data.eligibility.id);
                    $('#update_point').val(data.eligibility.point);
                    $('#update_requirement').val(data.eligibility.requirement);
                    $('#update_requirement_bn').val(data.eligibility.requirement_bn);

                    $('#update_education_course_type_id').empty();
                    $('#update_education_course_type_id').append('<option value="">Select Degree of Education</option>');
                    $.each(data.education_types, function(index, education_type) {
                        var option = '<option value="' + education_type.id + '">' + education_type.name + '</option>';
                        if (data.eligibility.education_course_type_id && education_type.id === data.eligibility.education_course_type_id) {
                            option = '<option value="' + education_type.id + '" selected>' + education_type.name + '</option>';
                        }
                        $('#update_education_course_type_id').append(option);
                    });

                    $('#kt_modal_edit_admission_eligibility').modal('show');
                },
                error: function(xhr, status, error) {
                    console.error(xhr.responseText);
                }
            });
        }
        function deleteAdmissionEligibility(institute_slug, course_slug, id) {
            if (confirm('Are you sure you want to delete this eligibility item?')){
                $.ajax({
                    url: '{{ url('/course-details') }}/' + institute_slug + '/' + course_slug + '/delete-eligibility/' + id,
                    method: 'GET',
                    success: function(returnData) {
                        window.location.reload();
                        toastr.success('Eligibility item Deleted Successfully!');
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr.responseText);
                    }
                });
            }
        }
    </script>

    <script type="text/javascript">
        $(document).ready(function() {
            $('.summernote').summernote({
                height: 200,
                popover: {
                    image: [],
                    link: [],
                    air: []
                }
            });
        });
    </script>
@endsection