Weitere Felder zur Einsatzmaske hinzugefügt

apps/dispatch/app/dispatch/_components/pannel/MissionForm.tsx

@@ -4,7 +4,6 @@ import { useForm, Controller } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 import { MissionSchema } from "@repo/db/zod";
-import { Mission } from "@repo/db/zod";
 import { Trash2 } from "lucide-react";
 import { Select } from "_components/Select";
 
@@ -31,6 +30,9 @@ const missionFormSchema = MissionSchema.pick({
 type MissionFormValues = z.infer<typeof missionFormSchema>;
 
 const dummyRettungsmittel = [
+	"RTW",
+	"Feuerwehr",
+	"Polizei",
 	"Christoph 31",
 	"Christoph 100",
 	"Christoph Berlin",
@@ -41,6 +43,15 @@ export const MissionForm: React.FC = () => {
 	const [missionCategory, setMissionCategory] = useState<"PRIMÄR" | "SEKUNDÄ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>({
 		resolver: zodResolver(missionFormSchema),
 		defaultValues: {
@@ -49,10 +60,12 @@ export const MissionForm: React.FC = () => {
 			missionCategory: "PRIMÄR",
 		},
 	});
-	const { control, register, handleSubmit, watch } = form;
 
 	const onSubmit = (data: MissionFormValues) => {
-		console.log(data);
+		console.log({
+			...data,
+			rettungsmittel: selectedRettungsmittel.map((item) => item.value),
+		});
 	};
 
 	return (
@@ -110,20 +123,15 @@ export const MissionForm: React.FC = () => {
 			{/* Rettungsmittel Section */}
 			<div className="form-control">
 				<h2 className="text-lg font-bold mb-2">Rettungsmittel</h2>
-				<Controller
+				<Select
 					name="rettungsmittel"
-					control={form.control}
-					render={({ field }) => (
-						<Select
-							isMulti
-							form={form}
-							name="rettungsmittel"
-							label={""}
-							options={dummyRettungsmittel.map((item) => ({
-								label: item,
-							}))}
-						/>
-					)}
+					label={""}
+					isMulti
+					form={form}
+					options={dummyRettungsmittel.map((key, val) => ({
+						label: key,
+						value: val,
+					}))}
 				/>
 			</div>
 
@@ -140,12 +148,30 @@ export const MissionForm: React.FC = () => {
 					<option value="PRIMÄR">PRIMÄR</option>
 					<option value="SEKUNDÄR">SEKUNDÄR</option>
 				</select>
-				<input
-					type="text"
+				<select
 					{...form.register("missionKeyword")}
-					placeholder="Stichwort"
-					className="input input-primary input-bordered w-full mb-4"
-				/>
+					className="select select-primary select-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
 					{...form.register("missionAdditionalInfo")}
 					placeholder="Einsatzinformationen"
@@ -170,8 +196,12 @@ export const MissionForm: React.FC = () => {
 				/>
 			</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]">
-				<button type="submit" className="btn btn-primary mt-4">
+				<button type="submit" className="btn btn-primary">
 					Alarmieren
 				</button>
 			</div>