From 53b40ec732948e856c4a40881c84787e22586979 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 13:02:14 +0700
Subject: [PATCH 01/15] feat: Implement patient encounter management with entry
 form, SEP integration, and list views.

---
 app/components/app/encounter/entry-form.vue   |   1 +
 app/components/app/encounter/list.cfg.ts      | 150 ++++++++++++++++--
 app/components/app/encounter/list.vue         |   7 +-
 .../app/encounter/vclaim-sep-info.vue         |  33 ++++
 app/components/content/encounter/list.vue     |  22 ++-
 app/handlers/encounter-entry.handler.ts       |   4 +-
 6 files changed, 195 insertions(+), 22 deletions(-)
 create mode 100644 app/components/app/encounter/vclaim-sep-info.vue

diff --git a/app/components/app/encounter/entry-form.vue b/app/components/app/encounter/entry-form.vue
index 46ad2db7..56e0383b 100644
--- a/app/components/app/encounter/entry-form.vue
+++ b/app/components/app/encounter/entry-form.vue
@@ -187,6 +187,7 @@ function onAddSep() {
     registerDate: registerDate.value,
     cardNumber: cardNumber.value,
     paymentMethodCode: paymentMethodCode.value,
+    unitCode: props.selectedDoctor?.unit?.code || '',
     sepFile: sepFile.value,
     sippFile: sippFile.value,
     sepType: sepType.value,
diff --git a/app/components/app/encounter/list.cfg.ts b/app/components/app/encounter/list.cfg.ts
index cc0b951c..442233cc 100644
--- a/app/components/app/encounter/list.cfg.ts
+++ b/app/components/app/encounter/list.cfg.ts
@@ -1,25 +1,18 @@
 import type { Config, RecComponent } from '~/components/pub/my-ui/data-table'
 import { defineAsyncComponent } from 'vue'
 import type { Encounter } from '~/models/encounter'
-import { educationCodes, genderCodes } from '~/lib/constants'
+import { formatAddress } from '~/models/person-address'
+import { educationCodes, encounterClassCodes, genderCodes } from '~/lib/constants'
 import { getAge } from '~/lib/date'
 
 type SmallDetailDto = Encounter
 
 const action = defineAsyncComponent(() => import('./dropdown-action.vue'))
 const statusBadge = defineAsyncComponent(() => import('./status-badge.vue'))
+const vclaimSepInfo = defineAsyncComponent(() => import('./vclaim-sep-info.vue'))
 
-export const config: Config = {
-  cols: [
-    {},
-    {},
-    {},
-    { width: 160 },
-    {},
-    { width: 70 },
-    { },
-    { width: 50 },
-  ],
+export const defaultConfig: Config = {
+  cols: [{}, {}, {}, { width: 160 }, {}, { width: 70 }, {}, { width: 50 }],
 
   headers: [
     [
@@ -94,11 +87,140 @@ export const config: Config = {
     birth_date: (rec: unknown): unknown => {
       const recX = rec as Encounter
       if (recX.patient?.person?.birthDate) {
-        return '' +
-          '<div>' + (recX.patient.person.birthDate as string).substring(0, 10) + ' / </div>' +
+        return (
+          '' +
+          '<div>' +
+          (recX.patient.person.birthDate as string).substring(0, 10) +
+          ' / </div>' +
           getAge(recX.patient.person.birthDate as string).extFormat
+        )
       }
       return '-'
     },
   },
 }
+
+export const ambulatoryConfig: Config = {
+  cols: [{}, {}, {}, { width: 160 }, {}, { width: 70 }, {}, {}, {}, {}, {}, {}, { width: 50 }],
+
+  headers: [
+    [
+      { label: 'TANGGAL' },
+      { label: 'NO. RM' },
+      { label: 'NO. BILL' },
+      { label: 'NAMA PASIEN' },
+      { label: 'L/P' },
+      { label: 'ALAMAT' },
+      { label: 'KLINIK' },
+      { label: 'CARA BAYAR' },
+      { label: 'RUJUKAN' },
+      { label: 'KET. RUJUKAN' },
+      { label: 'ASAL' },
+      { label: 'SEP' },
+      { label: 'STATUS', classVal: '!text-center' },
+      { label: '' },
+    ],
+  ],
+
+  keys: [
+    'registeredAt',
+    'patientNumber',
+    'trxNumber',
+    'patient.person.name',
+    'gender',
+    'address',
+    'clinic',
+    'paymentMethod_code',
+    'referral',
+    'note',
+    'class_code',
+    'sep',
+    'status',
+    'action',
+  ],
+
+  delKeyNames: [
+    { key: 'code', label: 'Kode' },
+    { key: 'name', label: 'Nama' },
+  ],
+
+  parses: {
+    registeredAt: (rec: unknown): unknown => {
+      const recX = rec as Encounter
+      return recX.registeredAt ? (recX.registeredAt as string).substring(0, 10) : '-'
+    },
+    patientNumber: (rec: unknown): unknown => {
+      const recX = rec as any
+      return recX.patient?.number || '-'
+    },
+    trxNumber: (rec: unknown): unknown => {
+      const recX = rec as any
+      return recX.trx_number || '-'
+    },
+    gender: (rec: unknown): unknown => {
+      const recX = rec as Encounter
+      if (recX.patient?.person?.gender_code) {
+        return genderCodes[recX.patient.person.gender_code]
+      }
+      return '-'
+    },
+    address: (rec: unknown): unknown => {
+      const recX = rec as Encounter
+      const addresses = recX.patient.person.addresses
+      const resident = addresses?.find((addr) => addr.locationType_code === 'domicile')
+      const text = resident ? formatAddress(resident) : '-'
+      return text.length > 20 ? text.substring(0, 17) + '...' : text
+    },
+    clinic: (rec: unknown): unknown => {
+      const recX = rec as Encounter
+      return recX.unit?.name || recX.refSource_name || '-'
+    },
+    paymentMethod_code: (rec: unknown): unknown => {
+      const recX = rec as Encounter
+      return (recX.paymentMethod_code || '-').toUpperCase()
+    },
+    referral: (rec: unknown): unknown => {
+      const recX = rec as any
+      return recX?.vclaimReference?.poliRujukan || '-'
+    },
+    note: (rec: unknown): unknown => {
+      const recX = rec as any
+      return recX?.vclaimReference?.ppkDirujuk || '-'
+    },
+    class_code: (rec: unknown): unknown => {
+      const recX = rec as Encounter
+      return recX.class_code ? encounterClassCodes[recX.class_code] : '-'
+    },
+  },
+
+  components: {
+    sep(rec, idx) {
+      const res: RecComponent = {
+        rec: rec as object,
+        idx,
+        component: vclaimSepInfo,
+      }
+      return res
+    },
+    status(rec, idx) {
+      const recX = rec as Encounter
+      if (!recX.status_code) {
+        recX.status_code = 'new'
+      }
+      const res: RecComponent = {
+        idx,
+        rec: recX,
+        component: statusBadge,
+      }
+      return res
+    },
+    action(rec, idx) {
+      const res: RecComponent = {
+        idx,
+        rec: rec as object,
+        component: action,
+      }
+      return res
+    },
+  },
+}
diff --git a/app/components/app/encounter/list.vue b/app/components/app/encounter/list.vue
index 801e5b4c..0f171d4e 100644
--- a/app/components/app/encounter/list.vue
+++ b/app/components/app/encounter/list.vue
@@ -1,15 +1,16 @@
 <script setup lang="ts">
 import DataTable from '~/components/pub/my-ui/data-table/data-table.vue'
-import { config } from './list.cfg'
+import { defaultConfig, ambulatoryConfig } from './list.cfg'
 
 const props = defineProps<{
-  data: any[],
+  data: any[]
+  classCode: string | undefined
 }>()
 </script>
 
 <template>
   <DataTable
-    v-bind="config"
+    v-bind="props.classCode === 'ambulatory' ? ambulatoryConfig : defaultConfig"
     :rows="props.data"
   />
 </template>
diff --git a/app/components/app/encounter/vclaim-sep-info.vue b/app/components/app/encounter/vclaim-sep-info.vue
new file mode 100644
index 00000000..a72e1352
--- /dev/null
+++ b/app/components/app/encounter/vclaim-sep-info.vue
@@ -0,0 +1,33 @@
+<script setup lang="ts">
+const props = defineProps<{
+  rec: any
+  idx: number
+}>()
+</script>
+
+<template>
+  <div class="flex flex-col gap-2">
+    <Button
+      variant="ghost"
+      type="button"
+      class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+    >
+      <Icon
+        name="i-lucide-eye"
+        class="h-5 w-5"
+      />
+      Lihat SIPP
+    </Button>
+    <Button
+      variant="ghost"
+      type="button"
+      class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+    >
+      <Icon
+        name="i-lucide-eye"
+        class="h-5 w-5"
+      />
+      Lihat SEP
+    </Button>
+  </div>
+</template>
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 3aeb1254..ebb49042 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -136,8 +136,21 @@ onMounted(() => {
 /////// Functions
 async function getPatientList() {
   isLoading.isTableLoading = true
-  const includesParams =
-    'patient,patient-person,patient-person-addresses,unit,Appointment_Doctor,Appointment_Doctor-employee,Appointment_Doctor-employee-person,Responsible_Doctor,Responsible_Doctor-employee,Responsible_Doctor-employee-person'
+  const includesParamsArrays = [
+    'patient',
+    'patient-person',
+    'patient-person-addresses',
+    'Appointment_Doctor',
+    'Appointment_Doctor-employee',
+    'Appointment_Doctor-employee-person',
+    'Responsible_Doctor',
+    'Responsible_Doctor-employee',
+    'Responsible_Doctor-employee-person',
+    'EncounterDocuments',
+    'unit',
+    'vclaimReference', // vclaimReference | vclaimSep
+  ]
+  const includesParams = includesParamsArrays.join(',')
   data.value = []
   try {
     const params: any = { includes: includesParams, ...filterParams.value }
@@ -270,7 +283,10 @@ function handleRemoveConfirmation() {
     />
   </CH.ContentHeader>
 
-  <Content :data="data" />
+  <Content
+    :data="data"
+    :class-code="classCode"
+  />
 
   <!-- Filter -->
   <Dialog
diff --git a/app/handlers/encounter-entry.handler.ts b/app/handlers/encounter-entry.handler.ts
index 168b1f56..41cc2602 100644
--- a/app/handlers/encounter-entry.handler.ts
+++ b/app/handlers/encounter-entry.handler.ts
@@ -539,7 +539,7 @@ export function useEncounterEntry(props: {
         class_code: props.classCode || '',
         subClass_code: props.subClassCode || '',
         infra_id: formValues.infra_id ?? null,
-        unit_code: userStore?.user?.unit_code ?? null,
+        unit_code: formValues.unitCode ?? userStore?.user?.unit_code ?? null,
         refSource_name: formValues.refSource_name ?? 'RSSA',
         refTypeCode: formValues.paymentType === 'jkn' ? 'bpjs' : '',
         vclaimReference: vclaimReference.value ?? null,
@@ -547,7 +547,7 @@ export function useEncounterEntry(props: {
         registeredAt: formatDate(registeredAtValue),
         visitDate: formatDate(visitDateValue),
       }
-
+      
       if (props.classCode !== 'inpatient') {
         delete payload.infra_id
       }

From 703d3f902a3560fb35db426eed5c415a6cc8fea9 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 14:02:41 +0700
Subject: [PATCH 02/15] feat: Implement encounter list views with new
 configurations, vclaim SEP/SIPP document handling, and initial encounter
 entry forms.

---
 ...form.vue.backup => entry-form-prev-00.vue} |  6 +-
 ...y-form-prev.vue => entry-form-prev-01.vue} |  0
 app/components/app/encounter/list.cfg.ts      |  6 +-
 .../app/encounter/vclaim-sep-info.vue         | 52 ++++++++++--
 app/components/content/encounter/list.vue     | 85 +++++++++++++++++++
 app/handlers/supporting-document.handler.ts   |  1 +
 6 files changed, 139 insertions(+), 11 deletions(-)
 rename app/components/app/encounter/{entry-form.vue.backup => entry-form-prev-00.vue} (99%)
 rename app/components/app/encounter/{entry-form-prev.vue => entry-form-prev-01.vue} (100%)

diff --git a/app/components/app/encounter/entry-form.vue.backup b/app/components/app/encounter/entry-form-prev-00.vue
similarity index 99%
rename from app/components/app/encounter/entry-form.vue.backup
rename to app/components/app/encounter/entry-form-prev-00.vue
index f92b7736..a0c1ec28 100644
--- a/app/components/app/encounter/entry-form.vue.backup
+++ b/app/components/app/encounter/entry-form-prev-00.vue
@@ -43,7 +43,7 @@ const emit = defineEmits<{
 }>()
 
 // Validation schema
-const { handleSubmit, errors, defineField, meta } = useForm<IntegrationEncounterFormData>({
+const { handleSubmit, errors, defineField, meta } = useForm<any>({
   validationSchema: toTypedSchema(IntegrationEncounterSchema),
 })
 
@@ -141,7 +141,7 @@ function onAddSep() {
     registerDate: registerDate.value,
     cardNumber: cardNumber.value,
     paymentType: paymentType.value,
-    sepType: sepType.value
+    sepType: sepType.value,
   }
   emit('event', 'add-sep', formValues)
 }
@@ -454,7 +454,7 @@ defineExpose({
                     name="i-lucide-loader-2"
                     class="h-4 w-4 animate-spin"
                   />
-                   <Icon
+                  <Icon
                     v-else
                     name="i-lucide-plus"
                     class="h-4 w-4"
diff --git a/app/components/app/encounter/entry-form-prev.vue b/app/components/app/encounter/entry-form-prev-01.vue
similarity index 100%
rename from app/components/app/encounter/entry-form-prev.vue
rename to app/components/app/encounter/entry-form-prev-01.vue
diff --git a/app/components/app/encounter/list.cfg.ts b/app/components/app/encounter/list.cfg.ts
index 442233cc..5572b397 100644
--- a/app/components/app/encounter/list.cfg.ts
+++ b/app/components/app/encounter/list.cfg.ts
@@ -147,7 +147,8 @@ export const ambulatoryConfig: Config = {
   parses: {
     registeredAt: (rec: unknown): unknown => {
       const recX = rec as Encounter
-      return recX.registeredAt ? (recX.registeredAt as string).substring(0, 10) : '-'
+      const currentDate = recX.registeredAt ? (recX.registeredAt as string) : (recX as any).createdAt
+      return currentDate ? currentDate.substring(0, 10) : '-'
     },
     patientNumber: (rec: unknown): unknown => {
       const recX = rec as any
@@ -194,10 +195,9 @@ export const ambulatoryConfig: Config = {
   },
 
   components: {
-    sep(rec, idx) {
+    sep(rec) {
       const res: RecComponent = {
         rec: rec as object,
-        idx,
         component: vclaimSepInfo,
       }
       return res
diff --git a/app/components/app/encounter/vclaim-sep-info.vue b/app/components/app/encounter/vclaim-sep-info.vue
index a72e1352..06af4f85 100644
--- a/app/components/app/encounter/vclaim-sep-info.vue
+++ b/app/components/app/encounter/vclaim-sep-info.vue
@@ -1,33 +1,75 @@
 <script setup lang="ts">
 const props = defineProps<{
   rec: any
-  idx: number
 }>()
+
+const recSepId = inject<Ref<number>>('rec_sep_id')!
+const recSepMenu = inject<Ref<string>>('rec_sep_menu')!
+const recSepSubMenu = inject<Ref<string>>('rec_sep_sub_menu')!
+const sepFileReview = ref<any>({})
+const sippFileReview = ref<any>({})
+
+const getEncounterDocument = () => {
+  const encounter = props.rec
+  if (encounter.encounterDocuments && Array.isArray(encounter.encounterDocuments)) {
+    for (const doc of encounter.encounterDocuments) {
+      if (doc.type_code === 'vclaim-sep') {
+        sepFileReview.value = { id: doc.id, fileName: doc.fileName, filePath: doc.filePath, type: doc.type_code }
+      } else if (doc.type_code === 'vclaim-sipp') {
+        sippFileReview.value = { id: doc.id, fileName: doc.fileName, filePath: doc.filePath, type: doc.type_code }
+      }
+    }
+  }
+}
+
+function handleSepView(menu: string, subMenu: string) {
+  recSepId.value = props.rec.id || 0
+  recSepMenu.value = menu
+  recSepSubMenu.value = subMenu
+}
+
+onMounted(() => {
+  getEncounterDocument()
+})
 </script>
 
 <template>
   <div class="flex flex-col gap-2">
     <Button
-      variant="ghost"
+      variant="outline"
       type="button"
       class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+      @click="handleSepView('sipp', sippFileReview.id ? 'edit' : 'view')"
     >
       <Icon
+        v-if="sippFileReview.id"
         name="i-lucide-eye"
         class="h-5 w-5"
       />
-      Lihat SIPP
+      <Icon
+        v-else
+        name="i-lucide-upload"
+        class="h-5 w-5"
+      />
+      {{ sippFileReview.id ? 'Lihat SIPP' : 'Upload File SIPP' }}
     </Button>
     <Button
-      variant="ghost"
+      variant="outline"
       type="button"
       class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+      @click="handleSepView('sep', sepFileReview.id ? 'edit' : 'view')"
     >
       <Icon
+        v-if="sepFileReview.id"
         name="i-lucide-eye"
         class="h-5 w-5"
       />
-      Lihat SEP
+      <Icon
+        v-else
+        name="i-lucide-upload"
+        class="h-5 w-5"
+      />
+      {{ sepFileReview.id ? 'Lihat SEP' : 'Upload File SEP' }}
     </Button>
   </div>
 </template>
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index ebb49042..5cff930a 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -7,6 +7,7 @@ import { ActionEvents } from '~/components/pub/my-ui/data/types'
 import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
 import * as CH from '~/components/pub/my-ui/content-header'
 import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
+import FileUpload from '~/components/pub/my-ui/form/file-field.vue'
 import { useSidebar } from '~/components/pub/ui/sidebar/utils'
 
 // App libs
@@ -19,6 +20,9 @@ import {
   cancel as cancelEncounter,
 } from '~/services/encounter.service'
 
+// Handlers
+import { uploadAttachmentCustom } from '~/handlers/supporting-document.handler'
+
 // Apps
 import Content from '~/components/app/encounter/list.vue'
 import FilterNav from '~/components/app/encounter/filter-nav.vue'
@@ -53,9 +57,13 @@ const isLoading = reactive<DataTableLoader>({
 const recId = ref<number>(0)
 const recAction = ref<string>('')
 const recItem = ref<any>(null)
+const recSepId = ref<number>(0)
+const recSepMenu = ref<string>('')
+const recSepSubMenu = ref<string>('')
 const isFilterFormDialogOpen = ref(false)
 const isRecordConfirmationOpen = ref(false)
 const isRecordCancelOpen = ref(false)
+const uploadFile = ref<any>(null)
 
 // Headers
 const hreaderPrep: CH.Config = {
@@ -102,6 +110,9 @@ provide('activeServicePosition', activeServicePosition)
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)
+provide('rec_sep_id', recSepId)
+provide('rec_sep_menu', recSepMenu)
+provide('rec_sep_sub_menu', recSepSubMenu)
 provide('table_data_loader', isLoading)
 
 watch(getActiveRole, (role?: string) => {
@@ -129,6 +140,19 @@ watch(
   },
 )
 
+watch([recSepId, recSepMenu, recSepSubMenu], (value) => {
+  const id = value[0]
+  const menu = value[1]
+  const subMenu = value[2]
+  if (!id) return
+  if (subMenu === 'view') {
+    handleViewFile(id, menu, subMenu)
+  }
+  if (subMenu === 'edit') {
+    handleUploadFile(id, menu)
+  }
+})
+
 onMounted(() => {
   getPatientList()
 })
@@ -172,6 +196,55 @@ async function getPatientList() {
   }
 }
 
+function handleUploadFile(id: number, menu: string) {
+  uploadFile.value = null
+  document.getElementById('uploadFile')?.click()
+}
+
+async function handleUploadFileSubmit() {
+  if (!uploadFile.value) return
+  const result = await uploadAttachmentCustom({
+    file: uploadFile.value,
+    refId: recSepId.value,
+    entityTypeCode: 'encounter',
+    type: recSepMenu.value === 'sep' ? 'vclaim-sep' : 'vclaim-sipp',
+  })
+  if (result.success) {
+    toast({
+      title: 'Berhasil',
+      description: 'File berhasil diunggah',
+      variant: 'default',
+    })
+    await getPatientList()
+  } else {
+    toast({
+      title: 'Gagal',
+      description: 'File gagal diunggah',
+      variant: 'destructive',
+    })
+  }
+}
+
+function handleViewFile(id: number, menu: string, subMenu: string) {
+  const currentData: any = data.value.find((item: any) => item.id === id)
+  if (!currentData) return
+  let fileReviewSep: any = null
+  let fileReviewSipp: any = null
+  for (const doc of currentData.encounterDocuments) {
+    if (doc.type_code === 'vclaim-sep') {
+      fileReviewSep = { id: doc.id, fileName: doc.fileName, filePath: doc.filePath, type: doc.type_code }
+    } else if (doc.type_code === 'vclaim-sipp') {
+      fileReviewSipp = { id: doc.id, fileName: doc.fileName, filePath: doc.filePath, type: doc.type_code }
+    }
+  }
+  if (fileReviewSep && menu === 'sep' && subMenu === 'view') {
+    window.open(fileReviewSep.filePath, '_blank')
+  }
+  if (fileReviewSipp && menu === 'sipp' && subMenu === 'view') {
+    window.open(fileReviewSipp.filePath, '_blank')
+  }
+}
+
 function handleFilterApply(filters: { personName: string; startDate: string; endDate: string }) {
   filterParams.value = {
     'person-name': filters.personName,
@@ -356,4 +429,16 @@ function handleRemoveConfirmation() {
   >
     Hak akses tidak memenuhi kriteria untuk proses ini.
   </Dialog>
+
+  <FileUpload
+    id="uploadFile"
+    class="hidden"
+    field-name="uploadFile"
+    label="Dokumen"
+    placeholder="Pilih file"
+    :accept="['pdf', 'jpg', 'png']"
+    :max-size-mb="1"
+    v-model="uploadFile"
+    @file-selected="handleUploadFileSubmit"
+  />
 </template>
diff --git a/app/handlers/supporting-document.handler.ts b/app/handlers/supporting-document.handler.ts
index 87ff864a..d63e1ccf 100644
--- a/app/handlers/supporting-document.handler.ts
+++ b/app/handlers/supporting-document.handler.ts
@@ -27,6 +27,7 @@ export async function uploadAttachmentCustom(payload: any) {
   const { user } = useUserStore()
   
   const formData = new FormData()
+  formData.append('code', payload.type)
   formData.append('content', payload.file)
   formData.append('entityType_code', payload.entityTypeCode)
   formData.append('type_code', payload.type)

From 4fc48d613123d2b8ab5201b1a51ea5fe8b487be9 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 14:51:38 +0700
Subject: [PATCH 03/15] feat: Implement encounter list with filtering and
 navigation components.

---
 .../app/encounter/filter-form-prev.vue        | 114 +++++++++++
 app/components/app/encounter/filter-form.vue  | 189 +++++++++---------
 app/components/app/encounter/filter-nav.vue   |  40 +++-
 app/components/content/encounter/list.vue     |  51 +++--
 4 files changed, 257 insertions(+), 137 deletions(-)
 create mode 100644 app/components/app/encounter/filter-form-prev.vue

diff --git a/app/components/app/encounter/filter-form-prev.vue b/app/components/app/encounter/filter-form-prev.vue
new file mode 100644
index 00000000..31ec4476
--- /dev/null
+++ b/app/components/app/encounter/filter-form-prev.vue
@@ -0,0 +1,114 @@
+<script setup lang="ts">
+import type { FormErrors } from '~/types/error'
+import { toTypedSchema } from '@vee-validate/zod'
+import FieldGroup from '~/components/pub/my-ui/form/field-group.vue'
+import Field from '~/components/pub/my-ui/form/field.vue'
+import Label from '~/components/pub/my-ui/form/label.vue'
+import Select from '~/components/pub/my-ui/form/select.vue'
+import { Form } from '~/components/pub/ui/form'
+
+interface InstallationFormData {
+  name: string
+  code: string
+  encounterClassCode: string
+}
+
+const props = defineProps<{
+  installation: {
+    msg: {
+      placeholder: string
+    }
+    items: {
+      value: string
+      label: string
+      code: string
+    }[]
+  }
+  schema: any
+  initialValues?: Partial<InstallationFormData>
+  errors?: FormErrors
+}>()
+
+const emit = defineEmits<{
+  submit: [values: InstallationFormData, resetForm: () => void]
+  cancel: [resetForm: () => void]
+}>()
+
+const formSchema = toTypedSchema(props.schema)
+
+// Form submission handler
+function onSubmitForm(values: any, { resetForm }: { resetForm: () => void }) {
+  const formData: InstallationFormData = {
+    name: values.name || '',
+    code: values.code || '',
+    encounterClassCode: values.encounterClassCode || '',
+  }
+  emit('submit', formData, resetForm)
+}
+
+// Form cancel handler
+function onCancelForm({ resetForm }: { resetForm: () => void }) {
+  emit('cancel', resetForm)
+}
+
+const items = ref([
+  { label: 'Rujukan Internal', value: 'ri' },
+  { label: 'SEP Rujukan', value: 'sr' },
+])
+</script>
+
+<template>
+  <Form
+    v-slot="{ handleSubmit, resetForm }"
+    as=""
+    keep-values
+    :validation-schema="formSchema"
+    :initial-values="initialValues"
+  >
+    <form id="entry-form" @submit="handleSubmit($event, (values) => onSubmitForm(values, { resetForm }))">
+      <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
+        <div class="flex flex-col justify-between">
+          <FieldGroup>
+            <Label label-for="parentId">Cara Bayar</Label>
+            <Field id="encounterClassCode" :errors="errors">
+              <FormField v-slot="{ componentField }" name="encounterClassCode">
+                <FormItem>
+                  <FormControl>
+                    <Select v-bind="componentField" :items="items" />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+            </Field>
+          </FieldGroup>
+          <FieldGroup>
+            <Label label-for="parentId">Poliklinik</Label>
+            <Field id="encounterClassCode" :errors="errors">
+              <FormField v-slot="{ componentField }" name="encounterClassCode">
+                <FormItem>
+                  <FormControl>
+                    <Select v-bind="componentField" :items="items" />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+            </Field>
+          </FieldGroup>
+          <FieldGroup>
+            <Label label-for="parentId">Kunjungan</Label>
+            <Field id="encounterClassCode" :errors="errors">
+              <FormField v-slot="{ componentField }" name="encounterClassCode">
+                <FormItem>
+                  <FormControl>
+                    <Select v-bind="componentField" :items="items" />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+            </Field>
+          </FieldGroup>
+        </div>
+      </div>
+    </form>
+  </Form>
+</template>
diff --git a/app/components/app/encounter/filter-form.vue b/app/components/app/encounter/filter-form.vue
index 31ec4476..9ae0123b 100644
--- a/app/components/app/encounter/filter-form.vue
+++ b/app/components/app/encounter/filter-form.vue
@@ -1,114 +1,107 @@
 <script setup lang="ts">
-import type { FormErrors } from '~/types/error'
-import { toTypedSchema } from '@vee-validate/zod'
-import FieldGroup from '~/components/pub/my-ui/form/field-group.vue'
-import Field from '~/components/pub/my-ui/form/field.vue'
-import Label from '~/components/pub/my-ui/form/label.vue'
-import Select from '~/components/pub/my-ui/form/select.vue'
-import { Form } from '~/components/pub/ui/form'
-
-interface InstallationFormData {
-  name: string
-  code: string
-  encounterClassCode: string
-}
+// Components
+import * as DE from '~/components/pub/my-ui/doc-entry'
 
+// Props
 const props = defineProps<{
-  installation: {
-    msg: {
-      placeholder: string
-    }
-    items: {
-      value: string
-      label: string
-      code: string
-    }[]
-  }
-  schema: any
-  initialValues?: Partial<InstallationFormData>
-  errors?: FormErrors
+  payments: any[]
+  units: any[]
+  visits: any[]
 }>()
 
 const emit = defineEmits<{
-  submit: [values: InstallationFormData, resetForm: () => void]
-  cancel: [resetForm: () => void]
+  (e: 'search', values: any): void
 }>()
 
-const formSchema = toTypedSchema(props.schema)
+const paymentItem = ref<any>(null)
+const unitItem = ref<any>(null)
+const visitItem = ref<any>(null)
 
-// Form submission handler
-function onSubmitForm(values: any, { resetForm }: { resetForm: () => void }) {
-  const formData: InstallationFormData = {
-    name: values.name || '',
-    code: values.code || '',
-    encounterClassCode: values.encounterClassCode || '',
-  }
-  emit('submit', formData, resetForm)
+function handleReset() {
+  paymentItem.value = null
+  unitItem.value = null
+  visitItem.value = null
 }
 
-// Form cancel handler
-function onCancelForm({ resetForm }: { resetForm: () => void }) {
-  emit('cancel', resetForm)
+function handleSearch() {
+  emit('search', {
+    paymentMethodCode: paymentItem.value,
+    unit: unitItem.value,
+    visit: visitItem.value,
+  })
 }
-
-const items = ref([
-  { label: 'Rujukan Internal', value: 'ri' },
-  { label: 'SEP Rujukan', value: 'sr' },
-])
 </script>
 
 <template>
-  <Form
-    v-slot="{ handleSubmit, resetForm }"
-    as=""
-    keep-values
-    :validation-schema="formSchema"
-    :initial-values="initialValues"
-  >
-    <form id="entry-form" @submit="handleSubmit($event, (values) => onSubmitForm(values, { resetForm }))">
-      <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
-        <div class="flex flex-col justify-between">
-          <FieldGroup>
-            <Label label-for="parentId">Cara Bayar</Label>
-            <Field id="encounterClassCode" :errors="errors">
-              <FormField v-slot="{ componentField }" name="encounterClassCode">
-                <FormItem>
-                  <FormControl>
-                    <Select v-bind="componentField" :items="items" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </Field>
-          </FieldGroup>
-          <FieldGroup>
-            <Label label-for="parentId">Poliklinik</Label>
-            <Field id="encounterClassCode" :errors="errors">
-              <FormField v-slot="{ componentField }" name="encounterClassCode">
-                <FormItem>
-                  <FormControl>
-                    <Select v-bind="componentField" :items="items" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </Field>
-          </FieldGroup>
-          <FieldGroup>
-            <Label label-for="parentId">Kunjungan</Label>
-            <Field id="encounterClassCode" :errors="errors">
-              <FormField v-slot="{ componentField }" name="encounterClassCode">
-                <FormItem>
-                  <FormControl>
-                    <Select v-bind="componentField" :items="items" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </Field>
-          </FieldGroup>
-        </div>
-      </div>
-    </form>
-  </Form>
+  <div class="mx-auto w-full">
+    <DE.Block
+      labelSize="thin"
+      class="!pt-0"
+      :colCount="1"
+      :cellFlex="false"
+    >
+      <DE.Cell>
+        <DE.Label height="compact">Cara Bayar</DE.Label>
+        <DE.Field>
+          <Select
+            id="paymentMethodCode"
+            v-model="paymentItem"
+            :items="payments || []"
+            placeholder="Pilih Jenis Pembayaran"
+          />
+        </DE.Field>
+      </DE.Cell>
+
+      <DE.Cell>
+        <DE.Label height="compact">Poliklinik</DE.Label>
+        <DE.Field>
+          <Select
+            id="unit"
+            v-model="unitItem"
+            :items="units || []"
+            placeholder="Pilih Poliklinik"
+          />
+        </DE.Field>
+      </DE.Cell>
+
+      <DE.Cell>
+        <DE.Label height="compact">Kunjungan</DE.Label>
+        <DE.Field>
+          <Select
+            id="visit"
+            v-model="visitItem"
+            :items="visits || []"
+            placeholder="Pilih Kunjungan"
+          />
+        </DE.Field>
+      </DE.Cell>
+    </DE.Block>
+
+    <div class="flex w-full justify-end gap-2">
+      <Button
+        variant="outline"
+        type="button"
+        class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+        @click="handleReset"
+      >
+        <Icon
+          name="i-lucide-rotate-ccw"
+          class="h-5 w-5"
+        />
+        Reset
+      </Button>
+      <Button
+        variant="outline"
+        type="button"
+        class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+        @click="handleSearch"
+      >
+        <Icon
+          name="i-lucide-check"
+          class="h-5 w-5"
+        />
+        Terapkan
+      </Button>
+    </div>
+  </div>
 </template>
diff --git a/app/components/app/encounter/filter-nav.vue b/app/components/app/encounter/filter-nav.vue
index 8f4c850e..30b95b96 100644
--- a/app/components/app/encounter/filter-nav.vue
+++ b/app/components/app/encounter/filter-nav.vue
@@ -20,11 +20,13 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   apply: [filters: { personName: string; startDate: string; endDate: string }]
+  click: []
 }>()
 
 const searchQuery = ref('')
 const isRoleRegistration = props.activePositon === 'registration'
 const isRoleMedical = props.activePositon === 'medical'
+const debouncedSearchQuery = refDebounced(searchQuery, 500)
 
 const df = new DateFormatter('en-US', {
   dateStyle: 'medium',
@@ -43,14 +45,18 @@ const oneMonthAgoCalendar = new CalendarDate(
   oneMonthAgo.getDate(),
 )
 
-const value = ref({
+const dateRange = ref({
   start: oneMonthAgoCalendar,
   end: todayCalendar,
 }) as Ref<DateRange>
 
 function onFilterClick() {
-  const startDate = value.value.start ? value.value.start.toString() : ''
-  const endDate = value.value.end ? value.value.end.toString() : startDate
+  emit('click')
+}
+
+function onFilterApply() {
+  const startDate = dateRange.value.start ? dateRange.value.start.toString() : ''
+  const endDate = dateRange.value.end ? dateRange.value.end.toString() : startDate
 
   emit('apply', {
     personName: searchQuery.value,
@@ -58,6 +64,18 @@ function onFilterClick() {
     endDate,
   })
 }
+
+watch(debouncedSearchQuery, () => {
+  onFilterApply()
+})
+
+watch(
+  dateRange,
+  () => {
+    onFilterApply()
+  },
+  { deep: true },
+)
 </script>
 
 <template>
@@ -76,18 +94,18 @@ function onFilterClick() {
       <Button
         variant="outline"
         :class="
-          cn('min-w-[240px] max-w-[320px] justify-start text-left font-normal', !value && 'text-muted-foreground')
+          cn('min-w-[240px] max-w-[320px] justify-start text-left font-normal', !dateRange && 'text-muted-foreground')
         "
       >
         <CalendarIcon class="mr-2 h-4 w-4" />
-        <template v-if="value.start">
-          <template v-if="value.end">
-            {{ df.format(value.start.toDate(getLocalTimeZone())) }} -
-            {{ df.format(value.end.toDate(getLocalTimeZone())) }}
+        <template v-if="dateRange.start">
+          <template v-if="dateRange.end">
+            {{ df.format(dateRange.start.toDate(getLocalTimeZone())) }} -
+            {{ df.format(dateRange.end.toDate(getLocalTimeZone())) }}
           </template>
 
           <template v-else>
-            {{ df.format(value.start.toDate(getLocalTimeZone())) }}
+            {{ df.format(dateRange.start.toDate(getLocalTimeZone())) }}
           </template>
         </template>
         <template v-else>Pick a date</template>
@@ -95,10 +113,10 @@ function onFilterClick() {
     </PopoverTrigger>
     <PopoverContent class="w-auto p-0">
       <RangeCalendar
-        v-model="value"
+        v-model="dateRange"
         initial-focus
         :number-of-months="2"
-        @update:start-value="(startDate) => (value.start = startDate)"
+        @update:start-value="(startDate) => (dateRange.start = startDate)"
       />
     </PopoverContent>
   </Popover>
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 5cff930a..84e6026f 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -10,6 +10,9 @@ import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confi
 import FileUpload from '~/components/pub/my-ui/form/file-field.vue'
 import { useSidebar } from '~/components/pub/ui/sidebar/utils'
 
+// Constants
+import { paymentTypes } from '~/lib/constants.vclaim'
+
 // App libs
 import { getServicePosition } from '~/lib/roles' // previously getPositionAs
 
@@ -19,6 +22,7 @@ import {
   remove as removeEncounter,
   cancel as cancelEncounter,
 } from '~/services/encounter.service'
+import { getValueLabelList as getUnits } from '~/services/unit.service'
 
 // Handlers
 import { uploadAttachmentCustom } from '~/handlers/supporting-document.handler'
@@ -64,6 +68,12 @@ const isFilterFormDialogOpen = ref(false)
 const isRecordConfirmationOpen = ref(false)
 const isRecordCancelOpen = ref(false)
 const uploadFile = ref<any>(null)
+const payments = ref<any>([])
+const units = ref<any>([])
+const visits = ref([
+  { label: 'Rujukan Internal', value: 'ri' },
+  { label: 'SEP Rujukan', value: 'sr' },
+])
 
 // Headers
 const hreaderPrep: CH.Config = {
@@ -80,31 +90,6 @@ if (!props.canCreate) {
   delete hreaderPrep.addNav
 }
 
-// Filters
-const filter = ref<{
-  installation: {
-    msg: {
-      placeholder: string
-    }
-    items: {
-      value: string
-      label: string
-      code: string
-    }[]
-  }
-  schema: any
-  initialValues?: Partial<any>
-  errors?: any
-}>({
-  installation: {
-    msg: {
-      placeholder: 'Pilih',
-    },
-    items: [],
-  },
-  schema: {},
-})
-
 // Recrod reactivities
 provide('activeServicePosition', activeServicePosition)
 provide('rec_id', recId)
@@ -153,8 +138,13 @@ watch([recSepId, recSepMenu, recSepSubMenu], (value) => {
   }
 })
 
-onMounted(() => {
+onMounted(async () => {
   getPatientList()
+  units.value = await getUnits({}, true)
+  payments.value = Object.keys(paymentTypes).map((item) => ({
+    value: item.toString(),
+    label: paymentTypes[item],
+  })) as any
 })
 
 /////// Functions
@@ -350,6 +340,7 @@ function handleRemoveConfirmation() {
     <FilterNav
       :active-positon="activeServicePosition"
       @apply="handleFilterApply"
+      @click="() => (isFilterFormDialogOpen = true)"
       @onExportPdf="() => {}"
       @onExportExcel="() => {}"
       @nExportCsv="() => {}"
@@ -364,11 +355,15 @@ function handleRemoveConfirmation() {
   <!-- Filter -->
   <Dialog
     v-model:open="isFilterFormDialogOpen"
-    title="Filter"
+    title="Filter Data"
     size="lg"
     prevent-outside
   >
-    <FilterForm v-bind="filter" />
+    <FilterForm
+      :payments="payments"
+      :units="units"
+      :visits="visits"
+    />
   </Dialog>
 
   <!-- Batal -->

From 356647f810337b25d8533fa1a4cfd4b95f7cedc9 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 15:01:14 +0700
Subject: [PATCH 04/15] feat: Add encounter list page with filter form and
 document upload functionality.

---
 app/components/app/encounter/filter-form.vue |  2 ++
 app/components/content/encounter/list.vue    | 12 ++++++++++++
 2 files changed, 14 insertions(+)

diff --git a/app/components/app/encounter/filter-form.vue b/app/components/app/encounter/filter-form.vue
index 9ae0123b..338b3fc2 100644
--- a/app/components/app/encounter/filter-form.vue
+++ b/app/components/app/encounter/filter-form.vue
@@ -11,6 +11,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   (e: 'search', values: any): void
+  (e: 'reset'): void
 }>()
 
 const paymentItem = ref<any>(null)
@@ -21,6 +22,7 @@ function handleReset() {
   paymentItem.value = null
   unitItem.value = null
   visitItem.value = null
+  emit('reset')
 }
 
 function handleSearch() {
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 84e6026f..d14b6023 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -244,6 +244,16 @@ function handleFilterApply(filters: { personName: string; startDate: string; end
   getPatientList()
 }
 
+function handleFilterReset() {
+  filterParams.value = {}
+  getPatientList()
+}
+
+function handleFilterSearch(filters: any) {
+  filterParams.value = { ...filterParams.value, ...filters }
+  getPatientList()
+}
+
 // Handle confirmation result
 async function handleConfirmCancel(record: any, action: string) {
   if (action === 'deactivate' && record?.id) {
@@ -363,6 +373,8 @@ function handleRemoveConfirmation() {
       :payments="payments"
       :units="units"
       :visits="visits"
+      @search="handleFilterSearch"
+      @reset="handleFilterReset"
     />
   </Dialog>
 

From b77646c9a67b33e95007909e23178ec695f41335 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 15:03:38 +0700
Subject: [PATCH 05/15] feat: add encounter list component with filtering, CRUD
 actions, and document management capabilities.

---
 app/components/content/encounter/list.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index d14b6023..0c8de49f 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -245,11 +245,13 @@ function handleFilterApply(filters: { personName: string; startDate: string; end
 }
 
 function handleFilterReset() {
+  isFilterFormDialogOpen.value = false
   filterParams.value = {}
   getPatientList()
 }
 
 function handleFilterSearch(filters: any) {
+  isFilterFormDialogOpen.value = false
   filterParams.value = { ...filterParams.value, ...filters }
   getPatientList()
 }

From e33b23205a94596200249f97c4decf06cf4a39ce Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 16:01:36 +0700
Subject: [PATCH 06/15] feat: Add encounter list with filtering, VClaim
 SEP/SIPP document management, and a new file field component.

---
 app/components/app/encounter/filter-form.vue     | 4 ++--
 app/components/app/encounter/vclaim-sep-info.vue | 6 ++++--
 app/components/content/encounter/list.vue        | 6 ++++--
 app/components/pub/my-ui/form/file-field.vue     | 5 +++--
 4 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/app/components/app/encounter/filter-form.vue b/app/components/app/encounter/filter-form.vue
index 338b3fc2..a3adb9c8 100644
--- a/app/components/app/encounter/filter-form.vue
+++ b/app/components/app/encounter/filter-form.vue
@@ -27,8 +27,8 @@ function handleReset() {
 
 function handleSearch() {
   emit('search', {
-    paymentMethodCode: paymentItem.value,
-    unit: unitItem.value,
+    'paymentMethod-code': paymentItem.value,
+    'unit-code': unitItem.value,
     visit: visitItem.value,
   })
 }
diff --git a/app/components/app/encounter/vclaim-sep-info.vue b/app/components/app/encounter/vclaim-sep-info.vue
index 06af4f85..b0aa723f 100644
--- a/app/components/app/encounter/vclaim-sep-info.vue
+++ b/app/components/app/encounter/vclaim-sep-info.vue
@@ -11,6 +11,8 @@ const sippFileReview = ref<any>({})
 
 const getEncounterDocument = () => {
   const encounter = props.rec
+  sippFileReview.value = {}
+  sepFileReview.value = {}
   if (encounter.encounterDocuments && Array.isArray(encounter.encounterDocuments)) {
     for (const doc of encounter.encounterDocuments) {
       if (doc.type_code === 'vclaim-sep') {
@@ -39,7 +41,7 @@ onMounted(() => {
       variant="outline"
       type="button"
       class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
-      @click="handleSepView('sipp', sippFileReview.id ? 'edit' : 'view')"
+      @click="handleSepView('sipp', sippFileReview.id ? 'view' : 'edit')"
     >
       <Icon
         v-if="sippFileReview.id"
@@ -57,7 +59,7 @@ onMounted(() => {
       variant="outline"
       type="button"
       class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
-      @click="handleSepView('sep', sepFileReview.id ? 'edit' : 'view')"
+      @click="handleSepView('sep', sepFileReview.id ? 'view' : 'edit')"
     >
       <Icon
         v-if="sepFileReview.id"
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 0c8de49f..8dc06ab2 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -129,6 +129,7 @@ watch([recSepId, recSepMenu, recSepSubMenu], (value) => {
   const id = value[0]
   const menu = value[1]
   const subMenu = value[2]
+  console.log(id, menu, subMenu)
   if (!id) return
   if (subMenu === 'view') {
     handleViewFile(id, menu, subMenu)
@@ -189,6 +190,7 @@ async function getPatientList() {
 function handleUploadFile(id: number, menu: string) {
   uploadFile.value = null
   document.getElementById('uploadFile')?.click()
+  console.log(id)
 }
 
 async function handleUploadFileSubmit() {
@@ -216,7 +218,8 @@ async function handleUploadFileSubmit() {
 }
 
 function handleViewFile(id: number, menu: string, subMenu: string) {
-  const currentData: any = data.value.find((item: any) => item.id === id)
+  const currentData: any = data.value.find((item: any) => Number(item.id) === Number(id))
+  console.log(currentData)
   if (!currentData) return
   let fileReviewSep: any = null
   let fileReviewSipp: any = null
@@ -440,7 +443,6 @@ function handleRemoveConfirmation() {
   </Dialog>
 
   <FileUpload
-    id="uploadFile"
     class="hidden"
     field-name="uploadFile"
     label="Dokumen"
diff --git a/app/components/pub/my-ui/form/file-field.vue b/app/components/pub/my-ui/form/file-field.vue
index b995ca56..90236737 100644
--- a/app/components/pub/my-ui/form/file-field.vue
+++ b/app/components/pub/my-ui/form/file-field.vue
@@ -72,7 +72,7 @@ async function onFileChange(event: Event, handleChange: (value: any) => void) {
 </script>
 
 <template>
-  <DE.Cell>
+  <DE.Cell :class="class">
     <DE.Label
       v-if="label !== ''"
       :label-for="fieldName"
@@ -91,12 +91,13 @@ async function onFileChange(event: Event, handleChange: (value: any) => void) {
         <FormItem>
           <FormControl class="flex flex-col">
             <Input
-              @change="onFileChange($event, handleChange)"
+              :id="fieldName"
               type="file"
               :disabled="isDisabled"
               v-bind="{ onBlur: componentField.onBlur }"
               :placeholder="placeholder"
               :class="cn('focus:border-primary focus:ring-2 focus:ring-primary focus:ring-offset-0')"
+              @change="onFileChange($event, handleChange)"
             />
           </FormControl>
           <FormMessage />

From 0a0461238c4561025bc24ca78d6c6929d3df366d Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 8 Dec 2025 16:10:11 +0700
Subject: [PATCH 07/15] feat: add encounter list component with data display,
 filtering, and record management capabilities

---
 app/components/content/encounter/list.vue | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 8dc06ab2..1210ab68 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -129,7 +129,6 @@ watch([recSepId, recSepMenu, recSepSubMenu], (value) => {
   const id = value[0]
   const menu = value[1]
   const subMenu = value[2]
-  console.log(id, menu, subMenu)
   if (!id) return
   if (subMenu === 'view') {
     handleViewFile(id, menu, subMenu)
@@ -189,8 +188,13 @@ async function getPatientList() {
 
 function handleUploadFile(id: number, menu: string) {
   uploadFile.value = null
-  document.getElementById('uploadFile')?.click()
-  console.log(id)
+  const fileInput: HTMLInputElement | undefined | null = document
+    .getElementById('uploadFile')
+    ?.querySelector("input[type='file']")
+  if (fileInput) {
+    fileInput.value = ''
+    fileInput.click()
+  }
 }
 
 async function handleUploadFileSubmit() {

From 69b047fce591b21254670520d9716ee166e3383a Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 11:41:03 +0700
Subject: [PATCH 08/15] feat: Add encounter list view with filter form and data
 table configurations for encounter management.

---
 app/components/app/encounter/filter-form.vue |  4 ++--
 app/components/app/encounter/list.cfg.ts     |  2 +-
 app/components/content/encounter/list.vue    | 17 ++++++++++-------
 3 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/app/components/app/encounter/filter-form.vue b/app/components/app/encounter/filter-form.vue
index a3adb9c8..b0660a1c 100644
--- a/app/components/app/encounter/filter-form.vue
+++ b/app/components/app/encounter/filter-form.vue
@@ -93,9 +93,9 @@ function handleSearch() {
         Reset
       </Button>
       <Button
-        variant="outline"
+        variant="default"
         type="button"
-        class="h-[40px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50"
+        class="h-[40px]"
         @click="handleSearch"
       >
         <Icon
diff --git a/app/components/app/encounter/list.cfg.ts b/app/components/app/encounter/list.cfg.ts
index 5572b397..510dbfd5 100644
--- a/app/components/app/encounter/list.cfg.ts
+++ b/app/components/app/encounter/list.cfg.ts
@@ -167,7 +167,7 @@ export const ambulatoryConfig: Config = {
     },
     address: (rec: unknown): unknown => {
       const recX = rec as Encounter
-      const addresses = recX.patient.person.addresses
+      const addresses = recX.patient?.person?.addresses || []
       const resident = addresses?.find((addr) => addr.locationType_code === 'domicile')
       const text = resident ? formatAddress(resident) : '-'
       return text.length > 20 ? text.substring(0, 17) + '...' : text
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 80a42528..d9dd19ae 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -11,7 +11,7 @@ import FileUpload from '~/components/pub/my-ui/form/file-field.vue'
 import { useSidebar } from '~/components/pub/ui/sidebar/utils'
 
 // Constants
-import { paymentTypes } from '~/lib/constants.vclaim'
+import { paymentTypes, sepRefTypeCodes } from '~/lib/constants.vclaim'
 
 // App libs
 import { getServicePosition } from '~/lib/roles' // previously getPositionAs
@@ -70,10 +70,7 @@ const isRecordCancelOpen = ref(false)
 const uploadFile = ref<any>(null)
 const payments = ref<any>([])
 const units = ref<any>([])
-const visits = ref([
-  { label: 'Rujukan Internal', value: 'ri' },
-  { label: 'SEP Rujukan', value: 'sr' },
-])
+const sepsList = ref<any>([])
 
 // Headers
 const hreaderPrep: CH.Config = {
@@ -145,6 +142,10 @@ onMounted(async () => {
     value: item.toString(),
     label: paymentTypes[item],
   })) as any
+  sepsList.value = Object.keys(sepRefTypeCodes).map((item) => ({
+    value: item.toString(),
+    label: sepRefTypeCodes[item],
+  })) as any
 })
 
 /////// Functions
@@ -244,7 +245,8 @@ function handleViewFile(id: number, menu: string, subMenu: string) {
 
 function handleFilterApply(filters: { personName: string; startDate: string; endDate: string }) {
   filterParams.value = {
-    'person-name': filters.personName,
+    // 'person-name': filters.personName,
+    'patient-identifier': filters.personName,
     'start-date': filters.startDate,
     'end-date': filters.endDate,
   }
@@ -358,6 +360,7 @@ function handleRemoveConfirmation() {
   <CH.ContentHeader v-bind="hreaderPrep">
     <FilterNav
       :active-positon="activeServicePosition"
+      :enable-export="false"
       @apply="handleFilterApply"
       @click="() => (isFilterFormDialogOpen = true)"
       @onExportPdf="() => {}"
@@ -381,7 +384,7 @@ function handleRemoveConfirmation() {
     <FilterForm
       :payments="payments"
       :units="units"
-      :visits="visits"
+      :visits="sepsList"
       @search="handleFilterSearch"
       @reset="handleFilterReset"
     />

From 1634256becf587f652e0976b49618097c6c6569d Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 11:41:31 +0700
Subject: [PATCH 09/15] feat: create encounter list view with filtering, CRUD
 actions, and document management.

---
 app/components/content/encounter/list.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index d9dd19ae..0e80ddd8 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -224,7 +224,6 @@ async function handleUploadFileSubmit() {
 
 function handleViewFile(id: number, menu: string, subMenu: string) {
   const currentData: any = data.value.find((item: any) => Number(item.id) === Number(id))
-  console.log(currentData)
   if (!currentData) return
   let fileReviewSep: any = null
   let fileReviewSipp: any = null

From 9dc9c85fab466aa55c1ee019aff0dcef6491de4b Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 12:50:11 +0700
Subject: [PATCH 10/15] feat: Introduce encounter list page with filtering,
 search, and action support, along with new handlers for encounter entries and
 supporting documents.

---
 app/components/app/encounter/filter-nav.vue |  2 +-
 app/components/content/encounter/list.vue   | 11 ++++++++++-
 app/handlers/encounter-entry.handler.ts     |  2 ++
 app/handlers/supporting-document.handler.ts |  4 ++--
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/app/components/app/encounter/filter-nav.vue b/app/components/app/encounter/filter-nav.vue
index 30b95b96..aa552a11 100644
--- a/app/components/app/encounter/filter-nav.vue
+++ b/app/components/app/encounter/filter-nav.vue
@@ -130,7 +130,7 @@ watch(
     Filter
   </Button>
 
-  <DropdownMenu v-show="props.enableExport && (isRoleRegistration || isRoleMedical)">
+  <DropdownMenu v-if="props.enableExport && (isRoleRegistration || isRoleMedical)">
     <DropdownMenuTrigger as-child>
       <Button
         variant="outline"
diff --git a/app/components/content/encounter/list.vue b/app/components/content/encounter/list.vue
index 0e80ddd8..4b219d7c 100644
--- a/app/components/content/encounter/list.vue
+++ b/app/components/content/encounter/list.vue
@@ -199,7 +199,13 @@ function handleUploadFile(id: number, menu: string) {
 }
 
 async function handleUploadFileSubmit() {
-  if (!uploadFile.value) return
+  const files = uploadFile.value
+  if (!uploadFile.value || files.length === 0) {
+    recSepId.value = 0
+    recSepMenu.value = ''
+    recSepSubMenu.value = ''
+    return
+  }
   const result = await uploadAttachmentCustom({
     file: uploadFile.value,
     refId: recSepId.value,
@@ -220,6 +226,9 @@ async function handleUploadFileSubmit() {
       variant: 'destructive',
     })
   }
+  recSepId.value = 0
+  recSepMenu.value = ''
+  recSepSubMenu.value = ''
 }
 
 function handleViewFile(id: number, menu: string, subMenu: string) {
diff --git a/app/handlers/encounter-entry.handler.ts b/app/handlers/encounter-entry.handler.ts
index 41cc2602..240d5305 100644
--- a/app/handlers/encounter-entry.handler.ts
+++ b/app/handlers/encounter-entry.handler.ts
@@ -601,6 +601,7 @@ export function useEncounterEntry(props: {
             await uploadAttachmentCustom({
               id: isEditMode.value && formValues.sepFileReview ? formValues.sepFileReview.id : null,
               file: sepFile.value,
+              name: 'image-vclaim-sep',
               refId: encounterId,
               entityTypeCode: 'encounter',
               type: 'vclaim-sep',
@@ -610,6 +611,7 @@ export function useEncounterEntry(props: {
             await uploadAttachmentCustom({
               id: isEditMode.value && formValues.sippFileReview ? formValues.sippFileReview.id : null,
               file: sippFile.value,
+              name: 'image-vclaim-sipp',
               refId: encounterId,
               entityTypeCode: 'encounter',
               type: 'vclaim-sipp',
diff --git a/app/handlers/supporting-document.handler.ts b/app/handlers/supporting-document.handler.ts
index d63e1ccf..31087edc 100644
--- a/app/handlers/supporting-document.handler.ts
+++ b/app/handlers/supporting-document.handler.ts
@@ -27,7 +27,7 @@ export async function uploadAttachmentCustom(payload: any) {
   const { user } = useUserStore()
   
   const formData = new FormData()
-  formData.append('code', payload.type)
+  formData.append('name', payload.name)
   formData.append('content', payload.file)
   formData.append('entityType_code', payload.entityTypeCode)
   formData.append('type_code', payload.type)
@@ -35,5 +35,5 @@ export async function uploadAttachmentCustom(payload: any) {
   formData.append('upload_employee_id', user.employee_id)
 
   const response = payload.id ? await update(payload.id, formData) : await create(formData)
-  return response?.body?.data
+  return response
 }

From d5993ecbfeaa0052e98d6c0e4fd75e71bd7fb1f5 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 12:59:43 +0700
Subject: [PATCH 11/15] feat: Add default and ambulatory data table
 configurations for encounter lists.

---
 app/components/app/encounter/list.cfg.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/app/components/app/encounter/list.cfg.ts b/app/components/app/encounter/list.cfg.ts
index 510dbfd5..e572f403 100644
--- a/app/components/app/encounter/list.cfg.ts
+++ b/app/components/app/encounter/list.cfg.ts
@@ -195,7 +195,10 @@ export const ambulatoryConfig: Config = {
   },
 
   components: {
-    sep(rec) {
+    sep(rec: any) {
+      if (rec?.paymentMethod_code !== 'jkn') {
+        return {} as RecComponent
+      }
       const res: RecComponent = {
         rec: rec as object,
         component: vclaimSepInfo,

From 1b31b334060b2cd378422b540a1a8d3a3c7887e8 Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 13:08:14 +0700
Subject: [PATCH 12/15] feat: implement generic API proxy to forward requests,
 handle authentication, and manage vclaim routes.

---
 server/api/[...req].ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/api/[...req].ts b/server/api/[...req].ts
index 79f90d1d..b9fb4a16 100644
--- a/server/api/[...req].ts
+++ b/server/api/[...req].ts
@@ -34,7 +34,7 @@ export default defineEventHandler(async (event) => {
   let body: any
   if (['POST', 'PATCH', 'PUT', 'DELETE'].includes(method)) {
     if (headers['content-type']?.includes('multipart/form-data')) {
-      body = await readBody(event)
+      body = await readRawBody(event, false) // false to get Buffer
     } else {
       body = await readBody(event)
       forwardHeaders.set('Content-Type', 'application/json')

From ad3f44c4a866434edc59f8655cff85b6f39aaddc Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 13:31:23 +0700
Subject: [PATCH 13/15] feat: Implement VClaim SEP integration with new
 components and handlers for encounter entry and supporting documents.

---
 app/components/app/encounter/list.cfg.ts         |  6 +++++-
 app/components/app/encounter/vclaim-sep-none.vue | 11 +++++++++++
 app/handlers/encounter-entry.handler.ts          |  2 --
 app/handlers/supporting-document.handler.ts      |  4 +++-
 4 files changed, 19 insertions(+), 4 deletions(-)
 create mode 100644 app/components/app/encounter/vclaim-sep-none.vue

diff --git a/app/components/app/encounter/list.cfg.ts b/app/components/app/encounter/list.cfg.ts
index e572f403..9c425da1 100644
--- a/app/components/app/encounter/list.cfg.ts
+++ b/app/components/app/encounter/list.cfg.ts
@@ -10,6 +10,7 @@ type SmallDetailDto = Encounter
 const action = defineAsyncComponent(() => import('./dropdown-action.vue'))
 const statusBadge = defineAsyncComponent(() => import('./status-badge.vue'))
 const vclaimSepInfo = defineAsyncComponent(() => import('./vclaim-sep-info.vue'))
+const vclaimSepNone = defineAsyncComponent(() => import('./vclaim-sep-none.vue'))
 
 export const defaultConfig: Config = {
   cols: [{}, {}, {}, { width: 160 }, {}, { width: 70 }, {}, { width: 50 }],
@@ -197,7 +198,10 @@ export const ambulatoryConfig: Config = {
   components: {
     sep(rec: any) {
       if (rec?.paymentMethod_code !== 'jkn') {
-        return {} as RecComponent
+        return {
+          rec: rec as object,
+          component: vclaimSepNone,
+        } as RecComponent
       }
       const res: RecComponent = {
         rec: rec as object,
diff --git a/app/components/app/encounter/vclaim-sep-none.vue b/app/components/app/encounter/vclaim-sep-none.vue
new file mode 100644
index 00000000..e22d4221
--- /dev/null
+++ b/app/components/app/encounter/vclaim-sep-none.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+const props = defineProps<{
+  rec: any
+}>()
+</script>
+
+<template>
+  <div class="flex flex-col gap-2">
+    <span>Tidak ada</span>
+  </div>
+</template>
diff --git a/app/handlers/encounter-entry.handler.ts b/app/handlers/encounter-entry.handler.ts
index 240d5305..41cc2602 100644
--- a/app/handlers/encounter-entry.handler.ts
+++ b/app/handlers/encounter-entry.handler.ts
@@ -601,7 +601,6 @@ export function useEncounterEntry(props: {
             await uploadAttachmentCustom({
               id: isEditMode.value && formValues.sepFileReview ? formValues.sepFileReview.id : null,
               file: sepFile.value,
-              name: 'image-vclaim-sep',
               refId: encounterId,
               entityTypeCode: 'encounter',
               type: 'vclaim-sep',
@@ -611,7 +610,6 @@ export function useEncounterEntry(props: {
             await uploadAttachmentCustom({
               id: isEditMode.value && formValues.sippFileReview ? formValues.sippFileReview.id : null,
               file: sippFile.value,
-              name: 'image-vclaim-sipp',
               refId: encounterId,
               entityTypeCode: 'encounter',
               type: 'vclaim-sipp',
diff --git a/app/handlers/supporting-document.handler.ts b/app/handlers/supporting-document.handler.ts
index 31087edc..900eb5a4 100644
--- a/app/handlers/supporting-document.handler.ts
+++ b/app/handlers/supporting-document.handler.ts
@@ -27,7 +27,9 @@ export async function uploadAttachmentCustom(payload: any) {
   const { user } = useUserStore()
   
   const formData = new FormData()
-  formData.append('name', payload.name)
+  if (!payload.id && payload.name) {
+    formData.append('name', payload.name)
+  }
   formData.append('content', payload.file)
   formData.append('entityType_code', payload.entityTypeCode)
   formData.append('type_code', payload.type)

From f4501cf3802f16cfa43fef9a97d26012cb43feed Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Tue, 9 Dec 2025 13:53:33 +0700
Subject: [PATCH 14/15] feat: add `useEncounterEntry` handler for managing
 encounter form data and logic.

---
 app/handlers/encounter-entry.handler.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/handlers/encounter-entry.handler.ts b/app/handlers/encounter-entry.handler.ts
index 41cc2602..9e354e5a 100644
--- a/app/handlers/encounter-entry.handler.ts
+++ b/app/handlers/encounter-entry.handler.ts
@@ -599,7 +599,7 @@ export function useEncounterEntry(props: {
         if (encounterId) {
           if (sepFile.value) {
             await uploadAttachmentCustom({
-              id: isEditMode.value && formValues.sepFileReview ? formValues.sepFileReview.id : null,
+              // id: isEditMode.value && formValues.sepFileReview ? formValues.sepFileReview.id : null,
               file: sepFile.value,
               refId: encounterId,
               entityTypeCode: 'encounter',
@@ -608,7 +608,7 @@ export function useEncounterEntry(props: {
           }
           if (sippFile.value) {
             await uploadAttachmentCustom({
-              id: isEditMode.value && formValues.sippFileReview ? formValues.sippFileReview.id : null,
+              // id: isEditMode.value && formValues.sippFileReview ? formValues.sippFileReview.id : null,
               file: sippFile.value,
               refId: encounterId,
               entityTypeCode: 'encounter',

From bcfe566373412e3be09f472d34963b046a792c0a Mon Sep 17 00:00:00 2001
From: Munawwirul Jamal <munawwirul.jamal@gmail.com>
Date: Tue, 9 Dec 2025 08:07:35 +0700
Subject: [PATCH 15/15] dev: hotfix, menu structure

---
 app/handlers/encounter-init.handler.ts        |  38 +-
 public/side-menu-items/emp-doc.json           |  42 ++-
 public/side-menu-items/emp-doc.json-bu        | 100 -----
 .../{emp-mid.json => emp-miw.json}            |  10 -
 public/side-menu-items/emp-nur.json           |  14 +-
 public/side-menu-items/sys.json               | 350 ------------------
 public/side-menu-items/system.json            |  64 ++--
 7 files changed, 89 insertions(+), 529 deletions(-)
 delete mode 100644 public/side-menu-items/emp-doc.json-bu
 rename public/side-menu-items/{emp-mid.json => emp-miw.json} (63%)
 delete mode 100644 public/side-menu-items/sys.json

diff --git a/app/handlers/encounter-init.handler.ts b/app/handlers/encounter-init.handler.ts
index 83cdb529..5e7e271c 100644
--- a/app/handlers/encounter-init.handler.ts
+++ b/app/handlers/encounter-init.handler.ts
@@ -68,12 +68,12 @@ const defaultKeys: Record<string, any> = {
     classCode: ['ambulatory', 'emergency', 'inpatient'],
     unit: 'all',
   },
-  earlyNurseryAssessment: {
-    id: 'early-nursery-assessment',
-    title: 'Pengkajian Awal Keperawatan',
-    classCode: ['ambulatory', 'emergency', 'inpatient'],
-    unit: 'all',
-  },
+  // earlyNurseryAssessment: {
+  //   id: 'early-nursery-assessment',
+  //   title: 'Pengkajian Awal Keperawatan',
+  //   classCode: ['ambulatory', 'emergency', 'inpatient'],
+  //   unit: 'all',
+  // },
   earlyMedicalAssessment: {
     id: 'early-medical-assessment',
     title: 'Pengkajian Awal Medis',
@@ -87,13 +87,13 @@ const defaultKeys: Record<string, any> = {
     unit: 'rehab',
     afterId: 'early-medical-assessment',
   },
-  functionAssessment: {
-    id: 'function-assessment',
-    title: 'Asesmen Fungsi',
-    classCode: ['ambulatory'],
-    unit: 'rehab',
-    afterId: 'rehab-medical-assessment',
-  },
+  // functionAssessment: {
+  //   id: 'function-assessment',
+  //   title: 'Asesmen Fungsi',
+  //   classCode: ['ambulatory'],
+  //   unit: 'rehab',
+  //   afterId: 'rehab-medical-assessment',
+  // },
   // therapyProtocol: {
   //   id: 'therapy-protocol',
   //   classCode: ['ambulatory'],
@@ -106,9 +106,9 @@ const defaultKeys: Record<string, any> = {
     classCode: ['ambulatory', 'emergency', 'inpatient'],
     unit: 'all',
   },
-  fkr: {
-    id: 'fkr',
-    title: 'FKR',
+  kfr: {
+    id: 'kfr',
+    title: 'KFR',
     classCode: ['ambulatory', 'emergency', 'inpatient'],
     unit: 'all',
   },
@@ -234,12 +234,6 @@ const defaultKeys: Record<string, any> = {
     classCode: ['ambulatory', 'emergency'],
     unit: 'all',
   },
-  kfr: {
-    id: 'kfr',
-    title: 'KFR',
-    classCode: ['ambulatory', 'emergency', 'inpatient'],
-    unit: 'all',
-  },
   refBack: {
     id: 'reference-back',
     title: 'PRB',
diff --git a/public/side-menu-items/emp-doc.json b/public/side-menu-items/emp-doc.json
index 36be57c7..350977e1 100644
--- a/public/side-menu-items/emp-doc.json
+++ b/public/side-menu-items/emp-doc.json
@@ -20,6 +20,11 @@
             "title": "Konsultasi",
             "icon": "i-lucide-building-2",
             "link": "/ambulatory/consultation"
+          },
+          {
+            "title": "Triase",
+            "icon": "i-lucide-stethoscope",
+            "link": "/ambulatory/triage"
           }
         ]
       },
@@ -47,7 +52,42 @@
       {
         "title": "Kemoterapi",
         "icon": "i-lucide-droplets",
-        "link": "/chemotherapy"
+        "link": "/chemotherapy",
+        "children": [
+          {
+            "title": "Administrasi",
+            "link": "/chemotherapy/early-encounter"
+          },
+          {
+            "title": "Kunjungan",
+            "link": "/chemotherapy/encounter"
+          }
+        ]
+      },
+      {
+        "title": "Hemofilia",
+        "icon": "i-lucide-droplet-off",
+        "link": "/hemophilia"
+      }
+    ]
+  },
+  {
+    "heading": "Ruang Tindakan Anak",
+    "items": [
+      {
+        "title": "Thalasemi",
+        "icon": "i-lucide-baby",
+        "link": "/thalasemia"
+      },
+      {
+        "title": "Echocardiography",
+        "icon": "i-lucide-baby",
+        "link": "/echocardiography"
+      },
+      {
+        "title": "Spirometri",
+        "icon": "i-lucide-baby",
+        "link": "/spirometry"
       }
     ]
   }
diff --git a/public/side-menu-items/emp-doc.json-bu b/public/side-menu-items/emp-doc.json-bu
deleted file mode 100644
index 2618a33b..00000000
--- a/public/side-menu-items/emp-doc.json-bu
+++ /dev/null
@@ -1,100 +0,0 @@
-[
-  {
-    "heading": "Menu Utama",
-    "items": [
-      {
-        "title": "Dashboard",
-        "icon": "i-lucide-home",
-        "link": "/"
-      },
-      {
-        "title": "Rawat Jalan",
-        "icon": "i-lucide-stethoscope",
-        "children": [
-          {
-            "title": "Kunjungan",
-            "icon": "i-lucide-stethoscope",
-            "link": "/ambulatory/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "icon": "i-lucide-building-2",
-            "link": "/ambulatory/consultation"
-          }
-        ]
-      },
-      {
-        "title": "IGD",
-        "icon": "i-lucide-zap",
-        "children": [
-          {
-            "title": "Triase",
-            "icon": "i-lucide-stethoscope",
-            "link": "/emergency/triage"
-          },
-          {
-            "title": "Kunjungan",
-            "icon": "i-lucide-building-2",
-            "link": "/emergency/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "icon": "i-lucide-building-2",
-            "link": "/emergency/consultation"
-          }
-        ]
-      },
-      {
-        "title": "Rawat Inap",
-        "icon": "i-lucide-building-2",
-        "children": [
-          {
-            "title": "Kunjungan",
-            "icon": "i-lucide-building-2",
-            "link": "/inpatient/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "icon": "i-lucide-building-2",
-            "link": "/inpatient/consultation"
-          }
-        ]
-      }
-    ]
-  },
-  {
-    "heading": "Ruang Tindakan Rajal",
-    "items": [
-      {
-        "title": "Kemoterapi",
-        "icon": "i-lucide-droplets",
-        "link": "/chemotherapy"
-      },
-      {
-        "title": "Hemofilia",
-        "icon": "i-lucide-droplet-off",
-        "link": "/hemophilia"
-      }
-    ]
-  },
-  {
-    "heading": "Ruang Tindakan Anak",
-    "items": [
-      {
-        "title": "Thalasemi",
-        "icon": "i-lucide-baby",
-        "link": "/thalasemia"
-      },
-      {
-        "title": "Echocardiography",
-        "icon": "i-lucide-baby",
-        "link": "/echocardiography"
-      },
-      {
-        "title": "Spirometri",
-        "icon": "i-lucide-baby",
-        "link": "/spirometry"
-      }
-    ]
-  }
-]
diff --git a/public/side-menu-items/emp-mid.json b/public/side-menu-items/emp-miw.json
similarity index 63%
rename from public/side-menu-items/emp-mid.json
rename to public/side-menu-items/emp-miw.json
index 1c6e5aef..37bcbbae 100644
--- a/public/side-menu-items/emp-mid.json
+++ b/public/side-menu-items/emp-miw.json
@@ -12,16 +12,6 @@
         "icon": "i-lucide-stethoscope",
         "link": "/ambulatory/encounter"
       },
-      {
-        "title": "IGD",
-        "icon": "i-lucide-zap",
-        "link": "/emergency/encounter"
-      },
-      {
-        "title": "Rehabilitasi Medik",
-        "icon": "i-lucide-bike",
-        "link": "/rehab/encounter-queue"
-      },
       {
         "title": "Rawat Inap",
         "icon": "i-lucide-building-2",
diff --git a/public/side-menu-items/emp-nur.json b/public/side-menu-items/emp-nur.json
index f940219e..a3fd9d4b 100644
--- a/public/side-menu-items/emp-nur.json
+++ b/public/side-menu-items/emp-nur.json
@@ -18,20 +18,10 @@
           {
             "title": "Kunjungan",
             "link": "/ambulatory/encounter"
-          }
-        ]
-      },
-      {
-        "title": "IGD",
-        "icon": "i-lucide-zap",
-        "children": [
-          {
-            "title": "Triase",
-            "link": "/emergency/triage"
           },
           {
-            "title": "Kunjungan",
-            "link": "/emergency/encounter"
+            "title": "Triase",
+            "link": "/ambulatory/triage"
           }
         ]
       },
diff --git a/public/side-menu-items/sys.json b/public/side-menu-items/sys.json
deleted file mode 100644
index 996c2a6b..00000000
--- a/public/side-menu-items/sys.json
+++ /dev/null
@@ -1,350 +0,0 @@
-[
-  {
-    "heading": "Menu Utama",
-    "items": [
-      {
-        "title": "Dashboard",
-        "icon": "i-lucide-home",
-        "link": "/"
-      },
-      {
-        "title": "Rawat Jalan",
-        "icon": "i-lucide-stethoscope",
-        "children": [
-          {
-            "title": "Antrian Pendaftaran",
-            "link": "/ambulatory/registration-queue"
-          },
-          {
-            "title": "Antrian Poliklinik",
-            "link": "/ambulatory/encounter-queue"
-          },
-          {
-            "title": "Kunjungan",
-            "link": "/ambulatory/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "link": "/ambulatory/consultation"
-          }
-        ]
-      },
-      {
-        "title": "IGD",
-        "icon": "i-lucide-zap",
-        "children": [
-          {
-            "title": "Triase",
-            "link": "/emergency/triage"
-          },
-          {
-            "title": "Kunjungan",
-            "link": "/emergency/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "link": "/emergency/consultation"
-          }
-        ]
-      },
-      {
-        "title": "Rawat Inap",
-        "icon": "i-lucide-building-2",
-        "children": [
-          {
-            "title": "Permintaan",
-            "link": "/inpatient/request"
-          },
-          {
-            "title": "Kunjungan",
-            "link": "/inpatient/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "link": "/inpatient/consultation"
-          }
-        ]
-      },
-      {
-        "title": "Obat - Order",
-        "icon": "i-lucide-briefcase-medical",
-        "children": [
-          {
-            "title": "Permintaan",
-            "link": "/medication/order"
-          },
-          {
-            "title": "Standing Order",
-            "link": "/medication/standing-order"
-          }
-        ]
-      },
-      {
-        "title": "Radiologi - Order",
-        "icon": "i-lucide-radio",
-        "link": "/radiology-order"
-      },
-      {
-        "title": "Lab - Order",
-        "icon": "i-lucide-microscope",
-        "link": "/cp-lab-order"
-      },
-      {
-        "title": "Lab Mikro - Order",
-        "icon": "i-lucide-microscope",
-        "link": "/micro-lab-order"
-      },
-      {
-        "title": "Lab PA - Order",
-        "icon": "i-lucide-microscope",
-        "link": "/ap-lab-order"
-      },
-      {
-        "title": "Gizi",
-        "icon": "i-lucide-egg-fried",
-        "link": "/nutrition-order"
-      },
-      {
-        "title": "Pembayaran",
-        "icon": "i-lucide-banknote-arrow-up",
-        "link": "/payment"
-      }
-    ]
-  },
-  {
-    "heading": "Ruang Tindakan Rajal",
-    "items": [
-      {
-        "title": "Kemoterapi",
-        "icon": "i-lucide-droplets",
-        "link": "/outpation-action/cemotherapy"
-      },
-      {
-        "title": "Hemofilia",
-        "icon": "i-lucide-droplet-off",
-        "link": "/outpation-action/hemophilia"
-      }
-    ]
-  },
-  {
-    "heading": "Ruang Tindakan Anak",
-    "items": [
-      {
-        "title": "Thalasemi",
-        "icon": "i-lucide-baby",
-        "link": "/children-action/thalasemia"
-      },
-      {
-        "title": "Echocardiography",
-        "icon": "i-lucide-baby",
-        "link": "/children-action/echocardiography"
-      },
-      {
-        "title": "Spirometri",
-        "icon": "i-lucide-baby",
-        "link": "/children-action/spirometry"
-      }
-    ]
-  },
-  {
-    "heading": "Client",
-    "items": [
-      {
-        "title": "Pasien",
-        "icon": "i-lucide-users",
-        "link": "/client/patient"
-      },
-      {
-        "title": "Rekam Medis",
-        "icon": "i-lucide-file-text",
-        "link": "/client/medical-record"
-      }
-    ]
-  },
-  {
-    "heading": "Integrasi",
-    "items": [
-      {
-        "title": "BPJS",
-        "icon": "i-lucide-circuit-board",
-        "children": [
-          {
-            "title": "SEP",
-            "icon": "i-lucide-circuit-board",
-            "link": "/integration/bpjs-vclaim/sep"
-          },
-          {
-            "title": "Peserta",
-            "icon": "i-lucide-circuit-board",
-            "link": "/integration/bpjs-vclaim/member"
-          },
-          {
-            "title": "Surat Kontrol",
-            "icon": "i-lucide-circuit-board",
-            "link": "/integration/bpjs-vclaim/control-letter"
-          }
-        ]
-      },
-      {
-        "title": "SATUSEHAT",
-        "icon": "i-lucide-database",
-        "link": "/integration/satusehat"
-      }
-    ]
-  },
-  {
-    "heading": "Source",
-    "items": [
-      {
-        "title": "Peralatan dan Perlengkapan",
-        "icon": "i-lucide-layout-dashboard",
-        "children": [
-          {
-            "title": "Obat",
-            "link": "/tools-equipment-src/medicine"
-          },
-          {
-            "title": "Peralatan",
-            "link": "/tools-equipment-src/tools"
-          },
-          {
-            "title": "Perlengkapan (BMHP)",
-            "link": "/tools-equipment-src/equipment"
-          },
-          {
-            "title": "Metode Obat",
-            "link": "/tools-equipment-src/medicine-method"
-          },
-          {
-            "title": "Jenis Obat",
-            "link": "/tools-equipment-src/medicine-type"
-          },
-          {
-            "title": "Sediaan Obat",
-            "link": "/tools-equipment-src/medicine-form"
-          }
-        ]
-      },
-      {
-        "title": "Pengguna",
-        "icon": "i-lucide-user",
-        "children": [
-          {
-            "title": "Pegawai",
-            "link": "/human-src/employee"
-          },
-          {
-            "title": "PPDS",
-            "link": "/human-src/specialist-intern"
-          }
-        ]
-      },
-      {
-        "title": "Pemeriksaan Penunjang",
-        "icon": "i-lucide-layout-list",
-        "children": [
-          {
-            "title": "Checkup",
-            "link": "/mcu-src/mcu"
-          },
-          {
-            "title": "Prosedur",
-            "link": "/mcu-src/procedure"
-          },
-          {
-            "title": "Diagnosis",
-            "link": "/mcu-src/diagnose"
-          },
-          {
-            "title": "Medical Action",
-            "link": "/mcu-src/medical-action"
-          }
-        ]
-      },
-      {
-        "title": "Infrastruktur",
-        "icon": "i-lucide-layout-list",
-        "children": [
-          {
-            "title": "Kasur",
-            "link": "/infra-src/bed"
-          },
-          {
-            "title": "Kamar",
-            "link": "/infra-src/chamber"
-          },
-          {
-            "title": "Ruang",
-            "link": "/infra-src/room"
-          },
-          {
-            "title": "Depo",
-            "link": "/infra-src/warehouse"
-          },
-          {
-            "title": "Lantai",
-            "link": "/infra-src/floor"
-          },
-          {
-            "title": "Gedung",
-            "link": "/infra-src/building"
-          },
-          {
-            "title": "Counter",
-            "link": "/infra-src/counter"
-          },
-          {
-            "title": "Public Screen (Big Screen)",
-            "link": "/infra-src/public-screen"
-          }
-        ]
-      },
-      {
-        "title": "Organisasi",
-        "icon": "i-lucide-network",
-        "children": [
-          {
-            "title": "Divisi",
-            "link": "/org-src/division"
-          },
-          {
-            "title": "Instalasi",
-            "link": "/org-src/installation"
-          },
-          {
-            "title": "Unit",
-            "link": "/org-src/unit"
-          },
-          {
-            "title": "Spesialis",
-            "link": "/org-src/specialist"
-          },
-          {
-            "title": "Sub Spesialis",
-            "link": "/org-src/subspecialist"
-          }
-        ]
-      },
-      {
-        "title": "Umum",
-        "icon": "i-lucide-airplay",
-        "children": [
-          {
-            "title": "Uom",
-            "link": "/common/uom"
-          }
-        ]
-      },
-      {
-        "title": "Keuangan",
-        "icon": "i-lucide-airplay",
-        "children": [
-          {
-            "title": "Item & Pricing",
-            "link": "/common/item"
-          }
-        ]
-      }
-    ]
-  }
-]
diff --git a/public/side-menu-items/system.json b/public/side-menu-items/system.json
index 19d20336..e8bdc06c 100644
--- a/public/side-menu-items/system.json
+++ b/public/side-menu-items/system.json
@@ -26,24 +26,10 @@
           {
             "title": "Konsultasi",
             "link": "/ambulatory/consultation"
-          }
-        ]
-      },
-      {
-        "title": "IGD",
-        "icon": "i-lucide-zap",
-        "children": [
+          },
           {
             "title": "Triase",
             "link": "/emergency/triage"
-          },
-          {
-            "title": "Kunjungan",
-            "link": "/emergency/encounter"
-          },
-          {
-            "title": "Konsultasi",
-            "link": "/emergency/consultation"
           }
         ]
       },
@@ -139,12 +125,22 @@
       {
         "title": "Kemoterapi",
         "icon": "i-lucide-droplets",
-        "link": "/outpation-action/chemotherapy"
+        "link": "/chemotherapy",
+        "children": [
+          {
+            "title": "Administrasi",
+            "link": "/chemotherapy/early-encounter"
+          },
+          {
+            "title": "Kunjungan",
+            "link": "/chemotherapy/encounter"
+          }
+        ]
       },
       {
         "title": "Hemofilia",
         "icon": "i-lucide-droplet-off",
-        "link": "/outpation-action/hemophilia"
+        "link": "/hemophilia"
       }
     ]
   },
@@ -154,17 +150,17 @@
       {
         "title": "Thalasemi",
         "icon": "i-lucide-baby",
-        "link": "/children-action/thalasemia"
+        "link": "/thalasemia"
       },
       {
         "title": "Echocardiography",
         "icon": "i-lucide-baby",
-        "link": "/children-action/echocardiography"
+        "link": "/echocardiography"
       },
       {
         "title": "Spirometri",
         "icon": "i-lucide-baby",
-        "link": "/children-action/spirometry"
+        "link": "/spirometry"
       }
     ]
   },
@@ -252,20 +248,6 @@
           }
         ]
       },
-      {
-        "title": "Pengguna",
-        "icon": "i-lucide-user",
-        "children": [
-          {
-            "title": "Pegawai",
-            "link": "/human-src/employee"
-          },
-          {
-            "title": "PPDS",
-            "link": "/human-src/specialist-intern"
-          }
-        ]
-      },
       {
         "title": "Pemeriksaan Penunjang",
         "icon": "i-lucide-layout-list",
@@ -288,6 +270,20 @@
           }
         ]
       },
+      {
+        "title": "Pengguna",
+        "icon": "i-lucide-user",
+        "children": [
+          {
+            "title": "Pegawai",
+            "link": "/human-src/employee"
+          },
+          {
+            "title": "PPDS",
+            "link": "/human-src/intern"
+          }
+        ]
+      },
       {
         "title": "Layanan",
         "icon": "i-lucide-layout-list",