⚠️ refactor (soapi): refactor form component to use usequerycrudmode and update api call

app/components/content/soapi/list.vue

@@ -8,7 +8,9 @@ const props = defineProps<{
   label: string
 }>()
 
-const emits = defineEmits(['add', 'edit'])
+const { goToEntry } = useQueryCRUDMode('mode')
+const router = useRouter()
+const route = useRoute()
 
 const data = ref([])
 
@@ -37,21 +39,40 @@ const hreaderPrep: HeaderPrep = {
   icon: 'i-lucide-users',
   addNav: {
     label: 'Tambah',
-    onClick: () => emits('add'),
+    onClick: () => goToEntry(),
   },
 }
 
 async function getPatientList() {
-  const resp = await xfetch('/api/v1/patient')
+  const resp = await xfetch(`/api/v1/soapi?encounter_id=${route.params.id}?include=encounter`)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
   }
 }
 
+const goEdit = (id: string) => {
+  router.replace({
+    path: route.path,
+    query: {
+      ...route.query,
+      mode: 'entry',
+      'record-id': id,
+    },
+  })
+}
+
 onMounted(() => {
   getPatientList()
 })
 
+watch(recId, () => {
+  console.log('recId', recId.value)
+  console.log('recIdaacin', recAction.value)
+  if (recAction.value === 'showEdit') {
+    goEdit(recId.value)
+  }
+})
+
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)