<?php include '../header.php'; ?>
<?php include '../sidemenu.php'; ?>

<style>

</style>


<div class="page-header d-print-none">
    <div class="container-xl">
        <div class="row g-2 align-items-center">
            <div class="col d-flex justify-content-between">
                <h2 class="page-title">Rental Sales</h2>
            </div>
        </div>
    </div>
</div>

<div class="container" id="alertContainer1"></div>
<div class="page-body">
    <div class="container-xl">
        <div class="row row-cards">
            <div class="col-12">
                <div class="row">
                    <div class="col-3 mb-3 row">
                        <label class="col-4 col-form-label text-end">Reserve From</label>
                        <div class="col">
                            <input type="text" class="flatpickr flatpickr-input active form-control" id="dateFrom" required>
                        </div>
                    </div>
                    <div class="col-3 mb-3 row">
                        <label class="col-4 col-form-label text-end">Reserve To</label>
                        <div class="col">
                            <input type="text" class="flatpickr flatpickr-input active form-control" id="dateTo" required>
                        </div>
                    </div>
                </div>
                <div class="card">
                    <div class="card-body">
                        <div class="export-buttons-container" style="margin-bottom: 10px;">
                            <button id="exportCSV" class="btn btn-outline-primary">Export to CSV</button>
                            <button id="exportExcel" class="btn btn-outline-primary">Export to Excel</button>
                            <button id="exportPDF" class="btn btn-outline-primary">Export to PDF</button>
                            <button id="printTable" class="btn btn-outline-primary">Print Table</button>
                        </div>
                        <div class="table-responsive">
                            <table id="myTable" class="table card-table table-vcenter text-nowrap datatable">
                                <thead>
                                    <tr>
                                        <th>Vehicle No.</th>
                                        <th>Booking No.</th>
                                        <th>Invoice No.</th>
                                        <th>Driver Name</th>
                                        <th>Customer Name</th>
                                        <th>Booking Date</th>
                                        <th>Created At</th>
                                        <th>Rental Rate</th>
                                        <th>Add-on</th>
                                        <th>Extra Driver</th>
                                        <th>Total GROSS</th>
                                        <th>VAT (7%)</th>
                                        <th>Balance</th>
                                        <!-- <th>Actions</th> -->
                                    </tr>
                                </thead>
                                <tbody>
                                    <!-- Dynamic content here -->
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <th colspan="10" class="text-end">Total:</th>
                                        <th class="text-end"></th> <!-- sum will be shown here -->
                                        <th class="text-end"></th>
                                        <th class="text-end"></th>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<?php include '../footer.php'; ?>

<script>
    var today = new Date().toISOString().split('T')[0];
    $(document).ready(function() {
        flatpickr("#dateFrom", {
            dateFormat: "Y-m-d", 
            defaultDate: today,  
            maxDate: today,      
        });
        flatpickr("#dateTo", {
            dateFormat: "Y-m-d", 
            defaultDate: today,  
            maxDate: today,      
        });
        getAllReservations();
    });

    $("#dateFrom, #dateTo").change(function() {
        getAllReservations();
    });

    function getAllReservations() {
        var df = $("#dateFrom").val();
        var dt = $("#dateTo").val();
        $('#myTable').DataTable().destroy(); // Destroy existing DataTable instance

        let table = $('#myTable').DataTable({
            ajax: {
                url: APP_URL + "api/reservation/get_room_sales.php",
                method: "GET",
                dataType: "json",
                data: {
                    df: df,
                    dt: dt
                },
                dataSrc: 'records'
            },
            columns: [
                {
                    data: 0,
                    render: function(data, type, row) {
                        return `<span class="reservation-number">${data}</span>`;
                    }
                },
                { data: 1 },
                { data: 2 },
                { data: 3 },
                { data: 4 },
                { data: 5 },
                { data: 6 },
                {
                    data: 7,
                    className: 'text-nowrap text-end',
                    render: function (data, type, row) {
                        return data == 0 ? 0 : Number(data).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
                    }
                },
                {
                    data: 8,
                    className: 'text-nowrap text-end',
                    render: function (data, type, row) {
                        return data == 0 ? 0 : Number(data).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
                    }
                },
                {
                    data: 9,
                    className: 'text-nowrap text-end',
                    render: function (data, type, row) {
                        return data == 0 ? 0 : Number(data).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
                    }
                },
                            {
                    data: 10,
                    className: 'text-nowrap text-end',
                    render: function (data, type, row) {
                        return data == 0 ? 0 : Number(data).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
                    }
                },
                {
                    data: 11,
                    className: 'text-nowrap text-end',
                    render: function (data, type, row) {
                        return data == 0 ? 0 : Number(data).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
                    }
                },
                {
                    data: 12,
                    className: 'text-nowrap text-end',
                    render: function (data, type, row) {
                        return data == 0 ? 0 : Number(data).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
                    }
                },
            ],
            "order": [[5, "asc"], [6, "asc"]],
            paging: true,
            lengthMenu: [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
            buttons: [
                {
                    extend: 'csv',
                    text: 'Export to CSV',
                    className: 'buttons-csv',
                    filename: 'RentalSalesReport ' + df + ' to ' + dt,
                    exportOptions: {
                        columns: ':visible',
                        modifier: {
                        page: 'all',  // Include all pages
                        search: 'none' // Don't filter by search
                    }
                    }
                },
                {
                    extend: 'excel',
                    text: 'Export to Excel',
                    className: 'buttons-excel',
                    exportOptions: {
                        columns: ':visible',
                        modifier: {
                        page: 'all',  // Include all pages
                        search: 'none' // Don't filter by search
                    }
                    }
                },
                {
                    extend: 'pdf',
                    text: 'Export to PDF',
                    className: 'buttons-pdf',
                    exportOptions: {
                        columns: ':visible',
                        modifier: {
                        page: 'all',  // Include all pages
                        search: 'none' // Don't filter by search
                    }
                    }
                },
                {
                    extend: 'print',
                    text: 'Print Table',
                    className: 'buttons-print',
                    exportOptions: {
                        columns: ':visible',
                        modifier: {
                        page: 'all',  // Include all pages
                        search: 'none' // Don't filter by search
                    }
                    }
                }
            ],
            createdRow: function (row, data, dataIndex) {
                $(row).attr('data-reservation', JSON.stringify(data));
            },
            footerCallback: function (row, data, start, end, display) {
                var api = this.api();

                function getColumnTotal(index) {
                    const total = api
                        .column(index, { page: 'current' })
                        .data()
                        .reduce(function (a, b) {
                            return parseFloat(a) + parseFloat(b);
                        }, 0);
                
                    return total.toLocaleString(undefined, {
                        minimumFractionDigits: 2,
                        maximumFractionDigits: 2
                    });
                }

                $(api.column(10).footer()).html(getColumnTotal(10));
                $(api.column(11).footer()).html(getColumnTotal(11));
                $(api.column(12).footer()).html(getColumnTotal(12));
            }


        });

        
        $('#exportCSV').on('click', function() {
            table.button('.buttons-csv').trigger();
        });

        $('#exportExcel').on('click', function() {
            table.button('.buttons-excel').trigger();
        });

        $('#exportPDF').on('click', function() {
            table.button('.buttons-pdf').trigger();
        });

        $('#printTable').on('click', function() {
            table.button('.buttons-print').trigger();
        });
    }
</script>
