chore: solve conflict

app/components/content/consultation/list.vue

@@ -23,6 +23,7 @@ import {
   isProcessing,
   isFormEntryDialogOpen,
   isRecordConfirmationOpen,
+  onResetState,
   handleActionSave,
   handleActionEdit,
   handleActionRemove,
@@ -43,6 +44,7 @@ interface Props {
 const props = defineProps<Props>()
 
 let units = ref<{ value: string; label: string }[]>([])
+const encounterId = ref<number>(props?.encounter?.id || 0)
 const title = ref('')
 
 const {
@@ -57,7 +59,7 @@ const {
   fetchFn: async ({ page, search }) => {
     const result = await getList({ 'encounter-id': props.encounter.id, includes: 'encounter,dstUnit', search, page })
     if (result.success) {
-      data.value = result.body.data;
+      data.value = result.body.data
     }
     return { success: result.success || false, body: result.body || {} }
   },
@@ -83,7 +85,7 @@ const headerPrep: HeaderPrep = {
     icon: 'i-lucide-plus',
     onClick: () => {
       recItem.value = {
-        encounter_id: props.encounter.id,
+        encounter_id: encounterId.value,
         date: today.toISOString().slice(0, 10),
         unit_id: 0,
         problem: '',
@@ -144,13 +146,29 @@ onMounted(async () => {
     @search="handleSearch"
     class="mb-4 xl:mb-5"
   />
-  <List :data="data" :pagination-meta="paginationMeta" @page-change="handlePageChange" />
 
-  <Dialog v-model:open="isFormEntryDialogOpen" :title="recItem?.id ? 'Edit Konsultasi' : 'Tambah Konsultasi'" size="xl" prevent-outside>
+  <List
+    :data="data"
+    :pagination-meta="paginationMeta"
+    @page-change="handlePageChange"
+  />
+
+  <Dialog
+    v-model:open="isFormEntryDialogOpen"
+    :title="recItem?.id ? 'Edit Konsultasi' : 'Tambah Konsultasi'"
+    size="xl"
+    prevent-outside
+    @update:open="
+      (value: any) => {
+        onResetState()
+        isFormEntryDialogOpen = value
+      }
+    "
+  >
     <Entry
       :schema="ConsultationSchema"
       :values="recItem"
-      :encounter_id="props.encounter.id"
+      :encounter_id="encounterId"
       :units="units"
       :is-loading="isProcessing"
       :is-readonly="isReadonly"
@@ -168,7 +186,6 @@ onMounted(async () => {
   </Dialog>
 
   <!-- Record Confirmation Modal -->
-   {{ isRecordConfirmationOpen }}
   <RecordConfirmation
     v-model:open="isRecordConfirmationOpen"
     action="delete"
@@ -178,9 +195,18 @@ onMounted(async () => {
   >
     <template #default="{ record }">
       <div class="text-sm">
-        <p><strong>ID:</strong> {{ record?.id }}</p>
-        <p v-if="record?.name"><strong>Nama:</strong> {{ record.name }}</p>
-        <p v-if="record?.code"><strong>Kode:</strong> {{ record.code }}</p>
+        <p>
+          <strong>ID:</strong>
+          {{ record?.id }}
+        </p>
+        <p v-if="record?.name">
+          <strong>Nama:</strong>
+          {{ record.name }}
+        </p>
+        <p v-if="record?.code">
+          <strong>Kode:</strong>
+          {{ record.code }}
+        </p>
       </div>
     </template>
   </RecordConfirmation>

app/components/content/device-order/entry.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+import Nav from '~/components/pub/my-ui/nav-footer/ba-su.vue'
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+
+import { useQueryCRUDMode } from '~/composables/useQueryCRUD'
+
+import ItemListEntry from '~/components/app/device-order-item/list-entry.vue'
+import type { HeaderPrep } from '~/components/pub/my-ui/data/types'
+
+const { backToList } = useQueryCRUDMode()
+
+const headerPrep: HeaderPrep = {
+  title: 'Tambah Order Alkes',
+  icon: 'i-lucide-box',
+}
+
+  function navClick(type: 'cancel' | 'submit') {
+    if (type === 'cancel') {
+      backToList()
+    }
+  }
+</script>
+
+<template>
+  <Header
+    :prep="headerPrep"
+    :ref-search-nav="headerPrep.refSearchNav"
+    class="mb-4 xl:mb-5"
+  />
+
+  <ItemListEntry />
+  <Separator class="my-5" />
+
+  <div class="w-full flex justify-center">
+    <Nav @click="navClick" />
+  </div>
+</template>

app/components/content/device-order/list.vue

@@ -0,0 +1,145 @@
+<script setup lang="ts">
+// Components
+import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
+import List from '~/components/app/device-order/list.vue'
+
+// Helpers
+import { usePaginatedList } from '~/composables/usePaginatedList'
+import { toast } from '~/components/pub/ui/toast'
+// import { useQueryMode } from '~/composables/useQueryMode'
+import { useQueryCRUDMode } from '~/composables/useQueryCRUD'
+
+// Types
+import { ActionEvents, type HeaderPrep } from '~/components/pub/my-ui/data/types'
+import { type DeviceOrderFormData, DeviceOrderSchema  } from '~/schemas/device-order.schema'
+import type { DeviceOrder } from "~/models/device-order";
+
+// Handlers
+import {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isProcessing,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  onResetState,
+  handleActionSave,
+  handleActionEdit,
+  handleActionRemove,
+  handleCancelForm,
+} from '~/handlers/device-order.handler'
+
+// Services
+import { getList } from '~/services/device-order.service'
+
+const route = useRoute()
+const title = ref('')
+
+// const { mode, openForm, backToList } = useQueryMode()
+const { mode, goToEntry, backToList } = useQueryCRUDMode()
+const { recordId } = useQueryCRUDRecordId()
+
+const {
+  data,
+  isLoading,
+  paginationMeta,
+  searchInput,
+  handlePageChange,
+  handleSearch,
+  fetchData: getMyList,
+} = usePaginatedList({
+  fetchFn: async (params: any) => {
+    const result = await getList({
+      search: params.search,
+      sort: 'createdAt:asc',
+      'page-number': params['page-number'] || 0,
+      'page-size': params['page-size'] || 10,
+      includes: 'parent,childrens',
+    })
+    return { success: result.success || false, body: result.body || {} }
+  },
+  entityName: 'device-order',
+})
+
+const headerPrep: HeaderPrep = {
+  title: 'Order Alkes',
+  icon: 'i-lucide-box',
+  refSearchNav: {
+    placeholder: 'Cari (min. 3 karakter)...',
+    minLength: 3,
+    debounceMs: 500,
+    showValidationFeedback: true,
+    onInput: (value: string) => {
+      searchInput.value = value
+    },
+    onClick: () => {},
+    onClear: () => {},
+  },
+  addNav: {
+    label: 'Tambah',
+    icon: 'i-lucide-plus',
+    onClick: async () => {
+      recItem.value = null
+      recId.value = 0
+      isReadonly.value = false
+      // await handleActionSave(recItem, getMyList, () => {}, () => {})
+      goToEntry()
+    },
+  },
+}
+
+provide('rec_id', recId)
+provide('rec_action', recAction)
+provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
+
+// Watch for row actions when recId or recAction changes
+onMounted(async () => {
+  await getMyList()
+})
+</script>
+
+<template>
+  <Header
+    v-model="searchInput"
+    :prep="headerPrep"
+    :ref-search-nav="headerPrep.refSearchNav"
+    @search="handleSearch"
+    class="mb-4 xl:mb-5"
+  />
+
+  <List
+    :data="data"
+    :pagination-meta="paginationMeta"
+    @page-change="handlePageChange"
+  />
+
+  <!-- Record Confirmation Modal -->
+  <RecordConfirmation
+    v-model:open="isRecordConfirmationOpen"
+    action="delete"
+    :record="recItem"
+    @confirm="() => handleActionRemove(recId, getMyList, toast)"
+    @cancel=""
+  >
+    <template #default="{ record }">
+      <div class="text-sm">
+        <p>
+          <strong>ID:</strong>
+          {{ record?.id }}
+        </p>
+        <p v-if="record?.name">
+          <strong>Nama:</strong>
+          {{ record.name }}
+        </p>
+        <p v-if="record?.code">
+          <strong>Kode:</strong>
+          {{ record.code }}
+        </p>
+      </div>
+    </template>
+  </RecordConfirmation>
+</template>

app/components/content/device-order/main.vue

@@ -0,0 +1,12 @@
+<script setup lang="ts">
+//
+import List from './list.vue'
+import Entry from './entry.vue'
+
+const { mode } = useQueryMode()
+</script>
+
+<template>
+  <List v-if="mode === 'list'" />
+  <Entry v-else />
+</template>