changes

barkmanui/src/features/jobs/AddJob.tsx

@@ -1,4 +1,5 @@
-import {Button, Group, TextInput, Container, Title, Flex} from '@mantine/core';
+import {Button, Group, TextInput, NumberInput, Container, Title, Flex} from '@mantine/core';
+import { DateTimePicker } from '@mantine/dates';
 import {useForm} from '@mantine/form';
 import {useMutation} from "@tanstack/react-query";
 import {NewJob} from "./types.ts";
@@ -12,25 +13,27 @@ function AddJob() {
 
     const navigate = useNavigate();
 
-    const customerQuery = useCustomerList();
+    const customerQuery = useJobList();
 
     const newJobForm = useForm<NewJob>({
         mode: 'uncontrolled',
         initialValues: {
+            customerId: 0,
             name: "",
-            company: "",
-            email: "",
-            phone: "",
+            startDate: new Date(),
+            endDate: new Date(),
             address: "",
+            venue: "",
+            notes: "",
         },
 
         validate: {},
     });
 
-    const updateCustomer = useMutation({
-        mutationFn: async (values: newJob) => {
+    const updateJob = useMutation({
+        mutationFn: async (values: NewJob) => {
 
-            const result = await fetch(import.meta.env.VITE_API_URL + '/customers', {
+            const result = await fetch(import.meta.env.VITE_API_URL + '/jobs', {
                 method: 'POST',
                 body: JSON.stringify(values),
                 headers: {
@@ -43,10 +46,10 @@ function AddJob() {
                     icon: <IconCheck size={20}/>,
                     color: "teal",
                     title: "All good!",
-                    message: "Customer Created",
+                    message: "Job Created",
                     position: 'top-center',
                 });
-                navigate("/customers");
+                navigate("/jobs");
 
             }
 
@@ -58,7 +61,7 @@ function AddJob() {
                     message: "Something went wrong",
                     position: 'top-center',
                 });
-                throw new Error('Failed to create customer');
+                throw new Error('Failed to create job');
             }
 
         },
@@ -74,8 +77,8 @@ function AddJob() {
 
     return (
         <>
-            <form onSubmit={newCustomerForm.onSubmit(async (values) => await
-                updateCustomer.mutateAsync(values))}>
+            <form onSubmit={newJobForm.onSubmit(async (values) => await
+                updateJob.mutateAsync(values))}>
                 <Container m="lg">
                     <Flex mih={50}
                           gap="md"
@@ -85,16 +88,20 @@ function AddJob() {
                           wrap="wrap">
 
                         <Title order={1}>Add Item</Title>
-                        <TextInput withAsterisk key={newCustomerForm.key('name')} size="md" label="Name"
-                                   placeholder="Name" {...newCustomerForm.getInputProps('name')}/>
-                        <TextInput size="md" key={newCustomerForm.key('company')} label="Company"
-                                   placeholder="Company"{...newCustomerForm.getInputProps('company')}/>
-                        <TextInput withAsterisk size="md" key={newCustomerForm.key('email')} label="Email"
-                                     placeholder="Email" {...newCustomerForm.getInputProps('email')}/>
-                        <TextInput size="md" key={newCustomerForm.key('phone')} label="Phone"
-                                     placeholder="Phone" {...newCustomerForm.getInputProps('phone')}/>
-                        <TextInput size="md" key={newCustomerForm.key('address')} label="Address"
-                                     placeholder="Address" {...newCustomerForm.getInputProps('address')}/>
+                        <NumberInput withAsterisk key={newJobForm.key('customerId')} size="md" label="Customer ID"
+                                     placeholder="Customer ID" {...newJobForm.getInputProps('customerId')}/>
+                        <TextInput withAsterisk key={newJobForm.key('name')} size="md" label="Name"
+                                   placeholder="Name" {...newJobForm.getInputProps('name')}/>
+                        <DateTimePicker withAsterisk key={newJobForm.key('startDate')} size="md" label="Start Date"
+                                   placeholder="Start Date" {...newJobForm.getInputProps('startDate')}/>
+                        <DateTimePicker withAsterisk key={newJobForm.key('endDate')} size="md" label="End Date"
+                                        placeholder="End Date" {...newJobForm.getInputProps('endDate')}/>
+                        <TextInput size="md" key={newJobForm.key('address')} label="Address"
+                                   placeholder="Address" {...newJobForm.getInputProps('address')}/>
+                        <TextInput size="md" key={newJobForm.key('venue')} label="Venue"
+                                   placeholder="Venue"{...newJobForm.getInputProps('venue')}/>
+                        <TextInput size="md" key={newJobForm.key('notes')} label="Notes"
+                                     placeholder="Notes" {...newJobForm.getInputProps('notes')}/>
 
                         <Group justify="flex-end" mt="md">
                             <Button type="submit">Submit</Button>
@@ -106,4 +113,4 @@ function AddJob() {
     );
 }
 
-export default AddCustomer;
+export default AddJob;

barkmanui/src/features/jobs/types.ts

@@ -7,8 +7,8 @@ export interface Job {
     startDate: Date;
     endDate: Date;
     totalPrice: string,
-    venue: number,
-    address: number,
+    venue: string,
+    address: string,
     notes: string,
 }
 
@@ -17,7 +17,7 @@ export interface NewJob {
     name: string,
     startDate: Date;
     endDate: Date;
-    venue: number,
-    address: number,
+    venue: string,
+    address: string,
     notes: string,
 }