refactor(patient): rename PatientEntity to Patient and update related components

Update interface name from PatientEntity to Patient for better clarity and consistency. Modify all related components and models to use the new interface name. Also includes minor improvements to address handling in patient forms.

app/components/app/patient/list-cfg.ts

@@ -6,7 +6,7 @@ import type {
   RecStrFuncUnknown,
   Th,
 } from '~/components/pub/my-ui/data/types'
-import type { PatientEntity } from '~/models/patient'
+import type { Patient } from '~/models/patient'
 import { defineAsyncComponent } from 'vue'
 import { educationCodes, genderCodes } from '~/lib/constants'
 import { calculateAge } from '~/lib/utils'
@@ -36,11 +36,11 @@ export const delKeyNames: KeyLabel[] = [
 
 export const funcParsed: RecStrFuncUnknown = {
   name: (rec: unknown): unknown => {
-    const { person } = rec as PatientEntity
+    const { person } = rec as Patient
     return person.name.trim()
   },
   identity_number: (rec: unknown): unknown => {
-    const { person } = rec as PatientEntity
+    const { person } = rec as Patient
 
     if (person?.residentIdentityNumber?.substring(0, 5) === 'BLANK') {
       return '(TANPA NIK)'
@@ -48,7 +48,7 @@ export const funcParsed: RecStrFuncUnknown = {
     return person.residentIdentityNumber
   },
   birth_date: (rec: unknown): unknown => {
-    const { person } = rec as PatientEntity
+    const { person } = rec as Patient
 
     if (typeof person.birthDate == 'object' && person.birthDate) {
       return (person.birthDate as Date).toLocaleDateString()
@@ -58,11 +58,11 @@ export const funcParsed: RecStrFuncUnknown = {
     return person.birthDate
   },
   patient_age: (rec: unknown): unknown => {
-    const { person } = rec as PatientEntity
+    const { person } = rec as Patient
     return calculateAge(person.birthDate)
   },
   gender: (rec: unknown): unknown => {
-    const { person } = rec as PatientEntity
+    const { person } = rec as Patient
 
     if (typeof person.gender_code == 'number' && person.gender_code >= 0) {
       return person.gender_code
@@ -72,7 +72,7 @@ export const funcParsed: RecStrFuncUnknown = {
     return '-'
   },
   education: (rec: unknown): unknown => {
-    const { person } = rec as PatientEntity
+    const { person } = rec as Patient
     if (typeof person.education_code == 'number' && person.education_code >= 0) {
       return person.education_code
     } else if (typeof person.education_code === 'string' && person.education_code) {

app/components/app/patient/preview.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import type { Person } from '~/models/person'
+import type { Patient } from '~/models/patient'
 import DetailRow from '~/components/pub/my-ui/form/view/detail-row.vue'
 import DetailSection from '~/components/pub/my-ui/form/view/detail-section.vue'
-import { type PersonAddress, formatAddress } from '~/models/person-address'
+import { formatAddress } from '~/models/person-address'
 
 import {
   addressLocationTypeCode,
@@ -17,7 +17,7 @@ import { mapToComboboxOptList } from '~/lib/utils'
 
 // #region Props & Emits
 const props = defineProps<{
-  person: Person
+  patient: Patient
 }>()
 
 const emit = defineEmits<{
@@ -36,22 +36,22 @@ const personContactTypeOptions = mapToComboboxOptList(personContactTypes)
 
 // Computed addresses from nested data
 const domicileAddress = computed(() => {
-  const addresses = props.person.addresses
+  const addresses = props.patient.person.addresses
   const resident = addresses?.find((addr) => addr.locationType === 'domicile')
   return formatAddress(resident)
 })
 
 const identityAddress = computed(() => {
-  const addresses = props.person.addresses
+  const addresses = props.patient.person.addresses
   const primary = addresses?.find((addr) => addr.locationType === 'identity')
   return formatAddress(primary)
 })
 
 const patientAge = computed(() => {
-  if (!props.person.birthDate) {
+  if (!props.patient.person.birthDate) {
     return '-'
   }
-  const birthDate = new Date(props.person.birthDate)
+  const birthDate = new Date(props.patient.person.birthDate)
   const today = new Date()
   let age = today.getFullYear() - birthDate.getFullYear()
   const monthDiff = today.getMonth() - birthDate.getMonth()
@@ -81,35 +81,37 @@ function onClick(type: string) {
 
 <template>
   <DetailSection title="Data Pasien">
-    <DetailRow label="Nomor ID">{{ person.id || '-' }}</DetailRow>
-    <DetailRow label="Nama Lengkap">{{ person.name || '-' }}</DetailRow>
+    <DetailRow label="Nomor">{{ patient.number || '-' }}</DetailRow>
+    <DetailRow label="Nama Lengkap">{{ patient.person.name || '-' }}</DetailRow>
     <DetailRow label="Tempat, tanggal lahir">
-      {{ person.birthRegency?.name || '-' }},
-      {{ person.birthDate ? new Date(person.birthDate).toLocaleDateString() : '-' }}
+      {{ patient.person.birthRegency?.name || '-' }},
+      {{ patient.person.birthDate ? new Date(patient.person.birthDate).toLocaleDateString() : '-' }}
     </DetailRow>
-    <DetailRow label="Usia">{{ patientAge || '-' }}</DetailRow>
+    <DetailRow label="Usia">{{ patientAge || '-' }} Tahun</DetailRow>
     <DetailRow label="Tanggal Daftar">
-      {{ person.createdAt ? new Date(person.createdAt).toLocaleDateString() : '-' }}
+      {{ patient.person.createdAt ? new Date(patient.person.createdAt).toLocaleDateString() : '-' }}
     </DetailRow>
     <DetailRow label="Jenis Kelamin">
-      {{ genderOptions.find((item) => item.code === person.gender_code)?.label || '-' }}
+      {{ genderOptions.find((item) => item.code === patient.person.gender_code)?.label || '-' }}
     </DetailRow>
 
-    <DetailRow label="NIK">{{ person.residentIdentityNumber || '-' }}</DetailRow>
-    <DetailRow label="No. SIM">{{ person.drivingLicenseNumber || '-' }}</DetailRow>
-    <DetailRow label="No. Paspor">{{ person.passportNumber || '-' }}</DetailRow>
+    <DetailRow label="NIK">{{ patient.person.residentIdentityNumber || '-' }}</DetailRow>
+    <DetailRow label="No. SIM">{{ patient.person.drivingLicenseNumber || '-' }}</DetailRow>
+    <DetailRow label="No. Paspor">{{ patient.person.passportNumber || '-' }}</DetailRow>
 
     <DetailRow label="Agama">
-      {{ religionOptions.find((item) => item.code === person.religion_code)?.label || '-' }}
+      {{ religionOptions.find((item) => item.code === patient.person.religion_code)?.label || '-' }}
     </DetailRow>
-    <DetailRow label="Suku">{{ person.ethnic_code || '-' }}</DetailRow>
-    <DetailRow label="Bahasa">{{ person.language_code || '-' }}</DetailRow>
+    <DetailRow label="Suku">{{ patient.person.ethnic?.name || '-' }}</DetailRow>
+    <DetailRow label="Bahasa">{{ patient.person.language?.name || '-' }}</DetailRow>
     <DetailRow label="Pendidikan">
-      {{ educationOptions.find((item) => item.code === person.education_code)?.label || '-' }}
+      {{ educationOptions.find((item) => item.code === patient.person.education_code)?.label || '-' }}
     </DetailRow>
     <DetailRow label="Pekerjaan">
       {{
-        occupationOptions.find((item) => item.code === person.occupation_code)?.label || person.occupation_name || '-'
+        occupationOptions.find((item) => item.code === patient.person.occupation_code)?.label ||
+        patient.person.occupation_name ||
+        '-'
       }}
     </DetailRow>
   </DetailSection>
@@ -119,13 +121,13 @@ function onClick(type: string) {
     <DetailRow :label="addressLocationTypeCode.identity || 'Alamat KTP'">{{ identityAddress || '-' }}</DetailRow>
   </DetailSection>
   <DetailSection title="Kontak">
-    <template v-if="person.contacts && person.contacts.length > 0">
+    <template v-if="patient.person.contacts && patient.person.contacts.length > 0">
       <template
         v-for="contactType in personContactTypeOptions"
         :key="contactType.code"
       >
         <DetailRow :label="contactType.label">
-          {{ person.contacts.find((item) => item.type_code === contactType.code)?.value || '-' }}
+          {{ patient.person.contacts.find((item) => item.type_code === contactType.code)?.value || '-' }}
         </DetailRow>
       </template>
     </template>
@@ -133,10 +135,45 @@ function onClick(type: string) {
       <DetailRow label="Kontak">-</DetailRow>
     </template>
   </DetailSection>
-  <DetailSection title="Penanggung Jawab">
-    <template v-if="person.relatives && person.relatives.filter((rel) => rel.responsible).length > 0">
+  <DetailSection title="Orang Tua">
+    <template v-if="patient.person.relatives && patient.person.relatives.filter((rel) => !rel.responsible).length > 0">
       <template
-        v-for="(relative, index) in person.relatives.filter((rel) => rel.responsible)"
+        v-for="(relative, index) in patient.person.relatives.filter((rel) => !rel.responsible)"
+        :key="relative.id"
+      >
+        <div
+          v-if="index > 0"
+          class="mt-3 border-t border-gray-200 pt-3"
+        ></div>
+        <DetailRow label="Nama">{{ relative.name || '-' }}</DetailRow>
+        <DetailRow label="Hubungan">
+          {{ relationshipOptions.find((item) => item.code === relative.relationship_code)?.label || '-' }}
+        </DetailRow>
+        <!-- <DetailRow label="Jenis Kelamin">
+          {{ genderOptions.find((item) => item.code === relative.gender_code)?.label || '-' }}
+        </DetailRow> -->
+        <DetailRow label="Pendidikan">
+          {{ educationOptions.find((item) => item.code === relative.education_code)?.label || '-' }}
+        </DetailRow>
+        <DetailRow label="Pekerjaan">
+          {{
+            occupationOptions.find((item) => item.code === relative.occupation_code)?.label ||
+            relative.occupation_name ||
+            '-'
+          }}
+        </DetailRow>
+        <!-- <DetailRow label="Alamat">{{ relative.address || '-' }}</DetailRow> -->
+        <!-- <DetailRow label="Nomor HP">{{ relative.phoneNumber || '-' }}</DetailRow> -->
+      </template>
+    </template>
+    <template v-else>
+      <DetailRow label="Orang Tua">-</DetailRow>
+    </template>
+  </DetailSection>
+  <DetailSection title="Penanggung Jawab">
+    <template v-if="patient.person.relatives && patient.person.relatives.filter((rel) => rel.responsible).length > 0">
+      <template
+        v-for="(relative, index) in patient.person.relatives.filter((rel) => rel.responsible)"
         :key="relative.id"
       >
         <div

app/components/content/patient/detail.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { withBase } from '~/models/_base'
 import type { HeaderPrep } from '~/components/pub/my-ui/data/types'
-import type { PatientEntity } from '~/models/patient'
+import type { Patient } from '~/models/patient'
 import type { Person } from '~/models/person'
 
 // Components
@@ -18,7 +18,7 @@ const props = defineProps<{
 
 // #region State & Computed
 const patient = ref(
-  withBase<PatientEntity>({
+  withBase<Patient>({
     person: {} as Person,
     personAddresses: [],
     personContacts: [],
@@ -74,7 +74,7 @@ function handleAction(type: string) {
     class="mb-4 border-b-2 border-b-slate-300 pb-2 xl:mb-5"
   />
   <AppPatientPreview
-    :person="patient.person"
+    :patient="patient"
     @click="handleAction"
   />
 </template>

app/components/content/patient/entry.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { PatientEntity, genPatientProps } from '~/models/patient'
+import type { Patient, genPatientProps } from '~/models/patient'
 import type { ExposedForm } from '~/types/form'
 import type { PatientBase } from '~/models/patient'
 import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
@@ -16,7 +16,7 @@ import { postPatient } from '~/services/patient.service'
 const props = defineProps<{
   callbackUrl?: string
 }>()
-const payload = ref<PatientEntity>()
+const payload = ref<Patient>()
 
 // form related state
 const personAddressForm = ref<ExposedForm<any> | null>(null)

app/models/patient.ts

@@ -21,7 +21,7 @@ export interface PatientBase extends Base {
   number?: string
 }
 
-export interface PatientEntity extends PatientBase {
+export interface Patient extends PatientBase {
   person: Person
   personAddresses: PersonAddress[]
   personContacts: PersonContact[]
@@ -37,16 +37,16 @@ export interface genPatientProps {
   responsible: PersonRelativeFormData
 }
 
-export function genPatient(props: genPatientProps): PatientEntity {
+export function genPatient(props: genPatientProps): Patient {
   const { patient, residentAddress, cardAddress, familyData, contacts, responsible } = props
 
-  const addresses: PersonAddress[] = [{ ...genBase(), person_id: 0, locationType: '', ...residentAddress }]
+  const addresses: PersonAddress[] = [{ ...genBase(), person_id: 0, ...residentAddress }]
   const familiesContact: PersonRelative[] = []
   const personContacts: PersonContact[] = []
 
   // jika alamat ktp sama dengan domisili saat ini
   if (cardAddress.isSameAddress) {
-    addresses.push({ ...genBase(), person_id: 0, locationType: '', ...residentAddress })
+    addresses.push({ ...genBase(), ...residentAddress, person_id: 0, locationType: 'identity' })
   }
 
   // add data orang tua

app/models/person-relative.ts

@@ -12,3 +12,4 @@ export interface PersonRelative {
   occupation_code?: string
   responsible?: boolean
 }
+