✨ feat (rehab): implement rehab registration home component

2025-09-23 23:05:22 +07:00
parent 03697f9cea
commit 887db6f2a2
7 changed files with 287 additions and 42 deletions
@@ -10,7 +10,7 @@ import { defineAsyncComponent } from 'vue'

 type SmallDetailDto = any

-const action = defineAsyncComponent(() => import('~/components/pub/custom-ui/data/dropdown-action-dud.vue'))
+const action = defineAsyncComponent(() => import('~/components/pub/custom-ui/data/dropdown-action-pdud.vue'))
 const statusBadge = defineAsyncComponent(() => import('./status-badge.vue'))

 export const cols: Col[] = [
@@ -0,0 +1,75 @@
+<script setup lang="ts">
+interface PatientData {
+  noRm: string
+  nama: string
+  alamat: string
+  tanggalKunjungan: string
+  klinik: string
+  tanggalLahir: string
+  jenisKelamin: string
+  jenisPembayaran: string
+  noBilling: string
+  dpjp: string
+}
+
+defineProps<{
+  data: PatientData
+}>()
+</script>
+
+<template>
+  <div class="w-full rounded-md border bg-white p-4 shadow-sm">
+    <!-- Data Pasien -->
+    <h2 class="mb-2 text-base font-semibold">Data Pasien:</h2>
+
+    <div class="grid grid-cols-1 gap-y-2 text-sm md:grid-cols-2 lg:grid-cols-3">
+      <!-- col 1 -->
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">No. RM</span>
+        <span>: {{ data.noRm }}</span>
+      </div>
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">Tanggal Kunjungan</span>
+        <span>: {{ data.tanggalKunjungan }}</span>
+      </div>
+      <div class="grid grid-cols-[100px_auto]">
+        <span class="font-medium">Klinik</span>
+        <span>: {{ data.klinik }}</span>
+      </div>
+
+      <!-- col 2 -->
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">Nama Pasien</span>
+        <span>: {{ data.nama }}</span>
+      </div>
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">Tanggal Lahir</span>
+        <span>: {{ data.tanggalLahir }}</span>
+      </div>
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">Jenis Pembayaran</span>
+        <span>: {{ data.jenisPembayaran }}</span>
+      </div>
+
+      <!-- col 3 -->
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">Alamat</span>
+        <span>: {{ data.alamat }}</span>
+      </div>
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">Jenis Kelamin</span>
+        <span>: {{ data.jenisKelamin }}</span>
+      </div>
+      <div class="grid grid-cols-[140px_auto]">
+        <span class="font-medium">No. Billing</span>
+        <span>: {{ data.noBilling }}</span>
+      </div>
+
+      <!-- full row -->
+      <div class="grid grid-cols-[140px_auto] lg:col-span-3">
+        <span class="font-medium">DPJP</span>
+        <span>: {{ data.dpjp }}</span>
+      </div>
+    </div>
+  </div>
+</template>