diff --git a/app/components/content/sep/entry.vue b/app/components/content/sep/entry.vue
index 61107232..2015570c 100644
--- a/app/components/content/sep/entry.vue
+++ b/app/components/content/sep/entry.vue
@@ -1,24 +1,45 @@
 <script setup lang="ts">
+import { ref } from 'vue'
+import { getPatients } from '~/services/patient.service'
+
 const openPatient = ref(false)
 const openLetter = ref(false)
 const openHistory = ref(false)
 const selectedPatient = ref('3456512345678880')
 const selectedLetter = ref('SK22334442')
 
-const patients = [
-  {
-    ktp: '3456512345678880',
-    rm: 'RM23311224',
-    bpjs: '334423213214',
-    nama: 'Ahmad Baidowi',
-  },
-  {
-    ktp: '345678804565123',
-    rm: 'RM23455667',
-    bpjs: '33442367656',
-    nama: 'Bian Maulana',
-  },
-]
+// patients used by AppSepTableSearchPatient (will be filled from API)
+const patients = ref<Array<{ ktp: string; rm: string; bpjs: string; nama: string }>>([
+  // fallback empty list until fetched
+])
+const isPatientsLoading = ref(false)
+
+function mapPatientToRow(p: any) {
+  // Defensive mapping: try common field names that might be returned by the API
+  const ktp = p.ktp || p.noKtp || p.ktpNumber || p.person?.identityNo || ''
+  const rm = p.rm || p.noRm || p.medicalRecordNo || ''
+  const bpjs = p.bpjs || p.noBpjs || p.bpjsNo || ''
+  const nama = p.nama || p.name || p.fullName || p.person?.name || p.person?.fullName || p.person?.nama || ''
+  return { ktp, rm, bpjs, nama }
+}
+
+async function fetchPatients(params: any = { 'page-size': 100 }) {
+  try {
+    isPatientsLoading.value = true
+    const result = await getPatients(params)
+    if (result && result.success && result.body && Array.isArray(result.body.data)) {
+      patients.value = result.body.data.map(mapPatientToRow)
+    } else {
+      // fallback to empty array
+      patients.value = []
+    }
+  } catch (err) {
+    console.error('Failed to fetch patients for SEP search:', err)
+    patients.value = []
+  } finally {
+    isPatientsLoading.value = false
+  }
+}
 
 const letters = [
   {
@@ -70,7 +91,10 @@ function handleSaveLetter() {
 
 function handleEvent(value: string) {
   if (value === 'search-patient') {
-    openPatient.value = true
+    // fetch patients from API then open the dialog
+    fetchPatients().then(() => {
+      openPatient.value = true
+    })
     return
   }
   if (value === 'search-letter') {