@extends('../layout/' . $layout)

@section('subhead')
    <title>Atarud MIS - Promote Student To New Course</title>
@endsection
<style type="text/css">
    .stu_pro tr td {
        padding: 1px;
    }

    .fileBtn:hover {
        cursor: progress;
        color: red;
    }
</style>

@section('subcontent')
    <div class="intro-y flex items-center mt-8">
        <h2 class="text-lg font-medium mr-auto">Promote Student To New Course </h2>
    </div>
    <div class="box ">

        <div class="col-span-12 lg:col-span-8 2xl:col-span-9 ">

                <!-- BEGIN: Display Information -->

                <div class="intro-y box lg:mt-5">

                    <!--End of Course Display-->
                    <div class="flex items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400"
                        style="background-color: #292727; border-radius: 4px;">
                        <h2 class="font-medium text-base mr-auto" style="font-weight: bold; color:white;">Courses</h2>
                    </div>

                    <div class="p-5 box bg-primary/10">
                        <div class="flex flex-col-reverse xl:flex-row flex-col">
                            <div class="flex-1 mt-6 xl:mt-0">
                                <form id="studentForm" action="{{ route('students.new-course') }}" method="post" enctype="multipart/form-data">
                                    @csrf
                                    @method('post')
                                    <input type="hidden" name="curr_course_id" value="{{$data['course']->id}}">
                                <div class="grid grid-cols-12 gap-2">
                                    <div class="form-control col-span-3">
                                        <label for="field-2" class="control-label"> Program </label>

                                        <select name="program_id" class="form-control"
                                            value="{{ old('program_id') }}" id="class_id"
                                            onchange="get_class_semesters(this.value)">
                                            <option value="">Select</option>

                                            @foreach ($data['programs'] as $row)
                                                <option value="{{ $row->id }}">
                                                    {{ $row->title }}
                                                </option>
                                            @endforeach

                                        </select>
                                    </div>
                                    <div class="form-control col-span-3">
                                        <label for="field-2" class="control-label">Select Semester </label>

                                        <select name="semester_id" class="form-control"
                                            value="{{ old('semester_id') }}" id="semester_id"
                                            onchange="getSection(this.value)">
                                            <option value="">Select Semester</option>
                                        </select>
                                    </div>
                                    <div class="form-control col-span-3">
                                        <label for="field-2" class="control-label">Select Section </label>

                                        <select name="section_id" class="form-control"
                                            value="{{ old('section_id') }}" id="section_id"
                                            onchange="get_section_courses(this.value)">
                                            <option value="">Select Section</option>
                                        </select>

                                    </div>
                                    <div class="form-control col-span-3 ">
                                        <label for="field-2" class="control-label"> Course ID </label>
                                        <div class="col-sm-9">
                                            <select name="course_id" class="form-control" id="section_selector_holder"
                                                value="{{ old('course_id') }}"
                                                onchange="return get_section_students(this.value)">
                                                <option value="">Select Class</option>

                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                    <div class="flex items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400"
                    style="background-color: #292727; border-radius: 4px;">
                    <h2 class="font-medium text-base mr-auto" style="font-weight: bold; color:white;">Student Courses</h2>
                </div>

                <div class="p-5">
                    <div class="flex flex-col-reverse xl:flex-row flex-col">
                        <div class="flex-1 mt-6 xl:mt-0">

                            <div class="overflow-x-auto">
                                <table class="table">
                                    <thead>
                                        <tr>

                                            <th class="whitespace-nowrap">#</th>
                                            <th class="whitespace-nowrap">ID</th>
                                            <th class="whitespace-nowrap">Name</th>
                                            <th class="whitespace-nowrap">Father Name</th>
                                            <th class="whitespace-nowrap">Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @php $x = 0; @endphp
                                        @foreach ($data['students'] as $row )
                                         @php $x++; @endphp
                                        <tr>
                                            <input type='hidden' name='studentId{{$x}}' value='{{$row->id}}' />
                                            {{-- <td> <input id="checkbox-switch-1" class="form-check-input" type="checkbox" value="{{$row->id}}" name="student_id{{$x}}"></td> --}}
                                            <td>{{ ++$loop->index }}</td>
                                            <td>{{ $row->id }}</td>
                                            <td>{{ $row->name }}</td>
                                            <td>{{ $row->father_name }}</td>
                                            <td>
                                                <select name="status{{$x}}" class="form-control">                                                    
                                                    <option value="Active">Active</option>
                                                    <option value="Completed">Completed</option>
                                                    <option value="Dropped">Dropped</option>
                                                </select>
                                            </td>
                                        </tr>
                                        @endforeach
                                        <input type='hidden' name='counter' value='{{$x}}' />
                                    </tbody>
                                </table>
                            </div>
                        </div>

                    </div>
                </div>

                </div>
        </div>

    </div>
    <!-- END: Display Information -->


