feat: implement flexible feeding intervals and fix layout alignment

This commit is contained in:
2026-01-12 23:06:12 +01:00
parent 87f4e43c9f
commit 3600ba665d
8 changed files with 149 additions and 5 deletions

View File

@@ -43,21 +43,33 @@ export function CreatePlanForm({ dict, lang }: CreatePlanFormProps) {
password: z.string().min(4, {
message: dict.passwordError,
}),
feedingPerDay: z.coerce.number().min(1).max(10),
feedingInterval: z.coerce.number().min(1).max(30),
litterInterval: z.coerce.number().min(1).max(30),
instructions: z.string().optional(),
})
const form = useForm<z.infer<typeof formSchema>>({
resolver: zodResolver(formSchema),
type FormValues = z.infer<typeof formSchema>
const form = useForm<FormValues>({
resolver: zodResolver(formSchema) as any,
defaultValues: {
title: "",
password: "",
instructions: "",
feedingPerDay: 2,
feedingInterval: 1,
litterInterval: 2,
dateRange: {
from: undefined,
to: undefined,
}
},
})
const dateLocale = lang === "de" ? de : enUS
async function onSubmit(values: z.infer<typeof formSchema>) {
async function onSubmit(values: FormValues) {
try {
const response = await fetch("/api/plan", {
method: "POST",
@@ -68,6 +80,9 @@ export function CreatePlanForm({ dict, lang }: CreatePlanFormProps) {
endDate: values.dateRange.to,
password: values.password,
instructions: values.instructions,
feedingPerDay: values.feedingPerDay,
feedingInterval: values.feedingInterval,
litterInterval: values.litterInterval,
}),
})
@@ -153,6 +168,52 @@ export function CreatePlanForm({ dict, lang }: CreatePlanFormProps) {
</FormItem>
)}
/>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<FormField
control={form.control}
name="feedingInterval"
render={({ field }) => (
<FormItem>
<FormLabel className="min-h-[3.5rem] flex items-end pb-2">{dict.feedingInterval}</FormLabel>
<FormControl>
<Input type="number" {...field} />
</FormControl>
<FormDescription className="min-h-[4rem]">{dict.feedingIntervalDesc}</FormDescription>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="feedingPerDay"
render={({ field }) => (
<FormItem>
<FormLabel className="min-h-[3.5rem] flex items-end pb-2">{dict.feedingPerDay}</FormLabel>
<FormControl>
<Input type="number" {...field} />
</FormControl>
<FormDescription className="min-h-[4rem]">{dict.feedingDesc}</FormDescription>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="litterInterval"
render={({ field }) => (
<FormItem>
<FormLabel className="min-h-[3.5rem] flex items-end pb-2">{dict.litterInterval}</FormLabel>
<FormControl>
<Input type="number" {...field} />
</FormControl>
<FormDescription className="min-h-[4rem]">{dict.litterDesc}</FormDescription>
<FormMessage />
</FormItem>
)}
/>
</div>
<FormField
control={form.control}
name="password"