ForFarmTeam/ForFarm
1
0
Fork 0
mirror of https://github.com/ForFarmTeam/ForFarm.git synced 2025-12-19 14:04:08 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: add Harvest Details form and integrate into setup page

Browse Source
This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2025-02-13 22:28:48 +07:00
parent 03c0c34df7
commit 3651e493d2
2 changed files with 234 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

230
frontend/app/setup/harvest-detail-form.tsx Normal file
View File

@ -0,0 +1,230 @@
"use client";
import {
Form,
FormControl,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { harvestDetailsFormSchema } from "@/schemas/application.schema";
import { useForm } from "react-hook-form";
import { z } from "zod";
import { zodResolver } from "@hookform/resolvers/zod";
import { Input } from "@/components/ui/input";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
type harvestSchema = z.infer<typeof harvestDetailsFormSchema>;
export default function HarvestDetailsForm() {
const form = useForm<harvestSchema>({
resolver: zodResolver(harvestDetailsFormSchema),
defaultValues: {},
});
return (
<Form {...form}>
<form className="grid grid-cols-3 gap-5">
<FormField
control={form.control}
name="daysToFlower"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Days To Flower
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="daysToFlower"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="daysToMaturity"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Days To Maturity
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="daysToMaturity"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="harvestWindow"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Harvest Window
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="harvestWindow"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="estimatedLossRate"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Estimated Loss Rate
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="estimatedLossRate"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="harvestUnits"
render={({ field }) => (
<FormItem>
<FormLabel className="font-bold text-lg">Harvest Units</FormLabel>
<FormControl>
<Select
onValueChange={field.onChange}
defaultValue={field.value}
>
<SelectTrigger className="w-96">
<SelectValue placeholder="Select a harvest unit" />
</SelectTrigger>
<SelectContent>
<SelectItem value="bales">bales</SelectItem>
<SelectItem value="transplant">Transplant</SelectItem>
<SelectItem value="cutting">Cutting</SelectItem>
</SelectContent>
</Select>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="estimatedRevenue"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Estimated Revenue
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="estimatedRevenue"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="expectedYieldPer100ft"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Expected Yield Per100ft
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="expectedYieldPer100ft"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="expectedYieldPerAcre"
render={({ field }: { field: any }) => (
<FormItem>
<FormLabel className="font-bold text-lg">
Expected Yield Per Acre
</FormLabel>
<FormControl>
<div className="mt-5 space-y-5">
<div className="flex space-x-5">
<Input
type="number"
id="expectedYieldPerAcre"
className="w-96"
{...field}
/>
</div>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
</form>
</Form>
);
}

4
frontend/app/setup/page.tsx
View File

@ -1,4 +1,5 @@
import PlantingDetailsForm from "./planting-detail-form"; import PlantingDetailsForm from "./planting-detail-form";
import HarvestDetailsForm from "./harvest-detail-form";
import { Separator } from "@/components/ui/separator"; import { Separator } from "@/components/ui/separator";
export default function SetupPage() { export default function SetupPage() {
@ -15,6 +16,9 @@ export default function SetupPage() {
<h1 className="flex text-2xl ">Harvest Details</h1> <h1 className="flex text-2xl ">Harvest Details</h1>
</div> </div>
<Separator className="mt-3" /> <Separator className="mt-3" />
<div className="mt-10 flex justify-center">
<HarvestDetailsForm />
</div>
</div> </div>
); );
} }