@extends('layouts.user.main')
@section('content')

    
    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <!--begin::Post-->
        <div class="post d-flex flex-column-fluid" id="kt_post">
            <!--begin::Container-->
            <div id="kt_content_container" class="container-xxl">
                <!--begin::Card-->
                <!--begin::Card body-->
                <form action="{{ route('trialBalanceDetails') }}" method="post" id="dateRangeForm">
                    @csrf
                    <input type="hidden" name="start_date" id="start_date">
                    <input type="hidden" name="end_date" id="end_date">
                </form>
                <!--begin::Card body-->
                <div class="card card-flush">
                    <!--begin::Card body-->
                    <div class="card-body py-4">
                        <!--begin::Table-->
                        <div class="table-responsive">
                            <table class="table align-middle table-row-dashed fs-6 gy-5 table-hover table-striped" id="kt_table_trial_balance_details">
                                <!--begin::Table head-->
                                <thead>
                                    <!--begin::Table row-->
                                    <tr class="text-center fw-bolder fs-7 text-uppercase gs-0">
                                        <th class="min-w-100px">Code (CR)</th>
                                        <th class="min-w-100px">Name (CR)</th>
                                        <th class="min-w-100px">Bill (CR)</th>
                                        <th class="min-w-100px">Manager Net (CR)</th>
                                        <th class="min-w-100px">Balance (CR)</th>
                                        <th class="min-w-100px">Code (DR)</th>
                                        <th class="min-w-100px">Name (DR)</th>
                                        <th class="min-w-100px">Bill (DR)</th>
                                        <th class="min-w-100px">Manager Net (DR)</th>
                                        <th class="min-w-100px">Balance (DR)</th>
                                    </tr>
                                    <!--end::Table row-->
                                </thead>
                                <!--end::Table head-->
                                <!--begin::Table body-->
                                <tbody class="fw-bold">
                                </tbody>
                                <!--end::Table body-->
                            </table>
                        </div>
                        <!--end::Table-->
                    </div>
                </div>
                <!--end::Card-->
            </div>
            <!--end::Container-->
        </div>
        <!--end::Post-->
    </div>
    <script type="text/javascript">
        const token             = "{{ csrf_token() }}";
        const table             = $('#kt_table_trial_balance_details');
        var fileName            = "Trial_Balance_Detail_Report";
        var title               = fileName + '_' +Date.now();
        var columns             = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
        var managerId           = "{{$managerId}}";
        var minFractionDigit    = "{{CommonConstants::PL_SUMMARY['MIN_FRACTION_DIGIT']}}";
        var maxFractionDigit    = "{{CommonConstants::PL_SUMMARY['MAX_FRACTION_DIGIT']}}";
        
        var dataColumns = [
            {
                data: 'loginIdCr',
                name: 'loginIdCr',
                render: function(data) { 
                    return data ? data : "-";
                }         
            },
            {
                data: 'nameCr',
                name: 'nameCr',
                render: function(data) { 
                    return data ? data : "-";
                } 
            },
            {
                data: 'grossBillCr',
                name: 'grossBillCr',
                render: function(data) {
                    if (data != '-') {
                        data = numberSeparator(Number(data), 2, 2)
                    }
                    return data;
                }
            },
            {
                data: 'managerNetCr',
                name: 'managerNetCr',
                render: function(data) {
                    if (data != '-') {
                        data = numberSeparator(Number(data), 2, 2)
                    }
                    return data;
                }
            },
            {
                data: 'balanceCr',
                name: 'balanceCr',
                render: function(data) {
                    if (data != '-') {
                        data = numberSeparator(Number(data), 2, 2)
                    }
                    return data;
                }
            },
            {
                data: 'loginIdDr',
                name: 'loginIdDr',
                render: function(data) {
                    return data ? data : "-";
                } 
            },
            {
                data: 'nameDr',
                name: 'nameDr',
                render: function(data) {
                    return data ? data : "-";
                } 
            },
            {
                data: 'grossBillDr',
                name: 'grossBillDr',
                render: function(data) {
                    if (data != '-') {
                        data = numberSeparator(Number(data), 2, 2)
                    }
                    return data;
                }
            },
            {
                data: 'managerNetDr',
                name: 'managerNetDr',
                render: function(data) {
                    if (data != '-') {
                        data = numberSeparator(Number(data), 2, 2)
                    }
                    return data;
                }
            },
            {
                data: 'balanceDr',
                name: 'balanceDr',
                render: function(data) {
                    if (data != '-') {
                        data = numberSeparator(Number(data), 2, 2)
                    }
                    return data;
                }
            }
        ];

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $(document).ready(function() {
            makeDataTable(table, title, columns, dataColumns);
        });

        function makeDataTable(table, title, columnArray, dataColumns) {
        var managers =  @json($managers);
        var diffName = '{{CommonConstants::COMPANY_NAME}}';

        var reloadAjex = $(table).dataTable({
            // export buttons
            dom: "<'card-header align-items-center py-5 gap-2 gap-md-5'<'card-title col-4'<'d-flex position-relative my-1'>><'card-toolbar flex-row-fluid justify-content-end gap-6'<'custom-button-container'>B>>" +
                    "<'row'<'col-sm-12'tr>>" +
                    "<'row'<'col-sm-12 col-md-5 gap-2 d-flex align-items-center justify-content-center justify-content-md-start'l<i>><'col-sm-12 col-md-7 d-flex align-items-center justify-content-center justify-content-md-end'p>>",
            processing: true,
            stateSave: true,
            "stateSaveParams": function (settings, data) {
                data.search.search = '';
            },
            pageLength: 10,
            "lengthMenu": {!! json_encode(CommonConstants::ALL_PAGE_PER_DATA) !!},
            language: {
                searchPlaceholder: "Search User",
                search: ""
            },
            ajax: {
                // url: "{{ route('trialBalanceDetails', ['managerId' => ':managerId']) }}".replace(':managerId', managerId),
                url: "{{ route('trialBalanceDetails') }}",
                method: "GET",
                data: {
                    managerId : managerId,
                    start_date : "{{ $start_date }}",
                    end_date   : "{{ $end_date }}"
                }
            },
            columns: dataColumns,
            rowCallback: function(row, data) {
                $(row).addClass('text-center');
            },
            "stateLoadParams": function (settings, data) {
                if (data.select) {
                    data.select.rows = [];
                }
            },
            order: [
                [0, "asc"]
            ],
            buttons: [{
                extend: "collection",
                className: "exportButton",
                text: "<i class='fa fa-download'></i>",
                    buttons: [
                    {
                        extend: "excelHtml5",
                        text: "Export",
                        className: "btn btn-default btn-sm gap-5",
                        title: title,
                        exportOptions: {
                            columns: columnArray
                        },
                        customizeData: function(data) {
                            var totalBillCr = 0, totalManagerNetCr = 0, totalBalanceCr = 0;
                            var totalBillDr = 0, totalManagerNetDr = 0, totalBalanceDr = 0;

                            var parseNumber = function(value) {
                                value = value.replace(/,/g, '');
                                return value !== "-" && !isNaN(value) ? parseFloat(value) : 0;
                            };

                            // Calculate totals
                            data.body.forEach(row => {                                
                                totalBillCr         += parseNumber(row[2]);                                
                                totalManagerNetCr   += parseNumber(row[3]);                                
                                totalBalanceCr      += parseNumber(row[4]);
                                totalBillDr         += parseNumber(row[7]);
                                totalManagerNetDr   += parseNumber(row[8]);                                
                                totalBalanceDr      += parseNumber(row[9]);
                            });

                            // Calculate differences
                            var diffBill    = Math.abs(totalBillCr - totalBillDr);
                            var diffNet     = Math.abs(totalManagerNetCr - totalManagerNetDr);
                            var diffBalance = Math.abs(totalBalanceCr - totalBalanceDr);

                            // Determine which side is smaller
                            var isBillCrSmaller     = totalBillCr < totalBillDr;
                            var isNetCrSmaller      = totalManagerNetCr < totalManagerNetDr;
                            var isBalanceCrSmaller  = totalBalanceCr < totalBalanceDr;

                            // Insert "Difference" row **AFTER HEADERS (index 1)**
                            data.body.unshift([
                                isBillCrSmaller ? diffName : "", "", 
                                isBillCrSmaller ? numberSeparator(diffBill, minFractionDigit, maxFractionDigit) : "", 
                                isNetCrSmaller ? numberSeparator(diffNet, minFractionDigit, maxFractionDigit) : "", 
                                isBalanceCrSmaller ? numberSeparator(diffBalance, minFractionDigit, maxFractionDigit) : "",
                                !isBillCrSmaller ? diffName : "", "", 
                                !isBillCrSmaller ? numberSeparator(diffBill, minFractionDigit, maxFractionDigit) : "", 
                                !isNetCrSmaller ? numberSeparator(diffNet, minFractionDigit, maxFractionDigit) : "", 
                                !isBalanceCrSmaller ? numberSeparator(diffBalance, minFractionDigit, maxFractionDigit) : ""
                            ]);

                            // Add "Total Amount" row at the bottom
                            data.body.push([
                                "Total Amount", "", 
                                numberSeparator(totalBillCr + (isBillCrSmaller ? diffBill : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalManagerNetCr + (isNetCrSmaller ? diffNet : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalBalanceCr + (isBalanceCrSmaller ? diffBalance : 0), minFractionDigit, maxFractionDigit),
                                "Total Amount", "", 
                                numberSeparator(totalBillDr + (!isBillCrSmaller ? diffBill : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalManagerNetDr + (!isNetCrSmaller ? diffNet : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalBalanceDr + (!isBalanceCrSmaller ? diffBalance : 0), minFractionDigit, maxFractionDigit)
                            ]);
                        }
                    },{
                        extend: "excelHtml5",
                        text: "Export All",
                        className: "btn btn-default btn-sm gap-5",
                        title: title,
                        "action": exportAllAction,
                        exportOptions: {
                            columns: columnArray
                        },
                        customizeData: function(data) {
                            var totalBillCr = 0, totalManagerNetCr = 0, totalBalanceCr = 0;
                            var totalBillDr = 0, totalManagerNetDr = 0, totalBalanceDr = 0;

                            var parseNumber = function(value) {
                                value = value.replace(/,/g, '');
                                return value !== "-" && !isNaN(value) ? parseFloat(value) : 0;
                            };

                            // Calculate totals
                            data.body.forEach(row => {                                
                                totalBillCr         += parseNumber(row[2]);                                
                                totalManagerNetCr   += parseNumber(row[3]);                                
                                totalBalanceCr      += parseNumber(row[4]);
                                totalBillDr         += parseNumber(row[7]);
                                totalManagerNetDr   += parseNumber(row[8]);                                
                                totalBalanceDr      += parseNumber(row[9]);
                            });

                            // Calculate differences
                            var diffBill    = Math.abs(totalBillCr - totalBillDr);
                            var diffNet     = Math.abs(totalManagerNetCr - totalManagerNetDr);
                            var diffBalance = Math.abs(totalBalanceCr - totalBalanceDr);

                            // Determine which side is smaller
                            var isBillCrSmaller     = totalBillCr < totalBillDr;
                            var isNetCrSmaller      = totalManagerNetCr < totalManagerNetDr;
                            var isBalanceCrSmaller  = totalBalanceCr < totalBalanceDr;

                            // Insert "Difference" row **AFTER HEADERS (index 1)**
                            data.body.unshift([
                                isBillCrSmaller ? diffName : "", "", 
                                isBillCrSmaller ? numberSeparator(diffBill, minFractionDigit, maxFractionDigit) : "", 
                                isNetCrSmaller ? numberSeparator(diffNet, minFractionDigit, maxFractionDigit) : "", 
                                isBalanceCrSmaller ? numberSeparator(diffBalance, minFractionDigit, maxFractionDigit) : "",
                                !isBillCrSmaller ? diffName : "", "", 
                                !isBillCrSmaller ? numberSeparator(diffBill, minFractionDigit, maxFractionDigit) : "", 
                                !isNetCrSmaller ? numberSeparator(diffNet, minFractionDigit, maxFractionDigit) : "", 
                                !isBalanceCrSmaller ? numberSeparator(diffBalance, minFractionDigit, maxFractionDigit) : ""
                            ]);

                            // Add "Total Amount" row at the bottom
                            data.body.push([
                                "Total Amount", "", 
                                numberSeparator(totalBillCr + (isBillCrSmaller ? diffBill : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalManagerNetCr + (isNetCrSmaller ? diffNet : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalBalanceCr + (isBalanceCrSmaller ? diffBalance : 0), minFractionDigit, maxFractionDigit),
                                "Total Amount", "", 
                                numberSeparator(totalBillDr + (!isBillCrSmaller ? diffBill : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalManagerNetDr + (!isNetCrSmaller ? diffNet : 0), minFractionDigit, maxFractionDigit), 
                                numberSeparator(totalBalanceDr + (!isBalanceCrSmaller ? diffBalance : 0), minFractionDigit, maxFractionDigit)
                            ]);
                        }
                    },{
                        extend: "csvHtml5",
                        text: "CSV",
                        className: "btn btn-default btn-sm gap-5 d-none",
                        title: title,
                        exportOptions: {
                            columns: columnArray
                        }
                    },{
                        extend: "pdfHtml5",
                        text: 'Pdf',
                        className: "btn btn-default btn-sm",
                        title: title,
                        exportOptions: {
                            columns: columnArray
                        },
                        customize: function(doc) {
                            doc.pageOrientation = 'landscape'; 
                            doc.content.splice(0, 1);
                            var now     = new Date();
                            var jsDate  = now.getDate() + '-' + (now.getMonth() + 1) + '-' + now.getFullYear();

                            doc.pageMargins = [20, 60, 20, 30];
                            doc.defaultStyle.fontSize = 7;
                            doc.styles.tableHeader.fontSize = 7;

                            doc['header'] = function() {
                                return {
                                    columns: [
                                        {
                                            alignment: 'left',
                                            text: "",
                                            fontSize: 14,
                                            margin: [10, 10, 10, 10]
                                        },
                                        {
                                            alignment: 'center',
                                            text: "{{CommonConstants::TRIAL_BALANCE_DETAIL_REPORT['PDF_HEADING']}}",
                                            fontSize: 12,
                                            bold: true,
                                            margin: [20, 0, 0, 0]
                                        },
                                        {
                                            alignment: 'right',
                                            text: [
                                                { text: 'Week Date : ', fontSize: 10 },
                                                { text: "{{ $start_date }}" + ' - ' + "{{ $end_date }}", fontSize: 10, color: 'red' }
                                            ],
                                            margin: [0, 20, 20, 20]
                                        }
                                    ],
                                    margin: 20
                                };
                            };

                            doc['footer'] = function(page, pages) {
                                return {
                                    columns: [
                                        {
                                            alignment: 'left',
                                            text: ['Created on: ', { text: jsDate.toString() }]
                                        },
                                        {
                                            alignment: 'right',
                                            text: ['Page ', { text: page.toString() }, ' of ', { text: pages.toString() }]
                                        }
                                    ],
                                    margin: 20
                                };
                            };

                            var objLayout = {
                                hLineWidth: function(i) { return 0.5; },
                                vLineWidth: function(i) { return 0.5; },
                                hLineColor: function(i) { return '#aaa'; },
                                vLineColor: function(i) { return '#aaa'; },
                                paddingLeft: function(i) { return 4; },
                                paddingRight: function(i) { return 4; }
                            };
                            
                            doc.content[0].table.widths = [
                                '10%',
                                '10%',
                                '10%',
                                '10%',
                                '10%',
                                '10%',
                                '10%',
                                '10%',
                                '10%',
                                '10%'
                            ];
                            doc.content[0].layout = objLayout;

                            var parseNumber = function(value) {
                                if (typeof value === 'string') {
                                    value = value.replace(/,/g, '');
                                }
                                return value !== "-" && !isNaN(value) ? parseFloat(value) : 0;
                            };

                            var totalBillCr = 0, totalManagerNetCr = 0, totalBalanceCr = 0;
                            var totalBillDr = 0, totalManagerNetDr = 0, totalBalanceDr = 0;

                            // Calculate totals
                            doc.content[0].table.body.forEach(row => {
                                if (row.length < 6) return;

                                row[2].alignment = 'right';
                                row[3].alignment = 'right';
                                row[4].alignment = 'right';

                                const billCr    = parseNumber(row[2].text || row[2]);
                                const netCr     = parseNumber(row[3].text || row[3]);
                                const balanceCr = parseNumber(row[4].text || row[4]); 
                                const billDr    = parseNumber(row[7].text || row[7]);
                                const netDr     = parseNumber(row[8].text || row[8]);
                                const balanceDr = parseNumber(row[9].text || row[9]); 

                                totalBillCr       += billCr;
                                totalManagerNetCr += netCr;
                                totalBalanceCr    += balanceCr;
                                totalBillDr       += billDr;
                                totalManagerNetDr += netDr;
                                totalBalanceDr    += balanceDr;
                            });

                            // Calculate differences
                            var diffBill    = Math.abs(totalBillCr - totalBillDr);
                            var diffNet     = Math.abs(totalManagerNetCr - totalManagerNetDr);
                            var diffBalance = Math.abs(totalBalanceCr - totalBalanceDr);

                            // Determine which side is smaller
                            var isBillCrSmaller     = totalBillCr < totalBillDr;
                            var isNetCrSmaller      = totalManagerNetCr < totalManagerNetDr;
                            var isBalanceCrSmaller  = totalBalanceCr < totalBalanceDr;

                            // Add the "Difference" row at the top
                            doc.content[0].table.body.splice(1, 0, [
                                { text: isBillCrSmaller ? diffName : '', alignment: 'center', colSpan: 2, bold: true, fontSize: 10 },
                                {},
                                { text: isBillCrSmaller ? diffBill.toFixed(2) : '', alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: isNetCrSmaller ? diffNet.toFixed(2) : '', alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: isBalanceCrSmaller ? diffBalance.toFixed(2) : '', alignment: 'right', bold: true, fontSize: 10 },
                                { text: !isBillCrSmaller ? diffName : '', alignment: 'center', colSpan: 2, bold: true, fontSize: 10 },
                                {},
                                { text: !isBillCrSmaller ? diffBill.toFixed(2) : '', alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: !isNetCrSmaller ? diffNet.toFixed(2) : '', alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: !isBalanceCrSmaller ? diffBalance.toFixed(2) : '', alignment: 'right', bold: true, fontSize: 10 }
                            ]);

                            // Add the "Total" row at the bottom, adjusting for the difference
                            doc.content[0].table.body.push([
                                { text: 'Total Amount', alignment: 'center', colSpan: 2, bold: true, fontSize: 10 },
                                {},
                                { text: (totalBillCr + (isBillCrSmaller ? diffBill : 0)).toFixed(2), alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: (totalManagerNetCr + (isNetCrSmaller ? diffNet : 0)).toFixed(2), alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: (totalBalanceCr + (isBalanceCrSmaller ? diffBalance : 0)).toFixed(2), alignment: 'right', bold: true, fontSize: 10 },
                                { text: 'Total Amount', alignment: 'center', colSpan: 2, bold: true, fontSize: 10 },
                                {},
                                { text: (totalBillDr + (!isBillCrSmaller ? diffBill : 0)).toFixed(2), alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: (totalManagerNetDr + (!isNetCrSmaller ? diffNet : 0)).toFixed(2), alignment: 'right', bold: true, fontSize: 10 }, 
                                { text: (totalBalanceDr + (!isBalanceCrSmaller ? diffBalance : 0)).toFixed(2), alignment: 'right', bold: true, fontSize: 10 }
                            ]);
                        }
                    }
                ]
            }],
            drawCallback: function(settings) {
                var api = this.api();

                if (api.data().count() === 0) {
                    return;
                }

                var pageInfo = api.page.info();

                // Remove previous total-row and diff-row
                $(table).find('tbody .total-row, .diff-row').remove();

                var parseNumber = function(value) {
                    return value !== "-" ? parseFloat(value) : 0;
                };

                // Get totals for Bill, Net, and Balance on Credit & Debit sides
                var totalBillCr         = api.column(2).data().reduce((a, b) => Number(a) + parseNumber(b), 0);
                var totalBillDr         = api.column(7).data().reduce((a, b) => Number(a) + parseNumber(b), 0);
                var totalmanagerNetCr   = api.column(3).data().reduce((a, b) => Number(a) + parseNumber(b), 0);
                var totalmanagerNetDr   = api.column(8).data().reduce((a, b) => Number(a) + parseNumber(b), 0);
                var totalBalanceCr      = api.column(4).data().reduce((a, b) => Number(a) + parseNumber(b), 0);
                var totalBalanceDr      = api.column(9).data().reduce((a, b) => Number(a) + parseNumber(b), 0);

                // Calculate differences
                var diffBill    = Math.abs(totalBillCr - totalBillDr);
                var diffNet     = Math.abs(totalmanagerNetCr - totalmanagerNetDr);
                var diffBalance = Math.abs(totalBalanceCr - totalBalanceDr);

                // Check which side is smaller
                var isBillCrSmaller     = totalBillCr < totalBillDr;
                var isNetCrSmaller      = totalmanagerNetCr < totalmanagerNetDr;
                var isBalanceCrSmaller  = totalBalanceCr < totalBalanceDr;

                // Add difference row ONLY on the first page
                if (pageInfo.page === 0) {
                    var diffRow = `
                        <tr class="fw-bold diff-row text-center">
                            <td colspan="2" class="text-center text-dark fs-3 fw-boldest">${isBillCrSmaller ? diffName : ''}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${isBillCrSmaller ? numberSeparator(diffBill, minFractionDigit, maxFractionDigit) : ''}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${isNetCrSmaller ? numberSeparator(diffNet, minFractionDigit, maxFractionDigit) : ''}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${isBalanceCrSmaller ? numberSeparator(diffBalance, minFractionDigit, maxFractionDigit) : ''}</td>
                            <td colspan="2" class="text-center text-dark fs-3 fw-boldest">${!isBillCrSmaller ? diffName : ''}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${!isBillCrSmaller ? numberSeparator(diffBill, minFractionDigit, maxFractionDigit) : ''}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${!isNetCrSmaller ? numberSeparator(diffNet, minFractionDigit, maxFractionDigit) : ''}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${!isBalanceCrSmaller ? numberSeparator(diffBalance, minFractionDigit, maxFractionDigit) : ''}</td>
                        </tr>
                    `;

                    $(table).find('tbody').prepend(diffRow);
                }

                // Add total row ONLY on the last page
                if (pageInfo.page === pageInfo.pages - 1) {
                    var totalRow = `
                        <tr class="bg-light fw-bold total-row text-center">
                            <td colspan="2" class="text-center text-dark fs-3 fw-boldest">Total Amount</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${numberSeparator(totalBillCr + (isBillCrSmaller ? diffBill : 0), minFractionDigit, maxFractionDigit)}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${numberSeparator(totalmanagerNetCr + (isNetCrSmaller ? diffNet : 0), minFractionDigit, maxFractionDigit)}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${numberSeparator(totalBalanceCr + (isBalanceCrSmaller ? diffBalance : 0), minFractionDigit, maxFractionDigit)}</td>
                            <td colspan="2" class="text-center text-dark fs-3 fw-boldest">Total Amount</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${numberSeparator(totalBillDr + (!isBillCrSmaller ? diffBill : 0), minFractionDigit, maxFractionDigit)}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${numberSeparator(totalmanagerNetDr + (!isNetCrSmaller ? diffNet : 0), minFractionDigit, maxFractionDigit)}</td>
                            <td class="fs-3 text-dark text-center fw-boldest">${numberSeparator(totalBalanceDr + (!isBalanceCrSmaller ? diffBalance : 0), minFractionDigit, maxFractionDigit)}</td>
                        </tr>
                    `;

                    $(table).find('tbody').append(totalRow);
                }
            }
        }, );

        }

        $(document).ready(function() {
            var managers = @json($managers);

            @unlessrole(CommonConstants::ADMIN_ROLES['MANAGER_ADMIN'])    
                $('.card-title').append(`<div class="w-100 d-flex ms-4"><select class="js-example-basic-multiple
                    form-select form-select-solid multi-select-option" data-placeholder="Select Manager" id="managers" data-allow-clear="true">
                    <option value=""></option>'
                    ${managers.map(element => {
                        var selected = (managerId == element.loginId) ? 'selected' : '';
                        return '<option value="'+element.loginId+'" '+selected+'>'+element.loginId+' : ' +element.name+'</option>';
                    }).join('')}
                </select>
                </div>`);
            @endunlessrole

            $('#managers').on('change', function() {     
                managerId = $("#managers").val();
                
                var currentUrl  = new URL(window.location.href);
                var startDate   = currentUrl.searchParams.get('start_date');
                var endDate     = currentUrl.searchParams.get('end_date');
                var baseUrl     = "{{ route('trialBalanceDetails') }}";
                var url         = new URL(baseUrl, window.location.origin); 
                
                if (managerId !== undefined && managerId !== '') {
                    url.searchParams.set('managerId', managerId);
                }

                url.searchParams.set('start_date', startDate);
                url.searchParams.set('end_date', endDate);
                
                var newUrl              = url.toString();
                window.location.href    = newUrl;
            });
        });

        $(document).ready(function() {    
        var trialBalanceRoute = "{{route('trialBalanceReport')}}";
        $('.card-toolbar').append(`<div class="input-group w-250px">
            <input type="week" id="weekPicker" class="form-control form-control-solid rounded rounded-end-0" placeholder="Pick date range"/>
                <button class="btn btn-icon btn-light" id="weekPickerClear">
                    <span class="fas fa-times">
                </span>
            </button>
        </div>`);

        @unlessrole(CommonConstants::ADMIN_ROLES['MANAGER_ADMIN'])
            $('.card-toolbar').append(`<a href=${trialBalanceRoute} class="btn btn-secondary btn-sm"><span class="fa fa-arrow-left me-2"></span><span>Back</span></a>`)
        @endunlessrole

        // Retrieving start and end dates (in case they are passed from the server-side)
        var start_date = "{{ $start_date }}";
        var end_date = "{{ $end_date }}";

        // Function to determine the current week either based on provided dates or today's date
        function getCurrentWeek() {
            if (start_date && end_date) {
            // If start_date and end_date are provided, convert the start_date into the corresponding week
            return convertToWeekSelection(start_date);
            } else {
            // If no dates are provided, calculate the current ISO week
            return getISOWeek(new Date());
            }
        }

        // Convert the given start_date (YYYY-MM-DD) into the corresponding ISO week (YYYY-WW)
        function convertToWeekSelection(start_date) {
            var startDateObj = new Date(start_date); // Convert the start_date string to a Date object
            return getISOWeek(startDateObj); // Calculate the ISO week for the given date
        }

        // Function to calculate the ISO week (YYYY-WW) for a given date
        function getISOWeek(date) {
            // Find the day of the week for the given date (Sunday = 0, Monday = 1, ..., Saturday = 6)
            var dayOfWeek = date.getDay();

            // Find the Monday of the current week (ISO weeks start on Monday)
            var mondayDate = new Date(date);
            mondayDate.setDate(date.getDate() - (dayOfWeek === 0 ? 6 : dayOfWeek - 1)); // Adjust the date to Monday of the week

            // Adjust to the nearest Thursday to determine the ISO week year
            var adjustedDate = new Date(mondayDate);
            adjustedDate.setDate(mondayDate.getDate() + 4 - (mondayDate.getDay() || 7)); // Move to the nearest Thursday

            // Calculate the start of the year and determine the week number
            var yearStart = new Date(adjustedDate.getFullYear(), 0, 1); // January 1st of the adjusted year
            var weekNumber = Math.ceil(((adjustedDate - yearStart) / 86400000 + 1) / 7); // Calculate the week number

            // Format and return the week as YYYY-WW
            return adjustedDate.getFullYear() + "-W" + ("0" + weekNumber).slice(-2);
        }

        // Function to calculate the start and end dates for a given ISO week (YYYY-WW)
        function getWeekDateRange(weekString) {
            var [year, week] = weekString.split("-W").map(Number); // Split the weekString into year and week

            // Find the first Thursday of the given year to determine the ISO week start
            var firstThursday = new Date(year, 0, 1);
            firstThursday.setDate(firstThursday.getDate() + (4 - (firstThursday.getDay() || 7))); // Adjust to the nearest Thursday

            // Calculate the start date of the ISO week (Monday)
            var startOfWeek = new Date(firstThursday);
            startOfWeek.setDate(firstThursday.getDate() + (week - 1) * 7 - 3); // Calculate the Monday of the selected week

            // Calculate the end date of the ISO week (Sunday)
            var endOfWeek = new Date(startOfWeek);
            endOfWeek.setDate(startOfWeek.getDate() + 6); // Sunday of the same week

            const formatDate = (date) =>
                new Date(date.getTime() - date.getTimezoneOffset() * 60000)
                    .toISOString()
                    .split("T")[0];

            // Return the formatted date range (start date - end date)
            return formatDate(startOfWeek) + " - " + formatDate(endOfWeek);
        }

        // Set the current week in the week picker
        var currentWeek = getCurrentWeek();
        $("#weekPicker").val(currentWeek); // Set the value of the week picker to the current or provided week

        // Set the maximum allowed week selection to the current week
        var maxAllow = getDefaultSelectedWeek();
        $("#weekPicker").attr("max", maxAllow);

        // Event handler for changes in the week picker input field
        $("#weekPicker").on("change", function () {
            var selectedWeek = $(this).val(); // Get the selected week in the format YYYY-WW

            if (!selectedWeek) {
                $("#weekPickerClear").trigger("click");
            } else {
                var dateRange = getWeekDateRange(selectedWeek); // Get the start and end date for the selected week
                var [startDate, endDate] = dateRange.split(" - "); // Split the date range into start and end dates

                $("#weekPicker").attr("data-date-range", dateRange); // Store the date range in a custom attribute
                $(this).attr("placeholder", dateRange); // Set the placeholder to the date range
                
                managerId = $("#managers").val();
                
                var currentUrl          = new URL(window.location.href);
                var managerIdSelected   = currentUrl.searchParams.get('managerId');
                var baseUrl             = "{{ route('trialBalanceDetails') }}";
                var url                 = new URL(baseUrl, window.location.origin);
                                
                if (managerIdSelected !== null && managerIdSelected !== '') {
                    url.searchParams.set('managerId', managerIdSelected);
                }

                url.searchParams.set('start_date', startDate);
                url.searchParams.set('end_date', endDate);
                
                var newUrl              = url.toString();
                window.location.href    = newUrl;
            }
        });

        // Event handler for the "clear" button
        $("#weekPickerClear").on("click", function () {
            var currentWeek = getDefaultSelectedWeek(); 
    
            var dateRange = getWeekDateRange(currentWeek); // Assuming this function is working as expected
            var [startDate, endDate] = dateRange.split(" - ");

            $("#weekPicker").val(currentWeek);
            $("#weekPicker").attr("data-date-range", dateRange); // Store the date range in a custom attribute
            $("#weekPicker").attr("placeholder", dateRange); // Set the placeholder to the date range

            var managerId = $("#managers").val();
            
            var currentUrl = new URL(window.location.href);
            var managerIdSelected = currentUrl.searchParams.get('managerId');
            var baseUrl = "{{ route('trialBalanceDetails') }}";
            var url = new URL(baseUrl, window.location.origin);
            
            if (managerIdSelected !== null && managerIdSelected !== '') {
                url.searchParams.set('managerId', managerIdSelected);
            }

            url.searchParams.set('start_date', startDate);
            url.searchParams.set('end_date', endDate);

            var newUrl = url.toString();
            window.location.href = newUrl;
        });

        // Function to get the default selected week (current ISO week)
        function getDefaultSelectedWeek() {
            return getISOWeek(new Date()); // Calculate the current ISO week and return it
        }
    });
    </script>
@endsection