Change Marker Color depending on hpg validation state

This commit is contained in:
nocnico
2025-05-22 00:32:15 +02:00
parent 9095b5ea40
commit 02a172c2df
2 changed files with 72 additions and 28 deletions

View File

@@ -24,7 +24,7 @@ import {
SmartPopup, SmartPopup,
useSmartPopup, useSmartPopup,
} from "_components/SmartPopup"; } from "_components/SmartPopup";
import { Mission, MissionState } from "@repo/db"; import { HpgValidationState, Mission, MissionState } from "@repo/db";
import Einsatzdetails, { import Einsatzdetails, {
FMSStatusHistory, FMSStatusHistory,
Patientdetails, Patientdetails,
@@ -292,6 +292,15 @@ const MissionMarker = ({ mission }: { mission: Mission }) => {
mission: Mission, mission: Mission,
anchor: "topleft" | "topright" | "bottomleft" | "bottomright", anchor: "topleft" | "topright" | "bottomleft" | "bottomright",
) => { ) => {
const markerColor =
mission.hpgValidationState ===
(HpgValidationState.POSITION_AMANDED ||
HpgValidationState.INVALID ||
HpgValidationState.HPG_DISCONNECT ||
HpgValidationState.HPG_BUSY ||
HpgValidationState.HPG_INVALID_MISSION)
? MISSION_STATUS_COLORS["attention"]
: MISSION_STATUS_COLORS[mission.state];
return `<div return `<div
id="marker-mission-${mission.id}" id="marker-mission-${mission.id}"
class="${cn( class="${cn(
@@ -301,7 +310,7 @@ const MissionMarker = ({ mission }: { mission: Mission }) => {
hideMarker ? "opacity-0 pointer-events-none" : "opacity-100", hideMarker ? "opacity-0 pointer-events-none" : "opacity-100",
)}" )}"
style=" style="
background-color: ${MISSION_STATUS_COLORS[mission.state]}; background-color: ${markerColor};
${openMissionMarker.some((m) => m.id === mission.id) ? "opacity: 0; pointer-events: none;" : ""} ${openMissionMarker.some((m) => m.id === mission.id) ? "opacity: 0; pointer-events: none;" : ""}
"> ">

View File

@@ -21,6 +21,7 @@ import {
} from "lucide-react"; } from "lucide-react";
import { import {
getPublicUser, getPublicUser,
HpgValidationState,
Mission, Mission,
MissionLog, MissionLog,
MissionMessageLog, MissionMessageLog,
@@ -176,32 +177,66 @@ const Einsatzdetails = ({ mission }: { mission: Mission }) => {
</div> </div>
<div className="flex items-center gap-2 w-full"> <div className="flex items-center gap-2 w-full">
{/* <button {(mission.hpgValidationState === HpgValidationState.VALID ||
className="btn btn-sm btn-info btn-outline flex-3" mission.hpgValidationState ===
onClick={() => sendAlertMutation.mutate(mission.id)} HpgValidationState.NOT_VALIDATED) && (
> <button
<span className="flex items-center gap-2"> className="btn btn-sm btn-info btn-outline flex-3"
<BellRing size={16} /> Alarmieren onClick={() => sendAlertMutation.mutate(mission.id)}
</span> >
</button> */} <span className="flex items-center gap-2">
{/* <button <BellRing size={16} /> Alarmieren
className="btn btn-sm btn-info btn-outline flex-3" </span>
onClick={() => sendAlertMutation.mutate(mission.id)} </button>
disabled )}
> {(mission.hpgValidationState === HpgValidationState.PENDING ||
<span className="flex items-center gap-2"> mission.hpgValidationState === HpgValidationState.HPG_BUSY ||
<span className="loading loading-spinner loading-md"></span>{" "} mission.hpgValidationState ===
HPG-Validierung läuft... HpgValidationState.HPG_DISCONNECT ||
</span> mission.hpgValidationState === HpgValidationState.INVALID ||
</button> */} HpgValidationState.HPG_INVALID_MISSION) &&
<button mission.hpgValidationState !== HpgValidationState.NOT_VALIDATED &&
className="btn btn-sm btn-warning btn-outline flex-3" mission.hpgValidationState !==
onClick={() => sendAlertMutation.mutate(mission.id)} HpgValidationState.POSITION_AMANDED &&
> mission.hpgValidationState !== HpgValidationState.VALID && (
<span className="flex items-center gap-2"> <button
<BellRing size={16} /> Mit neuer Position alarmieren className="btn btn-sm btn-info btn-outline flex-3"
</span> onClick={() => sendAlertMutation.mutate(mission.id)}
</button> disabled
>
<span className="flex items-center gap-2">
{mission.hpgValidationState ===
HpgValidationState.PENDING && (
<div>
<span className="loading loading-spinner loading-md"></span>{" "}
HPG-Validierung läuft...
</div>
)}
{mission.hpgValidationState ===
HpgValidationState.HPG_BUSY && "HPG-Client busy"}
{mission.hpgValidationState ===
HpgValidationState.HPG_DISCONNECT &&
"HPG-Client nicht verbunden"}
{mission.hpgValidationState ===
HpgValidationState.INVALID && "HPG-Client fehlerhaft"}
{mission.hpgValidationState ===
HpgValidationState.HPG_INVALID_MISSION &&
"Fehlerhafte HPG-Mission"}
</span>
</button>
)}
{mission.hpgValidationState ===
HpgValidationState.POSITION_AMANDED && (
<button
className="btn btn-sm btn-warning btn-outline flex-3"
onClick={() => sendAlertMutation.mutate(mission.id)}
>
<span className="flex items-center gap-2">
<BellRing size={16} /> Mit neuer Position alarmieren
</span>
</button>
)}
<button <button
className="btn btn-sm btn-primary btn-dash flex items-center gap-2" className="btn btn-sm btn-primary btn-dash flex items-center gap-2"