<div class="p-5 box bg-primary/10 ">
    <div class="flex flex-col-reverse xl:flex-row flex-col">
        <div class="flex-1 mt-6 xl:mt-0">

            <div class="grid grid-cols-12 gap-2">


            </div>

            <button type="submit" class="btn btn-primary mt-5" style="float: right;">Save</button>

        </div>

    </div>
</div>

    </form>
    </div>
@endsection

@section('script')
    <script src="{{ asset('dist/js/jquery.js') }}"></script>

    <script>
        function select_row(){

            is_all_selected();
        }

    function count_selected(){
    var count = 0;
    $('.select_item').each(function(){
        var check = $(this).prop('checked');

        if(check == true)
        ++count;
    });

    if(count > 0)
    $('#operate_btn').attr('disabled', false);

    else{
        $('#operate_btn').attr('disabled', true);
        $('#save_btn').attr('disabled', true);
    }
    return count;
}
/* --------------------------------------------------------
| Check if all rows are selected
---------------------------------------------------------*/
function is_all_selected(){
    alert(123123)
    var all_rows = 0;
    $('.select_item').each(function(){
        ++all_rows;
    });

    var selected_rows = count_selected();

    if(all_rows == selected_rows)
    $('#select_all').prop('checked', true);

    else
    $('#select_all').prop('checked', false);

}
/* --------------------------------------------------------
| Select All Rows
---------------------------------------------------------*/
function all_selected(ex){
    alert(123);
    var state = $(ex).prop('checked');
    $('.select_item').each(function(){
        $(this).prop('checked', state);
    });
    is_all_selected();
}

        function dis(el) {
            if (el.value == 1) {
                jQuery('#discountPercentage').show();
                jQuery('#discountTitle').show();
            } else {
                jQuery('#discountPercentage').hide();
                jQuery('#discountTitle').hide();
            }
        }
        // End of discount show functionality

        $(document).ready(function() {
            // Start of image show functionality
            var img = document.getElementById('st_img');
            var fl = document.getElementById('image');
            fl.onchange = evt => {
                const [file] = fl.files;
                if (file) {
                    img.src = URL.createObjectURL(file);
                }
            }
            // end of image show functionality
        });

        var books = [];

        jQuery('#book_container').hide();
        jQuery('#material').hide();
        // print invoice function
        function PrintElem(elem) {
            Popup($(elem).html());
        }

        function Popup(data) {
            var mywindow = window.open('', 'invoice', 'height=600,width=850');
            mywindow.document.write('<html><head><title>Invoice</title>');
            mywindow.document.write('<link rel="stylesheet" href="assets/css/neon-theme.css" type="text/css" />');
            mywindow.document.write(
                '<link rel="stylesheet" href="assets/js/datatables/responsive/css/datatables.responsive.css" type="text/css" />'
            );
            mywindow.document.write('</head><body >');
            mywindow.document.write(data);
            mywindow.document.write('</body></html>');

            mywindow.print();
            mywindow.close();

            return true;
        }


        function get_class_semesters(program_id) {
            $.ajax({
                method: 'GET',
                url: "{{ url('/get/program/semester/') }}",
                data: {
                    p_id: program_id,
                },

                success: function(response) {
                    console.log(response);
                    jQuery('#semester_id').html(response);

                }
            });
            // get_class_sections(program_id);
            payment_info(program_id);
            get_book(program_id);
        }

        function get_section_courses(section_id) {
            $.ajax({
                method: 'GET',
                url: "{{ url('/get/section/course/') }}",
                data: {
                    s_id: section_id,
                },

                success: function(response) {
                    jQuery('#section_selector_holder').html(response);

                }
            });

            payment_info(program_id);
            get_book(program_id);
        }

        function getSection(semester_id) {
            $.ajax({
                method: 'GET',
                url: "{{ url('/get/semester/section/') }}",
                data: {
                    s_id: semester_id,
                },

                success: function(response) {
                    jQuery('#section_id').html(response);

                }
            });


        }
        // Change Material Fee Functionality
        function change_material_fee(book) {
            var id = book.dataset.id;
            var number = book.dataset.number;
            var selected_book_quantity = document.getElementById('book_amount' + number);
            var selected_book_checkbox = document.getElementById('book' + number);
            var price = book.dataset.price;
            var book_quantity = Number(selected_book_quantity.value);
            var total = 0;

            if (selected_book_checkbox.checked) {

                document.getElementById('total_book_amount' + number).value = Number(price) * book_quantity;
                $('input:hidden[class=total_book_amount]').each(function() {
                    total += Number($(this).val());
                });
                document.getElementById("material_fee").value = total;
                calculate();

            } else {
                document.getElementById('total_book_amount' + number).value = Number(0);
                $('input:hidden[class=total_book_amount]').each(function() {
                    total += Number($(this).val());
                });
                document.getElementById("material_fee").value = total;
                calculate();
            }
        }


        function get_book(program_id) {

            $.ajax({
                method: 'GET',
                url: "{{ url('/get/book/') }}",
                data: {
                    p_id: program_id,
                },

                success: function(response) {
                    console.log(response);
                    jQuery('#books').html(response[0]);
                    jQuery('#book_container').show();
                    jQuery('#material').show();
                    jQuery('#count').val(response[1]);
                }
            });
            payment_info(program_id);
        }

        function payment_info(program_id) {
            $.ajax({
                method: 'GET',
                url: "{{ url('/payment/info') }}",
                data: {
                    p_id: program_id,
                },

                success: function(response) {
                    jQuery('#admission_fee').attr('value', response.admission_fee);
                    jQuery('#exam_fee').attr('value', response.examination_fee);
                    // jQuery('#material_fee').attr('value', response.material_fee);

                    calculate();

                }
            });


        }

        function get_monthly_fee() {

            var form_data = {
                start_date: jQuery('#start_date').val(),
                due_date: jQuery('#due_date').val(),
                section_id: jQuery('#section_selector_holder').val()
            }

            $.ajax({
                method: 'GET',
                url: "{{ url('/get/monthly/fee') }}",
                data: form_data,

                success: function(response) {

                    console.log(response);
                    var monthly_fee = parseInt(response);
                    jQuery('#monthly_fee').attr('value', monthly_fee);
                    calculate();

                }
            });

        }

        function get_section_students(class_id) {
            $.ajax({
                method: 'GET',
                url: "{{ url('/get/section/students') }}",
                data: {
                    class_id: class_id,
                },

                success: function(response) {
                    jQuery('#student_selector_holder').html(response);
                    get_monthly_fee();

                }
            });
        }


        function has_admission(student_id) {
            var class_id = jQuery('#class_id').val();
            var section_id = jQuery('#section_selector_holder').val();

            $.ajax({
                url: 'index.php?admin/has_admission/' + class_id + '/' + section_id + '/' + student_id,
                success: function(response) {
                    if (response == 'true') {
                        $("#admission_fee").prop('disabled', true);
                        jQuery('#admission_fee').attr('value', 0);

                        calculate();
                    } else {
                        jQuery('#admission_fee').show();

                        payment_info(class_id);
                        calculate();
                    }
                }
            });

            //has_examination_fee(student_id);
            //has_material_fee(student_id);
        }

        function has_examination_fee(student_id) {
            var class_id = jQuery('#class_id').val();
            var section_id = jQuery('#section_selector_holder').val();

            $.ajax({
                url: 'index.php?admin/has_examination_fee/' + class_id + '/' + section_id + '/' + student_id,
                success: function(response) {
                    if (response == 'true') {
                        jQuery('#exam_fee').hide();
                        jQuery('#exam_fee').attr('value', '0');

                        calculate();
                    } else {
                        jQuery('#exam_fee').show();
                        calculate();
                    }
                }
            });
        }

        function check_payment() {
            var total = parseInt($('#total_to_pay').val());
            var amount_paid = parseInt($('#payment').val());

            if (amount_paid > total) {
                //alert("total: " + total + " Amount Paid: " + amount_paid);
                alert("payment cannot be more than total amount");
            }

        }


        function calculate() {
            var admission_fee = parseInt(jQuery('#admission_fee').val());
            var material_fee = parseInt(jQuery('#material_fee').val());
            var monthly_fee = parseInt(jQuery('#monthly_fee').val());
            var exam_fee = parseInt(jQuery('#exam_fee').val());
            var discount = parseInt(jQuery('#discount').val());
            var tax = parseInt(jQuery('#tax').val());

            // Total amount
            var total = 0;
            if (admission_fee) total += admission_fee;
            if (material_fee) total += material_fee;
            if (exam_fee) total += exam_fee;
            if (monthly_fee) total += monthly_fee;

            //net amount
            jQuery('#net_amount').attr('value', Math.round(total));
            jQuery('#net_amount').attr('value', Math.round(total + (monthly_fee * jQuery('#tax').val()) / 100));

            //discount amount
            if (discount != 0 && discount != '' && monthly_fee > 0) {
                discount_amount = (monthly_fee * discount) / 100;

                $('#title').attr('value', discount + '% discount ( ' + discount_amount + ' AFG )');
                total -= discount_amount;
            }

            jQuery('#total_to_pay').attr('value', Math.round(total));
            var tax_amount = (monthly_fee * jQuery('#tax').val()) / 100;
            jQuery('#tax_amount').attr('value', Math.round(tax_amount));

            jQuery('#payment').attr('value', Math.round(tax_amount + Number(jQuery('#total_to_pay').val())));
            jQuery('#total_to_pay').attr('value', Math.round(tax_amount + Number(jQuery('#total_to_pay').val())));
        }
    </script>
@endsection