diff --git a/apps/dispatch/app/_store/mapStore.ts b/apps/dispatch/app/_store/mapStore.ts index 447da5b7..7a6c681b 100644 --- a/apps/dispatch/app/_store/mapStore.ts +++ b/apps/dispatch/app/_store/mapStore.ts @@ -12,7 +12,7 @@ interface MapStore { }; openMissionMarker: { id: number; - tab: "home" | "details" | "chat" | "log"; + tab: "home" | "details" | "patient" | "log"; }[]; setOpenMissionMarker: (mission: { open: MapStore["openMissionMarker"]; diff --git a/apps/dispatch/app/dispatch/_components/map/MissionMarkers.tsx b/apps/dispatch/app/dispatch/_components/map/MissionMarkers.tsx index d5315f70..1fde2db7 100644 --- a/apps/dispatch/app/dispatch/_components/map/MissionMarkers.tsx +++ b/apps/dispatch/app/dispatch/_components/map/MissionMarkers.tsx @@ -11,7 +11,14 @@ import { useState, } from "react"; import { cn } from "helpers/cn"; -import { ClipboardList, Cross, House, Minimize2, Route } from "lucide-react"; +import { + ClipboardList, + Cross, + House, + Minimize2, + Route, + SmartphoneNfc, +} from "lucide-react"; import { calculateAnchor, SmartPopup, @@ -20,6 +27,8 @@ import { import { Mission, MissionState } from "@repo/db"; import Einsatzdetails, { FMSStatusHistory, + Patientdetails, + Rettungsmittel, } from "./_components/MissionMarkerTabs"; export const MISSION_STATUS_COLORS: Record = { @@ -42,7 +51,7 @@ const MissionPopupContent = ({ mission }: { mission: Mission }) => { ); const handleTabChange = useCallback( - (tab: "home" | "details" | "chat" | "log") => { + (tab: "home" | "details" | "patient" | "log") => { console.log("handleTabChange", tab); setMissionMarker({ open: [ @@ -62,9 +71,9 @@ const MissionPopupContent = ({ mission }: { mission: Mission }) => { case "home": return ; case "details": - return
Details Content
; - case "chat": - return
Chat Content
; + return ; + case "patient": + return ; case "log": return ; default: @@ -137,26 +146,26 @@ const MissionPopupContent = ({ mission }: { mission: Mission }) => { style={{ backgroundColor: `${MISSION_STATUS_COLORS[mission.state]}`, borderBottom: - currentTab === "details" + currentTab === "patient" ? `5px solid ${MISSION_STATUS_TEXT_COLORS[mission.state]}` : "5px solid transparent", }} - onClick={() => handleTabChange("details")} + onClick={() => handleTabChange("patient")} > - +
handleTabChange("chat")} + onClick={() => handleTabChange("details")} > - +
{
  • - __{mission.id} + __{new Date().toISOString().slice(0, 10).replace(/-/g, "")} + {mission.id}
  • @@ -97,6 +100,59 @@ const Einsatzdetails = ({ mission }: { mission: Mission }) => { ); }; +const Patientdetails = ({ mission }: { mission: Mission }) => { + return ( +
    +

    + Patientendetails +

    +

    + {mission.missionPatientInfo} +

    +
    + ); +}; + +const Rettungsmittel = () => { + // Mockup data + const mockupData = [ + { bosCallsign: "Christoph 31", FMSstatus: 2, min: 6 }, + { bosCallsign: "RTW", FMSstatus: 3, min: 2 }, + { bosCallsign: "Polizei", FMSstatus: 4, min: 0 }, + ]; + + return ( +
    +

    + Rettungsmittel +

    +
      + {mockupData.map((item, index) => ( +
    • + + {item.FMSstatus} + + + {item.bosCallsign} + {item.min > 0 && ( + <> +
      + Ankunft in ca. {item.min} min + + )} +
      +
    • + ))} +
    +
    + ); +}; + const FMSStatusHistory = ({ mission }: { mission: Mission }) => { const session = useSession(); const [isAddingNote, setIsAddingNote] = useState(false); @@ -212,5 +268,5 @@ const FMSStatusHistory = ({ mission }: { mission: Mission }) => { ); }; -export { FMSStatusHistory }; +export { FMSStatusHistory, Patientdetails, Rettungsmittel }; export default Einsatzdetails; diff --git a/apps/dispatch/app/dispatch/page.tsx b/apps/dispatch/app/dispatch/page.tsx index a9cc6c64..6987fde9 100644 --- a/apps/dispatch/app/dispatch/page.tsx +++ b/apps/dispatch/app/dispatch/page.tsx @@ -7,7 +7,7 @@ import { cn } from "helpers/cn"; import dynamic from "next/dynamic"; const Map = dynamic(() => import("./_components/map/Map"), { ssr: false }); -export default () => { +const DispatchPage = () => { const { isOpen } = usePannelStore(); return (
    @@ -27,3 +27,7 @@ export default () => {
    ); }; + +DispatchPage.displayName = "DispatchPage"; + +export default DispatchPage;