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/pos/src/ShiftOpen.tsx

42 lines
1.7 KiB
TypeScript

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

import { useState } from 'react'
import { Button, Field } from '@sims/ui'
import { formatINR } from '@sims/domain'
const DENOMS = [50000, 20000, 10000, 5000, 2000, 1000, 500, 200, 100] // paise per note/coin
/** Shift open with denomination count (09-UX §1.5) — the OG Day-Begin ritual's counter-level sibling. */
export function ShiftOpen(props: { userName: string; onOpen: (floatPaise: number) => void; onBack: () => void }) {
const [counts, setCounts] = useState<Record<number, number>>({})
const total = DENOMS.reduce((a, d) => a + d * (counts[d] ?? 0), 0)
return (
<div className="login-wrap">
<div className="login-card" style={{ width: 460 }}>
<h2 style={{ marginTop: 0 }}>Open shift {props.userName}</h2>
<div className="denoms">
{DENOMS.map((d) => (
<Field key={d} label={`${formatINR(d)} ×`}>
<input
className="wf num"
type="number"
min={0}
value={counts[d] ?? ''}
onChange={(e) => setCounts((c) => ({ ...c, [d]: Number(e.target.value) }))}
/>
</Field>
))}
</div>
<div className="payable" style={{ margin: '12px 0' }}>
<span>Opening float</span>
<span className="amount num" style={{ fontSize: 28 }}>{formatINR(total)}</span>
</div>
<div style={{ display: 'flex', gap: 8 }}>
<Button tone="primary" onClick={() => props.onOpen(total)}>Open shift</Button>
<Button onClick={() => props.onOpen(0)}>Skip count</Button>
<Button onClick={props.onBack}>Back</Button>
</div>
</div>
</div>
)
}