/* ============================================================ ELECTROMED — Deep Reports (filter-driven, server-side) Registered as the "Deep Reports" tab inside Reports (reports.jsx). All data via api.deepReport(path, filters); exports via ExportKit. ============================================================ */ /* ── Report catalogue: path + column spec (drives table + exports) ── */ const money = { type: 'currency', align: 'right' }; const numc = { type: 'number', align: 'right' }; const DEEP_REPORTS = { Ledgers: [ { id: 'ledger/general', name: 'General Ledger', needs: [], cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'entry_number', label: 'Entry' }, { key: 'account_code', label: 'Acct' }, { key: 'account_name', label: 'Account' }, { key: 'memo', label: 'Narration' }, { key: 'debit', label: 'Debit', ...money }, { key: 'credit', label: 'Credit', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { debit: 'debit', credit: 'credit' } }, { id: 'ledger/trial-balance', name: 'Trial Balance', flat: true, cols: [ { key: 'code', label: 'Code' }, { key: 'name', label: 'Account' }, { key: 'type', label: 'Type' }, { key: 'debit', label: 'Total Debit', ...money }, { key: 'credit', label: 'Total Credit', ...money }, { key: 'closing_debit', label: 'Closing Dr', ...money }, { key: 'closing_credit', label: 'Closing Cr', ...money }, ], totalsCols: { debit: 'debit', credit: 'credit', closing_debit: 'closing_debit', closing_credit: 'closing_credit' } }, { id: 'ledger/customer', name: 'Customer Ledger', requires: 'customer_id', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'type', label: 'Type' }, { key: 'no', label: 'Ref' }, { key: 'detail', label: 'Detail' }, { key: 'debit', label: 'Debit', ...money }, { key: 'credit', label: 'Credit', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { debit: 'debit', credit: 'credit' } }, { id: 'ledger/supplier', name: 'Supplier Ledger', requires: 'supplier_id', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'type', label: 'Type' }, { key: 'no', label: 'Ref' }, { key: 'credit', label: 'Bill', ...money }, { key: 'debit', label: 'Paid', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { credit: 'credit', debit: 'debit' } }, { id: 'ledger/cash-bank', name: 'Cash / Bank Book', account: true, cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'entry_number', label: 'Entry' }, { key: 'memo', label: 'Narration' }, { key: 'debit', label: 'In', ...money }, { key: 'credit', label: 'Out', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { debit: 'debit', credit: 'credit' } }, { id: 'ledger/daybook', name: 'Day Book', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'entry_number', label: 'Entry' }, { key: 'account_name', label: 'Account' }, { key: 'memo', label: 'Narration' }, { key: 'debit', label: 'Debit', ...money }, { key: 'credit', label: 'Credit', ...money }, ], totalsCols: { debit: 'debit', credit: 'credit' } }, { id: 'ar-aging', name: 'AR Aging', asOf: true, cols: [ { key: 'customer_name', label: 'Customer' }, { key: 'current', label: '0–30', ...money }, { key: 'd31_60', label: '31–60', ...money }, { key: 'd61_90', label: '61–90', ...money }, { key: 'd90_plus', label: '90+', ...money }, { key: 'total', label: 'Total', ...money }, ], totalsCols: { current: 'current', d31_60: 'd31_60', d61_90: 'd61_90', d90_plus: 'd90_plus', total: 'total' } }, { id: 'ap-aging', name: 'AP Aging', asOf: true, cols: [ { key: 'supplier_name', label: 'Supplier' }, { key: 'current', label: '0–30', ...money }, { key: 'd31_60', label: '31–60', ...money }, { key: 'd61_90', label: '61–90', ...money }, { key: 'd90_plus', label: '90+', ...money }, { key: 'total', label: 'Total', ...money }, ], totalsCols: { current: 'current', d31_60: 'd31_60', d61_90: 'd61_90', d90_plus: 'd90_plus', total: 'total' } }, ], Sales: [ { id: 'sales/register', name: 'Sales Register', status: 'invoice', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'invoice_number', label: 'Invoice' }, { key: 'customer_name', label: 'Customer' }, { key: 'device', label: 'Item' }, { key: 'rep', label: 'Rep' }, { key: 'amount', label: 'Amount', ...money }, { key: 'received', label: 'Received', ...money }, { key: 'balance', label: 'Balance', ...money }, { key: 'status', label: 'Status' }, ], totalsCols: { amount: 'amount', received: 'received', balance: 'balance' } }, { id: 'sales/by-customer', name: 'Sales by Customer', cols: [ { key: 'label', label: 'Customer' }, { key: 'invoices', label: 'Invoices', ...numc }, { key: 'amount', label: 'Amount', ...money }, { key: 'received', label: 'Received', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { invoices: 'invoices', amount: 'amount', received: 'received', balance: 'balance' } }, { id: 'sales/by-salesperson', name: 'Sales by Salesperson', cols: [ { key: 'label', label: 'Salesperson' }, { key: 'invoices', label: 'Deals', ...numc }, { key: 'amount', label: 'Amount', ...money }, { key: 'received', label: 'Received', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { invoices: 'invoices', amount: 'amount', received: 'received', balance: 'balance' } }, { id: 'sales/by-product', name: 'Sales by Product', cols: [ { key: 'label', label: 'Product' }, { key: 'qty', label: 'Qty', ...numc }, { key: 'orders', label: 'Orders', ...numc }, { key: 'value', label: 'Value', ...money }, ], totalsCols: { qty: 'qty', value: 'value' } }, { id: 'sales/by-category', name: 'Sales by Category', cols: [ { key: 'label', label: 'Category' }, { key: 'qty', label: 'Qty', ...numc }, { key: 'orders', label: 'Orders', ...numc }, { key: 'value', label: 'Value', ...money }, ], totalsCols: { qty: 'qty', value: 'value' } }, { id: 'sales/returns', name: 'Sales Returns', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'return_number', label: 'Return #' }, { key: 'customer_name', label: 'Customer' }, { key: 'reason', label: 'Reason' }, { key: 'amount', label: 'Amount', ...money }, ], totalsCols: { amount: 'amount' } }, ], Inventory: [ { id: 'inventory/stock', name: 'Stock + Valuation', category: true, cols: [ { key: 'sku', label: 'SKU' }, { key: 'name', label: 'Item' }, { key: 'category', label: 'Category' }, { key: 'stock', label: 'Qty', ...numc }, { key: 'cost_price', label: 'Cost', ...money }, { key: 'cost_value', label: 'Cost Value', ...money }, { key: 'retail_value', label: 'Retail Value', ...money }, ], totalsCols: { cost_value: 'cost_value', retail_value: 'retail_value' } }, { id: 'inventory/movement', name: 'Stock Movement', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'move_number', label: 'Move #' }, { key: 'item', label: 'Item' }, { key: 'type', label: 'Type' }, { key: 'qty', label: 'Qty', ...numc }, { key: 'from_loc', label: 'From' }, { key: 'to_loc', label: 'To' }, { key: 'status', label: 'Status' }, ] }, { id: 'inventory/aging', name: 'Stock Aging', category: true, cols: [ { key: 'sku', label: 'SKU' }, { key: 'name', label: 'Item' }, { key: 'stock', label: 'Qty', ...numc }, { key: 'cost_value', label: 'Cost Value', ...money }, { key: 'last_movement', label: 'Last Move', type: 'date' }, { key: 'idle_days', label: 'Idle Days', ...numc }, { key: 'bucket', label: 'Bucket' }, ], totalsCols: { cost_value: 'cost_value' } }, { id: 'purchases/register', name: 'Purchase Register', status: 'purchase', cols: [ { key: 'date', label: 'Date', type: 'date' }, { key: 'purchase_number', label: 'Purchase #' }, { key: 'supplier_name', label: 'Supplier' }, { key: 'amount', label: 'Amount', ...money }, { key: 'paid', label: 'Paid', ...money }, { key: 'balance', label: 'Balance', ...money }, { key: 'status', label: 'Status' }, ], totalsCols: { amount: 'amount', paid: 'paid', balance: 'balance' } }, ], Customers: [ { id: 'customers/master', name: 'Customer Master', cols: [ { key: 'name', label: 'Name' }, { key: 'phone', label: 'Phone' }, { key: 'city', label: 'City' }, { key: 'type', label: 'Type' }, { key: 'outstanding', label: 'Outstanding', ...money }, { key: 'status', label: 'Status' }, ], totalsCols: { outstanding: 'outstanding' } }, { id: 'customers/top', name: 'Top Customers', cols: [ { key: 'customer_name', label: 'Customer' }, { key: 'invoices', label: 'Invoices', ...numc }, { key: 'amount', label: 'Billed', ...money }, { key: 'received', label: 'Received', ...money }, { key: 'balance', label: 'Balance', ...money }, ], totalsCols: { amount: 'amount' } }, { id: 'customers/inactive', name: 'Inactive Customers', days: true, cols: [ { key: 'name', label: 'Customer' }, { key: 'phone', label: 'Phone' }, { key: 'city', label: 'City' }, { key: 'last_activity', label: 'Last Activity', type: 'date' }, { key: 'idle_days', label: 'Idle Days', ...numc }, { key: 'outstanding', label: 'Outstanding', ...money }, ], totalsCols: { outstanding: 'outstanding' } }, ], }; const PRESETS = [ ['this_month', 'This Month'], ['today', 'Today'], ['this_week', 'This Week'], ['last_month', 'Last Month'], ['this_quarter', 'Quarter'], ['this_year', 'FY Year'], ['last_year', 'Last FY'], ['custom', 'Custom'], ['', 'All Time'], ]; function fmtCell(v, col, PKR) { if (v === null || v === undefined || v === '') return col.type === 'currency' || col.type === 'number' ? '—' : ''; if (col.type === 'currency') return PKR(v); if (col.type === 'number') return Number(v).toLocaleString('en-PK'); return String(v); } /* ── Main component ─────────────────────────────────────────────── */ function DeepReports({ branch = 'All' }) { const { PKR } = window.DATA; const [group, setGroup] = useState('Ledgers'); const [repId, setRepId] = useState('ledger/general'); const report = useMemo(() => Object.values(DEEP_REPORTS).flat().find(r => r.id === repId), [repId]); const [preset, setPreset] = useState('this_month'); const [from, setFrom] = useState(''); const [to, setTo] = useState(''); const [filters, setFilters] = useState({}); // customer_id, supplier_id, status[], min, max, q, account, category, days, as_of, sort_by, sort_dir const [page, setPage] = useState(1); const [limit] = useState(50); const [resp, setResp] = useState(null); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [meta, setMeta] = useState({ reps: [], categories: [], accounts: [], suppliers: [], invoice_statuses: [], purchase_statuses: [] }); const tableRef = useRef(null); const { data: customers } = useCustomers(branch !== 'All' ? { branch_id: branch } : {}); // Load filter options once (branch-aware) useEffect(() => { api.getDeepMeta(branch !== 'All' ? { branch_id: branch } : {}).then(setMeta).catch(() => {}); }, [branch]); // Reset page when the report or key filters change useEffect(() => { setPage(1); }, [repId, preset, from, to, JSON.stringify(filters)]); const buildQuery = (forExport) => { const q = { ...filters }; if (preset === 'custom') { if (from) q.from = from; if (to) q.to = to; } else if (preset) q.preset = preset; if (branch !== 'All') q.branch_id = branch; if (Array.isArray(q.status)) q.status = q.status.join(','); if (forExport) q.limit = 'all'; else { q.page = page; q.limit = limit; } return q; }; const missingReq = report.requires && !filters[report.requires]; // Fetch on any change useEffect(() => { if (missingReq) { setResp(null); return; } let cancel = false; setLoading(true); setError(null); api.deepReport(report.id, buildQuery(false)) .then(d => { if (!cancel) setResp(d); }) .catch(e => { if (!cancel) setError(e.message || 'Failed to load'); }) .finally(() => { if (!cancel) setLoading(false); }); return () => { cancel = true; }; }, [repId, page, preset, from, to, JSON.stringify(filters), branch]); const rows = resp ? resp.rows : []; const totals = resp ? resp.totals : {}; const pages = resp ? resp.pages : 1; const patch = (k, v) => setFilters(f => ({ ...f, [k]: v })); const clearFilters = () => { setFilters({}); setPreset('this_month'); setFrom(''); setTo(''); }; // ── Exports ────────────────────────────────────────────────── const activeFilterList = () => { const out = {}; out.Report = report.name; out.Period = preset === 'custom' ? `${from || '…'} → ${to || '…'}` : (PRESETS.find(p => p[0] === preset) || [,'All Time'])[1]; if (branch !== 'All') out.Branch = branch; Object.entries(filters).forEach(([k, v]) => { if (v !== '' && v != null && !(Array.isArray(v) && !v.length)) out[k] = Array.isArray(v) ? v.join(', ') : v; }); return out; }; const doExport = async (kind) => { try { let exportRows = rows; // Pull the full filtered set for file exports (respect filters, ignore paging) if (kind !== 'print' && pages > 1) { const full = await api.deepReport(report.id, buildQuery(true)); exportRows = full.rows; } const totalsRow = report.totalsCols ? Object.fromEntries(Object.entries(report.totalsCols).map(([col, tk]) => [col, totals[tk]])) : null; const payload = { rows: exportRows, columns: report.cols, totals: totalsRow, reportName: report.name.replace(/[\/\s]+/g, '-'), from: exportPeriod().from, to: exportPeriod().to, filters: activeFilterList(), }; if (kind === 'xlsx') window.ExportKit.toXLSX(payload); else if (kind === 'csv') window.ExportKit.toCSV(payload); else window.ExportKit.printNode(tableRef.current, payload.reportName, payload.from, payload.to); window.toast && window.toast(`${report.name} exported`, 'ok'); } catch (e) { window.toast && window.toast('Export failed: ' + e.message, 'error'); } }; const exportPeriod = () => (preset === 'custom' ? { from, to } : { from: preset || 'All', to: '' }); // ── Sort handler ───────────────────────────────────────────── const onSort = (col) => { if (col.type === 'currency' || col.type === 'number' || ['date','name','customer_name','supplier_name'].includes(col.key)) { const key = col.sortKey || col.key; setFilters(f => ({ ...f, sort_by: key, sort_dir: f.sort_by === key && f.sort_dir === 'desc' ? 'asc' : 'desc' })); } }; const [showEntry, setShowEntry] = useState(null); // 'supplier' | 'purchase' | 'return' return (
{/* Report picker */}
{Object.keys(DEEP_REPORTS).map(g => ( ))}
} onClick={() => setShowEntry('menu')}>New Entry
{/* Report list */}
{group.toUpperCase()}
{DEEP_REPORTS[group].map(r => ( ))}
{/* Filter bar */} {/* Export bar */}
{resp ? `${resp.count.toLocaleString()} record${resp.count === 1 ? '' : 's'}` : '—'}{loading ? ' · loading…' : ''}
} onClick={() => doExport('csv')} disabled={!rows.length}>CSV } onClick={() => doExport('xlsx')} disabled={!rows.length}>Excel } onClick={() => doExport('print')} disabled={!rows.length}>Print / PDF
{/* Results */} {missingReq ? (
Select a {report.requires === 'customer_id' ? 'customer' : 'supplier'} above to run this statement.
) : error ? (
{error}
) : ( )} {/* Pagination */} {pages > 1 && (
setPage(p => Math.max(1, p - 1))} disabled={page <= 1}>Prev Page {page} / {pages} setPage(p => Math.min(pages, p + 1))} disabled={page >= pages}>Next
)}
{showEntry === 'menu' && setShowEntry(null)} />} {showEntry === 'supplier' && setShowEntry(null)} onSaved={() => { setShowEntry(null); api.getDeepMeta({}).then(setMeta); }} />} {showEntry === 'purchase' && setShowEntry(null)} onSaved={() => { setShowEntry(null); setRepId('purchases/register'); setGroup('Inventory'); }} />} {showEntry === 'return' && setShowEntry(null)} onSaved={() => { setShowEntry(null); setGroup('Sales'); setRepId('sales/returns'); }} />}
); } function metaLine(report, preset, from, to, branch) { const period = preset === 'custom' ? `${from || '…'} → ${to || '…'}` : (PRESETS.find(p => p[0] === preset) || [, 'All Time'])[1]; return `${period}${branch !== 'All' ? ' · branch-scoped' : ' · all branches'}`; } /* ── Filter bar ─────────────────────────────────────────────────── */ function FilterBar({ report, preset, setPreset, from, to, setFrom, setTo, filters, patch, clearFilters, meta, customers, PKR }) { const statusOpts = report.status === 'purchase' ? meta.purchase_statuses : report.status === 'invoice' ? meta.invoice_statuses : null; return (
{/* Date presets */} {!report.flat && (
{PRESETS.map(([v, l]) => ( ))} {preset === 'custom' && ( setFrom(e.target.value)} style={{ width: 150 }} /> → setTo(e.target.value)} style={{ width: 150 }} /> )}
)}
{report.requires === 'customer_id' || report.id === 'sales/by-customer' ? ( ) : null} {report.requires === 'supplier_id' && ( )} {report.account && ( )} {report.id === 'ledger/general' && ( )} {report.id === 'sales/by-salesperson' && ( )} {report.category && ( )} {statusOpts && ( )} {report.asOf && ( patch('as_of', e.target.value)} style={{ width: 150 }} /> )} {report.days && ( patch('days', e.target.value)} style={{ width: 110 }} /> )} {/* Amount range — reports with a money total */} {report.totalsCols && ( patch('min', e.target.value)} style={{ width: 96 }} /> patch('max', e.target.value)} style={{ width: 96 }} /> )} patch('q', e.target.value)} style={{ minWidth: 160 }} /> Reset
); } function Fld({ label, req, children }) { return ( ); } /* ── Results table (also the print/PDF surface) ─────────────────── */ function ReportTable({ innerRef, report, rows, totals, loading, PKR, onSort, sortBy, sortDir, meta }) { const { data: companies } = useCompanies(); const co = (companies && companies[0]) || { name: 'Electromed Corporation', addr: '', ntn: '' }; const cols = report.cols; const totalsRow = report.totalsCols; return (
{/* Print-only letterhead + applied filters */}
{co.name}
{co.addr} {co.ntn ? '· NTN ' + co.ntn : ''}
{report.name}
{meta}
{cols.map(c => { const sortable = c.type === 'currency' || c.type === 'number' || ['date', 'name', 'customer_name', 'supplier_name'].includes(c.key); const active = sortBy === (c.sortKey || c.key); return ( ); })} {loading && !rows.length ? ( ) : !rows.length ? ( ) : rows.map((r, ix) => ( {cols.map(c => ( ))} ))} {totalsRow && rows.length > 0 && ( {cols.map((c, i) => { const tk = totalsRow[c.key]; return ( ); })} )}
onSort(c)} style={{ textAlign: c.align || 'left', cursor: sortable ? 'pointer' : 'default', whiteSpace: 'nowrap' }}> {c.label}{active ? (sortDir === 'asc' ? ' ▲' : ' ▼') : ''}
Loading…
No records match these filters.
{fmtCell(r[c.key], c, PKR)}
{i === 0 ? 'TOTAL' : tk !== undefined ? fmtCell(totals[tk], c, PKR) : ''}
); } /* ── Entry modals: supplier / purchase / sales return ───────────── */ function EntryMenu({ onPick, onClose }) { return (
{[['supplier', 'Supplier', 'Add a vendor for purchases & payables'], ['purchase', 'Purchase (Stock In)', 'Record goods received — updates stock & AP'], ['return', 'Sales Return', 'Credit note against an invoice']].map(([k, t, d]) => ( ))}
); } function SupplierModal({ branch, onClose, onSaved }) { const [f, setF] = useState({ name: '', phone: '', city: '', email: '', ntn: '', opening_balance: '' }); const [busy, setBusy] = useState(false); const set = (k) => (e) => setF(s => ({ ...s, [k]: e.target.value })); const save = async () => { if (!f.name.trim()) return window.toast('Supplier name is required', 'warn'); setBusy(true); try { await api.createSupplier({ ...f, opening_balance: Number(f.opening_balance) || 0, branch_id: branch !== 'All' ? branch : undefined }); window.toast('Supplier added', 'ok'); onSaved(); } catch (e) { window.toast(e.message, 'error'); } finally { setBusy(false); } }; return ( Cancel{busy ? 'Saving…' : 'Save Supplier'}}>
); } function PurchaseModal({ branch, meta, onClose, onSaved }) { const [supplierId, setSupplierId] = useState(''); const [gst, setGst] = useState(false); const [items, setItems] = useState([{ name: '', sku: '', qty: 1, rate: 0 }]); const [busy, setBusy] = useState(false); const setItem = (i, k) => (e) => setItems(a => a.map((it, ix) => ix === i ? { ...it, [k]: e.target.value } : it)); const sub = items.reduce((s, it) => s + (Number(it.qty) || 0) * (Number(it.rate) || 0), 0); const tax = gst ? Math.round(sub * 0.17) : 0; const save = async () => { if (!supplierId) return window.toast('Select a supplier', 'warn'); if (sub <= 0) return window.toast('Add at least one line item with a rate', 'warn'); setBusy(true); try { await api.createPurchase({ supplier_id: supplierId, gst: gst ? 1 : 0, amount: sub + tax, tax_amount: tax, items: items.filter(it => it.name || it.sku).map(it => ({ name: it.name, sku: it.sku, qty: Number(it.qty) || 0, rate: Number(it.rate) || 0 })), branch_id: branch !== 'All' ? branch : undefined, }); window.toast('Purchase recorded — stock updated', 'ok'); onSaved(); } catch (e) { window.toast(e.message, 'error'); } finally { setBusy(false); } }; return ( Cancel{busy ? 'Saving…' : 'Record Purchase'}}> {!meta.suppliers.length &&
No suppliers yet — add one first via New Entry → Supplier.
}
LINE ITEMS (matched to inventory by SKU or name)
{items.map((it, i) => (
{items.length > 1 && }
))} } onClick={() => setItems(a => [...a, { name: '', sku: '', qty: 1, rate: 0 }])}>Add line
Total: Rs {(sub + tax).toLocaleString('en-PK')}
 ); } function ReturnModal({ branch, customers, onClose, onSaved }) { const [invoiceId, setInvoiceId] = useState(''); const [custId, setCustId] = useState(''); const [amount, setAmount] = useState(''); const [reason, setReason] = useState(''); const [restock, setRestock] = useState(false); const [busy, setBusy] = useState(false); const { data: invoices } = useInvoices(branch !== 'All' ? { branch_id: branch } : {}); const save = async () => { if (!Number(amount)) return window.toast('Enter a return amount', 'warn'); if (!invoiceId && !custId) return window.toast('Pick an invoice or customer', 'warn'); setBusy(true); try { await api.createSalesReturn({ invoice_id: invoiceId || undefined, customer_id: custId || undefined, amount: Number(amount), reason, restock, branch_id: branch !== 'All' ? branch : undefined }); window.toast('Sales return recorded', 'ok'); onSaved(); } catch (e) { window.toast(e.message, 'error'); } finally { setBusy(false); } }; return ( Cancel{busy ? 'Saving…' : 'Record Return'}}>
); } window.DeepReports = DeepReports;