diff --git a/src/Routers/routes/LabTestRoutes.tsx b/src/Routers/routes/LabTestRoutes.tsx index 92fc297c81c..2226429e5af 100644 --- a/src/Routers/routes/LabTestRoutes.tsx +++ b/src/Routers/routes/LabTestRoutes.tsx @@ -2,6 +2,7 @@ import { CollectSpecimen } from "@/components/LabTest/CollectSpecimen"; import { LabTest } from "@/components/LabTest/Index"; import { ProcessSpecimen } from "@/components/LabTest/ProcessSpecimen"; import { ReceiveSpecimen } from "@/components/LabTest/ReceiveSpecimen"; +import { ReviewResult } from "@/components/LabTest/ReviewResult"; import { SendSpecimen } from "@/components/LabTest/SendSpecimen"; import { AppRoutes } from "@/Routers/AppRouter"; @@ -17,6 +18,9 @@ const LabTestRoutes: AppRoutes = { "/lab_tests/:specimenId/collect": ({ specimenId }) => ( ), + "/lab_tests/:specimenId/review_result": ({ specimenId }) => ( + + ), }; export default LabTestRoutes; diff --git a/src/components/LabTest/ReviewResult.tsx b/src/components/LabTest/ReviewResult.tsx new file mode 100644 index 00000000000..de73a255a10 --- /dev/null +++ b/src/components/LabTest/ReviewResult.tsx @@ -0,0 +1,558 @@ +import { + ArrowRightIcon, + CheckCircledIcon, + CheckIcon, + ChevronDownIcon, + ChevronUpIcon, +} from "@radix-ui/react-icons"; +import React from "react"; + +import CareIcon from "@/CAREUI/icons/CareIcon"; + +import { Button } from "@/components/ui/button"; +import { + Collapsible, + CollapsibleContent, + CollapsibleTrigger, +} from "@/components/ui/collapsible"; +import { + Table, + TableBody, + TableCell, + TableHead, + TableHeader, + TableRow, +} from "@/components/ui/table"; +import { Textarea } from "@/components/ui/textarea"; + +interface Sample { + id: string; + status: string; + barcode?: string; + tubeType?: string; + collectionDateTime?: string; + specimenType: string; +} + +interface Order { + orderId: string; + status: string; + test: string; + samples: Sample[]; +} + +// Mock Data +const initialOrders: Order[] = [ + { + orderId: "CARE_LAB-001", + status: "Pending", + test: "Complete Blood Count (CBC)", + samples: [ + { + id: "SPEC009213", + specimenType: "Blood", + status: "Collection Pending", + }, + { + id: "SPEC009213-2", + specimenType: "Blood", + status: "Collected", + barcode: "123456789", + tubeType: "EDTA", + collectionDateTime: "28-Nov-2024, 2:30PM", + }, + ], + }, + { + orderId: "CARE_LAB-002", + status: "Pending", + test: "Urine Analysis", + samples: [ + { + id: "SPEC009412", + specimenType: "Urine", + status: "Collection Pending", + }, + ], + }, +]; +const testResults = [ + { + parameter: "Total Bilirubin", + result: "1.2", + unit: "mg/dL", + referenceRange: "0.1 - 1.2", + remark: "Boderline High", + }, + { + parameter: "Direct Bilirubin", + result: "0.3", + unit: "mg/dL", + referenceRange: "0.0 - 0.4", + remark: "", + }, + { + parameter: "ALT", + result: "42", + unit: "U/L", + referenceRange: "7 - 56", + remark: "", + }, + { + parameter: "AST", + result: "37", + unit: "U/L", + referenceRange: "5 - 40", + remark: "", + }, + { + parameter: "ALP", + result: "112", + unit: "U/L", + referenceRange: "40 - 129", + remark: "", + }, + { + parameter: "Albumin", + result: "4.4", + unit: "g/dL", + referenceRange: "3.5 - 5.0", + remark: "", + }, + { + parameter: "Total Protein", + result: "7.2", + unit: "g/dL", + referenceRange: "6.4 - 8.3", + remark: "", + }, +]; + +export const ReviewResult: React.FC<{ + specimenId: string; +}> = ({ specimenId }) => { + // Store orders in state so we can modify them + const [orderData, setOrderData] = React.useState(initialOrders); + + const [openOrders, setOpenOrders] = React.useState>( + {}, + ); + + const toggleOrder = (orderId: string) => { + setOpenOrders((prev) => ({ ...prev, [orderId]: !prev[orderId] })); + }; + + return ( +
+ {/* Left - Navigation/Progress Bar */} + + + {/* Right - Main Content */} +
+ {/* Header Section */} + + +
+

Review Result

+
+ +
+
+ + {/* Patient Details Section */} +
+
+
+

Patient Name

+

John Honai

+
+
+

UHID

+

T105690908240017

+
+
+

Age/Sex

+

58/Male

+
+
+
+ +
+
+ {orderData.map((order) => ( +
+ toggleOrder(order.orderId)} + > +
+
+
+
+ + Order id + +
+ + {order.orderId} + + + {order.status} + +
+
+
+ + Specimen to be collected:{" "} + + {order.samples[0]?.specimenType} + + +
+ + + +
+
+
+ + {/* Expanded Content */} + +
+
+
+
+ {/* Left Section */} +
+

+ Test +

+

{order.test}

+
+ + {/* Right Section */} +
+

+ Order Placed by +

+
+

+ Dr. Jahnab Dutta, +

+

+ Cardiologist +

+
+ +

+ Order Date/Time +

+

+ 28-Nov-2024, 2:30PM +

+ +

+ Priority +

+ + Stat + +
+
+ {/* Note Section */} +
+

+ Note: +

+

+ Prescribed CBC to check for anemia or infection +

+
+
+ +
+
+
+
+
+ +
+
+ + Specimen Collected by: + + + Aisha Mohamed + +
+ + on 28 Nov 3:32 PM + +
+
+
+
+
+
+ +
+
+ + Specimen Send to lab by: + + + Sanjay Patel + +
+ + on 28 Nov 4:56 PM + +
+
+
+
+
+
+ +
+
+ + Specimen Recieved at lab{" "} + + Medcore Laboratories + + by: + + + Amar singh + +
+ + on 29 Nov 10:10 AM + +
+
+
+
+
+
+ +
+
+ + Test conducted and results entered by: + + + Sam George + +
+ + on 29 Nov 2:22 PM + +
+
+
+
+
+
+
+

+ Test Results: +

+ + + + + Parameter + + + Result + + + Unit + + + Reference Range + + Remark + + + + {testResults.map((test, index) => ( + + {test.parameter} + {test.result} + {test.unit} + {test.referenceRange} + {test.remark} + + ))} + +
+ +
+

+ Note +

+