/* global React, PORTAL */ const { useState, useEffect } = React; const STATUS_META = { sent: { label: 'Awaiting your response', color: '#60a5fa', bg: 'rgba(37,99,235,0.10)' }, accepted: { label: 'Accepted', color: 'var(--ok)', bg: 'rgba(5,150,105,0.10)' }, rejected: { label: 'Rejected', color: 'var(--danger)', bg: 'rgba(220,38,38,0.08)' }, expired: { label: 'Expired', color: 'var(--fg-subtle)', bg: 'var(--night-elev-1)' }, }; function fmtEur(v) { return `€ ${Number(v||0).toLocaleString('nl-NL',{minimumFractionDigits:2,maximumFractionDigits:2})}`; } function fmtDate(d) { return d ? new Date(d).toLocaleString('nl-NL',{day:'2-digit',month:'long',year:'numeric',hour:'2-digit',minute:'2-digit'}) : '—'; } function StatusBadge({ status }) { const m = STATUS_META[status] || STATUS_META.expired; return {m.label}; } function printProposal(p, session) { const lines = typeof p.lines === 'string' ? JSON.parse(p.lines) : (p.lines || []); const subtotal = lines.reduce((s,l) => s + (Number(l.subtotal)||0), 0); const vat_amount = subtotal * 0.21; const total = subtotal + vat_amount; const fmtN = v => Number(v||0).toLocaleString('nl-NL',{minimumFractionDigits:2,maximumFractionDigits:2}); const linesHtml = lines.map(l => ` ${l.description} ${l.quantity} € ${fmtN(l.unit_price)} € ${fmtN(l.subtotal)} `).join(''); const accBlock = p.status === 'accepted' ? `
✓ Digitaal geaccepteerd
Door: ${session?.contact||'—'}
Namens: ${session?.company||'—'}
Op: ${fmtDate(p.accepted_at)}
Rechtsgeldig onder Nederlands recht (eIDAS Art. 25)
` : ''; const w = window.open('', '_blank'); w.document.write(` Offerte ${p.proposal_number} — Lake-Project
Lake Project · KvK 29816688 · BTW NL001170142B85 · Rotterdam

Offerte ${p.proposal_number}

${p.proposal_number}
Aangemaakt: ${p.created_at?.slice(0,10)||''}
${p.valid_until?`
Geldig tot: ${p.valid_until}
`:''}

${p.title}

${p.intro?`

${p.intro}

`:''} ${linesHtml}
OmschrijvingAantalPrijsBedrag
Subtotaal: € ${fmtN(subtotal)}
BTW 21%: € ${fmtN(vat_amount)}
Totaal: € ${fmtN(total)}
${p.notes?`

${p.notes}

`:''} ${accBlock}
Lake-Project · KvK 29816688 · BTW NL001170142B85 · hello@lake-project.com · lake-project.com/algemene-voorwaarden
`); w.document.close(); } function ProposalCard({ p, session, onAccept, busy }) { const [expanded, setExpanded] = useState(false); const [confirmed, setConfirmed] = useState(false); const now = new Date().toISOString().slice(0,10); const status = (p.status === 'sent' && p.valid_until && p.valid_until < now) ? 'expired' : p.status; const lines = typeof p.lines === 'string' ? JSON.parse(p.lines||'[]') : (p.lines||[]); return (
setExpanded(e => !e)}>
{p.proposal_number}
{p.title}
{fmtEur(p.total)} {p.valid_until ? `· geldig tot ${p.valid_until}` : ''}
{expanded ? '▾' : '▸'}
{expanded && (
{p.intro &&

{p.intro}

} {/* Line items */}
{['Description','Qty','Unit price','Amount'].map(h => ( {h} ))}
{lines.map((l, i) => (
{l.description} {l.quantity} {fmtEur(l.unit_price)} {fmtEur(l.subtotal)}
))}
Subtotaal {fmtEur(p.subtotal)} BTW 21% {fmtEur(p.vat_amount)} {fmtEur(p.total)}
{/* Accepted state */} {status === 'accepted' && (
✓ Accepted
{fmtDate(p.accepted_at)}
)} {/* Accept flow */} {status === 'sent' && (
{!confirmed ? ( ) : (
By accepting, you confirm that {session?.company} agrees to this proposal and the attached Algemene Voorwaarden. Your acceptance is recorded with a timestamp.
)}
)}
)}
); } function Proposals() { const [proposals, setProposals] = useState(undefined); const [session, setSession] = useState({ company: '', contact: '' }); const [busy, setBusy] = useState(false); const [error, setError] = useState(''); useEffect(() => { PORTAL.get('/proposals').then(setProposals).catch(() => setProposals([])); Promise.all([ PORTAL.get('/company').catch(() => ({})), PORTAL.get('/profile').catch(() => ({})), ]).then(([co, ct]) => setSession({ company: co?.name||'', contact: ct?.name||'' })); }, []); async function handleAccept(id) { setBusy(true); setError(''); try { const updated = await PORTAL.post(`/proposals/${id}/accept`, {}); setProposals(prev => prev.map(p => p.id === id ? { ...p, ...updated } : p)); } catch(ex) { setError(ex?.error || 'Something went wrong. Please try again.'); } finally { setBusy(false); } } if (proposals === undefined) { return
Loading…
; } const now = new Date().toISOString().slice(0,10); const pending = proposals.filter(p => p.status === 'sent' && !(p.valid_until && p.valid_until < now)); const others = proposals.filter(p => !(p.status === 'sent' && !(p.valid_until && p.valid_until < now))); return (

Proposals

Offertes from Lake-Project
{error && (
{error}
)} {proposals.length === 0 ? (
No proposals yet
When Lake-Project sends you a proposal, it will appear here for your review and acceptance.
) : (
{pending.length > 0 && (
Awaiting response
{pending.map(p => )}
)} {others.length > 0 && (
History
{others.map(p => )}
)}
)}
Questions? hello@lake-project.com
); } window.Proposals = Proposals;