knee-cola/evidencija-rezija
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bill Edit Form: saving all the fields

Browse Source
This commit is contained in:
Nikola Derežić
2024-01-05 09:38:27 +01:00
parent 0b55fb0f6a
commit 64c7ee4474
2 changed files with 59 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
app/lib/actions.ts
View File

@@ -9,15 +9,17 @@ import { ObjectId } from 'mongodb';
export type State = {
errors?: {
billName?: string[];
billAttachment?: string[],
billNotes?: string[],
};
message?:string | null;
}
const FormSchema = z.object({
_id: z.string(),
billName: z.string({
invalid_type_error: 'Please select a bill name',
}),
billName: z.coerce.string().min(1, "Bill Name is required."),
billAttachment: z.object({ }),
billNotes: z.string(),
});
const UpdateBill = FormSchema.omit({ _id: true });
@@ -26,6 +28,8 @@ export async function updateBill(locationId: string, billId:string, prevState:St
const validatedFields = UpdateBill.safeParse({
billName: formData.get('billName'),
billAttachment: formData.get('billAttachment'),
billNotes: formData.get('billNotes'),
});
// If form validation fails, return errors early. Otherwise, continue...
@@ -39,8 +43,12 @@ export async function updateBill(locationId: string, billId:string, prevState:St
const {
billName,
billAttachment,
billNotes,
} = validatedFields.data;
const billPaid = formData.get('billPaid') === 'on';
// update the bill in the mongodb
const client = await clientPromise;
const db = client.db("rezije");
@@ -53,6 +61,9 @@ export async function updateBill(locationId: string, billId:string, prevState:St
{
$set: {
"bills.$[elem].name": billName,
"bills.$[elem].paid": billPaid,
"bills.$[elem].attachment": billAttachment,
"bills.$[elem].notes": billNotes,
}
}, {
arrayFilters: [
@@ -60,8 +71,6 @@ export async function updateBill(locationId: string, billId:string, prevState:St
]
});
console.log("updateBill.success", post);
// clear the cache for the path
revalidatePath('/');
// go to the bill list

54
app/ui/BillEditForm.tsx
View File

@@ -23,7 +23,17 @@ export const BillEditForm:FC<BillEditFormProps> = ({ invoiceID, bill: { id, name
<div className="card-body">
<form action={ dispatch }>
<TrashIcon className="h-[1em] w-[1em] absolute cursor-pointer text-error bottom-5 right-4 text-2xl" />
<input id="billName" name="billName" type="text" placeholder="Naziv računa" className="input input-bordered w-full" defaultValue={name} />
<input id="billName" name="billName" type="text" placeholder="Bill name" className="input input-bordered w-full" defaultValue={name} />
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.billName &&
state.errors.billName.map((error: string) => (
<p className="mt-2 text-sm text-red-500" key={error}>
{error}
</p>
))}
</div>
{
// <textarea className="textarea textarea-bordered my-1 w-full max-w-sm block" placeholder="Opis" value="Pričuva, Voda, Smeće"></textarea>
// <a href="#document.pdf" className='text-center block max-w-[24em] text-nowrap truncate inline-block'>
@@ -31,15 +41,41 @@ export const BillEditForm:FC<BillEditFormProps> = ({ invoiceID, bill: { id, name
// 2023-22-12 document GSKG račun za 2023.pdf
// </a>
}
<input type="file" className="file-input file-input-bordered w-full max-w-sm file-input-xs my-2" />
<div className="form-control w-32 p-1">
<label className="cursor-pointer label p-0">
<span className="label-text">Plaćeno</span>
<input type="checkbox" className="toggle toggle-success" defaultChecked={paid} />
</label>
<input id="billAttachment" name="billAttachment" type="file" className="file-input file-input-bordered w-full max-w-sm file-input-xs my-2" />
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.billAttachment &&
state.errors.billAttachment.map((error: string) => (
<p className="mt-2 text-sm text-red-500" key={error}>
{error}
</p>
))}
</div>
<textarea className="textarea textarea-bordered my-2 w-full max-w-sm block" placeholder="Napomena"></textarea>
<button type="submit" className="btn btn-primary">Spremi</button>
<div className="form-control w-32 p-1">
<label className="cursor-pointer label p-0">
<span className="label-text">Paid</span>
<input id="billPaid" name="billPaid" type="checkbox" className="toggle toggle-success" defaultChecked={paid} />
</label>
</div>
<textarea id="billNotes" name="billNotes" className="textarea textarea-bordered my-2 w-full max-w-sm block" placeholder="Note"></textarea>
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.billNotes &&
state.errors.billNotes.map((error: string) => (
<p className="mt-2 text-sm text-red-500" key={error}>
{error}
</p>
))}
</div>
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.message &&
<p className="mt-2 text-sm text-red-500">
{state.message}
</p>
}
</div>
<button type="submit" className="btn btn-primary">Save</button>
</form>
</div>
</div>);