feat(sep): add query from encounter

app/components/content/encounter/entry.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { DataTableLoader } from '~/components/pub/my-ui/data-table'
 import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
 
 const props = defineProps<{
@@ -12,6 +13,18 @@ const isLoading = reactive<DataTableLoader>({
   isTableLoading: false,
 })
 
+const division = {
+  msg: {
+    placeholder: 'Pilih Divisi',
+    search: 'Cari Divisi',
+    empty: 'Divisi tidak ditemukan',
+  },
+}
+
+const items = ref([{ value: '1', label: 'Division 1', code: 'DIV1' }])
+
+const schema = {}
+
 async function getPatientList() {
   isLoading.isTableLoading = true
   const resp = await xfetch('/api/v1/patient')
@@ -25,12 +38,38 @@ onMounted(() => {
   getPatientList()
 })
 
-function onClick(e: 'search' | 'add') {
+function toKebabCase(str: string): string {
+  return str.replace(/_/g, '-').toLowerCase()
+}
+
+function toNavigateSep(values: any) {
+  const queryParams = new URLSearchParams()
+  Object.keys(values).forEach(field => {
+    if (values[field]) {
+      queryParams.append(toKebabCase(field), values[field])
+    }
+  })
+  navigateTo('/integration/bpjs/sep/add' + `?${queryParams.toString()}`)
+}
+
+function onSubmit(values: any, resetForm: () => void) {
+  console.log('submit', values)
+  resetForm()
+}
+
+function onCancel(resetForm: () => void) {
+  console.log('cancel')
+  resetForm()
+}
+
+function onClick(e: 'search' | 'add' | 'add-sep', formValues?: any) {
   console.log('click', e)
   if (e === 'search') {
-    isOpen.value = true
+    console.log('search')
   } else if (e === 'add') {
     navigateTo('/client/patient/add')
+  } else if (e === 'add-sep') {
+    toNavigateSep({ resource: 'encounter', is_service: 'false', ...formValues })
   }
 }
 
@@ -39,13 +78,29 @@ provide('table_data_loader', isLoading)
 
 <template>
   <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
-    <Icon name="i-lucide-user" class="me-2" />
-    <span class="font-semibold">{{ props.formType }}</span> Kunjungan
+    <Icon
+      name="i-lucide-user"
+      class="me-2"
+    />
+    <span class="font-semibold">{{ props.formType }}</span>
+    Kunjungan
   </div>
-  <AppEncounterEntryForm @click="onClick" />
+  <AppEncounterEntryForm
+    :division="division"
+    :items="items"
+    :schema="schema"
+    @click="onClick"
+    @submit="onSubmit"
+    @cancel="onCancel"
+  />
   <AppSepSmallEntry v-if="props.id" />
 
-  <Dialog v-model:open="isOpen" title="Cari Pasien" size="xl" prevent-outside>
+  <Dialog
+    v-model:open="isOpen"
+    title="Cari Pasien"
+    size="xl"
+    prevent-outside
+  >
     <AppPatientPicker :data="data" />
   </Dialog>
 </template>