<h4 class="mb-4"><?= lang('finance.overdue_invoices') ?></h4>

<div class="card">
    <div class="card-body">
        <table id="overdue-table" class="table table-striped w-100"
               data-url="/finance/reports/overdue/datatable"
               data-columns='[
                   {"data":"invoice_number","title":"<?= lang('finance.invoice_no') ?>"},
                   {"data":"member_name","title":"<?= lang('finance.member') ?>"},
                   {"data":"invoice_type","title":"<?= lang('finance.type') ?>"},
                   {"data":"total_amount","title":"<?= lang('finance.total') ?>"},
                   {"data":"balance_due","title":"<?= lang('finance.balance') ?>"},
                   {"data":"due_date","title":"<?= lang('finance.due_date') ?>"},
                   {"data":"days_overdue","title":"<?= lang('finance.days_overdue') ?>"},
                   {"data":"aging_bucket","title":"<?= lang('finance.aging') ?>"},
                   {"data":"actions","title":"","orderable":false}
               ]'>
            <thead><tr><th>Invoice</th><th>Member</th><th>Type</th><th>Total</th><th>Balance</th><th>Due</th><th>Days</th><th>Aging</th><th></th></tr></thead>
        </table>
    </div>
</div>

<?php $__view->push('scripts'); ?>
<script>document.addEventListener('DOMContentLoaded', function() { DataTableHelper.init('overdue-table'); });</script>
<?php $__view->endPush(); ?>