munawwirul_jamal/simrsx-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: improves encounter detail rendering and data mapping

Browse Source
This commit is contained in:
riefive
2025-11-14 15:02:49 +07:00
parent 0d4accc281
commit 840efeba8c
4 changed files with 240 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/app/encounter/quick-info-full.vue
+91 -79
View File
@@ -75,7 +75,7 @@ const genderLabel = computed(() => {
const paymentTypeLabel = computed(() => {
const code = props.data.paymentMethod_code
if (!code) return '-'
// Map payment method codes
if (code === 'insurance') {
return 'JKN'
@@ -88,12 +88,12 @@ const paymentTypeLabel = computed(() => {
} else if (code === 'pks') {
return 'PKS'
}
// Try to get from paymentTypes constant
if (paymentTypes[code]) {
return paymentTypes[code].split(' ')[0] // Get first part (e.g., "JKN" from "JKN (Jaminan...)")
}
return code
})
@@ -138,91 +138,103 @@ const bedNumber = computed(() => {
<template>
<div class="w-full rounded-md border bg-white p-4 shadow-sm dark:bg-neutral-950">
<!-- Data Pasien -->
<h2 class="mb-4 font-semibold text-base md:text-lg 2xl:text-xl">
Data Pasien:
</h2>
<h2 class="mb-4 text-base font-semibold md:text-lg 2xl:text-xl">Data Pasien:</h2>
<DE.Block
mode="preview"
labelSize="large"
>
<DE.Cell>
<DE.Label class="font-semibold">No. RM</DE.Label>
<DE.Field>
<!-- 4 Column Grid Layout -->
<div class="grid grid-cols-1 gap-4 sm:grid-cols-4">
<!-- No. RM -->
<div class="flex gap-2">
<label class="w-[100px] flex-none text-sm font-semibold text-gray-700 dark:text-gray-300">No. RM</label>
<label class="w-[20px] flex-none">:</label>
<p class="flex-1 text-sm text-gray-900 dark:text-gray-100">
{{ data.patient.number || '-' }}
</DE.Field>
</DE.Cell>
</p>
</div>
<DE.Cell>
<DE.Label class="font-semibold">Nama Pasien</DE.Label>
<DE.Field>
{{ data.patient.person.name || '-' }}
</DE.Field>
</DE.Cell>
<DE.Cell>
<DE.Label class="font-semibold">Alamat</DE.Label>
<DE.Field>
{{ address }}
</DE.Field>
</DE.Cell>
<DE.Cell>
<DE.Label class="font-semibold">Tanggal Lahir</DE.Label>
<DE.Field>
<!-- Tanggal Lahir -->
<div class="flex gap-2">
<label class="w-[100px] flex-none text-sm font-semibold text-gray-700 dark:text-gray-300">Tanggal Lahir</label>
<label class="w-[20px] flex-none">:</label>
<p class="flex-1 text-sm text-gray-900 dark:text-gray-100">
{{ birthDateFormatted }}
</DE.Field>
</DE.Cell>
</p>
</div>
<DE.Cell>
<DE.Label class="font-semibold">Tanggal Masuk RS</DE.Label>
<DE.Field>
{{ registeredDateFormatted }}
</DE.Field>
</DE.Cell>
<DE.Cell>
<DE.Label class="font-semibold">Jenis Kelamin</DE.Label>
<DE.Field>
{{ genderLabel }}
</DE.Field>
</DE.Cell>
<DE.Cell>
<DE.Label class="font-semibold">Jenis Pembayaran</DE.Label>
<DE.Field>
<!-- Jenis Pembayaran -->
<div class="flex gap-2">
<label class="w-[100px] flex-none text-sm font-semibold text-gray-700 dark:text-gray-300">
Jenis Pembayaran
</label>
<label class="w-[20px] flex-none">:</label>
<p class="flex-1 text-sm text-gray-900 dark:text-gray-100">
{{ paymentTypeLabel }}
</DE.Field>
</DE.Cell>
</p>
</div>
<DE.Cell>
<DE.Label class="font-semibold">No. Billing</DE.Label>
<DE.Field>
{{ billingNumber }}
</DE.Field>
</DE.Cell>
<DE.Cell>
<DE.Label class="font-semibold">Nama Ruang</DE.Label>
<DE.Field>
{{ roomName }}
</DE.Field>
</DE.Cell>
<DE.Cell>
<DE.Label class="font-semibold">No Bed</DE.Label>
<DE.Field>
<!-- No Bed -->
<div class="flex gap-2">
<label class="w-[100px] flex-none text-sm font-semibold text-gray-700 dark:text-gray-300">No Bed</label>
<label class="w-[20px] flex-none">:</label>
<p class="flex-1 text-sm text-gray-900 dark:text-gray-100">
{{ bedNumber }}
</DE.Field>
</DE.Cell>
</p>
</div>
<DE.Cell>
<DE.Label class="font-semibold">DPJP</DE.Label>
<DE.Field>
<!-- Nama Pasien -->
<div>
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">Nama Pasien</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ data.patient.person.name || '-' }}
</p>
</div>
<!-- Jenis Kelamin -->
<div>
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">Jenis Kelamin</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ genderLabel }}
</p>
</div>
<!-- Alamat (spans 2 columns on lg) -->
<div class="lg:col-span-2">
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">Alamat</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ address }}
</p>
</div>
<!-- Tanggal Masuk RS -->
<div>
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">Tanggal Masuk RS</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ registeredDateFormatted }}
</p>
</div>
<!-- No. Billing -->
<div>
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">No. Billing</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ billingNumber }}
</p>
</div>
<!-- Nama Ruang -->
<div>
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">Nama Ruang</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ roomName }}
</p>
</div>
<!-- DPJP (spans 2 columns on lg) -->
<div class="lg:col-span-2">
<label class="text-sm font-semibold text-gray-700 dark:text-gray-300">DPJP</label>
<p class="mt-1 text-sm text-gray-900 dark:text-gray-100">
{{ dpjp }}
</DE.Field>
</DE.Cell>
</DE.Block>
</p>
</div>
</div>
</div>
</template>