From a56921e0ee84f6abc58d1c469b30299a60dc877f Mon Sep 17 00:00:00 2001 From: rithviknishad Date: Wed, 7 Aug 2024 18:41:56 +0530 Subject: [PATCH] Updated prescription print preview as per requirements --- src/Components/Medicine/PrintPreview.tsx | 227 ++++++++++++++--------- 1 file changed, 141 insertions(+), 86 deletions(-) diff --git a/src/Components/Medicine/PrintPreview.tsx b/src/Components/Medicine/PrintPreview.tsx index 07e1a406c27..c8b72114693 100644 --- a/src/Components/Medicine/PrintPreview.tsx +++ b/src/Components/Medicine/PrintPreview.tsx @@ -3,13 +3,22 @@ import PrintPreview from "../../CAREUI/misc/PrintPreview"; import { useSlugs } from "../../Common/hooks/useSlug"; import routes from "../../Redux/api"; import useQuery from "../../Utils/request/useQuery"; -import { classNames, formatDate, formatPatientAge } from "../../Utils/utils"; +import { + classNames, + formatDate, + formatDateTime, + formatName, + patientAgeInYears, +} from "../../Utils/utils"; import MedicineRoutes from "./routes"; import { Prescription } from "./models"; -import CheckBoxFormField from "../Form/FormFields/CheckBoxFormField"; -import { useState } from "react"; +import useConfig from "../../Common/hooks/useConfig"; +import { ReactNode } from "react"; + +// TODO: follow format of aparna export default function PrescriptionsPrintPreview() { + const { main_logo } = useConfig(); const { t } = useTranslation(); const [patientId, consultationId] = useSlugs("patient", "consultation"); @@ -17,66 +26,106 @@ export default function PrescriptionsPrintPreview() { pathParams: { id: patientId }, }); + const encounterQuery = useQuery(routes.getConsultation, { + pathParams: { id: consultationId }, + }); + const prescriptionsQuery = useQuery(MedicineRoutes.listPrescriptions, { pathParams: { consultation: consultationId }, query: { discontinued: false, limit: 100 }, }); const patient = patientQuery.data; + const encounter = encounterQuery.data; + + const items = prescriptionsQuery.data?.results; + const normalPrescriptions = items?.filter((p) => p.dosage_type !== "PRN"); + const prnPrescriptions = items?.filter((p) => p.dosage_type === "PRN"); return ( -
- -
- - - - -
+
+ care logo +
+
+ + {patient && ( + <> + {patient.name} -{" "} + {t(`GENDER__${patient.gender}`)},{" "} + {patientAgeInYears(patient).toString()}yrs + + )} + + + {encounter?.patient_no} + + + + {formatDate(encounter?.encounter_date)} + + + {encounter?.facility_name} + + + {encounter?.current_bed?.bed_object.location_object?.name} + {" - "} + {encounter?.current_bed?.bed_object.name} + + + + {patient?.allergies ?? "None"} + +
+ + + + +
+

+ Sign of the Consulting Doctor +

+ + {encounter?.treating_physician_object && + formatName(encounter?.treating_physician_object)} + +

+ Generated on: {formatDateTime(new Date())} +

+

+ This is a computer generated prescription. It shall be issued to the + patient only after the concerned doctor has verified the content and + authorized the same by affixing signature. +

- ); } -const PrescriptionIcon = () => ( - - - -); - -const PatientDetail = ({ name, value }: { name: string; value?: string }) => { +const PatientDetail = ({ + name, + children, + className, +}: { + name: string; + children?: ReactNode; + className?: string; +}) => { return ( -
-
{name}:
- {value ? ( - {value} +
+
{name}:
+ {children != null ? ( + {children} ) : (
)} @@ -84,26 +133,35 @@ const PatientDetail = ({ name, value }: { name: string; value?: string }) => { ); }; -const PrescriptionsTable = ({ items }: { items?: Prescription[] }) => { +const PrescriptionsTable = ({ + items, + prn, +}: { + items?: Prescription[]; + prn?: boolean; +}) => { if (!items) { return (
); } + if (!items.length) { + return; + } + return ( - +
+ - - - - - + + + + + @@ -117,27 +175,10 @@ const PrescriptionsTable = ({ items }: { items?: Prescription[] }) => { const PrescriptionEntry = ({ obj }: { obj: Prescription }) => { const { t } = useTranslation(); - const [checked, setChecked] = useState(true); - const medicine = obj.medicine_object; return ( - setChecked((c) => !c)} - > - + -
+ {prn && "PRN"} Prescriptions +
- MedicineDosageRoute -

Freq. or

-

Indicator

- 		NotesMedicineDosageRoute{prn ? "Indicator" : "Frequency"}Notes
- setChecked(value)} - /> -

@@ -149,29 +190,43 @@ const PrescriptionEntry = ({ obj }: { obj: Prescription }) => {

Generic:{" "} - {medicine.generic} + {medicine.generic ?? "--"}

Brand:{" "} - {medicine.company} + {medicine.company ?? "--"}

)} 		- {obj.dosage_type === "REGULAR" && obj.base_dosage} - {obj.dosage_type === "PRN" && ( - <> - {obj.base_dosage &&

{obj.base_dosage}

} - {obj.target_dosage &&

target: {obj.target_dosage}

} - {obj.max_dosage &&

Max {obj.max_dosage} in 24hrs

} - {obj.min_hours_between_doses && ( -

Min. {obj.min_hours_between_doses}hrs b/w doses

- )} - + 		+ {obj.dosage_type === "TITRATED" &&

Titrated

} +

+ {obj.base_dosage}{" "} + {obj.target_dosage != null && `→ ${obj.target_dosage}`}{" "} +

+ {obj.max_dosage && ( +

+ Max. {obj.max_dosage} in + 24hrs +

+ )} + {obj.min_hours_between_doses && ( +

+ Min.{" "} + + {obj.min_hours_between_doses}hrs + {" "} + b/w doses +

+ )} + {obj.days != null && ( +

+ Days: {obj.days} day(s) +

)}