Weitere Felder zur Einsatzmaske hinzugefügt
This commit is contained in:
@@ -4,7 +4,6 @@ import { useForm, Controller } from "react-hook-form";
|
|||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
import { MissionSchema } from "@repo/db/zod";
|
import { MissionSchema } from "@repo/db/zod";
|
||||||
import { Mission } from "@repo/db/zod";
|
|
||||||
import { Trash2 } from "lucide-react";
|
import { Trash2 } from "lucide-react";
|
||||||
import { Select } from "_components/Select";
|
import { Select } from "_components/Select";
|
||||||
|
|
||||||
@@ -31,6 +30,9 @@ const missionFormSchema = MissionSchema.pick({
|
|||||||
type MissionFormValues = z.infer<typeof missionFormSchema>;
|
type MissionFormValues = z.infer<typeof missionFormSchema>;
|
||||||
|
|
||||||
const dummyRettungsmittel = [
|
const dummyRettungsmittel = [
|
||||||
|
"RTW",
|
||||||
|
"Feuerwehr",
|
||||||
|
"Polizei",
|
||||||
"Christoph 31",
|
"Christoph 31",
|
||||||
"Christoph 100",
|
"Christoph 100",
|
||||||
"Christoph Berlin",
|
"Christoph Berlin",
|
||||||
@@ -41,6 +43,15 @@ export const MissionForm: React.FC = () => {
|
|||||||
const [missionCategory, setMissionCategory] = useState<"PRIMÄR" | "SEKUNDÄR">(
|
const [missionCategory, setMissionCategory] = useState<"PRIMÄR" | "SEKUNDÄR">(
|
||||||
"PRIMÄR",
|
"PRIMÄR",
|
||||||
);
|
);
|
||||||
|
const [missionKeyword, setMissionKeyword] = useState<
|
||||||
|
"AB_ATMUNG" | "C_BLUTUNG"
|
||||||
|
>("AB_ATMUNG");
|
||||||
|
const [missionType, setMissionType] = useState<"typ1" | "typ2" | "typ3">(
|
||||||
|
"typ1",
|
||||||
|
);
|
||||||
|
const [selectedRettungsmittel, setSelectedRettungsmittel] = useState<
|
||||||
|
{ label: string; value: string }[]
|
||||||
|
>([]);
|
||||||
const form = useForm<MissionFormValues>({
|
const form = useForm<MissionFormValues>({
|
||||||
resolver: zodResolver(missionFormSchema),
|
resolver: zodResolver(missionFormSchema),
|
||||||
defaultValues: {
|
defaultValues: {
|
||||||
@@ -49,10 +60,12 @@ export const MissionForm: React.FC = () => {
|
|||||||
missionCategory: "PRIMÄR",
|
missionCategory: "PRIMÄR",
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
const { control, register, handleSubmit, watch } = form;
|
|
||||||
|
|
||||||
const onSubmit = (data: MissionFormValues) => {
|
const onSubmit = (data: MissionFormValues) => {
|
||||||
console.log(data);
|
console.log({
|
||||||
|
...data,
|
||||||
|
rettungsmittel: selectedRettungsmittel.map((item) => item.value),
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -110,20 +123,15 @@ export const MissionForm: React.FC = () => {
|
|||||||
{/* Rettungsmittel Section */}
|
{/* Rettungsmittel Section */}
|
||||||
<div className="form-control">
|
<div className="form-control">
|
||||||
<h2 className="text-lg font-bold mb-2">Rettungsmittel</h2>
|
<h2 className="text-lg font-bold mb-2">Rettungsmittel</h2>
|
||||||
<Controller
|
<Select
|
||||||
name="rettungsmittel"
|
name="rettungsmittel"
|
||||||
control={form.control}
|
label={""}
|
||||||
render={({ field }) => (
|
isMulti
|
||||||
<Select
|
form={form}
|
||||||
isMulti
|
options={dummyRettungsmittel.map((key, val) => ({
|
||||||
form={form}
|
label: key,
|
||||||
name="rettungsmittel"
|
value: val,
|
||||||
label={""}
|
}))}
|
||||||
options={dummyRettungsmittel.map((item) => ({
|
|
||||||
label: item,
|
|
||||||
}))}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -140,12 +148,30 @@ export const MissionForm: React.FC = () => {
|
|||||||
<option value="PRIMÄR">PRIMÄR</option>
|
<option value="PRIMÄR">PRIMÄR</option>
|
||||||
<option value="SEKUNDÄR">SEKUNDÄR</option>
|
<option value="SEKUNDÄR">SEKUNDÄR</option>
|
||||||
</select>
|
</select>
|
||||||
<input
|
<select
|
||||||
type="text"
|
|
||||||
{...form.register("missionKeyword")}
|
{...form.register("missionKeyword")}
|
||||||
placeholder="Stichwort"
|
className="select select-primary select-bordered w-full mb-4"
|
||||||
className="input input-primary input-bordered w-full mb-4"
|
onChange={(e) =>
|
||||||
/>
|
setMissionKeyword(e.target.value as "AB_ATMUNG" | "C_BLUTUNG")
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<option value="AB_ATMUNG">AB_ATMUNG</option>
|
||||||
|
<option value="C_BLUTUNG">C_BLUTUNG</option>
|
||||||
|
</select>
|
||||||
|
<select
|
||||||
|
/* {...form.register("missionKeyword")} */
|
||||||
|
className="select select-primary select-bordered w-full mb-4"
|
||||||
|
onChange={(e) =>
|
||||||
|
setMissionType(e.target.value as "typ1" | "typ2" | "typ3")
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<option defaultChecked disabled value="">
|
||||||
|
Einsatz Szenerie auswählen...
|
||||||
|
</option>
|
||||||
|
<option value="typ1">typ1</option>
|
||||||
|
<option value="typ2">typ2</option>
|
||||||
|
<option value="typ3">typ3</option>
|
||||||
|
</select>
|
||||||
<textarea
|
<textarea
|
||||||
{...form.register("missionAdditionalInfo")}
|
{...form.register("missionAdditionalInfo")}
|
||||||
placeholder="Einsatzinformationen"
|
placeholder="Einsatzinformationen"
|
||||||
@@ -170,8 +196,12 @@ export const MissionForm: React.FC = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<p className="text-sm text-error">
|
||||||
|
Du musst noch ein Gebäude auswählen, um den Einsatz zu erstellen.
|
||||||
|
</p>
|
||||||
|
|
||||||
<div className="min-h-[140px]">
|
<div className="min-h-[140px]">
|
||||||
<button type="submit" className="btn btn-primary mt-4">
|
<button type="submit" className="btn btn-primary">
|
||||||
Alarmieren
|
Alarmieren
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user