Fix Station-Select

This commit is contained in:
PxlLoewe
2025-07-22 11:06:00 -07:00
parent 228feb0512
commit a905872f25
5 changed files with 40 additions and 25 deletions

View File

@@ -45,16 +45,9 @@ export function StationsSelect({
queryFn: () => getStationsAPI(),
});
const [value, setValue] = useState<string[]>(selectedStations?.map((id) => String(id)) || []);
useEffect(() => {
setValue([
...(selectedStations || []).map((id) => String(id)),
...(vehicleStates.hpgAmbulanceState !== HpgState.NOT_REQUESTED || undefined ? ["RTW"] : []),
...(vehicleStates.hpgFireEngineState !== HpgState.NOT_REQUESTED || undefined ? ["FW"] : []),
...(vehicleStates.hpgPoliceState !== HpgState.NOT_REQUESTED || undefined ? ["POL"] : []),
]);
}, [selectedStations, vehicleStates]);
const [value, setValue] = useState<string[] | string | null>(
selectedStations?.map((id) => String(id)) || [],
);
// Helper to check if a station is a vehicle and its state is NOT_REQUESTED
const stationsOptions = [
@@ -101,6 +94,20 @@ export function StationsSelect({
return true;
});
useEffect(() => {
if (isMulti) {
setValue([
...(selectedStations || []).map((id) => String(id)),
...(vehicleStates.hpgAmbulanceState !== HpgState.NOT_REQUESTED || undefined ? ["RTW"] : []),
...(vehicleStates.hpgFireEngineState !== HpgState.NOT_REQUESTED || undefined ? ["FW"] : []),
...(vehicleStates.hpgPoliceState !== HpgState.NOT_REQUESTED || undefined ? ["POL"] : []),
]);
} else {
console.log("clear selected stations");
setValue(null);
}
}, [selectedStations, vehicleStates, isMulti]);
return (
<Select
className={className}

View File

@@ -135,7 +135,7 @@ export const ConnectionBtn = () => {
/>
</div>
)}
<fieldset className="fieldset mt-2 w-full">
<fieldset className="fieldset mt-4 w-full">
<label className="floating-label w-full text-base">
<span>Logoff Zeit (LCL)</span>
<input

View File

@@ -7,9 +7,11 @@ import { getMissionsAPI } from "_querys/missions";
import { HPGValidationRequired } from "_helpers/hpgValidationRequired";
import { getConnectedAircraftsAPI } from "_querys/aircrafts";
import { useMapStore } from "_store/mapStore";
import { useDispatchConnectionStore } from "_store/dispatch/connectionStore";
export const MapAdditionals = () => {
const { isOpen, missionFormValues } = usePannelStore((state) => state);
const dispatcherConnectionState = useDispatchConnectionStore((state) => state.status);
const { data: missions = [] } = useQuery({
queryKey: ["missions"],
queryFn: () =>
@@ -32,6 +34,7 @@ export const MapAdditionals = () => {
m.hpgValidationState === "POSITION_AMANDED" &&
m.state === "draft" &&
m.hpgLocationLat &&
dispatcherConnectionState === "connected" &&
m.hpgLocationLng,
);

View File

@@ -82,7 +82,7 @@ const MissionPopupContent = ({
return (
<>
<div
className="absolute p-1 z-99 top-0 right-0 transform -translate-y-full bg-base-100 cursor-pointer"
className="z-99 bg-base-100 absolute right-0 top-0 -translate-y-full transform cursor-pointer p-1"
onClick={() => {
setOpenMissionMarker({
open: [],
@@ -95,7 +95,7 @@ const MissionPopupContent = ({
<div
className={cn(
"absolute w-[calc(100%+2px)] h-4 z-99",
"z-99 absolute h-4 w-[calc(100%+2px)]",
anchor.includes("left") ? "-left-[2px]" : "-right-[2px]",
anchor.includes("top") ? "-top-[2px]" : "-bottom-[2px]",
)}
@@ -116,13 +116,13 @@ const MissionPopupContent = ({
/>
<div>
<div
className="flex gap-[2px] text-white pb-0.5"
className="flex gap-[2px] pb-0.5 text-white"
style={{
backgroundColor: `${MISSION_STATUS_TEXT_COLORS[mission.state]}`,
}}
>
<div
className="p-2 px-3 flex justify-center items-center cursor-pointer"
className="flex cursor-pointer items-center justify-center p-2 px-3"
style={{
backgroundColor: `${MISSION_STATUS_COLORS[mission.state]}`,
borderBottom:
@@ -135,7 +135,7 @@ const MissionPopupContent = ({
<House className="text-sm" />
</div>
<div
className="p-2 px-4 flex justify-center items-center cursor-pointer"
className="flex cursor-pointer items-center justify-center p-2 px-4"
style={{
backgroundColor: `${MISSION_STATUS_COLORS[mission.state]}`,
borderBottom:
@@ -148,7 +148,7 @@ const MissionPopupContent = ({
<Cross className="text-sm" />
</div>
<div
className="p-2 px-4 flex justify-center items-center cursor-pointer"
className="flex cursor-pointer items-center justify-center p-2 px-4"
style={{
backgroundColor: `${MISSION_STATUS_COLORS[mission.state]}`,
borderBottom:
@@ -162,7 +162,7 @@ const MissionPopupContent = ({
</div>
{mission.state === "draft" && (
<div
className="p-2 px-4 flex justify-center items-center cursor-pointer ml-auto"
className="ml-auto flex cursor-pointer items-center justify-center p-2 px-4"
style={{
backgroundColor: `${MISSION_STATUS_COLORS["attention"]}`,
borderBottom: "5px solid transparent",
@@ -173,9 +173,9 @@ const MissionPopupContent = ({
addressMissionDestination: mission.addressMissionDestination ?? undefined,
addressAdditionalInfo: mission.addressAdditionalInfo ?? undefined,
state: "draft",
hpgAmbulanceState: "NOT_REQUESTED",
hpgFireEngineState: "NOT_REQUESTED",
hpgPoliceState: "NOT_REQUESTED",
hpgAmbulanceState: mission.hpgAmbulanceState ?? "NOT_REQUESTED",
hpgFireEngineState: mission.hpgFireEngineState ?? "NOT_REQUESTED",
hpgPoliceState: mission.hpgPoliceState ?? "NOT_REQUESTED",
hpgLocationLat: mission.hpgLocationLat ?? undefined,
hpgLocationLng: mission.hpgLocationLng ?? undefined,
});
@@ -188,7 +188,7 @@ const MissionPopupContent = ({
)}
<div
className={cn(
"p-2 px-4 flex justify-center items-center cursor-pointer",
"flex cursor-pointer items-center justify-center p-2 px-4",
mission.state !== "draft" && "ml-auto",
)}
style={{

View File

@@ -530,11 +530,15 @@ const Rettungsmittel = ({ mission }: { mission: Mission }) => {
className="min-w-[320px] flex-1"
isMulti={false}
onChange={(v) => {
console.log("Selected Station:", v);
setSelectedStation({
selectedStationId: v?.selectedStationIds[0],
hpgAmbulanceState: mission.hpgAmbulanceState || HpgState.NOT_REQUESTED,
hpgFireEngineState: mission.hpgFireEngineState || HpgState.NOT_REQUESTED,
hpgPoliceState: mission.hpgPoliceState || HpgState.NOT_REQUESTED,
hpgAmbulanceState:
v.hpgAmbulanceState || mission.hpgAmbulanceState || HpgState.NOT_REQUESTED,
hpgFireEngineState:
v.hpgFireEngineState || mission.hpgFireEngineState || HpgState.NOT_REQUESTED,
hpgPoliceState:
v.hpgPoliceState || mission.hpgPoliceState || HpgState.NOT_REQUESTED,
});
}}
selectedStations={mission.missionStationIds}
@@ -548,6 +552,7 @@ const Rettungsmittel = ({ mission }: { mission: Mission }) => {
<button
className="btn btn-sm btn-primary btn-outline"
onClick={async () => {
console.log("Selected Station:", selectedStation);
if (
selectedStation.hpgAmbulanceState !== "NOT_REQUESTED" ||
selectedStation.hpgFireEngineState !== "NOT_REQUESTED" ||