@extends('layouts.layout')

@section('title', 'Student Reports')
<!-- @section('content') -->
@section('content')

    <!--maintainance code -->
    <!-- @include('maintainance') -->

    <div class="content-inner">
        <div class="dashboard-inner">
            <div class="dashboard-header">
                <h3>Student Report</h3>
                @if(Auth::user()->role_id != 5)
                <a href="javascript:void(0)" class="btn email-report disabled-form allocation-btn">Email Report
                    <div class="allocation-loader d-none"><img src="{{ asset('images/loader-white.svg') }}" /></div>
                </a>
                @endif
            </div>
            <form>
            <div class="user-select-group select-auto">
                @if (Auth::user()->role_id == 1 || Auth::user()->role_id == 5)
                    @if (!empty($franchises))
                        <select class="form-select select-hidden ml-2" name="franchise" id="search_franchise"
                            onchange="select_franchise(this.value)">
                            <option value="">Franchise</option>
                            @foreach ($franchises as $franchise)
                                <option value="{{ $franchise->id }}"  {{(($searchfranchise == $franchise->id) ? "selected" : "")}}>{{ $franchise->name }}</option>
                            @endforeach
                        </select>
                    @endif
                @else
                    <input type="hidden" id="search_franchise" value="{{ $franchise_id }}" />
                @endif

                @if ($terms)
                    <select class="form-select" name="term" id="search_term">
                        <option value="">Term</option>
                        @foreach ($terms as $term)
                            <option value="{{ $term->id }}" {{(($searchterm == $term->id) ? "selected" : "")}}>{{ $term->term_name }}</option>
                        @endforeach
                    </select>
                @endif

                @if (!empty($settingClassAgeGroup))
                    <select class="form-select" name="class" id="search_class">
                        <option value="">Class</option>
                        @foreach ($settingClassAgeGroup as $settingClassAgeGroupItem)
                            <option {{(($searchclass == $settingClassAgeGroupItem->id) ? "selected" : "")}} value="{{ $settingClassAgeGroupItem['id'] }}">{!! Str::ucfirst($settingClassAgeGroupItem['type']) !!} |
                                {!! $settingClassAgeGroupItem['class_age_from'] !!} - {!! $settingClassAgeGroupItem['class_age_to'] !!} </option>
                        @endforeach
                    </select>
                @endif

                <div>
                    <button type="submit" class="btn">Filter</button>
                    @if (!empty($searchfranchise) || !empty($searchclass) || !empty($searchterm))
                        <a href="{{ url('student-reports') }}" class="btn ml-2" id="clear">Clear</a>
                    @endif

                </div>
            </div>
            </form>
            <div class="table-wrap-class last-th-none accordion-table review-table student-datatable">
                <table id="example1" class="table table-bordered table-striped">
                    <thead>
                        <tr>
                            <th>
                                <div class="form-check">
                                    <input style="margin-left: -30px !important;" class="form-check-input" type="checkbox" name="multipleselect"
                                        id="multipleselect">
                                </div>
                            </th>
                            @if (Auth::user()->role_id == 1)
                                <th>Franchise</th>
                            @endif
                            <th>Term</th>
                            <th>Class</th>
                            <th>Student Name</th>
                            <th>Dance</th>
                            <th>Drama</th>
                            <th>Singing</th>
                            <th>Manager</th>
                            <th>Report Date</th>
                            <th>Date sent</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>

                    </tbody>

                </table>
            </div>
        </div>
    </div>
    @if (Auth::user()->role_id == 1)
        <script>
            $(function() {
                var table = $(".table-wrap-class .table").DataTable({
                    processing: true,
                    language: {
                        searchPlaceholder: "Search",
                    },
                    dom: '<"custom-table-info"<"custom-table-left"B><"custom-table-right"frlp>><"custom-table"t>p',

                    language: {
                        searchPlaceholder: "Search",
                        "lengthMenu": '<select class="form-select">' +
                            '<option value="50">Show: 50</option>' +
                            '<option value="100">Show: 100</option>' +
                            '<option value="150">Show: 150</option>' +
                            '<option value="200">Show: 200</option>' +
                            '<option value="-1">Show: All</option>' +
                            '</select> '
                    },

                    serverSide: true,
                    ordering: true,
                    order: [],
                    pageLength: 50,
                    buttons: [{
                            extend: "excelHtml5",
                            orientation: "landscape",
                            pageSize: "LEGAL",
                        },
                        {
                            extend: "pdfHtml5",
                            orientation: "landscape",
                            pageSize: "LEGAL",
                        },
                        {
                            extend: "print",
                            customize: function(win) {
                                $(win.document.body).css("font-size", "10pt");

                                $(win.document.body)
                                    .find("table")
                                    .addClass("compact")
                                    .css("font-size", "inherit");
                            },
                        },
                    ],
                    ajax: {
                        url: "{{ url('student-reports') }}",
                        data: function(d) {
                            d.franchise = $('#search_franchise').val();
                            d.term = $('#search_term').val();
                            d.class = $('#search_class').val();
                            d.search = $('input[type="search"]').val();
                        }
                    },
                    columns: [{
                            data: 'multipleselect',
                            name: 'multipleselect',
                            orderable: false,
                            searchable: true
                        },
                        {
                            data: 'franchise',
                            name: 'franchise',
                            searchable: true
                        },
                        {
                            data: 'term',
                            name: 'term',
                            serachable: true
                        },
                        {
                            data: 'class',
                            name: 'class',
                            serachable: true
                        },
                        {
                            data: 'student_name',
                            name: 'student_name',
                            serachable: true
                        },
                        {
                            data: 'dance',
                            name: 'dance',
                            orderable: false,
                            serachable: true
                        },
                        {
                            data: 'drama',
                            name: 'drama',
                            orderable: false,
                            serachable: true
                        },
                        {
                            data: 'singing',
                            name: 'singing',
                            orderable: false,
                            serachable: true
                        },
                        {
                            data: 'manager',
                            name: 'manager',
                            orderable: false,
                            serachable: true
                        },
                        {
                            data: 'reportdate',
                            name: 'reportdate',
                            serachable: true
                        },
                        {
                            data: 'datesent',
                            name: 'datesent',
                            serachable: true
                        },
                        {
                            className: 'dtd-control',
                            orderable: false,
                            data: 'view',
                            defaultContent: ''
                        }

                    ],
                    "fnDrawCallback": function(oSettings, json) {
                        // console.log($('.table-custom-wrap').find(".dataTables_paginate").eq(0).find('span').find("a").length);
                        // $("html, body").animate({
                        //         scrollTop: $(".table-wrap-class").offset().top,
                        //     },
                        //     "slow"
                        // );

                        if ($('.table-wrap-class').find(".dataTables_paginate").eq(0).find('span').find("a")
                            .length > 1) {

                            $('.table-wrap-class').find(".dataTables_paginate").show();
                        } else {
                            $('.table-wrap-class').find(".dataTables_paginate").hide();
                        }

                        if($("#multipleselect").prop('checked') == true){
                            $(".selectmultiple").prop("checked", true);
                        }
                    }

                });
                var openAccordionId = null; // variable to store the ID of the currently open accordion

                table.on('click', 'td.dtd-control', function(e) {


                    var id = $(this).children("a").attr("data-id");
                    let tr = e.target.closest('tr');
                    let row = table.row(tr);



                    if (row.child.isShown()) {
                        // This row is already open - close it
                        row.child.hide();
                    } else {
                        $.ajax({
                            type: "POST",
                            dataType: "json",
                            url: "{{ url('student-reports/getexpandview') }}",
                            data: {
                                booking_id: id,
                                _token: '{{ csrf_token() }}'
                            },
                            success: function(response) {
                                row.child(format(response.data)).show();
                                if (openAccordionId !== null && openAccordionId !== id) {
                                    // If there's an open accordion and it's not the one being clicked, close it
                                    var openAccordionRow = table.row('#closemodel' +
                                        openAccordionId);
                                    openAccordionRow.child.hide();
                                }
                                row.node().id = 'closemodel' + id;
                                openAccordionId = id;
                            }
                        });
                        // Open this row

                    }
                });

            });

            function savestudentreport(value) {
                var dance = $('#dance' + value).val()?.trim();
                var drama = $('#drama' + value).val()?.trim();
                var singing = $('#singing' + value).val()?.trim();
                var manager = $('#manager' + value).val()?.trim();

                var booking_id = value;
                const swalWithBootstrapButtons = Swal.mixin({
                    customClass: {
                        confirmButton: 'btn btn-success',
                        cancelButton: 'btn btn-danger'
                    },
                    buttonsStyling: false
                });
                if (dance || drama || singing || manager) {
                    $.ajax({
                        type: "POST",
                        dataType: "json",
                        url: "{{ url('student-reports/storereportdata') }}",
                        data: {
                            dance: dance,
                            drama: drama,
                            singing: singing,
                            manager: manager,
                            booking_id: booking_id,
                            _token: '{{ csrf_token() }}'
                        },
                        success: function(response) {
                            $("#multipleselect").prop("checked", false);
                            $('.table-wrap-class .table').DataTable().ajax.reload();
                            swalWithBootstrapButtons.fire(
                                'Report',
                                'Report comment added.',
                                'success'
                            );
                        }
                    });
                }else {
                    swalWithBootstrapButtons.fire(
                        'Validation',
                        'Yon need to add at least one field form Dance,Drama,Singing,Manager.',
                        'warning'
                    );
                }

            }
        </script>
    @else
        <script>
            $(function() {
                var table = $(".table-wrap-class .table").DataTable({
                    processing: true,
                    language: {
                        searchPlaceholder: "Search",
                    },
                    dom: '<"custom-table-info"<"custom-table-left"B><"custom-table-right"frlp>><"custom-table"t>p',

                    language: {
                        searchPlaceholder: "Search",
                        "lengthMenu": '<select class="form-select">' +
                            '<option value="50">Show: 50</option>' +
                            '<option value="75">Show: 75</option>' +
                            '<option value="100">Show: 100</option>' +
                            '<option value="150">Show: 150</option>' +
                            '<option value="300">Show: 300</option>' +
                            '<option value="-1">Show: All</option>' +
                            '</select> '
                    },
                    serverSide: true,
                    ordering: true,
                    order: [],
                    pageLength: 50,
                    buttons: ["excel", "pdf", "print"],
                    ajax: {
                        url: "{{ url('student-reports') }}",
                        data: function(d) {
                            d.franchise = $('#search_franchise').val();
                            d.term = $('#search_term').val();
                            d.class = $('#search_class').val();
                            d.search = $('input[type="search"]').val();
                        }
                    },
                    columns: [{
                            data: 'multipleselect',
                            name: 'multipleselect',
                            orderable: false,
                            searchable: true
                        },
                        {
                            data: 'term',
                            name: 'term',
                            serachable: true
                        },
                        {
                            data: 'class',
                            name: 'class',
                            serachable: true
                        },
                        {
                            data: 'student_name',
                            name: 'student_name',
                            serachable: true
                        },
                        {
                            data: 'dance',
                            name: 'dance',
                            serachable: true,
                            orderable: false,
                        },
                        {
                            data: 'drama',
                            name: 'drama',
                            serachable: true,
                            orderable: false,
                        },
                        {
                            data: 'singing',
                            name: 'singing',
                            serachable: true,
                            orderable: false,
                        },
                        {
                            data: 'manager',
                            name: 'manager',
                            serachable: true,
                            orderable: false,
                        },
                        {
                            data: 'reportdate',
                            name: 'reportdate',
                            serachable: true
                        },
                        {
                            data: 'datesent',
                            name: 'datesent',
                            serachable: true
                        },
                        {
                            className: 'dtd-control',
                            orderable: false,
                            data: 'view',
                            defaultContent: ''
                        }

                    ],
                    "fnDrawCallback": function(oSettings, json) {
                        // console.log($('.table-custom-wrap').find(".dataTables_paginate").eq(0).find('span').find("a").length);
                        // $("html, body").animate({
                        //         scrollTop: $(".table-wrap-class").offset().top,
                        //     },
                        //     "slow"
                        // );

                        if ($('.table-wrap-class').find(".dataTables_paginate").eq(0).find('span').find("a")
                            .length > 1) {
                            $('.table-wrap-class').find(".dataTables_paginate").show();
                        } else {
                            $('.table-wrap-class').find(".dataTables_paginate").hide();
                        }

                        if($("#multipleselect").prop('checked') == true){
                            $(".selectmultiple").prop("checked", true);
                        }
                    }

                });
                var openAccordionId = null; // variable to store the ID of the currently open accordion

                table.on('click', 'td.dtd-control', function(e) {


                    var id = $(this).children("a").attr("data-id");
                    let tr = e.target.closest('tr');
                    let row = table.row(tr);



                    if (row.child.isShown()) {
                        // This row is already open - close it
                        row.child.hide();
                    } else {
                        $.ajax({
                            type: "POST",
                            dataType: "json",
                            url: "{{ url('student-reports/getexpandview') }}",
                            data: {
                                booking_id: id,
                                _token: '{{ csrf_token() }}'
                            },
                            success: function(response) {
                                row.child(format(response.data)).show();
                                if (openAccordionId !== null && openAccordionId !== id) {
                                    // If there's an open accordion and it's not the one being clicked, close it
                                    var openAccordionRow = table.row('#closemodel' +
                                        openAccordionId);
                                    openAccordionRow.child.hide();
                                }
                                row.node().id = 'closemodel' + id;
                                openAccordionId = id;
                            }
                        });
                        // Open this row

                    }
                });

            });

            function savestudentreport(value) {
                var dance = $('#dance' + value).val()?.trim();
                var drama = $('#drama' + value).val()?.trim();
                var singing = $('#singing' + value).val()?.trim();
                var manager = $('#manager' + value).val()?.trim();

                const swalWithBootstrapButtons = Swal.mixin({
                    customClass: {
                        confirmButton: 'btn btn-success',
                        cancelButton: 'btn btn-danger'
                    },
                    buttonsStyling: false
                });

                if (dance || drama || singing || manager) {

                    var booking_id = value;


                    $.ajax({
                        type: "POST",
                        dataType: "json",
                        url: "{{ url('student-reports/storereportdata') }}",
                        data: {
                            dance: dance,
                            drama: drama,
                            singing: singing,
                            manager: manager,
                            booking_id: booking_id,
                            _token: '{{ csrf_token() }}'
                        },
                        success: function(response) {
                            $("#multipleselect").prop("checked", false);
                            $('.table-wrap-class .table').DataTable().ajax.reload();
                            swalWithBootstrapButtons.fire(
                                'Report',
                                'Report comment added.',
                                'success'
                            );
                        }
                    });
                }else {
                    swalWithBootstrapButtons.fire(
                        'Validation',
                        'Yon need to add at least one field form Dance,Drama,Singing,Manager.',
                        'warning'
                    );
                }

            }
        </script>
    @endif
    <script type="text/javascript">
        $('.email-report').click(function() {

            $('.email-report').addClass('disabled-form');

            const swalWithBootstrapButtons = Swal.mixin({
                customClass: {
                    confirmButton: 'btn btn-success',
                    cancelButton: 'btn btn-danger'
                },
                buttonsStyling: false
            });
            $('.allocation-loader').removeClass('d-none');
            var reportval = [];
            $('input[name="checkbox[]"]:checked').each(function() {

                reportval.push($(this).val());
                // Perform other operations here for each checked checkbox
            });

            $.ajax({
                type: "POST",
                dataType: "json",
                url: "{{ url('student-reports/sendbulkmailtocustomer') }}",
                data: {
                    reportval: reportval,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {

                    $('.email-report').removeClass('disabled-form');

                    $('.allocation-loader').addClass('d-none');
                    $("#multipleselect").prop("checked", false);
                    $(".selectmultiple").prop("checked", false);
                    $('.table-wrap-class .table').DataTable().ajax.reload();
                    swalWithBootstrapButtons.fire(
                        'Sent!',
                        'Email sent successfully.',
                        'success'
                    );
                }
            });
        });

        $(".selectmultiple").click(function() {
            if ($(".selectmultiple").prop('checked') == true) {
                $('.email-report').removeClass('disabled-form');
            } else {
                $('.email-report').addClass('disabled-form');
            }
        });


        $('#multipleselect').click(function() {
            if ($("#multipleselect").prop('checked') == true) {
                $('.email-report').removeClass('disabled-form');
                $(".selectmultiple").prop("checked", true);
            } else {
                $('.email-report').addClass('disabled-form');
                $(".selectmultiple").prop("checked", false);
            }
        });

        function checkuncheck() {
            if ($('input[name="checkbox[]"]:checked').length > 0) {
                $('.email-report').removeClass('disabled-form');
            } else {
                $('.email-report').addClass('disabled-form');
            }
        }

        function sentstudentreport(value) {

            var dance = $('#dance' + value).val()?.trim();
            var drama = $('#drama' + value).val()?.trim();
            var singing = $('#singing' + value).val()?.trim();
            var manager = $('#manager' + value).val()?.trim();

            const swalWithBootstrapButtons = Swal.mixin({
                customClass: {
                    confirmButton: 'btn btn-success',
                    cancelButton: 'btn btn-danger'
                },
                buttonsStyling: false
            });

            if (dance || drama || singing || manager) {
                $(this).addClass('disabled-form');
                $("#student_report_booking_id_"+value).addClass('disabled-form');
                $('.sentstudentreport').removeClass('d-none');

                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "{{ url('student-reports/sendsinglemailtocustomer') }}",
                    data: {
                        booking_id: value,
                        dance: dance,
                        drama: drama,
                        singing: singing,
                        manager: manager,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        $('.sentstudentreport').addClass('d-none');
                        $("#student_report_booking_id_"+value).removeClass('disabled-form');
                        $(this).removeClass('disabled-form');
                        swalWithBootstrapButtons.fire(
                            'Sent!',
                            'Report sent successfully.',
                            'success'
                        ).then((result) => {

                            $('.table-wrap-class .table').DataTable().ajax.reload();
                        });


                    }
                });
            } else {
                swalWithBootstrapButtons.fire(
                    'Validation',
                    'Yon need to add at least one field form Dance,Drama,Singing,Manager.',
                    'warning'
                );
            }
        }

        function generatestudentreportpdf(value) {

            var dance = $('#dance' + value).val()?.trim();
            var drama = $('#drama' + value).val()?.trim();
            var singing = $('#singing' + value).val()?.trim();
            var manager = $('#manager' + value).val()?.trim();

            $('.allocation-loader').removeClass('d-none');
            $.ajax({
                type: "POST",
                dataType: "json",
                url: "{{ url('student-reports/generatestudentreportpdf') }}",
                data: {
                    booking_id: value,
                    dance: dance,
                    drama: drama,
                    singing: singing,
                    manager: manager,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {

                    window.open(response.data, '_blank');
                    $('.allocation-loader').addClass('d-none');
                    //  $("#multipleselect").prop("checked", false);
                    // $('.table-wrap-class .table').DataTable().ajax.reload();
                }
            });
        }

        function select_franchise(value) {
            $('#search_class').val("");
            $('#search_term').val("");

            $.ajax({
                type: "POST",
                dataType: "json",
                url: "{{ url('student-reports/get-franchise-class-age-group') }}",
                data: {
                    franchise_id: value,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    $('#search_class').html('<option value="">Class</option>');
                    if (response.data.length > 0) {
                        $.each(response.data, function(key, value) {
                            $('#search_class').append('<option value="' + value.id + '">' + value
                                .class_age_group_name + '</option>');
                        });
                    }

                    $('#search_term').html('<option value="">Term</option>');
                    if (response.terms.length > 0) {
                        $.each(response.terms, function(key, value) {
                            $('#search_term').append('<option value="' + value.id + '">' + value
                                .term_name + '</option>');
                        });
                    }
                }
            });
            //$('.table-wrap-class .table').DataTable().ajax.reload();
            //$('#clear_filter').show();
        }

        function select_term(value) {

            $('.table-wrap-class .table').DataTable().ajax.reload();
            $('#clear_filter').show();
        }

        function select_class(value, franchise, term) {
            $('.table-wrap-class .table').DataTable().ajax.reload();
            $('#clear_filter').show();
        }



        function format(d) {
            return (d);
        }
    </script>

    @if (Auth::user()->role_id == 1)
        <script>
            function clear_filter() {
                $('#search_franchise').val("");
                $('#search_term').val("");
                $('#search_class').val("");
                $('.table-wrap-class .table').DataTable().ajax.reload();
                $('#clear_filter').hide();
            }
        </script>
    @else
        <script>
            function clear_filter() {
                $('#search_term').val("");
                $('#search_class').val("");
                $('.table-wrap-class .table').DataTable().ajax.reload();
                $('#clear_filter').hide();
            }
        </script>
    @endif
@endsection