133 lines
4.4 KiB
TypeScript
133 lines
4.4 KiB
TypeScript
import type { ActionFunctionArgs } from "@remix-run/node";
|
|
import { LoaderFunctionArgs, json, redirect } from "@remix-run/node";
|
|
import { useLoaderData, useSearchParams } from "@remix-run/react";
|
|
import { Button, Container, Form, InputGroup, Row } from "react-bootstrap";
|
|
|
|
import { ContainerType } from "@prisma/client";
|
|
import { enhance } from "~/utils/db.server";
|
|
|
|
export const action = async ({
|
|
request,
|
|
}: ActionFunctionArgs) => {
|
|
const { dbe } = await enhance(request);
|
|
|
|
const form = await request.formData();
|
|
const drink = Number(form.get("drink"));
|
|
const section = Number(form.get("section"));
|
|
|
|
const type = form.get("type") as ContainerType;
|
|
const volume = Number(form.get("volume"));
|
|
const portions = Number(form.get("portions"));
|
|
const price = Number(form.get("price"));
|
|
const inventory = Number(form.get("inventory"));
|
|
|
|
try{
|
|
const createdContainer = await dbe.container.create({ data: {
|
|
type: type,
|
|
volume: volume,
|
|
portions: portions,
|
|
price: price,
|
|
inventory: inventory,
|
|
lastAdded: inventory > 0 ? new Date() : null,
|
|
drink: {connect: {id: drink}},
|
|
section: {connect: {id: section}}
|
|
}, select: {drink: {select: {slug: true, type: true}}}
|
|
});
|
|
return redirect("/inventory/" + createdContainer.drink.type.toLowerCase() + "/" + createdContainer.drink.slug);
|
|
}
|
|
catch(e){
|
|
|
|
}
|
|
|
|
return null;
|
|
};
|
|
|
|
export const loader = async ({
|
|
request,
|
|
} : LoaderFunctionArgs) => {
|
|
const { dbe } = await enhance(request);
|
|
|
|
const drinks = await dbe.drink.findMany({orderBy: {name: "asc"}});
|
|
const sections = await dbe.section.findMany({orderBy: {name: "asc"}});
|
|
return json({drinks, sections});
|
|
}
|
|
|
|
export default function NewContainerRoute() {
|
|
var loaderData = useLoaderData<typeof loader>();
|
|
var [searchParams] = useSearchParams();
|
|
|
|
return (
|
|
<Container>
|
|
<Row>
|
|
<h1>Add Container</h1>
|
|
<Form method="POST">
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Drink</Form.Label>
|
|
<Form.Select name="drink" required>
|
|
{loaderData.drinks.map((drink) => (
|
|
<option value={drink.id} selected={("" + drink.id)==searchParams.get("drink") }>
|
|
{drink.name}
|
|
</option>
|
|
))}
|
|
</Form.Select>
|
|
</Form.Group>
|
|
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Section</Form.Label>
|
|
<Form.Select name="section" required>
|
|
{loaderData.sections.map((section) => (
|
|
<option value={section.id}>
|
|
{section.name}
|
|
</option>
|
|
))}
|
|
</Form.Select>
|
|
</Form.Group>
|
|
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Container type</Form.Label>
|
|
<Form.Select name="type" required>
|
|
<option value={"BeerBottle"}>Beer bottle</option>
|
|
<option value={"Can"}>Can</option>
|
|
<option value={"Carton"}>Carton</option>
|
|
<option value={"PlasticBottle"}>Plastic Bottle</option>
|
|
<option value={"WineBottle"}>Wine bottle</option>
|
|
<option value={"Keg"}>Keg</option>
|
|
</Form.Select>
|
|
</Form.Group>
|
|
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Volume</Form.Label>
|
|
|
|
<InputGroup>
|
|
<Form.Control type="number" min={0} max={2500} step={1} name="volume" defaultValue={330} required/>
|
|
<InputGroup.Text>ml</InputGroup.Text>
|
|
</InputGroup>
|
|
</Form.Group>
|
|
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Portions</Form.Label>
|
|
<Form.Control type="number" min={1} max={10} step={1} defaultValue={1} name="portions" required/>
|
|
</Form.Group>
|
|
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Price</Form.Label>
|
|
|
|
<InputGroup>
|
|
<InputGroup.Text>€</InputGroup.Text>
|
|
<Form.Control type="number" min={0} max={25} step={0.01} name="price" defaultValue={1} required/>
|
|
</InputGroup>
|
|
</Form.Group>
|
|
|
|
<Form.Group className="mb-3">
|
|
<Form.Label>Inventory</Form.Label>
|
|
<Form.Control type="number" min={0} step={1} defaultValue={1} name="inventory" required/>
|
|
</Form.Group>
|
|
|
|
<Button variant="primary" type="submit">
|
|
Submit
|
|
</Button>
|
|
</Form>
|
|
</Row>
|
|
</Container>
|
|
);
|
|
} |