feat:update web

2026-05-24 23:33:43 +07:00
parent b6ccde2c74
commit b0baa509d9
58 changed files with 4920 additions and 292 deletions
@@ -0,0 +1,123 @@
+"use client";
+
+import { QUERY_KEY } from "@/constant/config/enum";
+import { httpRequest } from "@/services";
+import prescriptionServices, {
+  PrescriptionDetail,
+} from "@/services/prescriptionServices";
+import { useQuery } from "@tanstack/react-query";
+import { useParams } from "next/navigation";
+import React from "react";
+
+const DetailPrescription = () => {
+  const params = useParams();
+  const PrescriptionId = params?.id as string;
+
+  const prescriptionDetailQuery = useQuery<PrescriptionDetail>({
+    queryKey: [QUERY_KEY.chi_tiet_don_thuoc, PrescriptionId],
+
+    enabled: !!PrescriptionId,
+
+    queryFn: async () => {
+      const res = await httpRequest<PrescriptionDetail>({
+        showMessageFailed: true,
+
+        http: prescriptionServices.detailPrescription(PrescriptionId),
+      });
+
+      return (
+        res || {
+          id: "",
+          examinationSessionId: "",
+          prescriptionCode: "",
+          prescriptionImg: null,
+          notes: "",
+          createdBy: "",
+          items: [],
+        }
+      );
+    },
+  });
+
+  const data = prescriptionDetailQuery.data;
+
+  return (
+    <div className="p-6 bg-white rounded-lg shadow">
+      <h1 className="text-xl font-semibold mb-4">Chi tiết đơn thuốc</h1>
+
+      {/* LOADING */}
+      {prescriptionDetailQuery.isLoading && <p>Đang tải...</p>}
+
+      {/* ERROR */}
+      {prescriptionDetailQuery.isError && (
+        <p className="text-red-500">Lỗi tải dữ liệu</p>
+      )}
+
+      {/* CONTENT */}
+      {data && (
+        <div className="space-y-4">
+          <div>
+            <strong>Mã đơn thuốc:</strong> {data.prescriptionCode}
+          </div>
+
+          <div>
+            <strong>Phiên khám:</strong> {data.examinationSessionId}
+          </div>
+
+          <div>
+            <strong>Ghi chú:</strong> {data.notes || "-"}
+          </div>
+
+          {/* IMAGE */}
+          <div>
+            <strong>Ảnh đơn thuốc:</strong>
+            <div className="mt-2">
+              {data.prescriptionImg ? (
+                <img
+                  src={data.prescriptionImg}
+                  alt="prescription"
+                  className="h-32 w-32 object-cover rounded"
+                />
+              ) : (
+                <span className="text-gray-400">Không có ảnh</span>
+              )}
+            </div>
+          </div>
+
+          {/* ITEMS */}
+          <div>
+            <strong>Danh sách thuốc:</strong>
+
+            <div className="mt-2 space-y-2">
+              {data.items?.length ? (
+                data.items.map((item, index) => (
+                  <div key={item.id || index} className="p-3 border rounded">
+                    <p>
+                      <b>Tên thuốc:</b> {item.medicineName}
+                    </p>
+                    <p>
+                      <b>Liều lượng:</b> {item.dosage}
+                    </p>
+                    <p>
+                      <b>Tần suất:</b> {item.frequency}
+                    </p>
+                    <p>
+                      <b>Thời gian:</b> {item.duration}
+                    </p>
+                    <p>
+                      <b>Hướng dẫn:</b> {item.instructions}
+                    </p>
+                  </div>
+                ))
+              ) : (
+                <p className="text-gray-400">Không có thuốc</p>
+              )}
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default DetailPrescription;