tin-spa 20.2.9 → 20.3.0

package/fesm2022/tin-spa.mjs

@@ -789,6 +789,7 @@ var InvoiceStatus;
     InvoiceStatus[InvoiceStatus["Submitted"] = 1] = "Submitted";
     InvoiceStatus[InvoiceStatus["Paid"] = 2] = "Paid";
     InvoiceStatus[InvoiceStatus["Discarded"] = 3] = "Discarded";
+    InvoiceStatus[InvoiceStatus["Paying"] = 4] = "Paying"; // Changed: Added Paying status for partially paid invoices
 })(InvoiceStatus || (InvoiceStatus = {}));
 // Inventory receipt status tracking enum - mirrors backend
 var InventoryReceiptStatus;
@@ -1467,6 +1468,7 @@ class DataServiceLib {
         this.capCategories = new CapItem;
         this.capSubCategories = new CapItem;
         this.capBrands = new CapItem;
+        this.capGPTCaches = new CapItem; // Added: GPT Cache capability property
         this.capSuppliers = new CapItem;
         this.capTasks = new CapItem;
         this.capHR = new CapItem;
@@ -1484,6 +1486,7 @@ class DataServiceLib {
         this.capAccounting = new CapItem;
         this.capAccounts = new CapItem;
         this.capAggregates = new CapItem; // Added: Capability for aggregates view
+        this.capAging = new CapItem; // Added: Capability for aging report
         this.capTransactionTypes = new CapItem;
         this.capTransactions = new CapItem;
         this.capAccountingInvoices = new CapItem;
@@ -1495,6 +1498,7 @@ class DataServiceLib {
         this.capInventoryDashboard = new CapItem;
         this.capInventoryStock = new CapItem; // Changed: Added new cap item for inventory stock view
         this.capProducts = new CapItem;
+        this.capBundleProducts = new CapItem; // Added: Capability for bundle products
         this.capInventoryItems = new CapItem;
         this.capPurchaseOrders = new CapItem;
         this.capInventoryReceipts = new CapItem;
@@ -1824,6 +1828,45 @@ class DataServiceLib {
             loadAction: { url: 'suppliers/all/x' },
             formConfig: this.supplierFormConfig
         };
+        //--------------------------GPT Caches-------------------------
+        this.gptCachesFormConfig = {
+            security: { allow: [this.capGPTCaches] },
+            title: 'GPT Cache',
+            fields: [
+                { name: 'gptCacheID', type: 'number', readonly: true, alias: 'ID' },
+                { name: 'methodName', type: 'text', required: true, alias: 'Method Name', span: true },
+                { name: 'requestHash', type: 'text', readonly: true, alias: 'Request Hash', span: true },
+                { name: 'requestText', type: 'text-area', required: true, alias: 'Request Text', span: true, rows: 4 },
+                { name: 'responseJson', type: 'text-area', required: true, alias: 'Response JSON', span: true, rows: 4 },
+                { name: 'matchCount', type: 'number', alias: 'Match Count' },
+                { name: 'hitCount', type: 'number', alias: 'Hit Count' },
+                { name: 'createdDate', type: 'datetime', readonly: true, alias: 'Created' },
+                { name: 'updatedDate', type: 'datetime', readonly: true, alias: 'Updated' }
+            ],
+            loadAction: { url: 'gptcaches/id' },
+            heroField: 'gptCacheID',
+        };
+        this.gptCachesTableConfig = {
+            showFilter: true,
+            minColumns: ['methodName', 'requestText', 'hitCount'],
+            columns: [
+                { name: 'methodName', alias: 'Method' },
+                { name: 'requestText', alias: 'Request', maxLength: 100 },
+                { name: 'responseJson', alias: 'Response', maxLength: 100 },
+                { name: 'requestHash', alias: 'Hash', maxLength: 20 },
+                { name: 'matchCount', type: 'number', alias: 'Matches', icon: { name: 'verified', color: 'green', condition: (x) => x.matchCount > 3 } },
+                { name: 'hitCount', type: 'number', alias: 'Hits', icon: { name: 'trending_up', color: 'blue', condition: (x) => x.hitCount > 10 } },
+                { name: 'createdDate', type: 'datetime', alias: 'Created' },
+                { name: 'updatedDate', type: 'datetime', alias: 'Updated' }
+            ],
+            buttons: [
+                { name: 'view', dialog: true, tip: 'View Cache Details' },
+                { name: 'edit', dialog: true, action: { url: 'gptcaches?action=edit', method: 'post' }, tip: 'Edit Cache' },
+                { name: 'delete', confirm: { message: 'Are you sure you want to delete this cache entry?' }, action: { url: 'gptcaches?action=delete', method: 'post' }, tip: 'Delete Cache' }
+            ],
+            loadAction: { url: 'gptcaches/all/x' },
+            formConfig: this.gptCachesFormConfig
+        };
         //--------------------------Notifications-------------------------
         this.notificationOptions = [
             { name: 'UI Only', value: 1 },
@@ -2030,7 +2073,7 @@ class DataServiceLib {
         this.capAdmin.name = "cap2";
         this.capAdmin.display = "Admin";
         this.capAdmin.icon = "security";
-        this.capAdmin.capSubItems = [this.capUsers, this.capRoles, this.capLogs, this.capSettings];
+        this.capAdmin.capSubItems = [this.capUsers, this.capRoles, this.capLogs, this.capGPTCaches, this.capSettings]; // Added: GPT Cache to admin menu
         this.capUsers.name = "cap3";
         this.capUsers.display = "Users";
         this.capUsers.link = "home/admin/users";
@@ -2079,7 +2122,11 @@ class DataServiceLib {
         this.capBrands.display = "Brands";
         this.capBrands.link = "home/admin/brands";
         this.capBrands.icon = "loyalty";
-        //cap104 available
+        // Added: GPT Cache capability
+        this.capGPTCaches.name = "cap104";
+        this.capGPTCaches.display = "GPT Cache";
+        this.capGPTCaches.link = "home/admin/gpt-caches";
+        this.capGPTCaches.icon = "memory";
         //cap105 available
         this.capSuppliers.name = "cap15";
         this.capSuppliers.display = "Suppliers";
@@ -2133,7 +2180,7 @@ class DataServiceLib {
         this.capAccounting.display = "Accounting";
         this.capAccounting.icon = "account_balance";
         this.capAccounting.capSubItems = [this.capAccounts, this.capTransactions, this.capAggregates, this.capTransactionTypes, this.capAccountingInvoices,
-            this.capAccountingOutstandingInvoices];
+            this.capAging, this.capAccountingOutstandingInvoices]; // Added: capAging to submenu
         this.capAccounts.name = "cap52"; // Changed: Fixed conflict with capBrands (was cap14)
         this.capAccounts.display = "Accounts";
         this.capAccounts.link = "home/admin/accounting-accounts";
@@ -2142,6 +2189,10 @@ class DataServiceLib {
         this.capAggregates.display = "Aggregates";
         this.capAggregates.link = "home/admin/accounting-aggregates";
         this.capAggregates.icon = "bar_chart";
+        this.capAging.name = "cap58"; // Added: Aging capability
+        this.capAging.display = "Aging Report";
+        this.capAging.link = "home/admin/accounting-aging";
+        this.capAging.icon = "schedule";
         this.capTransactionTypes.name = "cap28";
         this.capTransactionTypes.display = "Transaction Types";
         this.capTransactionTypes.link = "home/admin/accounting-transaction-types";
@@ -2177,7 +2228,7 @@ class DataServiceLib {
         this.capInventory.name = "cap34";
         this.capInventory.display = "Inventory";
         this.capInventory.icon = "inventory";
-        this.capInventory.capSubItems = [this.capSales, this.capInventoryReceipts, this.capProducts, this.capInventoryStock, this.capInventoryTransactions, this.capInventoryItems,
+        this.capInventory.capSubItems = [this.capSales, this.capInventoryReceipts, this.capProducts, this.capBundleProducts, this.capInventoryStock, this.capInventoryTransactions, this.capInventoryItems,
             this.capPurchaseOrders, this.capSalesOrders, this.capRequisitions, this.capInventoryAdjustments,
             this.capInventoryReturns, this.capRequisitionReturns, this.capProductionRecipes, this.capProductionOrders, this.capInventoryDashboard];
         this.capInventoryDashboard.name = "cap35";
@@ -2192,6 +2243,10 @@ class DataServiceLib {
         this.capProducts.display = "Products";
         this.capProducts.link = "home/admin/inventory-products";
         this.capProducts.icon = "category";
+        this.capBundleProducts.name = "cap57"; // Added: Bundle products capability
+        this.capBundleProducts.display = "Bundle Products";
+        this.capBundleProducts.link = "home/admin/bundle-products";
+        this.capBundleProducts.icon = "inventory_2";
         this.capInventoryItems.name = "cap37";
         this.capInventoryItems.display = "Inventory Items";
         this.capInventoryItems.link = "home/admin/inventory-items";
@@ -2624,17 +2679,65 @@ class AccountingService {
             buttons: [this.accountCreateButton, this.finAccounEditButton]
         };
         //--------------------------Invoices-------------------------
+        // Added: Invoice payment form configuration
+        this.invoicePaymentFormConfig = {
+            security: { allow: [this.dataService.capAccountingInvoices] },
+            title: 'Record Payment',
+            fixedTitle: true,
+            fields: [
+                { name: 'invoiceID', type: 'number', hidden: true },
+                { name: 'paymentDate', type: 'date', alias: 'Payment Date', required: true },
+                { name: 'method', type: 'select', alias: 'Payment Method', required: true, defaultValue: 1, loadAction: { url: 'invoicepayments/list/methods' } },
+                { name: 'outstandingAmount', type: 'label', alias: 'Outstanding', readonly: true },
+                { name: 'amount', type: 'money', alias: 'Amount', required: true, span: true },
+                { name: 'reference', type: 'text', alias: 'Reference', span: true }
+            ],
+        };
+        this.invoicePaymentCreateButton = { name: 'edit', action: { url: 'invoicepayments?action=create', method: 'post', successMessage: 'Payment Recorded' } };
+        this.invoicePaymentsCreateDetailsDialogConfig = {
+            formConfig: this.invoicePaymentFormConfig,
+            heroField: 'invoiceID',
+            mode: 'edit',
+            buttons: [
+                this.invoicePaymentCreateButton
+            ]
+        };
+        // Added: Invoice payments table for history tracking
+        this.invoicePaymentsTableConfig = {
+            tabTitle: 'Payment History',
+            showFilter: false,
+            minColumns: ['paymentDate', 'amount', 'methodName'],
+            columns: [
+                { name: 'invoicePaymentID', type: 'number', alias: 'ID', hiddenCondition: () => true },
+                { name: 'paymentDate', type: 'date', alias: 'Date' },
+                { name: 'amount', type: 'money', alias: 'Amount' },
+                { name: 'methodName', type: 'text', alias: 'Method' },
+                { name: 'reference', type: 'text', alias: 'Reference' }
+            ],
+            buttons: [
+                { name: 'migrate-payments', display: 'Migrate Legacy Payments', inHeader: true, icon: { name: 'sync', color: 'green' },
+                    action: { url: 'invoicepayments/migrate', method: 'post',
+                        successMessage: 'Migration completed successfully' },
+                    confirm: { message: 'This will migrate existing invoice payments from the legacy PaidAmount field to the new InvoicePayments table. Continue?' }
+                }
+            ],
+            loadAction: { url: 'invoicepayments/x/x' }, loadCriteria: 'invoice', loadIDField: 'invoiceID'
+        };
         // Invoice form configuration with customer and status fields
         this.invoiceFormConfig = {
             security: { allow: [this.dataService.capAccountingInvoices] },
             title: 'Invoice',
             includeAudit: true,
             fields: [
-                { name: 'invoiceDate', type: 'date' },
-                { name: 'invoiceID', type: 'number', readonly: true, hideOnCreate: true },
-                { name: 'customerID', alias: 'Customer', type: 'select', loadAction: { url: 'customers/list/x' }, detailsConfig: this.dataService.customerDetailsConfig },
+                { name: 'invoiceDate', type: 'date', required: true },
+                { name: 'invoiceNumber', type: 'text', alias: 'Invoice #' }, // Changed: Made editable on create for optional manual numbering
+                { name: 'customerID', alias: 'Customer', type: 'select', required: true, loadAction: { url: 'customers/list/x' }, detailsConfig: this.dataService.customerDetailsConfig },
+                { name: 'paymentTerms', type: 'select', alias: 'Payment Terms', required: true, defaultValue: 30, loadAction: { url: 'invoices/list/payment-terms' } },
+                { name: 'dueDate', type: 'date', alias: 'Due Date', readonly: true, hideOnCreate: true },
                 { name: 'status', type: 'select', hideOnCreate: true, readonly: true, loadAction: { url: 'invoices/list/statuses' } },
                 { name: 'totalDisplay', type: 'label', alias: 'Total', format: 'text', readonly: true, hideOnCreate: true },
+                { name: 'paidAmount', type: 'label', alias: 'Paid', readonly: true, hideOnCreate: true },
+                { name: 'outstandingAmount', type: 'label', alias: 'Outstanding', readonly: true, hideOnCreate: true }
             ],
             loadAction: { url: 'invoices/id' },
             heroField: 'invoiceID',
@@ -2644,6 +2747,7 @@ class AccountingService {
             tabTitle: 'Invoice Items',
             showFilter: false,
             minColumns: ['description', 'quantity', 'amount'],
+            causeFormRefresh: true,
             columns: [
                 { name: 'invoiceItemID', type: 'number', alias: 'ID', hiddenCondition: () => true },
                 { name: 'description', type: 'text', alias: 'Description' },
@@ -2652,7 +2756,9 @@ class AccountingService {
                 { name: 'amount', type: 'money', alias: 'Amount' }
             ],
             buttons: [
-                { name: 'create', display: 'Add Item', dialog: true, action: { url: 'invoiceitems?action=create', method: 'post' }, disabled: x => x.status != InvoiceStatus.Draft },
+                { name: 'create', display: 'Add Item', dialog: true, action: { url: 'invoiceitems?action=create', method: 'post' },
+                    disabled: x => x.status != InvoiceStatus.Draft
+                },
                 { name: 'edit', dialog: true, action: { url: 'invoiceitems?action=edit', method: 'post' }, disabled: x => x.status != InvoiceStatus.Draft },
                 { name: 'delete', inDialog: true, icon: { name: 'delete', color: 'red' }, action: { url: 'invoiceitems?action=delete', method: 'post', successMessage: 'Deleted' }, confirm: { message: 'Delete this item?' }, disabled: x => x.status != InvoiceStatus.Draft }
             ],
@@ -2660,8 +2766,8 @@ class AccountingService {
             formConfig: {
                 title: 'Invoice Item',
                 fields: [
-                    { name: 'description', type: 'text', required: true },
-                    { name: 'quantity', type: 'number', required: true },
+                    { name: 'description', type: 'text', required: true, span: true },
+                    { name: 'quantity', type: 'number', required: true, defaultValue: 1 },
                     { name: 'unitPrice', type: 'number', alias: 'Unit Price', required: true },
                     { name: 'amount', type: 'number', readonly: true, hideOnCreate: true }
                 ],
@@ -2669,18 +2775,32 @@ class AccountingService {
             }
         };
         // Invoice action buttons
-        this.invoicePayButton = { name: 'pay', inDialog: true, display: 'Pay', icon: { name: 'attach_money', color: 'green' }, action: { url: 'invoices?action=pay', method: 'post', successMessage: 'Paid' }, confirm: { message: 'All loads on invoice have been Paid ?' }, visible: x => x.status == InvoiceStatus.Submitted };
-        this.invoiceDiscardButton = { name: 'discard', inDialog: true, display: 'Discard', icon: { name: 'close', color: 'red' }, action: { url: 'invoices?action=discard', method: 'post', successMessage: 'Discarded' }, confirm: { message: 'Invoice will be marked as cancelled and all related loads removed ?' }, visible: x => x.status == InvoiceStatus.Draft };
-        this.invoiceSubmitButton = { name: 'submit', inDialog: true, display: 'Submit', icon: { name: 'send', }, action: { url: 'invoices?action=submit', method: 'post', successMessage: 'Submitted' }, confirm: { message: 'Submit ?' }, visible: x => x.status == InvoiceStatus.Draft, disabled: x => x.totalAmount == 0 };
-        this.invoiceEditButton = { name: 'edit', dialog: true, action: { url: 'invoices?action=edit', method: 'post', }, confirm: { message: 'Proceed ?' }, disabled: x => x.status == InvoiceStatus.Paid };
+        this.invoiceRecordPaymentButton = { name: 'record-payment', display: 'Record Payment', dialog: true, icon: { name: 'payment', color: 'blue' },
+            detailsConfig: this.invoicePaymentsCreateDetailsDialogConfig,
+            visible: x => (x.status == InvoiceStatus.Submitted || x.status == InvoiceStatus.Paying) && x.outstandingAmount > 0 // Changed: Allow on both Submitted and Paying
+        }; // Changed: Use detailsConfig to open payment form dialog
+        this.invoiceDiscardButton = { name: 'discard', inDialog: true, display: 'Discard', icon: { name: 'close', color: 'red' },
+            action: { url: 'invoices?action=discard', method: 'post', successMessage: 'Discarded' }, confirm: { message: 'Invoice will be marked as cancelled?' },
+            visible: x => x.status == InvoiceStatus.Draft || x.status == InvoiceStatus.Submitted // Changed: Only allow on Draft and Submitted
+        };
+        this.invoiceSubmitButton = { name: 'submit', inDialog: true, display: 'Submit', icon: { name: 'send', },
+            action: { url: 'invoices?action=submit', method: 'post', successMessage: 'Submitted' },
+            confirm: { message: 'Submit invoice? This will record revenue and create an accounts receivable entry.' },
+            visible: x => x.status == InvoiceStatus.Draft,
+            disabled: x => x.totalAmount == 0
+        };
+        this.invoiceEditButton = { name: 'edit', dialog: true, action: { url: 'invoices?action=edit', method: 'post', }, confirm: { message: 'Proceed ?' },
+            visible: x => x.status == InvoiceStatus.Draft || x.status == InvoiceStatus.Submitted // Changed: Disable on Paying and Paid
+        };
         this.invoiceDownloadButton = { name: 'pdf', display: 'Download PDF', inDialog: true, icon: { name: 'picture_as_pdf', color: 'red' } };
-        // Invoice details dialog with items and action buttons
+        // Invoice details dialog with items, payments history, and action buttons
         this.invoiceDetailsDialogConfig = {
             formConfig: this.invoiceFormConfig,
-            tableConfigs: [this.invoiceItemsTableConfig],
+            tableConfigs: [this.invoiceItemsTableConfig, this.invoicePaymentsTableConfig],
             heroField: 'invoiceID',
-            buttons: [this.invoiceSubmitButton, this.invoicePayButton, this.invoiceDiscardButton, this.invoiceEditButton]
+            buttons: [this.invoiceSubmitButton, this.invoiceRecordPaymentButton, this.invoiceDiscardButton, this.invoiceEditButton]
         };
+        this.invoiceViewButton = { name: 'view', dialog: true, detailsConfig: this.invoiceDetailsDialogConfig };
         // Invoice summary tiles
         this.invoicesTileConfig = {
             clickable: true,
@@ -2694,34 +2814,75 @@ class AccountingService {
         // Main invoices table configuration
         this.invoicesTableConfig = {
             showFilter: true,
-            minColumns: ['invoiceID', 'customerName', 'statusName'],
+            minColumns: ['invoiceNumber', 'customerName', 'statusName'],
             minButtons: ['view', 'pdf'],
             flatButtons: true,
             collapseButtons: true,
             greyOut: x => x.status == InvoiceStatus.Paid,
             columns: [
-                { name: 'invoiceID', type: 'number', alias: 'ID' },
+                { name: 'invoiceNumber', type: 'text', alias: 'Invoice #' },
                 { name: 'customerName', type: 'text', alias: 'Customer' },
                 { name: 'invoiceDate', type: 'date' },
-                { name: 'statusName', type: 'chip', alias: 'Status', colors: [{ name: '#FFCC80', condition: x => x.status == InvoiceStatus.Draft }, { name: '#90CAF9', condition: x => x.status == InvoiceStatus.Submitted }, { name: '#A5D6A7', condition: x => x.status == InvoiceStatus.Paid }, { name: '#EF9A9A', condition: x => x.status == InvoiceStatus.Discarded }] },
+                { name: 'dueDate', type: 'date', alias: 'Due Date' },
+                { name: 'daysOverdue', type: 'number', alias: 'Days Overdue', },
+                { name: 'statusName', type: 'chip', alias: 'Status', detailsConfig: this.invoiceDetailsDialogConfig,
+                    colors: [
+                        { name: '#FFCC80', condition: x => x.status == InvoiceStatus.Draft },
+                        { name: '#90CAF9', condition: x => x.status == InvoiceStatus.Submitted },
+                        { name: '#FFD54F', condition: x => x.status == InvoiceStatus.Paying }, // Changed: Added Paying status color (amber/yellow)
+                        { name: '#A5D6A7', condition: x => x.status == InvoiceStatus.Paid },
+                        { name: '#EF9A9A', condition: x => x.status == InvoiceStatus.Discarded }
+                    ]
+                },
                 { name: 'itemCount', type: 'number', alias: 'Items' },
                 { name: 'totalAmount', type: 'money', alias: 'Total' },
                 { name: 'paidAmount', type: 'money', alias: 'Paid' },
                 { name: 'outstandingAmount', type: 'money', alias: 'Outstanding' }
             ],
             buttons: [
-                { name: 'create', display: 'Create', dialog: true, action: { url: 'invoices?action=create', method: 'post' } },
+                { name: 'create', display: 'Create', dialog: true, action: { url: 'invoices?action=create', method: 'post' }, onSuccessButton: this.invoiceViewButton },
                 { name: 'view', dialog: true, detailsConfig: this.invoiceDetailsDialogConfig },
-                this.invoiceDownloadButton,
+                this.invoiceRecordPaymentButton,
                 this.invoiceSubmitButton,
-                this.invoicePayButton,
+                // this.invoicePayButton,
                 this.invoiceDiscardButton,
-                this.invoiceEditButton
+                this.invoiceEditButton,
+                this.invoiceDownloadButton,
             ],
             loadAction: { url: 'invoices/all/x' },
             formConfig: this.invoiceFormConfig,
             tileConfig: this.invoicesTileConfig
         };
+        //--------------------------Aging Report-------------------------
+        // Added: Aging report summary tiles
+        this.agingTileConfig = {
+            // clickable: true,
+            tiles: [
+                { name: 'current', alias: 'Current', color: '#4CAF50', info: 'Not yet due', },
+                { name: 'days30', alias: '1-30 Days', color: '#FFC107', info: '1-30 days overdue', },
+                { name: 'days60', alias: '31-60 Days', color: '#FF9800', info: '31-60 days overdue', },
+                { name: 'days90', alias: '61-90 Days', color: '#F44336', info: '61-90 days overdue', },
+                { name: 'days90Plus', alias: '90+ Days', color: '#B71C1C', info: 'Over 90 days overdue', },
+                { name: 'total', alias: 'Total Outstanding', color: '#9E9E9E', info: 'Total outstanding amount' }
+            ],
+            // loadAction: { url: 'invoices/aging-summary/x' }
+        };
+        // Added: Base aging table configuration with common properties
+        this.agingBaseTableConfig = {
+            showFilter: true,
+            minColumns: ['invoiceNumber', 'customerName', 'outstandingAmount'],
+            columns: [
+                { name: 'invoiceNumber', type: 'text', alias: 'Invoice #' },
+                { name: 'customerName', type: 'text', alias: 'Customer' },
+                { name: 'invoiceDate', type: 'date', alias: 'Invoice Date' },
+                { name: 'dueDate', type: 'date', alias: 'Due Date' },
+                { name: 'daysOverdue', type: 'number', alias: 'Days Overdue' },
+                { name: 'totalAmount', type: 'money', alias: 'Total' },
+                { name: 'paidAmount', type: 'money', alias: 'Paid' },
+                { name: 'outstandingAmount', type: 'money', alias: 'Outstanding' }
+            ],
+            buttons: [{ name: 'view', dialog: true, detailsConfig: this.invoiceDetailsDialogConfig }]
+        };
         //--------------------------Customer Invoices-------------------------
         // Customer invoice form without customerID field
         this.customerInvoiceFormConfig = {
@@ -2735,19 +2896,24 @@ class AccountingService {
             loadCriteria: 'customer-invoice',
             buttons: []
         };
+        // Added: Customer invoice payments table (read-only)
+        this.customerInvoicePaymentsTableConfig = {
+            ...this.invoicePaymentsTableConfig,
+            loadCriteria: 'customer-invoice'
+        };
         // Customer invoice details dialog (read-only)
         this.customerInvoiceDetailsDialogConfig = {
             formConfig: this.customerInvoiceFormConfig,
-            tableConfigs: [this.customerInvoiceItemsTableConfig],
+            tableConfigs: [this.customerInvoiceItemsTableConfig, this.customerInvoicePaymentsTableConfig],
             heroField: 'invoiceID',
             buttons: []
         };
         // Customer invoices table configuration
         this.customerInvoicesTableConfig = {
             ...this.invoicesTableConfig,
-            minColumns: ['invoiceID', 'totalDisplay'],
+            minColumns: ['invoiceNumber', 'totalDisplay'],
             minButtons: ['view', 'pdf'],
-            columns: [...this.invoicesTableConfig.columns.filter(x => ['invoiceID', 'invoiceDate', 'statusName', 'itemCount', 'totalAmount'].includes(x.name))],
+            columns: [...this.invoicesTableConfig.columns.filter(x => ['invoiceNumber', 'invoiceDate', 'dueDate', 'statusName', 'itemCount', 'totalAmount', 'paidAmount', 'outstandingAmount'].includes(x.name))],
             buttons: [{ name: 'view', dialog: true, detailsConfig: this.customerInvoiceDetailsDialogConfig }, this.invoiceDownloadButton],
             loadAction: { url: 'invoices/customer-all/x' }
         };
@@ -3413,12 +3579,13 @@ class InventoryService {
                 { name: 'name', type: 'text', required: true, alias: 'Product Name', section: 'productInfo', infoMessage: 'The unique name of the product' },
                 { name: 'sku', type: 'text', alias: 'SKU (optional)', section: 'productInfo', infoMessage: 'Stock Keeping Unit for inventory tracking (optional)' }, // Changed: Removed required flag
                 { name: 'description', type: 'text', alias: 'Description', span: true, section: 'productInfo', infoMessage: 'Detailed description of the product' },
+                { name: 'isBundle', type: 'checkbox', alias: 'Bundle Product', span: true, section: 'productInfo', infoMessage: 'Check if this is a bundle/combo product made up of other products' }, // Added: Bundle product flag
                 { name: 'pricingInfo', type: 'section', alias: 'Pricing' },
                 { name: 'sellingPrice', type: 'money', required: true, alias: 'Selling Price', section: 'pricingInfo', infoMessage: 'Default selling price per unit' },
                 { name: 'inventoryInfo', type: 'section', alias: 'Inventory Settings', collapsedCondition: x => x.productID },
-                { name: 'isSerialized', type: 'checkbox', alias: 'Serialized Product', span: true, section: 'inventoryInfo', infoMessage: 'Track individual items by serial number' }, // Changed: Added span to cross two columns
+                { name: 'isSerialized', type: 'checkbox', alias: 'Serialized Product', span: true, section: 'inventoryInfo', infoMessage: 'Track individual items by serial number', hiddenCondition: x => x.isBundle }, // Changed: Hide for bundles
                 { name: 'baseUnit', type: 'select', required: true, alias: 'Base Unit', section: 'inventoryInfo', loadAction: { url: 'products/list/base-unit' }, defaultFirstValue: true, infoMessage: 'Unit of measure for inventory tracking' }, // Changed: Added defaultFirstValue flag
-                { name: 'minimumInventoryLevel', type: 'number', required: true, alias: 'Minimum Inventory Level', section: 'inventoryInfo', infoMessage: 'Alert threshold for low stock' },
+                { name: 'minimumInventoryLevel', type: 'number', required: true, alias: 'Minimum Inventory Level', section: 'inventoryInfo', infoMessage: 'Alert threshold for low stock', hiddenCondition: x => x.isBundle }, // Changed: Hide for bundles
                 { name: 'categoryInfo', type: 'section', alias: 'Categorization', collapsed: true },
                 { name: 'categoryID', type: 'select', alias: 'Category', nullable: true, section: 'categoryInfo', loadAction: { url: 'categories/list/x' }, detailsConfig: this.generalService.categoryDetailsConfig, infoMessage: 'The main product category' }, // Changed: Added nullable flag
                 { name: 'subCategoryID', type: 'select', alias: 'Sub Category', section: 'categoryInfo', loadAction: { url: 'subcategories/list/x' }, detailsConfig: this.generalService.subCategoryDetailsConfig, infoMessage: 'More specific product classification' },
@@ -3453,6 +3620,102 @@ class InventoryService {
             loadAction: { url: 'products/all/x' },
             formConfig: this.productFormConfig
         };
+        //--------------------------Product Components (Bundle Configuration)-------------------------
+        // Product component form for adding/editing bundle components
+        this.productComponentFormConfig = {
+            title: 'Bundle Component',
+            fixedTitle: true,
+            fields: [
+                { name: 'productComponentID', type: 'number', alias: 'ID', hidden: true },
+                { name: 'productID', type: 'number', alias: 'Bundle Product ID', hidden: true },
+                { name: 'componentProductID', type: 'select', alias: 'Component Product', required: true, detailsConfig: this.productDetailsConfig,
+                    loadAction: { url: 'products/list/components' },
+                    infoMessage: 'Select a non-bundle product to include in this bundle'
+                },
+                { name: 'quantity', type: 'number', alias: 'Quantity', required: true, defaultValue: 1, infoMessage: 'Number of units required per bundle' }
+            ],
+            loadAction: { url: 'productcomponents/id' },
+            heroField: 'productComponentID'
+        };
+        // Product components table for bundle details
+        this.productComponentsTableConfig = {
+            tabTitle: 'Components',
+            showFilter: false,
+            elevation: 'none',
+            flatButtons: true,
+            causeFormRefresh: true,
+            minColumns: ['componentProductName', 'quantity', 'estimatedCost'],
+            columns: [
+                { name: 'componentProductName', type: 'text', alias: 'Component' },
+                { name: 'quantity', type: 'number', alias: 'Quantity per Bundle' },
+                { name: 'componentCurrentStock', type: 'number', alias: 'Available Stock' },
+                { name: 'estimatedCost', type: 'money', alias: 'Est. Cost' }
+            ],
+            buttons: [
+                { name: 'create', display: 'Add Component', dialog: true, action: { url: 'productcomponents?action=create', method: 'post' } },
+                { name: 'edit', dialog: true, action: { url: 'productcomponents?action=edit', method: 'post' } },
+                { name: 'delete', dialog: true, action: { url: 'productcomponents?action=delete', method: 'post' } }
+            ],
+            loadAction: { url: 'productcomponents/x/x' }, loadCriteria: 'bundle', loadIDField: 'productID',
+            formConfig: this.productComponentFormConfig
+        };
+        // Bundle product form configuration
+        this.bundleProductFormConfig = {
+            security: { allow: [this.dataService.capProducts] },
+            title: 'Bundle Product',
+            fixedTitle: true,
+            multiColumn: true,
+            includeAudit: true,
+            fields: [
+                { name: 'productInfo', type: 'section', alias: 'Bundle Information' },
+                { name: 'name', type: 'text', required: true, alias: 'Bundle Name', section: 'productInfo', infoMessage: 'Name for this product bundle' },
+                { name: 'sku', type: 'text', alias: 'SKU (optional)', section: 'productInfo', infoMessage: 'Stock Keeping Unit for bundle tracking' },
+                { name: 'description', type: 'text', alias: 'Description', span: true, section: 'productInfo', infoMessage: 'Description of what is included in this bundle' },
+                { name: 'isBundle', type: 'checkbox', alias: 'Is Bundle', hidden: true, defaultValue: true },
+                { name: 'pricingInfo', type: 'section', alias: 'Pricing' },
+                { name: 'sellingPrice', type: 'money', required: true, alias: 'Bundle Price', section: 'pricingInfo', infoMessage: 'Selling price for the complete bundle' },
+                { name: 'bundleEstimatedCost', type: 'money', alias: 'Estimated Cost', section: 'pricingInfo', readonly: true, hideOnCreate: true, infoMessage: 'Total estimated cost based on component costs' },
+                { name: 'inventoryInfo', type: 'section', alias: 'Inventory Settings', collapsedCondition: x => x.productID },
+                { name: 'baseUnit', type: 'select', required: true, alias: 'Base Unit', section: 'inventoryInfo', loadAction: { url: 'products/list/base-unit' }, defaultFirstValue: true, infoMessage: 'Unit of measure for bundle' },
+                { name: 'bundleAvailableQuantity', type: 'number', alias: 'Available to Sell', section: 'inventoryInfo', readonly: true, hideOnCreate: true, infoMessage: 'Number of bundles that can be assembled from current component stock' },
+            ],
+            loadAction: { url: 'products/id' },
+            heroField: 'productID'
+        };
+        this.bundleProductDetailsConfig = {
+            formConfig: this.bundleProductFormConfig,
+            tableConfigs: [this.productComponentsTableConfig],
+            heroField: 'productID',
+            buttons: [
+                { name: 'create', display: 'Create Bundle', dialog: true, action: { url: 'products?action=create', method: 'post' } },
+                { name: 'edit', dialog: true, action: { url: 'products?action=edit', method: 'post' } },
+                { name: 'delete', dialog: true, action: { url: 'products?action=delete', method: 'post' } }
+            ]
+        };
+        this.bundleProductViewButton = { name: 'view', dialog: true, detailsConfig: this.bundleProductDetailsConfig };
+        this.bundleProductCreateButton = { name: 'create', display: 'Create Bundle', dialog: true, action: { url: 'products?action=create', method: 'post' } };
+        // Table configuration for bundle products
+        this.bundleProductsTableConfig = {
+            showFilter: true,
+            flatButtons: true,
+            minColumns: ['name', 'sku', 'bundleAvailableQuantity'],
+            columns: [
+                { name: 'name', type: 'text', alias: 'Bundle Name' },
+                { name: 'sku', type: 'text', alias: 'SKU' },
+                { name: 'bundleAvailableQuantity', type: 'number', alias: 'Available', icon: { name: 'info', color: '#2196F3', condition: (x) => x.bundleAvailableQuantity > 0 } }, // Changed: Removed infoMessage as it's not valid for columns
+                { name: 'bundleEstimatedCost', type: 'money', alias: 'Est. Cost' },
+                { name: 'sellingPrice', type: 'money', alias: 'Selling Price' },
+                { name: 'categoryName', type: 'text', alias: 'Category' }
+            ],
+            buttons: [
+                this.bundleProductCreateButton,
+                this.bundleProductViewButton,
+                { name: 'edit', dialog: true, action: { url: 'products?action=edit', method: 'post' } },
+                { name: 'delete', dialog: true, action: { url: 'products?action=delete', method: 'post' } }
+            ],
+            loadAction: { url: 'products/bundles/x' },
+            formConfig: this.bundleProductFormConfig
+        };
         //--------------------------Requisitions-------------------------
         this.requisitionItemFormConfig = {
             title: 'Requisition Item',
@@ -3822,7 +4085,7 @@ class InventoryService {
             title: 'Sales Order Item',
             fixedTitle: true, // Changed: Use fixedTitle to avoid duplication with 'Add Item' button
             fields: [
-                { name: 'productID', type: 'select', alias: 'Product', required: true, loadAction: { url: 'products/list/x' }, detailsConfig: this.productDetailsConfig },
+                { name: 'productID', type: 'select', alias: 'Product', required: true, loadAction: { url: 'products/list/x' }, detailsConfig: this.productDetailsConfig }, // Changed: Show all products including bundles
                 { name: 'quantity', type: 'number', alias: 'Quantity', required: true },
                 { name: 'unitPrice', type: 'money', alias: 'Unit Price', required: true },
                 { name: 'discount', type: 'money', alias: 'Discount' },
@@ -4045,7 +4308,7 @@ class InventoryService {
             fixedTitle: true,
             fields: [
                 {
-                    name: 'productID', type: 'select', required: true, alias: 'Product', span: true, loadAction: { url: 'products/list/x' },
+                    name: 'productID', type: 'select', required: true, alias: 'Product', span: true, loadAction: { url: 'products/list/x' }, // Changed: Show all products including bundles
                     onSelectChange: (selectedProductId, formData, option) => {
                         if (option && option.sellingPrice) {
                             formData.unitPrice = option.sellingPrice; // Changed: Auto-populate unitPrice with product's sellingPrice
@@ -4103,7 +4366,7 @@ class InventoryService {
                 { name: 'multipleProducts', type: 'checkbox', alias: 'Multiple Products', defaultValue: false, hideOnExists: true, infoMessage: 'Check this box if you want to add multiple products to this sale' }, // Changed: Added checkbox for multiple products mode
                 { name: 'saleType', type: 'select', required: true, alias: 'Sale Type', section: 'saleInfo', options: [{ name: 'Quick Sale', value: 0 }, { name: 'From Order', value: 1 }], defaultFirstValue: true, hideOnCreate: true, infoMessage: 'Select if this is a quick sale or created from an order' },
                 { name: 'quickSaleItem', type: 'section', alias: 'Quick Sale Item', hiddenCondition: x => x.multipleProducts === true || x.saleID }, // Changed: Section for single product entry
-                { name: 'productID', type: 'select', required: true, alias: 'Product', section: 'quickSaleItem', span: true, loadAction: { url: 'products/list/x' }, hiddenCondition: x => x.multipleProducts === true, // Changed: Product selection for quick sale
+                { name: 'productID', type: 'select', required: true, alias: 'Product', section: 'quickSaleItem', span: true, loadAction: { url: 'products/list/x' }, hiddenCondition: x => x.multipleProducts === true, // Changed: Show all products including bundles
                     onSelectChange: (selectedProductId, formData, option) => {
                         if (option && option.sellingPrice) {
                             formData.unitPrice = option.sellingPrice; // Changed: Auto-populate unitPrice with product's sellingPrice
@@ -4242,6 +4505,7 @@ class InventoryService {
         };
         this.productDetailsConfig = {
             formConfig: this.productFormConfig,
+            tableConfigs: [this.productComponentsTableConfig], // Added: Show components for bundle products
             heroField: 'productID',
             buttons: [this.productCreateButton, this.productEditButton, this.productDeleteButton]
         };
@@ -14055,11 +14319,11 @@ class ChangePasswordComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ChangePasswordComponent, deps: [{ token: i1$2.Router }, { token: i2.Location }, { token: HttpService }, { token: MessageService }, { token: DataServiceLib }, { token: AuthService }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ChangePasswordComponent, isStandalone: false, selector: "spa-change-password", ngImport: i0, template: "<h4>Change Password</h4>\r\n<hr>\r\n\r\n\r\n<div class=\"container tin-grid\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"fill\">\r\n\r\n    <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\"  [readonly]=\"true\"></spa-text>\r\n    <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\"  type=\"password\"></spa-text>\r\n    <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" type=\"password\"></spa-text>\r\n    <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\"  type=\"password\"></spa-text>\r\n    <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n\r\n  </div>\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n</div>\r\n\r\n\r\n<!-- <div class=\"container\">\r\n\r\n  <div class=\"d-flex justify-content-center row align-items-center\" >\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"tin-input \" style=\"font-size:14px;\">\r\n\r\n        <div class=\"col\" *ngIf=\"changePassword.userName!=''\">\r\n          <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\" width=\"300px\" [readonly]=\"true\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\" *ngIf=\"!myRole[dataService.capUsers.name]\">\r\n          <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n           <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col mt-3\">\r\n          <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n\r\n\r\n\r\n  </div>\r\n</div> -->\r\n\r\n", styles: [""], dependencies: [{ kind: "component", type: i5$1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: TextComponent, selector: "spa-text", inputs: ["appearance", "readonly", "hint", "display", "placeholder", "value", "format", "type", "width", "copyContent", "clearContent", "required", "min", "max", "regex", "suffix", "infoMessage"], outputs: ["valueChange", "leave", "enterPress"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ChangePasswordComponent, isStandalone: false, selector: "spa-change-password", ngImport: i0, template: "<h4>Change Password</h4>\r\n<hr>\r\n\r\n\r\n<div class=\"container tin-grid\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"fill\">\r\n\r\n    <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\"  [readonly]=\"true\"></spa-text>\r\n    <spa-text-mask id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\"  type=\"password\"></spa-text-mask>\r\n    <spa-text-mask id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" type=\"password\"></spa-text-mask>\r\n    <spa-text-mask id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\"  type=\"password\"></spa-text-mask>\r\n    <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n\r\n  </div>\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n</div>\r\n\r\n\r\n<!-- <div class=\"container\">\r\n\r\n  <div class=\"d-flex justify-content-center row align-items-center\" >\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"tin-input \" style=\"font-size:14px;\">\r\n\r\n        <div class=\"col\" *ngIf=\"changePassword.userName!=''\">\r\n          <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\" width=\"300px\" [readonly]=\"true\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\" *ngIf=\"!myRole[dataService.capUsers.name]\">\r\n          <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n           <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col mt-3\">\r\n          <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n\r\n\r\n\r\n  </div>\r\n</div> -->\r\n\r\n", styles: [""], dependencies: [{ kind: "component", type: i5$1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: TextComponent, selector: "spa-text", inputs: ["appearance", "readonly", "hint", "display", "placeholder", "value", "format", "type", "width", "copyContent", "clearContent", "required", "min", "max", "regex", "suffix", "infoMessage"], outputs: ["valueChange", "leave", "enterPress"] }, { kind: "component", type: TextMaskComponent, selector: "spa-text-mask", inputs: ["appearance", "readonly", "hint", "display", "placeholder", "value", "width", "required", "min", "max", "regex", "infoMessage"], outputs: ["valueChange", "leave", "enterPress"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ChangePasswordComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'spa-change-password', standalone: false, template: "<h4>Change Password</h4>\r\n<hr>\r\n\r\n\r\n<div class=\"container tin-grid\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"fill\">\r\n\r\n    <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\"  [readonly]=\"true\"></spa-text>\r\n    <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\"  type=\"password\"></spa-text>\r\n    <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" type=\"password\"></spa-text>\r\n    <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\"  type=\"password\"></spa-text>\r\n    <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n\r\n  </div>\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n</div>\r\n\r\n\r\n<!-- <div class=\"container\">\r\n\r\n  <div class=\"d-flex justify-content-center row align-items-center\" >\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"tin-input \" style=\"font-size:14px;\">\r\n\r\n        <div class=\"col\" *ngIf=\"changePassword.userName!=''\">\r\n          <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\" width=\"300px\" [readonly]=\"true\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\" *ngIf=\"!myRole[dataService.capUsers.name]\">\r\n          <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n           <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col mt-3\">\r\n          <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n\r\n\r\n\r\n  </div>\r\n</div> -->\r\n\r\n" }]
+            args: [{ selector: 'spa-change-password', standalone: false, template: "<h4>Change Password</h4>\r\n<hr>\r\n\r\n\r\n<div class=\"container tin-grid\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"fill\">\r\n\r\n    <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\"  [readonly]=\"true\"></spa-text>\r\n    <spa-text-mask id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\"  type=\"password\"></spa-text-mask>\r\n    <spa-text-mask id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" type=\"password\"></spa-text-mask>\r\n    <spa-text-mask id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\"  type=\"password\"></spa-text-mask>\r\n    <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n\r\n  </div>\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n</div>\r\n\r\n\r\n<!-- <div class=\"container\">\r\n\r\n  <div class=\"d-flex justify-content-center row align-items-center\" >\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"tin-input \" style=\"font-size:14px;\">\r\n\r\n        <div class=\"col\" *ngIf=\"changePassword.userName!=''\">\r\n          <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\" width=\"300px\" [readonly]=\"true\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\" *ngIf=\"!myRole[dataService.capUsers.name]\">\r\n          <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n           <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col mt-3\">\r\n          <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n\r\n\r\n\r\n  </div>\r\n</div> -->\r\n\r\n" }]
         }], ctorParameters: () => [{ type: i1$2.Router }, { type: i2.Location }, { type: HttpService }, { type: MessageService }, { type: DataServiceLib }, { type: AuthService }, { type: i1$2.ActivatedRoute }] });
 
 class ProfileComponent {
@@ -14132,11 +14396,11 @@ class ProfileComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ProfileComponent, deps: [{ token: DataServiceLib }, { token: MessageService }, { token: HttpService }, { token: i1$2.Router }, { token: AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ProfileComponent, isStandalone: false, selector: "spa-profile", inputs: { appConfig: "appConfig" }, ngImport: i0, template: "\r\n<h4>Profile</h4>\r\n<hr>\r\n\r\n<div class=\"container tin-grid-auto\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"tin-center centa\">\r\n    <div class=\"profileImage\">{{initials}}</div>\r\n    <mat-label id=\"lbluserName\" >{{profile?.userName}}</mat-label>\r\n  </div>\r\n\r\n  <div>\r\n\r\n    <spa-text id=\"txtFirstName\" display=\"First Name\" [(value)]=\"profile.firstName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtLastName\" display=\"Last Name\" [(value)]=\"profile.lastName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtAuth\" display=\"Authentication\" [(value)]=\"profile.authType\" [readonly]=\"true\"></spa-text>\r\n    <spa-text id=\"txtEmail\" display=\"Email\" [(value)]=\"profile.email\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-select id=\"cboRole\" display=\"Role\" [options]=\"roles\" optionDisplay=\"roleName\" optionValue=\"roleID\" [(value)]=\"profile.roleID\" [readonly]=\"selfProfile\"></spa-select>\r\n    <spa-label *ngIf=\"dataService.appConfig.multitenant\" display=\"Code\" [value]=\"profile.code\" ></spa-label>\r\n\r\n    <button id=\"btnUpdate\" class=\"w-100\"   mat-raised-button color=\"primary\" *ngIf=\"!selfProfile\" [disabled]=\"isProcessing\" (click)=\"updateProfile()\">Update Profile</button>\r\n  </div>\r\n\r\n\r\n  <div class=\"tin-center centa\">\r\n    <a mat-button id=\"lnkUserManager\" style=\"margin-left: 1em\" *ngIf=\"!selfProfile\" (click)=\"gotoUsers()\">User Manager</a>\r\n    <a mat-button id=\"lnkChangePassword\" style=\"margin-left: 1em\" *ngIf=\"(selfProfile || myRole[dataService.capUsers.name]) && profile.authType=='local'\" (click)=\"changePassword()\">Change Password</a>\r\n  </div>\r\n\r\n\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n", styles: [".centa{display:flex;flex-direction:column}.profileImage{width:150px;height:150px;border-radius:50%;background:#512da8;font-size:50px;color:#fff;text-align:center;line-height:150px;margin:20px 0 0}#lbluserName{font-size:20px;font-style:italic}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: TextComponent, selector: "spa-text", inputs: ["appearance", "readonly", "hint", "display", "placeholder", "value", "format", "type", "width", "copyContent", "clearContent", "required", "min", "max", "regex", "suffix", "infoMessage"], outputs: ["valueChange", "leave", "enterPress"] }, { kind: "component", type: SelectComponent, selector: "spa-select", inputs: ["detailsConfig"] }, { kind: "component", type: LabelComponent, selector: "spa-label", inputs: ["display", "value", "format", "suffix", "size"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ProfileComponent, isStandalone: false, selector: "spa-profile", inputs: { appConfig: "appConfig" }, ngImport: i0, template: "\r\n<h4>Profile</h4>\r\n<hr>\r\n\r\n<div class=\"container tin-grid-auto\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"tin-center centa\">\r\n    <div class=\"profileImage\">{{initials}}</div>\r\n    <mat-label id=\"lbluserName\" >{{profile?.userName}}</mat-label>\r\n  </div>\r\n\r\n  <div>\r\n\r\n    <spa-text id=\"txtFirstName\" display=\"First Name\" [(value)]=\"profile.firstName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtLastName\" display=\"Last Name\" [(value)]=\"profile.lastName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtAuth\" display=\"Authentication\" [(value)]=\"profile.authType\" [readonly]=\"true\"></spa-text>\r\n    <spa-text id=\"txtEmail\" display=\"Email\" [(value)]=\"profile.email\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtRole\" display=\"Role\" [(value)]=\"profile.role.roleName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <!-- <spa-select id=\"cboRole\" display=\"Role\" [options]=\"roles\" optionDisplay=\"roleName\" optionValue=\"roleID\" [(value)]=\"profile.roleID\" [readonly]=\"selfProfile\"></spa-select> -->\r\n    <spa-label *ngIf=\"dataService.appConfig.multitenant\" display=\"Code\" [value]=\"profile.code\" ></spa-label>\r\n\r\n    <button id=\"btnUpdate\" class=\"w-100\"   mat-raised-button color=\"primary\" *ngIf=\"!selfProfile\" [disabled]=\"isProcessing\" (click)=\"updateProfile()\">Update Profile</button>\r\n  </div>\r\n\r\n\r\n  <div class=\"tin-center centa\">\r\n    <a mat-button id=\"lnkUserManager\" style=\"margin-left: 1em\" *ngIf=\"!selfProfile\" (click)=\"gotoUsers()\">User Manager</a>\r\n    <a mat-button id=\"lnkChangePassword\" style=\"margin-left: 1em\" *ngIf=\"(selfProfile || myRole[dataService.capUsers.name]) && profile.authType=='local'\" (click)=\"changePassword()\">Change Password</a>\r\n  </div>\r\n\r\n\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n", styles: [".centa{display:flex;flex-direction:column}.profileImage{width:150px;height:150px;border-radius:50%;background:#512da8;font-size:50px;color:#fff;text-align:center;line-height:150px;margin:20px 0 0}#lbluserName{font-size:20px;font-style:italic}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: TextComponent, selector: "spa-text", inputs: ["appearance", "readonly", "hint", "display", "placeholder", "value", "format", "type", "width", "copyContent", "clearContent", "required", "min", "max", "regex", "suffix", "infoMessage"], outputs: ["valueChange", "leave", "enterPress"] }, { kind: "component", type: LabelComponent, selector: "spa-label", inputs: ["display", "value", "format", "suffix", "size"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ProfileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'spa-profile', standalone: false, template: "\r\n<h4>Profile</h4>\r\n<hr>\r\n\r\n<div class=\"container tin-grid-auto\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"tin-center centa\">\r\n    <div class=\"profileImage\">{{initials}}</div>\r\n    <mat-label id=\"lbluserName\" >{{profile?.userName}}</mat-label>\r\n  </div>\r\n\r\n  <div>\r\n\r\n    <spa-text id=\"txtFirstName\" display=\"First Name\" [(value)]=\"profile.firstName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtLastName\" display=\"Last Name\" [(value)]=\"profile.lastName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtAuth\" display=\"Authentication\" [(value)]=\"profile.authType\" [readonly]=\"true\"></spa-text>\r\n    <spa-text id=\"txtEmail\" display=\"Email\" [(value)]=\"profile.email\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-select id=\"cboRole\" display=\"Role\" [options]=\"roles\" optionDisplay=\"roleName\" optionValue=\"roleID\" [(value)]=\"profile.roleID\" [readonly]=\"selfProfile\"></spa-select>\r\n    <spa-label *ngIf=\"dataService.appConfig.multitenant\" display=\"Code\" [value]=\"profile.code\" ></spa-label>\r\n\r\n    <button id=\"btnUpdate\" class=\"w-100\"   mat-raised-button color=\"primary\" *ngIf=\"!selfProfile\" [disabled]=\"isProcessing\" (click)=\"updateProfile()\">Update Profile</button>\r\n  </div>\r\n\r\n\r\n  <div class=\"tin-center centa\">\r\n    <a mat-button id=\"lnkUserManager\" style=\"margin-left: 1em\" *ngIf=\"!selfProfile\" (click)=\"gotoUsers()\">User Manager</a>\r\n    <a mat-button id=\"lnkChangePassword\" style=\"margin-left: 1em\" *ngIf=\"(selfProfile || myRole[dataService.capUsers.name]) && profile.authType=='local'\" (click)=\"changePassword()\">Change Password</a>\r\n  </div>\r\n\r\n\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n", styles: [".centa{display:flex;flex-direction:column}.profileImage{width:150px;height:150px;border-radius:50%;background:#512da8;font-size:50px;color:#fff;text-align:center;line-height:150px;margin:20px 0 0}#lbluserName{font-size:20px;font-style:italic}\n"] }]
+            args: [{ selector: 'spa-profile', standalone: false, template: "\r\n<h4>Profile</h4>\r\n<hr>\r\n\r\n<div class=\"container tin-grid-auto\" style=\"font-size:14px;\">\r\n\r\n  <div class=\"tin-center centa\">\r\n    <div class=\"profileImage\">{{initials}}</div>\r\n    <mat-label id=\"lbluserName\" >{{profile?.userName}}</mat-label>\r\n  </div>\r\n\r\n  <div>\r\n\r\n    <spa-text id=\"txtFirstName\" display=\"First Name\" [(value)]=\"profile.firstName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtLastName\" display=\"Last Name\" [(value)]=\"profile.lastName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtAuth\" display=\"Authentication\" [(value)]=\"profile.authType\" [readonly]=\"true\"></spa-text>\r\n    <spa-text id=\"txtEmail\" display=\"Email\" [(value)]=\"profile.email\" [readonly]=\"selfProfile\"></spa-text>\r\n    <spa-text id=\"txtRole\" display=\"Role\" [(value)]=\"profile.role.roleName\" [readonly]=\"selfProfile\"></spa-text>\r\n    <!-- <spa-select id=\"cboRole\" display=\"Role\" [options]=\"roles\" optionDisplay=\"roleName\" optionValue=\"roleID\" [(value)]=\"profile.roleID\" [readonly]=\"selfProfile\"></spa-select> -->\r\n    <spa-label *ngIf=\"dataService.appConfig.multitenant\" display=\"Code\" [value]=\"profile.code\" ></spa-label>\r\n\r\n    <button id=\"btnUpdate\" class=\"w-100\"   mat-raised-button color=\"primary\" *ngIf=\"!selfProfile\" [disabled]=\"isProcessing\" (click)=\"updateProfile()\">Update Profile</button>\r\n  </div>\r\n\r\n\r\n  <div class=\"tin-center centa\">\r\n    <a mat-button id=\"lnkUserManager\" style=\"margin-left: 1em\" *ngIf=\"!selfProfile\" (click)=\"gotoUsers()\">User Manager</a>\r\n    <a mat-button id=\"lnkChangePassword\" style=\"margin-left: 1em\" *ngIf=\"(selfProfile || myRole[dataService.capUsers.name]) && profile.authType=='local'\" (click)=\"changePassword()\">Change Password</a>\r\n  </div>\r\n\r\n\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n", styles: [".centa{display:flex;flex-direction:column}.profileImage{width:150px;height:150px;border-radius:50%;background:#512da8;font-size:50px;color:#fff;text-align:center;line-height:150px;margin:20px 0 0}#lbluserName{font-size:20px;font-style:italic}\n"] }]
         }], ctorParameters: () => [{ type: DataServiceLib }, { type: MessageService }, { type: HttpService }, { type: i1$2.Router }, { type: AuthService }], propDecorators: { appConfig: [{
                 type: Input
             }] } });
@@ -14985,6 +15249,84 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                 }]
         }], ctorParameters: () => [{ type: DataServiceLib }, { type: AccountingService }] });
 
+// Aging report component for accounts receivable tracking
+class AgingComponent {
+    ngOnInit() {
+        this.loadSummaryData();
+    }
+    loadSummaryData() {
+        this.dataServiceLib.CallApi({ url: 'invoices/aging-summary/x' }, '').subscribe((apiResponse) => {
+            if (apiResponse.success) {
+                this.summaryData = apiResponse.data;
+            }
+        });
+    }
+    constructor(dataServiceLib) {
+        this.dataServiceLib = dataServiceLib;
+        this.accountingService = inject(AccountingService);
+        this.tileConfig = this.accountingService.agingTileConfig;
+        // this.tileConfig = this.accountingService.agingTileConfig;
+        this.agingTableConfigs = [
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: 'Current',
+                loadAction: { url: 'invoices/aging-current/x' },
+                countAction: { url: 'invoices/count/aging-current' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '1-30 Days',
+                loadAction: { url: 'invoices/aging-30/x' },
+                countAction: { url: 'invoices/count/aging-30' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '31-60 Days',
+                loadAction: { url: 'invoices/aging-60/x' },
+                countAction: { url: 'invoices/count/aging-60' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '61-90 Days',
+                loadAction: { url: 'invoices/aging-90/x' },
+                countAction: { url: 'invoices/count/aging-90' }
+            },
+            {
+                ...this.accountingService.agingBaseTableConfig,
+                tabTitle: '90+ Days',
+                loadAction: { url: 'invoices/aging-90plus/x' },
+                countAction: { url: 'invoices/count/aging-90plus' }
+            }
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AgingComponent, deps: [{ token: DataServiceLib }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: AgingComponent, isStandalone: false, selector: "spa-aging", ngImport: i0, template: `
+    <h4>Accounts Receivable Aging</h4>
+    <hr>
+    <div *ngIf="summaryData" class="mt-3 mb-3">
+      <spa-tiles [config]="tileConfig" [data]="summaryData"></spa-tiles>
+    </div>
+    
+    <spa-tabs [tableConfigs]="agingTableConfigs"></spa-tabs>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TilesComponent, selector: "spa-tiles", inputs: ["config", "lastSearch", "data", "reload"], outputs: ["tileActionSelected", "tileClick", "tileUnClick"] }, { kind: "component", type: TabsComponent, selector: "spa-tabs", inputs: ["tableConfigs", "reload", "parentDetails"], outputs: ["formRefresh"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AgingComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-aging',
+                    template: `
+    <h4>Accounts Receivable Aging</h4>
+    <hr>
+    <div *ngIf="summaryData" class="mt-3 mb-3">
+      <spa-tiles [config]="tileConfig" [data]="summaryData"></spa-tiles>
+    </div>
+    
+    <spa-tabs [tableConfigs]="agingTableConfigs"></spa-tabs>
+  `,
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: DataServiceLib }] });
+
 class TransactionTypesComponent {
     constructor() {
         this.accountingService = inject(AccountingService);
@@ -15675,11 +16017,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                 }]
         }] });
 
+// Component for managing bundle/combo products
+class BundleProductsComponent {
+    constructor() {
+        this.inventoryService = inject(InventoryService);
+        this.pageConfig = {
+            title: 'Bundle Products',
+            tableConfig: this.inventoryService.bundleProductsTableConfig
+        };
+    }
+    ngOnInit() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BundleProductsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: BundleProductsComponent, isStandalone: false, selector: "spa-bundle-products", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: BundleProductsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-bundle-products',
+                    standalone: false,
+                    template: '<spa-page [config]="pageConfig"></spa-page>'
+                }]
+        }] });
+
+class GptCachesComponent {
+    constructor() {
+        this.dataService = inject(DataServiceLib);
+        this.pageConfig = {
+            title: 'GPT Cache',
+            tableConfig: this.dataService.gptCachesTableConfig
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: GptCachesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: GptCachesComponent, isStandalone: true, selector: "spa-gpt-caches", ngImport: i0, template: '<spa-page [config]="pageConfig"></spa-page>', isInline: true, dependencies: [{ kind: "ngmodule", type: TinSpaModule }, { kind: "component", type: PageComponent, selector: "spa-page", inputs: ["config"], outputs: ["searchModeActivated", "searchModeDeactivated", "refreshClick", "actionClick", "actionResponse", "inputChange", "createClick", "searchClick", "dataLoad", "titleActionChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: GptCachesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spa-gpt-caches',
+                    standalone: true,
+                    imports: [TinSpaModule],
+                    template: '<spa-page [config]="pageConfig"></spa-page>'
+                }]
+        }] });
+
 const routes$1 = [
     { path: "users", component: UsersComponent },
     { path: "roles", component: RolesComponent },
     { path: "create-account", component: CreateAccountComponent },
     { path: "logs", component: LogsComponent },
+    { path: "gpt-caches", component: GptCachesComponent }, // Added: GPT Cache route
     { path: "settings", component: SettingsComponent },
     { path: "tenant-settings", component: TenantSettingsComponent },
     { path: "tenants", component: TenantsComponent },
@@ -15707,6 +16093,7 @@ const routes$1 = [
     { path: "accounting-transaction-types", component: TransactionTypesComponent },
     { path: "accounting-transactions", component: TransactionsComponent },
     { path: "accounting-invoices", component: InvoicesComponent },
+    { path: "accounting-aging", component: AgingComponent }, // Added: Aging route
     { path: "accounting-outstanding-invoices", component: OutstandingInvoicesComponent },
     { path: "loans-products", component: LoanProductsComponent },
     { path: "loans", component: LoansComponent },
@@ -15724,6 +16111,7 @@ const routes$1 = [
     { path: "inventory-transactions", component: InventoryTransactionsComponent },
     { path: "inventory-dashboard", component: InventoryDashboardComponent },
     { path: "inventory-stock", component: InventoryStockComponent }, // Changed: Added inventory stock route
+    { path: "bundle-products", component: BundleProductsComponent }, // Added: Bundle products route
     { path: "production-recipes", component: ProductionRecipesComponent },
     { path: "production-orders", component: ProductionOrdersComponent }
 ];
@@ -15746,6 +16134,7 @@ class AdminModule {
             // Accounting components
             AccountsComponent,
             AggregatesComponent, // Added: Aggregates component declaration
+            AgingComponent, // Added: Aging component declaration
             TransactionTypesComponent,
             TransactionsComponent,
             InvoicesComponent,
@@ -15765,7 +16154,9 @@ class AdminModule {
             InventoryDashboardComponent,
             InventoryStockComponent,
             ProductionRecipesComponent,
-            ProductionOrdersComponent], imports: [CommonModule,
+            ProductionOrdersComponent,
+            BundleProductsComponent // Added: Bundle products component
+        ], imports: [CommonModule,
             AdminRoutingModule,
             SpaAdminModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: AdminModule, imports: [CommonModule,
@@ -15779,6 +16170,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                         // Accounting components
                         AccountsComponent,
                         AggregatesComponent, // Added: Aggregates component declaration
+                        AgingComponent, // Added: Aging component declaration
                         TransactionTypesComponent,
                         TransactionsComponent,
                         InvoicesComponent,
@@ -15798,7 +16190,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                         InventoryDashboardComponent,
                         InventoryStockComponent,
                         ProductionRecipesComponent,
-                        ProductionOrdersComponent
+                        ProductionOrdersComponent,
+                        BundleProductsComponent // Added: Bundle products component
                     ],
                     imports: [
                         CommonModule,
@@ -15855,5 +16248,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { Account, AccountsComponent as AccountingAccountsComponent, AggregatesComponent as AccountingAggregatesComponent, InvoicesComponent as AccountingInvoicesComponent, OutstandingInvoicesComponent as AccountingOutstandingInvoicesComponent, AccountingService, TransactionTypesComponent as AccountingTransactionTypesComponent, TransactionsComponent as AccountingTransactionsComponent, Action, ActivityComponent, AdminModule, AlertComponent, AlertConfig, AlertMessage, ApiResponse, AppConfig, AppModelsComponent, AttachComponent, AuthService, BrandsComponent, CacheConfig, CapItem, CapsulesComponent, CategoriesComponent, ChangePasswordComponent, ChangeUserPassword, CheckComponent, ChipsComponent, Constants, Core, CreateAccountComponent, CustomersComponent, DataServiceLib, DateComponent, DatetimeComponent, DepartmentsComponent, DetailsDialog, DetailsDialogConfig, DetailsDialogProcessor, DetailsSource, DialogService, EmailComponent, EmployeesComponent, ExportService, FilterComponent, FormComponent, FormConfig, GeneralService, GradesComponent, GroupsComponent, HtmlComponent, HttpService, IndexModule, InventoryReceiptStatus, InventoryService, InvoiceStatus, LabelComponent, ListDialogComponent, ListDialogConfig, LoaderComponent, LoaderService, LoanPaymentsComponent, LoanProductsComponent, LoansComponent, LoansService, LogLevel, LogService, LoginComponent, LogsComponent, MembershipComponent, MessageService, MoneyComponent, MovementType, NavMenuComponent, NotesComponent, NotesConfig, NumberComponent, OnboardingComponent, OptionComponent, PageComponent, PageConfig, PlansComponent, PositionsComponent, Profile, ProfileComponent, RecoverAccountComponent, Register, Role, RoleAccess, RolesComponent, SearchComponent, SearchConfig, SecurityConfig, SelectBitwiseComponent, SelectComponent, SelectMultiComponent, SettingsComponent, SignupComponent, SpaAdminModule, SpaIndexModule, SpaMatModule, SpaUserModule, StatusesComponent, Step, StepConfig, StepsComponent, StorageService, SubCategoriesComponent, SuppliersComponent, TabService, TableComponent, TableConfig, TabsComponent, TabsInternalComponent, TabsLiteComponent, TasksComponent, TenantsComponent, TextAreaComponent, TextComponent, TextMaskComponent, TextMultiComponent, TextSingleComponent, TileConfig, TilesComponent, TinSpaComponent, TinSpaModule, TinSpaService, TitleActionsComponent, UnitOfMeasure, User, UserModule, UsersComponent, ViewerComponent, WelcomeComponent, authGuard, dialogOptions, loginConfig, messageDialog, viewerDialog };
+export { Account, AccountsComponent as AccountingAccountsComponent, AggregatesComponent as AccountingAggregatesComponent, AgingComponent as AccountingAgingComponent, InvoicesComponent as AccountingInvoicesComponent, OutstandingInvoicesComponent as AccountingOutstandingInvoicesComponent, AccountingService, TransactionTypesComponent as AccountingTransactionTypesComponent, TransactionsComponent as AccountingTransactionsComponent, Action, ActivityComponent, AdminModule, AlertComponent, AlertConfig, AlertMessage, ApiResponse, AppConfig, AppModelsComponent, AttachComponent, AuthService, BrandsComponent, CacheConfig, CapItem, CapsulesComponent, CategoriesComponent, ChangePasswordComponent, ChangeUserPassword, CheckComponent, ChipsComponent, Constants, Core, CreateAccountComponent, CustomersComponent, DataServiceLib, DateComponent, DatetimeComponent, DepartmentsComponent, DetailsDialog, DetailsDialogConfig, DetailsDialogProcessor, DetailsSource, DialogService, EmailComponent, EmployeesComponent, ExportService, FilterComponent, FormComponent, FormConfig, GeneralService, GradesComponent, GroupsComponent, HtmlComponent, HttpService, IndexModule, InventoryReceiptStatus, InventoryService, InvoiceStatus, LabelComponent, ListDialogComponent, ListDialogConfig, LoaderComponent, LoaderService, LoanPaymentsComponent, LoanProductsComponent, LoansComponent, LoansService, LogLevel, LogService, LoginComponent, LogsComponent, MembershipComponent, MessageService, MoneyComponent, MovementType, NavMenuComponent, NotesComponent, NotesConfig, NumberComponent, OnboardingComponent, OptionComponent, PageComponent, PageConfig, PlansComponent, PositionsComponent, Profile, ProfileComponent, RecoverAccountComponent, Register, Role, RoleAccess, RolesComponent, SearchComponent, SearchConfig, SecurityConfig, SelectBitwiseComponent, SelectComponent, SelectMultiComponent, SettingsComponent, SignupComponent, SpaAdminModule, SpaIndexModule, SpaMatModule, SpaUserModule, StatusesComponent, Step, StepConfig, StepsComponent, StorageService, SubCategoriesComponent, SuppliersComponent, TabService, TableComponent, TableConfig, TabsComponent, TabsInternalComponent, TabsLiteComponent, TasksComponent, TenantsComponent, TextAreaComponent, TextComponent, TextMaskComponent, TextMultiComponent, TextSingleComponent, TileConfig, TilesComponent, TinSpaComponent, TinSpaModule, TinSpaService, TitleActionsComponent, UnitOfMeasure, User, UserModule, UsersComponent, ViewerComponent, WelcomeComponent, authGuard, dialogOptions, loginConfig, messageDialog, viewerDialog };
 //# sourceMappingURL=tin-spa.mjs.map