diff --git a/app/components/app/patient/list-cfg.ts b/app/components/app/patient/list-cfg.ts
index 4fbdf694..fa91ba23 100644
--- a/app/components/app/patient/list-cfg.ts
+++ b/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) {
diff --git a/app/components/app/patient/preview.vue b/app/components/app/patient/preview.vue
index ef24c771..a7e174b1 100644
--- a/app/components/app/patient/preview.vue
+++ b/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
diff --git a/app/components/content/patient/detail.vue b/app/components/content/patient/detail.vue
index eb73f2ff..ec8a20e8 100644
--- a/app/components/content/patient/detail.vue
+++ b/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>
diff --git a/app/components/content/patient/entry.vue b/app/components/content/patient/entry.vue
index 6aac59f6..dda8f62e 100644
--- a/app/components/content/patient/entry.vue
+++ b/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)
diff --git a/app/models/patient.ts b/app/models/patient.ts
index 75b38fc6..04112e87 100644
--- a/app/models/patient.ts
+++ b/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
diff --git a/app/models/person-relative.ts b/app/models/person-relative.ts
index 3b140abb..0391b63a 100644
--- a/app/models/person-relative.ts
+++ b/app/models/person-relative.ts
@@ -12,3 +12,4 @@ export interface PersonRelative {
   occupation_code?: string
   responsible?: boolean
 }
+