58 lines
2.9 KiB
TypeScript
58 lines
2.9 KiB
TypeScript
import { Table } from "react-bootstrap";
|
|
import PizzaOrderRow from "./PizzaOrderRow";
|
|
import { PizzaDayState, PizzaOrder, PizzaVariant, updatePizzaFee } from "../../../types";
|
|
|
|
type Props = {
|
|
state: PizzaDayState,
|
|
orders: PizzaOrder[],
|
|
onDelete: (pizzaOrder: PizzaVariant) => void,
|
|
creator: string,
|
|
}
|
|
|
|
export default function PizzaOrderList({ state, orders, onDelete, creator }: Readonly<Props>) {
|
|
const saveFees = async (customer: string, text?: string, price?: number) => {
|
|
await updatePizzaFee({ body: { login: customer, text, price } });
|
|
}
|
|
|
|
if (!orders?.length) {
|
|
return <p className="mt-4" style={{ color: 'var(--luncher-text-muted)', fontStyle: 'italic' }}>Zatím žádné objednávky...</p>
|
|
}
|
|
|
|
const total = orders.reduce((total, order) => total + order.totalPrice, 0);
|
|
|
|
return (
|
|
<div className="mt-4" style={{
|
|
background: 'var(--luncher-bg-card)',
|
|
borderRadius: 'var(--luncher-radius-lg)',
|
|
overflow: 'hidden',
|
|
border: '1px solid var(--luncher-border-light)',
|
|
boxShadow: 'var(--luncher-shadow)'
|
|
}}>
|
|
<Table className="mb-0" style={{ color: 'var(--luncher-text)' }}>
|
|
<thead style={{ background: 'var(--luncher-primary-light)' }}>
|
|
<tr>
|
|
<th style={{ padding: '16px 20px', color: 'var(--luncher-primary)', fontWeight: 600, border: 'none' }}>Jméno</th>
|
|
<th style={{ padding: '16px 20px', color: 'var(--luncher-primary)', fontWeight: 600, border: 'none' }}>Objednávka</th>
|
|
<th style={{ padding: '16px 20px', color: 'var(--luncher-primary)', fontWeight: 600, border: 'none' }}>Poznámka</th>
|
|
<th style={{ padding: '16px 20px', color: 'var(--luncher-primary)', fontWeight: 600, border: 'none' }}>Příplatek</th>
|
|
<th style={{ padding: '16px 20px', color: 'var(--luncher-primary)', fontWeight: 600, border: 'none', textAlign: 'right' }}>Cena</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{orders.map(order => <tr key={order.customer} style={{ borderColor: 'var(--luncher-border-light)' }}>
|
|
<PizzaOrderRow creator={creator} state={state} order={order} onDelete={onDelete} onFeeModalSave={saveFees} />
|
|
</tr>)}
|
|
<tr style={{
|
|
fontWeight: 700,
|
|
background: 'var(--luncher-bg-hover)',
|
|
borderTop: '2px solid var(--luncher-border)'
|
|
}}>
|
|
<td colSpan={4} style={{ padding: '16px 20px', border: 'none' }}>Celkem</td>
|
|
<td style={{ padding: '16px 20px', border: 'none', textAlign: 'right', color: 'var(--luncher-primary)' }}>{`${total} Kč`}</td>
|
|
</tr>
|
|
</tbody>
|
|
</Table>
|
|
</div>
|
|
);
|
|
}
|