diff --git a/app/components/app/encounter/entry-form.vue b/app/components/app/encounter/entry-form.vue
index 446c9e17..117f0c3a 100644
--- a/app/components/app/encounter/entry-form.vue
+++ b/app/components/app/encounter/entry-form.vue
@@ -10,6 +10,7 @@ import Select from '~/components/pub/ui/select/Select.vue'
 import Combobox from '~/components/pub/my-ui/combobox/combobox.vue'
 import DatepickerSingle from '~/components/pub/my-ui/datepicker/datepicker-single.vue'
 import TreeSelect from '~/components/pub/my-ui/select-tree/tree-select.vue'
+import FileUpload from '~/components/pub/my-ui/form/file-field.vue'
 
 // Types
 import { IntegrationEncounterSchema, type IntegrationEncounterFormData } from '~/schemas/integration-encounter.schema'
@@ -59,10 +60,6 @@ const [medicalRecordNumber, medicalRecordNumberAttrs] = defineField('medicalReco
 const mode = props.isLoading !== undefined ? props.isLoading : false
 const isReadonly = props.isReadonly !== undefined ? props.isReadonly : false
 
-// File refs
-const sepFileInput = ref<HTMLInputElement | null>(null)
-const sippFileInput = ref<HTMLInputElement | null>(null)
-
 const doctorOpts = computed(() => {
   // Add default option
   const defaultOption = [{ label: 'Pilih', value: '' }]
@@ -114,25 +111,6 @@ watch(props, (value) => {
   }
 })
 
-// File handling functions
-function pickSepFile() {
-  sepFileInput.value?.click()
-}
-
-function pickSippFile() {
-  sippFileInput.value?.click()
-}
-
-function onSepFileChange(e: Event) {
-  const f = (e.target as HTMLInputElement).files?.[0]
-  console.log('sep file', f)
-}
-
-function onSippFileChange(e: Event) {
-  const f = (e.target as HTMLInputElement).files?.[0]
-  console.log('sipp file', f)
-}
-
 function onAddSep() {
   const formValues = {
     patientName: patientName.value,
@@ -416,57 +394,21 @@ const onSubmit = handleSubmit((values) => {
             </Field>
           </Cell>
 
-          <Cell>
-            <Label height="compact">Dokumen SEP</Label>
-            <Field>
-              <div class="flex items-center gap-2">
-                <input
-                  ref="sepFileInput"
-                  type="file"
-                  class="hidden"
-                  @change="onSepFileChange"
-                />
-                <Button
-                  variant="ghost"
-                  size="sm"
-                  class="bg-primary"
-                  @click.prevent="pickSepFile"
-                >
-                  Pilih Berkas
-                </Button>
-                <Input
-                  readonly
-                  placeholder="Unggah dokumen SEP"
-                />
-              </div>
-            </Field>
-          </Cell>
-
-          <Cell>
-            <Label height="compact">Dokumen SIPP</Label>
-            <Field>
-              <div class="flex items-center gap-2">
-                <input
-                  ref="sippFileInput"
-                  type="file"
-                  class="hidden"
-                  @change="onSippFileChange"
-                />
-                <Button
-                  variant="ghost"
-                  size="sm"
-                  class="bg-primary"
-                  @click.prevent="pickSippFile"
-                >
-                  Pilih Berkas
-                </Button>
-                <Input
-                  readonly
-                  placeholder="Unggah dokumen SIPP"
-                />
-              </div>
-            </Field>
-          </Cell>
+          <FileUpload
+            field-name="sepFile"
+            label="Dokumen SEP"
+            placeholder="Unggah dokumen SEP"
+            :accept="['pdf', 'jpg', 'png']"
+            :max-size-mb="1"
+          />
+          
+          <FileUpload
+            field-name="sippFile"
+            label="Dokumen SIPP"
+            placeholder="Unggah dokumen SIPP"
+            :accept="['pdf', 'jpg', 'png']"
+            :max-size-mb="1"
+          />
         </Block>
       </template>
 
diff --git a/app/components/app/sep/entry-form.vue b/app/components/app/sep/entry-form.vue
index 93cf02fb..cf45fa40 100644
--- a/app/components/app/sep/entry-form.vue
+++ b/app/components/app/sep/entry-form.vue
@@ -118,6 +118,10 @@ watch(props, (value) => {
     nationalId.value = objects?.nationalIdentity || '-'
     medicalRecordNumber.value = objects?.medicalRecordNumber || '-'
     patientName.value = objects?.patientName || '-'
+    // Set admission type to 1 (rujukan) if sepType exists in query params
+    if (objects?.sepType) {
+      admissionType.value = '1'
+    }
   }
   if (Object.keys(patient).length > 0) {
     bpjsNumber.value = '-'
@@ -327,13 +331,14 @@ onMounted(() => {
                 v-model="referralLetterNumber"
                 v-bind="referralLetterNumberAttrs"
                 :disabled="isLoading || isReadonly"
+                @change="emit('event', 'search-letter', { admissionType, serviceType, search: $event })"
               />
               <Button
                 variant="outline"
                 type="button"
                 class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
                 @click="
-                  emit('event', 'search-letter', { admissionType, serviceType, search: referralLetterNumber || '' })
+                  emit('event', 'open-letter', { admissionType, serviceType, search: referralLetterNumber || '' })
                 "
               >
                 <Icon
@@ -357,7 +362,7 @@ onMounted(() => {
               v-model="referralLetterDate"
               v-bind="referralLetterDateAttrs"
               :disabled="true"
-              placeholder="Pilih tanggal surat kontrol"
+              placeholder="Pilih tanggal surat"
             />
           </Field>
         </Cell>
diff --git a/app/components/content/sep/entry.vue b/app/components/content/sep/entry.vue
index dd863794..7f273927 100644
--- a/app/components/content/sep/entry.vue
+++ b/app/components/content/sep/entry.vue
@@ -181,31 +181,32 @@ async function getLetterMappers(admissionType: string, search: string) {
   }
   if (result && result.success && result.body) {
     const lettersRaw = result.body?.response || null
-    console.log(lettersRaw)
-    //   {
-    //   noSurat: 'SK22334442',
-    //   tglRencana: '12 Agustus 2025',
-    //   noSep: 'SEP3232332',
-    //   namaPasien: 'Ahmad Baidowi',
-    //   noBpjs: '33442331214',
-    //   klinik: 'Penyakit Dalam',
-    //   dokter: 'dr. Andi Prasetyo, Sp.PD-KHOM',
-    // },
-
-    // {
-    //   noSurat: 'SK99120039',
-    //   tglRencana: '12 Agustus 2025',
-    //   noSep: 'SEP4443232',
-    //   namaPasien: 'Bian Maulana',
-    //   noBpjs: '33442367656',
-    //   klinik: 'Gigi',
-    //   dokter: 'dr. Achmad Suparjo',
-    // },
-
     if (!lettersRaw) return
-    lettersRaw.forEach((result: any) => {
-      // letters.value.push({})
-    })
+    if (admissionType === '3') {
+      letters.value = [
+        {
+          letterNumber: lettersRaw.noSuratKontrol || '',
+          plannedDate: lettersRaw.tglRencanaKontrol || '',
+          sepNumber: lettersRaw.sep.noSep || '',
+          patientName: lettersRaw.sep.peserta.nama || '',
+          bpjsCardNo: lettersRaw.sep.peserta.noKartu,
+          clinic: lettersRaw.sep.poli || '',
+          doctor: lettersRaw.sep.namaDokter || '',
+        },
+      ]
+    } else {
+      letters.value = [
+        {
+          letterNumber: lettersRaw.rujukan.noRujukan || '',
+          plannedDate: lettersRaw.rujukan.tglKunjungan || '',
+          sepNumber: lettersRaw.rujukan.informasi.eSEP || '',
+          patientName: lettersRaw.rujukan.peserta.nama || '',
+          bpjsCardNo: lettersRaw.rujukan.peserta.noKartu || '',
+          clinic: lettersRaw.rujukan.poliRujukan.nama || '',
+          doctor: lettersRaw.rujukan.namaDokter || '',
+        },
+      ]
+    }
   }
 }
 
@@ -240,7 +241,14 @@ async function handleEvent(menu: string, value: any) {
     return
   }
   if (menu === 'search-letter') {
+    getLetterMappers(value.admissionType, value.search).then(() => {
+      console.log('letters:', letters.value)
+    })
+    return
+  }
+  if (menu === 'open-letter') {
     openLetter.value = true
+    return
   }
   if (menu === 'history-sep') {
     getMonitoringHistoryMappers().then(() => {