@include('admin.includes.head')
@include('admin.includes.sidebar')
@include('admin.includes.topbar')
<div class="container px-2 mt-4">
    <div id="TableData" class="table-responsive">


    </div>

</div>
<!-- End Main content-->

@include('admin.includes.footer')
<script type="text/javascript">
    $(document).ready(function() {
        $("#dropdown-list").html(
            '<div class="dropdown"><button class="btn dropdown-toggle text-white border-dark" type="button" id="filter-bookings" data-bs-toggle="dropdown" aria-expanded="false" style="background:#2978b5!important">IN TEMPLE BOOKINGS</button><ul class="dropdown-menu filter-bookings" aria-labelledby="filter-bookings"><li><a class="dropdown-item" href="#" data-value="IN-TEMPLE">IN TEMPLE BOOKINGS</a></li><li><a class="dropdown-item" href="#" data-value="AWAY-TEMPLE">AWAY TEMPLE BOOKINGS</a></li><li><a class="dropdown-item" href="#" data-value="EVENTS">EVENTS BOOKINGS</a></li>				</ul></div>'
        );
        var selectedValue = 'IN-TEMPLE';
        // alert(selectedValue);
        $("#filter-bookings").text("IN TEMPLE BOOKINGS"); // set initial text
        $('.dropdown-menu a').click(function(e) {
            //alert(e.val);
            e.preventDefault(); // prevent link from navigating
            var selectedValue = $(this).data('value');
            //alert(selectedValue);
            $("#filter-bookings").text($(this).text()); // update button text
            var URL = "{{ route('admin.filterBookingData') }}";
            //alert(URL);
            $.ajax({
                //alert("gfh");
                url: URL,
                type: 'POST',
                data: {
                    aspectType: selectedValue
                },
                success: function(data) {
                    $("#TableData").html(data);
                    $('#myBookings').DataTable({
                        order: [
                            [0, 'desc']
                        ],
                        "lengthChange": false,
                        "scrollX": true,
                        "ordering": false,
                        "searching": true,
                        language: {
                            emptyTable: "No Bookings Available to show..",
                            search: ''
                        }
                    });

                    if (selectedValue == 'IN-TEMPLE') {
                        $("#heading").text('In Temple Bookings');
                    }
                    if (selectedValue == 'AWAY-TEMPLE') {
                        $("#heading").text('Away Temple Bookings');
                    }
                    if (selectedValue == 'EVENTS') {
                        $("#heading").text('Events Bookings');
                    }
                }
            });
        });

        $('.dropdown-menu a[data-value="' + selectedValue + '"]').trigger(
            'click'); // trigger click on initial value



    });


    function show_booking_status(service, status) {

        var status = status;
        var service = service;

        Swal.fire({
            title: 'Booking Status',
            text: 'Your service "' + service + '" has been "' + status + '".',
            type: "success",
            confirmButtonText: 'OK',
            confirmButtonColor: '#008080',
        }).then((result) => {
            window.location.reload();
        });
    }

    function CancelBooking(id) {
        //alert(id);
        var id = id;
        var Url = "{{ route('admin.CancelBooking') }}";
        // alert(Url);
        Swal.fire({
            title: 'Do you want to cancel this Booking?',
            showDenyButton: false,
            showCancelButton: true,
            confirmButtonText: 'Yes',
            denyButtonText: 'No',
        }).then((result) => {
            if (result.isConfirmed) {
                loader.on();
                $.ajax({
                    url: Url,
                    type: 'POST',
                    data: {
                        // If you need to send additional data along with the request, include it here
                        _id: id, // Include the CSRF token
                    },
                    dataType: "json",
                    success: function(data) {
                        loader.off();
                        if (data['statusCode'] == 1) {
                            Swal.fire({
                                title: 'Booking has been cancelled',
                                type: "success",
                                confirmButtonText: 'OK',
                                confirmButtonColor: '#008080',
                            }).then((result) => {
                                window.location.reload();
                            });
                        } else {
                            Swal.fire({
                                title: 'Something went wrong!',
                                type: "alert",
                                confirmButtonText: 'OK',
                                confirmButtonColor: '#008080',
                            }).then((result) => {
                                window.location.reload();
                            });
                        }
                    }
                });
            } else if (result.isDenied) {
                Swal.fire('Changes are not saved', '', 'info')
            }
        });
    }
</script>


</body>

</html>