You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
sims-hq/apps/backoffice/src/pages/PurchaseInbox.tsx

66 lines
2.8 KiB
TypeScript

import { Badge, Button, DataTable, Notice, PageHeader, Toolbar } from '@sims/ui'
/** The flagship differentiator — side-by-side review of AI-parsed supplier bills (09-UX §3). */
export function PurchaseInbox() {
return (
<div className="wf-page">
<PageHeader
title="Purchase Inbox"
desc="Suppliers email bills to bills@st1.sims.in (or drag a PDF/photo here). AI drafts the purchase; you confirm."
actions={<><Button>Upload bill</Button><Button>Email-in settings</Button></>}
/>
<Toolbar>
<Badge tone="warn">3 to review</Badge>
<Badge tone="ok">38 posted this month</Badge>
<Badge>item-match memory: 1,204 learned</Badge>
</Toolbar>
<div className="inbox-split">
<div>
<h3>Source HUL_Invoice_HD2651.pdf</h3>
<div className="inbox-doc">{`HINDUSTAN UNILEVER DISTRIBUTOR
Invoice HD/2651 · 09-07-2026 · GSTIN 32AABCH1234K1Z6
SURF EXCEL MATIC 1KG x48 @122.00 5,856.00
RIN BAR 250G B12 x144 @10.20 1,468.80
CLINIC+ SHAMPOO 340ML x24 @168.00 4,032.00
Taxable 11,356.80
CGST 9% 1,022.11
SGST 9% 1,022.11
TOTAL 13,401.02`}</div>
</div>
<div>
<h3>Draft purchase review &amp; post</h3>
<DataTable
columns={[
{ key: 'supplier', label: 'Supplier line' },
{ key: 'ours', label: 'Our item' },
{ key: 'qty', label: 'Qty', numeric: true },
{ key: 'cost', label: 'Cost', numeric: true },
{ key: 'conf', label: 'Match' },
]}
rows={[
{ supplier: 'SURF EXCEL MATIC 1KG', ours: 'Surf Excel Matic 1kg (103)', qty: '48', cost: '122.00', conf: <Badge tone="ok">remembered</Badge> },
{ supplier: 'RIN BAR 250G B12', ours: 'Rin Bar 250g (207)', qty: '144', cost: '10.20', conf: <Badge tone="ok">98%</Badge> },
{ supplier: 'CLINIC+ SHAMPOO 340ML', ours: <em>choose item</em>, qty: '24', cost: '168.00', conf: <Badge tone="warn">new mapping</Badge> },
]}
/>
<Notice tone="warn">
Total check: parsed 13,401.02 = draft 13,401.02 · Tax check: CGST+SGST @9% ·
Duplicate check: HD/2651 not seen before
</Notice>
<div style={{ display: 'flex', gap: 8 }}>
<Button tone="primary">Post purchase</Button>
<Button>Save draft</Button>
<Button tone="danger">Reject</Button>
</div>
<Notice>
Confirming the shampoo mapping teaches the matcher next month it posts with one click.
MRP changed on Surf (150 152): label reprint will be queued automatically.
</Notice>
</div>
</div>
</div>
)
}