45 lines
1.9 KiB
TypeScript
45 lines
1.9 KiB
TypeScript
import { useRef } from "react";
|
|
import { Modal, Button } from "react-bootstrap"
|
|
|
|
type Props = {
|
|
customerName: string,
|
|
isOpen: boolean,
|
|
onClose: () => void,
|
|
onSave: (customer: string, name?: string, price?: number) => void,
|
|
initialValues?: { text?: string, price?: string },
|
|
}
|
|
|
|
/** Modální dialog pro nastavení příplatků za pizzu. */
|
|
export default function PizzaAdditionalFeeModal({ customerName, isOpen, onClose, onSave, initialValues }: Props) {
|
|
const textRef = useRef<HTMLInputElement>(null);
|
|
const priceRef = useRef<HTMLInputElement>(null);
|
|
|
|
const doSubmit = () => {
|
|
onSave(customerName, textRef.current?.value, parseInt(priceRef.current?.value || "0"));
|
|
}
|
|
|
|
const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
|
|
if (e.key === 'Enter') {
|
|
onSave(customerName, textRef.current?.value, parseInt(priceRef.current?.value || "0"));
|
|
}
|
|
}
|
|
|
|
return <Modal show={isOpen} onHide={onClose} size="lg">
|
|
<Modal.Header closeButton>
|
|
<Modal.Title>Příplatky za objednávku pro {customerName}</Modal.Title>
|
|
</Modal.Header>
|
|
<Modal.Body>
|
|
Popis: <input className="mb-3" ref={textRef} type="text" placeholder="např. kuřecí maso" defaultValue={initialValues?.text} onKeyDown={handleKeyDown} /> <br />
|
|
Cena v Kč: <input ref={priceRef} type="number" placeholder="0" defaultValue={initialValues?.price} onKeyDown={handleKeyDown} /> <br />
|
|
<div className="mt-3" style={{ fontSize: 'small' }}>Je možné zadávat i záporné částky (např. v případě slev)</div>
|
|
</Modal.Body>
|
|
<Modal.Footer>
|
|
<Button variant="secondary" onClick={onClose}>
|
|
Storno
|
|
</Button>
|
|
<Button variant="primary" onClick={doSubmit}>
|
|
Uložit
|
|
</Button>
|
|
</Modal.Footer>
|
|
</Modal>
|
|
} |