Fix: refactor Kai CRUD UI to no redirect

app/components/content/prb/detail.vue

@@ -11,17 +11,18 @@ import Header from '~/components/pub/my-ui/nav-header/prep.vue'
 import type { Prb } from '~/models/prb'
 
 // #region Props & Emits
-const props = defineProps<{
-}>()
+const props = withDefaults(defineProps<{ 
+  encounter_id: number
+  record_id: number 
+}>(), {
+  
+})
 
 // #endregion
 
 // #region State & Computed
 
-const route = useRoute()
 const router = useRouter()
-const encounterId = typeof route.params.id == 'string' ? parseInt(route.params.id) : 0
-const PrbId = typeof route.params.surgery_report_id == 'string' ? parseInt(route.params.surgery_report_id) : 0
 const Prb = ref<Prb | null>(null)
 
 const headerPrep: HeaderPrep = {

app/components/content/prb/entry.vue

@@ -4,21 +4,11 @@ import type { Patient, genPatientProps } from '~/models/patient'
 import type { ExposedForm } from '~/types/form'
 import type { PatientBase } from '~/models/patient'
 import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
-import Header from '~/components/pub/my-ui/nav-header/prep.vue'
-import { genPatient } from '~/models/patient'
-import { PatientSchema } from '~/schemas/patient.schema'
-import { PersonAddressRelativeSchema } from '~/schemas/person-address-relative.schema'
-import { PersonAddressSchema } from '~/schemas/person-address.schema'
-import { PersonContactListSchema } from '~/schemas/person-contact.schema'
-import { PersonFamiliesSchema } from '~/schemas/person-family.schema'
-import { ResponsiblePersonSchema } from '~/schemas/person-relative.schema'
-import { uploadAttachment } from '~/services/patient.service'
 import { getDetail, update } from '~/services/prb.service'
 import type { Prb } from '~/models/prb'
 import ActionDialog from '~/components/pub/my-ui/nav-footer/ba-su.vue'
 
 import { toast } from '~/components/pub/ui/toast'
-import { withBase } from '~/models/_base'
 import Confirmation from '~/components/pub/my-ui/confirmation/confirmation.vue'
 import { PrbSchema } from '~/schemas/prb.schema'
 import { formatDateYyyyMmDd } from '~/lib/date'
@@ -29,8 +19,10 @@ import type { HeaderPrep, RefSearchNav } from '~/components/pub/my-ui/data/types
 import { formatDateToDatetimeLocal } from '~/lib/utils'
 
 // #region Props & Emits
-const props = withDefaults(defineProps<{
+const props = withDefaults(defineProps<{ 
+  encounter_id: number
   callbackUrl?: string
+  record_id: number 
   isBpjs?: boolean
 }>(), {
   isBpjs: false,
@@ -44,11 +36,7 @@ const { data, isLoading, paginationMeta, searchInput, handlePageChange, handleSe
 // #endregion
 
 // #region State & Computed
-const route = useRoute()
 const router = useRouter()
-const encounterId = typeof route.params.id == 'string' ? parseInt(route.params.id) : 0
-const PrbId = typeof route.params.surgery_report_id == 'string' ? parseInt(route.params.surgery_report_id) : 0
-
 const inputForm = ref<ExposedForm<any> | null>(null)
 const Prb = ref({})
 const isConfirmationOpen = ref(false)
@@ -60,7 +48,7 @@ provide("isSepDialogOpen", isSepDialogOpen);
 
 // #region Lifecycle Hooks
 onMounted(async () => {
-  const result = await getDetail(PrbId)
+  const result = await getDetail(props.record_id)
   if (result.success) {
     const responseData = {...result.body.data, date: formatDateYyyyMmDd(result.body.data.date)}
     Prb.value = responseData
@@ -76,7 +64,7 @@ function goBack() {
 
 async function handleConfirmAdd() {
   const response = await handleActionEdit(
-    PrbId,
+    props.record_id,
     await composeFormData(),
     () => { },
     () => { },
@@ -97,7 +85,7 @@ async function composeFormData(): Promise<Prb> {
   if (!allValid) return Promise.reject('Form validation failed')
 
   const formData = input?.values
-  formData.encounter_id = encounterId
+  formData.encounter_id = props.encounter_id
   return new Promise((resolve) => resolve(formData))
 }
 // #endregion region

app/components/content/prb/list.vue

@@ -19,13 +19,16 @@ import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
 
 // #region State
 const props = withDefaults(defineProps<{
-  encounter?: Encounter
+  encounter_id: number
   isBpjs?: boolean
+  redirectToForm?: (myRecord_id?: any) => void
+  redirectToDetail?: (myRecord_id: string|number) => void
 }>(), {
   isBpjs: false,
+  redirectToForm: () => { },
+  redirectToDetail: () => { }
 })
-const route = useRoute()
-const encounterId = typeof route.params.id == 'string' ? parseInt(route.params.id) : 0
+const { user } = useUserStore()
 
 const { data, isLoading, paginationMeta, searchInput, handlePageChange, handleSearch, fetchData } = usePaginatedList({
   fetchFn: (params) => getList({ ...params, includes: '', }),
@@ -66,10 +69,9 @@ const headerPrep: HeaderPrep = {
 if(true){
   headerPrep.addNav = {
     label: "Program Rujuk Balik",
-    onClick: () => navigateTo({
-        name: 'rehab-encounter-id-prb-add',
-        params: { id: encounterId },
-      }),
+    onClick: () => {
+      props.redirectToForm()
+    },
   };
 }
 headerPrep.components = [
@@ -134,10 +136,7 @@ provide('isHistoryDialogOpen', isHistoryDialogOpen)
 watch([recId, recAction, timestamp], () => {
   switch (recAction.value) {
     case ActionEvents.showEdit:
-      navigateTo({
-        name: 'rehab-encounter-id-prb-prb_id-edit',
-        params: { id: encounterId, "prb_id": recId.value },
-      })
+      props.redirectToForm(recId.value)
       break
 
     case ActionEvents.showPrint:

app/components/content/prb/main.vue

@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { crudQueryParamsMode } from '~/lib/system-constants';
+import List from './list.vue'
+import Detail from './detail.vue'
+import Entry from './entry.vue'
+
+const props = defineProps<{
+  encounter_id: number
+}>()
+
+const { crudQueryParams, goToDetail, goToEntry } = useQueryCRUD()
+</script>
+
+<template>
+  <List v-if="crudQueryParams.mode === crudQueryParamsMode.list && !crudQueryParams.recordId"
+    :encounter_id="encounter_id"
+    :redirectToForm="goToEntry"
+    :redirectToDetail="goToDetail"/>
+  <Detail v-else-if="crudQueryParams.mode === crudQueryParamsMode.list && crudQueryParams.recordId"
+    :encounter_id="encounter_id"
+    :record_id="crudQueryParams.recordId"
+    :redirectToForm="goToEntry"/>
+  <Entry v-else-if="crudQueryParams.mode === crudQueryParamsMode.entry"
+    :encounter_id="encounter_id"
+    :record_id="crudQueryParams.recordId" />
+    
+  <List v-else :encounter_id="encounter_id" :redirectToForm="goToEntry" :redirectToDetail="goToDetail" />
+</template>