diff --git a/app/components/flow/medicine-method/list.vue b/app/components/flow/medicine-method/list.vue
index e05419e5..43d7a03f 100644
--- a/app/components/flow/medicine-method/list.vue
+++ b/app/components/flow/medicine-method/list.vue
@@ -3,6 +3,7 @@ import type { DataTableLoader } from '~/components/pub/base/data-table/type'
 import type { HeaderPrep, RefSearchNav } from '~/components/pub/custom-ui/data/types'
 import Modal from '~/components/pub/base/modal/modal.vue'
 import Header from '~/components/pub/custom-ui/nav-header/prep.vue'
+import { getMedicineMethods } from '~/services/medicine-method.service'
 
 const data = ref([])
 const entry = ref<any>({})
@@ -40,17 +41,19 @@ const hreaderPrep: HeaderPrep = {
   },
 }
 
-async function getPatientList() {
-  isLoading.isTableLoading = true
-  const resp = await xfetch('/api/v1/medicine-method')
-  if (resp.success) {
-    data.value = (resp.body as Record<string, any>).data
+async function getData() {
+  try {
+    isLoading.isTableLoading = true
+    data.value = await getMedicineMethods()
+  } catch (err) {
+    console.error(err)
+  } finally {
+    isLoading.isTableLoading = false
   }
-  isLoading.isTableLoading = false
 }
 
 onMounted(() => {
-  getPatientList()
+  getData()
 })
 
 provide('rec_id', recId)
diff --git a/app/services/medicine-method.service.ts b/app/services/medicine-method.service.ts
new file mode 100644
index 00000000..02327163
--- /dev/null
+++ b/app/services/medicine-method.service.ts
@@ -0,0 +1,9 @@
+import { xfetch } from '~/composables/useXfetch'
+
+export async function getMedicineMethods() {
+  const resp = await xfetch('/api/v1/medicine-method')
+  if (resp.success) {
+    return (resp.body as Record<string, any>).data
+  }
+  throw new Error('Failed to fetch medicine methods')
+}