From e3fc1e4ab9014e0948dda6c412433509b03310de Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Sat, 15 Nov 2025 20:14:38 +0700
Subject: [PATCH 1/8] feat/radiology-order-54: adjust wip

---
 app/components/content/radiology-order/list.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/app/components/content/radiology-order/list.vue b/app/components/content/radiology-order/list.vue
index b2c8571d..47c822e9 100644
--- a/app/components/content/radiology-order/list.vue
+++ b/app/components/content/radiology-order/list.vue
@@ -13,7 +13,6 @@ import {
   recAction,
   recItem,
   isReadonly,
-  isFormEntryDialogOpen,
   isRecordConfirmationOpen,
   handleActionSave,
   handleActionRemove,
@@ -28,6 +27,7 @@ const route = useRoute()
 const { setQueryParams } = useQueryParam()
 
 const title = ref('')
+const addTrigger = ref(false)
 
 const plainEid = route.params.id
 const encounter_id = (plainEid && typeof plainEid == 'string') ? parseInt(plainEid) : 0 // here the
@@ -74,7 +74,7 @@ const headerPrep: HeaderPrep = {
     onClick: () => {
       recItem.value = null
       recId.value = 0
-      isFormEntryDialogOpen.value = true
+      addTrigger.value = true
       isReadonly.value = false
     },
   },
@@ -90,7 +90,7 @@ const getMyDetail = async (id: number | string) => {
   if (result.success) {
     const currentValue = result.body?.data || {}
     recItem.value = currentValue
-    isFormEntryDialogOpen.value = true
+    addTrigger.value = true
   }
 }
 
@@ -113,10 +113,10 @@ watch([recId, recAction], () => {
   }
 })
 
-watch([isFormEntryDialogOpen], async () => {
-  if (isFormEntryDialogOpen.value) {
-    isFormEntryDialogOpen.value = false;
-    const saveResp = await handleActionSave({ encounter_id }, getMyList, () =>{}, toast)
+watch([addTrigger], async () => {
+  if (addTrigger.value) {
+    addTrigger.value = false;
+    const saveResp = await handleActionSave({ encounter_id, "scope_code": "rad" }, getMyList, () =>{}, toast)
     if (saveResp.success) {
       setQueryParams({
         'mode': 'entry',

From cf5789549e7e86b6e93f9d784e3ccb433e22619f Mon Sep 17 00:00:00 2001
From: Munawwirul Jamal <munawwirul.jamal@gmail.com>
Date: Sun, 23 Nov 2025 15:56:31 +0700
Subject: [PATCH 2/8] feat/mcu: improved wip

---
 .../app/mcu-order-item/list-entry.cfg.ts      | 24 ++++----
 .../app/mcu-order-item/list-entry.vue         |  4 +-
 app/components/app/mcu-order-item/list.cfg.ts |  2 +-
 .../pub/my-ui/data/camuflage-input.vue        | 59 +++++++++++++++++++
 app/models/mcu-order-item.ts                  |  1 +
 app/services/mcu-order.service.ts             | 13 ++++
 6 files changed, 90 insertions(+), 13 deletions(-)
 create mode 100644 app/components/pub/my-ui/data/camuflage-input.vue

diff --git a/app/components/app/mcu-order-item/list-entry.cfg.ts b/app/components/app/mcu-order-item/list-entry.cfg.ts
index 89d85dce..8bf2fb18 100644
--- a/app/components/app/mcu-order-item/list-entry.cfg.ts
+++ b/app/components/app/mcu-order-item/list-entry.cfg.ts
@@ -1,18 +1,19 @@
 import type { Config } from '~/components/pub/my-ui/data-table'
 import { defineAsyncComponent } from 'vue'
+import type { McuOrderItem } from '~/models/mcu-order-item'
 
 const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
-const input = defineAsyncComponent(() => import('~/components/pub/ui/input/Input.vue'))
+const input = defineAsyncComponent(() => import('~/components/pub/my-ui/data/editable-div.vue'))
 
 export const config: Config = {
-  cols: [{}, {}, { classVal: '!p-0.5' }, { width: 50 }],
+  cols: [{}, {}, { classVal: '!p-0.5' }],
 
   headers: [
     [
       { label: 'Nama' },
       { label: 'Jenis' },
-      { label: 'Catatan' },
-      { label: '' },
+      { label: 'Catatan', classVal: '!w-[40%]' },
+      // { label: '' },
     ],
   ],
 
@@ -27,16 +28,17 @@ export const config: Config = {
       return {
         idx,
         rec: rec as object,
+        props: { data: (rec as McuOrderItem).note },
         component: input,
       }
     },
-    action(rec, idx) {
-      return {
-        idx,
-        rec: rec as object,
-        component: action,
-      }
-    },
+    // action(rec, idx) {
+    //   return {
+    //     idx,
+    //     rec: rec as object,
+    //     component: action,
+    //   }
+    // },
   },
 
   htmls: {},
diff --git a/app/components/app/mcu-order-item/list-entry.vue b/app/components/app/mcu-order-item/list-entry.vue
index 6c93c5ac..4fd8edb8 100644
--- a/app/components/app/mcu-order-item/list-entry.vue
+++ b/app/components/app/mcu-order-item/list-entry.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import DataTable from '~/components/pub/my-ui/data-table/data-table.vue'
+
 import { config } from './list-entry.cfg'
 import type { McuOrderItem } from '~/models/mcu-order-item';
 
@@ -13,7 +15,7 @@ const emit = defineEmits<{
 </script>
 
 <template>
-  <PubMyUiDataTable class="border mb-3 2xl:mb-4"
+  <DataTable class="border mb-3 2xl:mb-4"
     v-bind="config"
     :rows="data"
   />
diff --git a/app/components/app/mcu-order-item/list.cfg.ts b/app/components/app/mcu-order-item/list.cfg.ts
index 2b054379..1dee1bf9 100644
--- a/app/components/app/mcu-order-item/list.cfg.ts
+++ b/app/components/app/mcu-order-item/list.cfg.ts
@@ -6,7 +6,7 @@ export const config: Config = {
   headers: [
     [
       { label: 'Nama' },
-      { label: 'Jenis' },
+      { label: 'Catatan' },
     ],
   ],
 
diff --git a/app/components/pub/my-ui/data/camuflage-input.vue b/app/components/pub/my-ui/data/camuflage-input.vue
new file mode 100644
index 00000000..09500724
--- /dev/null
+++ b/app/components/pub/my-ui/data/camuflage-input.vue
@@ -0,0 +1,59 @@
+<script setup lang="ts">
+const model = defineModel<string>()
+const props = defineProps<{
+  class: string
+  defaultClass?: string
+  disabled?: boolean
+  width?: number
+  widthUnit?: string
+}>()
+
+const InputComp = defineAsyncComponent(() => import('~/components/pub/ui/input/Input.vue'))
+const activeState = ref(false)
+
+let defaultClass = props.defaultClass ?? 'h-8 xl:h-9'
+let widthStyle = '';
+if(props.width) {
+  widthStyle = `width: ${props.width}${props.widthUnit ?? 'px'};`
+} else {
+  widthStyle = `width: 100%;`
+}
+
+const recId = inject<Ref<number>>('rec_id')!
+const recAction = inject<Ref<string>>('rec_action')!
+const recItem = inject<Ref<any>>('rec_item')!
+
+watch(activeState, () => {
+  nextTick(() => {
+    if (asyncInputRef.value && typeof asyncInputRef.value.focus === 'function') {
+        asyncInputRef.value.focus()
+      }
+  })
+
+    //   document.getElementById('editable-div')?.scrollIntoView({ behavior: 'smooth' })
+    InputComp.value.focus()
+    // console.log(inputComp.__defaults)
+})
+</script>
+
+<template>
+  <div
+    v-if="!activeState || disabled" @click="() => activeState = true"
+    :class="`${defaultClass}`"
+    :style="widthStyle">
+    {{ model }}
+  </div>
+  <InputComp v-else 
+    v-model="model"
+    :class="`${defaultClass}`"
+    :style="widthStyle"
+    @blur="() => activeState = false"
+  />
+  <!-- {{ inputComp.value }} -->
+  <!-- <Input
+    v-else v-model="model" @blur="() => activeState = false"
+    :class="`${defaultClass}`"
+    :style="widthStyle"
+    autofocus
+  /> -->
+</template>
diff --git a/app/models/mcu-order-item.ts b/app/models/mcu-order-item.ts
index 67038edf..ed78f755 100644
--- a/app/models/mcu-order-item.ts
+++ b/app/models/mcu-order-item.ts
@@ -3,6 +3,7 @@ import { type Base, genBase } from "./_base"
 export interface McuOrderItem extends Base {
   mcuOrder_id: number
   mcuSrc_id: number
+  note?: string
   examinationDate?: string
   result?: string
   status_code?: string
diff --git a/app/services/mcu-order.service.ts b/app/services/mcu-order.service.ts
index 77e023d7..7299203b 100644
--- a/app/services/mcu-order.service.ts
+++ b/app/services/mcu-order.service.ts
@@ -22,3 +22,16 @@ export function update(id: number | string, data: any) {
 export function remove(id: number | string) {
   return base.remove(path, id)
 }
+
+export async function submit(id: number) {
+  try {
+    const resp = await xfetch(`${path}/${id}/submit`, 'PATCH')
+    const result: any = {}
+    result.success = resp.success
+    result.body = (resp.body as Record<string, any>) || {}
+    return result
+  } catch (error) {
+    console.error(`Error submitting ${name}:`, error)
+    throw new Error(`Failed to submit ${name}`)
+  }
+}

From 4251239f7cd7185cb3841f912dae8df23012ca36 Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Fri, 28 Nov 2025 21:17:18 +0700
Subject: [PATCH 3/8] feat/micro-lab-order-50: wip

---
 .../app/mcu-order-item/list-entry.cfg.ts      |   3 +-
 app/components/app/mcu-order/micro-list.vue   |  64 +++++++
 app/components/content/cp-lab-order/list.vue  |   4 +-
 app/components/content/encounter/process.vue  |   5 +-
 .../content/micro-lab-order/entry.vue         | 155 ++++++++++++++++
 .../content/micro-lab-order/list.vue          | 169 ++++++++++++++++++
 .../content/micro-lab-order/main.vue          |  16 ++
 7 files changed, 411 insertions(+), 5 deletions(-)
 create mode 100644 app/components/app/mcu-order/micro-list.vue
 create mode 100644 app/components/content/micro-lab-order/entry.vue
 create mode 100644 app/components/content/micro-lab-order/list.vue
 create mode 100644 app/components/content/micro-lab-order/main.vue

diff --git a/app/components/app/mcu-order-item/list-entry.cfg.ts b/app/components/app/mcu-order-item/list-entry.cfg.ts
index 8bf2fb18..841b77a0 100644
--- a/app/components/app/mcu-order-item/list-entry.cfg.ts
+++ b/app/components/app/mcu-order-item/list-entry.cfg.ts
@@ -3,7 +3,8 @@ import { defineAsyncComponent } from 'vue'
 import type { McuOrderItem } from '~/models/mcu-order-item'
 
 const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
-const input = defineAsyncComponent(() => import('~/components/pub/my-ui/data/editable-div.vue'))
+// const input = defineAsyncComponent(() => import('~/components/pub/my-ui/data/editable-div.vue'))
+const input = defineAsyncComponent(() => import('~/components/pub/ui/input/Input.vue'))
 
 export const config: Config = {
   cols: [{}, {}, { classVal: '!p-0.5' }],
diff --git a/app/components/app/mcu-order/micro-list.vue b/app/components/app/mcu-order/micro-list.vue
new file mode 100644
index 00000000..df296419
--- /dev/null
+++ b/app/components/app/mcu-order/micro-list.vue
@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import * as DE from '~/components/pub/my-ui/doc-entry';
+import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
+import Nav from '~/components/pub/my-ui/nav-footer/ca-ed-su.vue'
+
+import type { McuOrder } from '~/models/mcu-order';
+import McuOrderItems from '~/components/app/mcu-order-item/list.vue';
+
+interface Props {
+  data: McuOrder[]
+  paginationMeta: PaginationMeta
+}
+const props = defineProps<Props>()
+
+const emit = defineEmits<{
+  cancel: [data: any]
+  edit: [data: any],
+  submit: [data: any]
+}>()
+
+function navClick(type: 'cancel' | 'edit' | 'submit', data: McuOrder): void {
+  if (type === 'cancel') {
+    emit('cancel', data)
+  } else if (type === 'edit') {
+    emit('edit', data)
+  } else if (type === 'submit') {
+    emit('submit', data)
+  }
+}
+</script>
+
+<template>
+  <div v-if="data.length == 0" class="p-10 text-center">
+    <div class="mb-4 xl:mb-5">Belum Ada Data</div>
+  </div>
+  <template v-for="item, idx in data">
+    <div :class="'text-sm 2xl:text-base font-semibold ' + (item.status_code == 'new' ? 'mb-2' : 'mb-2')">
+      Order #{{ data.length - idx }} - {{ item.createdAt?.substring(0, 10) }} - {{ item.status_code }}
+    </div>
+    <DE.Block mode="preview" :col-count=7 class="!mb-3">
+      <DE.Cell :col-span="3">
+        <DE.Label :class="'font-semibold ' + (item.status_code == 'new' ? 'pt-2' : '')">DPJP</DE.Label>
+        <DE.Field :class="item.status_code == 'new' ? 'pt-2' : ''">
+          {{ item.doctor?.employee?.person?.name || '........' }}
+        </DE.Field>
+      </DE.Cell>
+      <DE.Cell :col-span="3">
+        <DE.Label :class="'font-semibold ' + (item.status_code == 'new' ? 'pt-2' : '')">PPDS</DE.Label>
+        <DE.Field :class="item.status_code == 'new' ? 'pt-2' : ''">
+          ...........
+        </DE.Field>
+      </DE.Cell>
+      <div class="flex justify-end" >
+        <Nav
+          v-if="item.status_code == 'new'"
+          :small-mode="true"
+          :default-class="'flex gap-1'"
+          @click="(type) => { navClick(type, item) }"
+        />
+      </div>
+    </DE.Block>
+    <McuOrderItems :data="item.items || []" @click="console.log('click')" class="!mb-5" />
+  </template>
+</template>
diff --git a/app/components/content/cp-lab-order/list.vue b/app/components/content/cp-lab-order/list.vue
index 73b9361c..8bb06569 100644
--- a/app/components/content/cp-lab-order/list.vue
+++ b/app/components/content/cp-lab-order/list.vue
@@ -21,7 +21,7 @@ import {
 
 // Apps
 import { getList, getDetail } from '~/services/mcu-order.service'
-import List from '~/components/app/mcu-order/list.vue'
+import List from '~/components/app/mcu-order/micro-list.vue'
 import type { McuOrder } from '~/models/mcu-order'
 
 const route = useRoute()
@@ -55,7 +55,7 @@ const {
 })
 
 const headerPrep: HeaderPrep = {
-  title: 'Order Lab PK',
+  title: 'Order Lab Mikro',
   icon: 'i-lucide-box',
   refSearchNav: {
     placeholder: 'Cari (min. 3 karakter)...',
diff --git a/app/components/content/encounter/process.vue b/app/components/content/encounter/process.vue
index 23640af7..5caa55fb 100644
--- a/app/components/content/encounter/process.vue
+++ b/app/components/content/encounter/process.vue
@@ -15,8 +15,9 @@ import AssesmentFunctionList from '~/components/content/soapi/entry.vue'
 import EarlyMedicalAssesmentList from '~/components/content/soapi/entry.vue'
 import EarlyMedicalRehabList from '~/components/content/soapi/entry.vue'
 import Prescription from '~/components/content/prescription/main.vue'
-import CpLabOrder from '~/components/content/cp-lab-order/main.vue'
 import Radiology from '~/components/content/radiology-order/main.vue'
+import CpLabOrder from '~/components/content/cp-lab-order/main.vue'
+import MicroLabOrder from '~/components/content/micro-lab-order/main.vue'
 import Consultation from '~/components/content/consultation/list.vue'
 import ControlLetterList from '~/components/content/control-letter/list.vue'
 
@@ -67,7 +68,7 @@ const tabs: TabItem[] = [
   { value: 'device', label: 'Order Alkes' },
   { value: 'mcu-radiology', label: 'Order Radiologi', component: Radiology, props: { encounter_id: data.id } },
   { value: 'mcu-lab-cp', label: 'Order Lab PK', component: CpLabOrder, props: { encounter_id: data.id } },
-  { value: 'mcu-lab-micro', label: 'Order Lab Mikro' },
+  { value: 'micro-lab-order', label: 'Order Lab Mikro', component: CpLabOrder, props: { encounter_id: data.id } },
   { value: 'mcu-lab-pa', label: 'Order Lab PA' },
   { value: 'medical-action', label: 'Order Ruang Tindakan' },
   { value: 'mcu-result', label: 'Hasil Penunjang' },
diff --git a/app/components/content/micro-lab-order/entry.vue b/app/components/content/micro-lab-order/entry.vue
new file mode 100644
index 00000000..4d0aa002
--- /dev/null
+++ b/app/components/content/micro-lab-order/entry.vue
@@ -0,0 +1,155 @@
+<script setup lang="ts">
+import Nav from '~/components/pub/my-ui/nav-footer/ba-de-su.vue'
+import NavOk from '~/components/pub/my-ui/nav-footer/ok.vue'
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
+
+import { useQueryCRUDMode } from '~/composables/useQueryCRUD'
+import { type HeaderPrep } from '~/components/pub/my-ui/data/types'
+
+// mcu src category
+import ScrCategorySwitcher from '~/components/app/mcu-src-category/switcher.vue'
+import { getList as getMcuCategoryList } from '~/services/mcu-src-category.service'
+
+// mcu src
+import { type McuSrc } from '~/models/mcu-src'
+import { getList as getMcuSrcList } from '~/services/mcu-src.service'
+import McuSrcPicker from '~/components/app/mcu-src/picker-accordion.vue'
+
+// mcu order
+import { getDetail } from '~/services/mcu-order.service'
+import Detail from '~/components/app/mcu-order/detail.vue'
+
+// mcu order item, manually not using composable
+import {
+  getList as getMcuOrderItemList,
+  create as createMcuOrderItem,
+  remove as removeMcuOrderItem,
+} from '~/services/mcu-order-item.service'
+import { type McuOrderItem } from '~/models/mcu-order-item'
+import ItemListEntry from '~/components/app/mcu-order-item/list-entry.vue'
+
+// props
+const props = defineProps<{
+  encounter_id: number
+}>()
+
+// declaration & flows
+
+// MCU Order
+const { getQueryParam } = useQueryParam()
+const id = getQueryParam('id')
+const dataRes = await getDetail(
+  typeof id === 'string' ? parseInt(id) : 0,
+  { includes: 'encounter,doctor,doctor-employee,doctor-employee-person' }
+)
+const data = dataRes.body?.data
+
+// MCU items
+const items = ref<McuOrderItem[]>([])
+
+// MCU Categories
+const mcuSrcCategoryRes = await getMcuCategoryList()
+const mcuSrcCategories = mcuSrcCategoryRes.body?.data
+const selectedMcuSrcCategory_code = ref('')
+
+// MCU Sources
+const mcuSrcs = ref<McuSrc[]>([])
+
+// const {
+//   data: items,
+//   fetchData: getItems,
+// } = usePaginatedList<McuOrderItem> ({
+//   fetchFn: async ({ page, search }) => {
+//     const result = await getMcuOrderItemList({ 'mcu-order-id': id, search, page })
+//     if (result.success) {
+//       items.value = result.body.data
+//     }
+//     return { success: result.success || false, body: result.body || {} }
+//   },
+//   entityName: 'mcu-order-item',
+// })
+
+const { backToList } = useQueryCRUDMode()
+
+const headerPrep: HeaderPrep = {
+  title: 'Detail dan List Item Order Radiologi ',
+  icon: 'i-lucide-box',
+}
+
+const pickerDialogOpen = ref(false)
+
+onMounted(async () => {
+  await getItems()
+})
+
+watch(selectedMcuSrcCategory_code, async () => {
+  const res = await getMcuSrcList({ 'mcu-src-category-code': selectedMcuSrcCategory_code.value })
+  mcuSrcs.value = res.body?.data
+})
+
+function navClick(type: 'back' | 'delete' | 'draft' | 'submit') {
+  if (type === 'back') {
+    backToList()
+  }
+}
+
+function requestItem() {
+  pickerDialogOpen.value = true
+}
+
+async function pickItem(item: McuSrc) {
+  const exItem = items.value.find(e => e.mcuSrc_id === item.id)
+  if (exItem) {
+    await removeMcuOrderItem(exItem.id)
+    await getItems()
+  } else {
+    const intId = parseInt(id?.toString() || '0')
+    await createMcuOrderItem({
+      mcuOrder_id: intId,
+      mcuSrc_id: item.id,
+    })
+    await getItems()
+  }
+}
+
+async function getItems() {
+  const itemsRes = await getMcuOrderItemList({ 'mcu-order-id': id, includes: 'mcuSrc,mcuSrc-mcuSrcCategory' })
+  if (itemsRes.success) {
+      items.value = itemsRes.body.data
+  } else {
+    items.value = []
+  }
+}
+</script>
+
+<template>
+  <Header
+    :prep="headerPrep"
+    :ref-search-nav="headerPrep.refSearchNav"
+    class="mb-4 xl:mb-5"
+  />
+
+  <Detail :data="data" />
+
+  <ItemListEntry
+    :data="items"
+    @requestItem="requestItem"/>
+  <Separator class="my-5" />
+
+  <div class="w-full flex justify-center">
+    <Nav @click="navClick" />
+  </div>
+
+  <Dialog
+    v-model:open="pickerDialogOpen"
+    title="Pilih Item"
+    size="2xl"
+    prevent-outside
+  >
+    <ScrCategorySwitcher :data="mcuSrcCategories" v-model="selectedMcuSrcCategory_code" />
+    <McuSrcPicker v-model="items" :data-source="mcuSrcs" @pick="pickItem" />
+    <Separator />
+    <NavOk @click="() => pickerDialogOpen = false" class="justify-center" />
+  </Dialog>
+</template>
diff --git a/app/components/content/micro-lab-order/list.vue b/app/components/content/micro-lab-order/list.vue
new file mode 100644
index 00000000..73b9361c
--- /dev/null
+++ b/app/components/content/micro-lab-order/list.vue
@@ -0,0 +1,169 @@
+<script setup lang="ts">
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+
+import { usePaginatedList } from '~/composables/usePaginatedList'
+import { toast } from '~/components/pub/ui/toast'
+import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
+
+import { ActionEvents, type HeaderPrep } from '~/components/pub/my-ui/data/types'
+
+// Handlers
+import {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  handleActionSave,
+  handleActionRemove,
+} from '~/handlers/mcu-order.handler'
+
+// Apps
+import { getList, getDetail } from '~/services/mcu-order.service'
+import List from '~/components/app/mcu-order/list.vue'
+import type { McuOrder } from '~/models/mcu-order'
+
+const route = useRoute()
+const { setQueryParams } = useQueryParam()
+
+const title = ref('')
+
+const plainEid = route.params.id
+const encounter_id = (plainEid && typeof plainEid == 'string') ? parseInt(plainEid) : 0 // here the
+
+const {
+  data,
+  isLoading,
+  paginationMeta,
+  searchInput,
+  handlePageChange,
+  handleSearch,
+  fetchData: getMyList,
+} = usePaginatedList<McuOrder>({
+  fetchFn: async ({ page, search }) => {
+    const result = await getList({
+      search,
+      page,
+      'scope-code': "cp-lab",
+      'encounter-id': encounter_id,
+      includes: 'doctor,doctor-employee,doctor-employee-person',
+    })
+    return { success: result.success || false, body: result.body || {} }
+  },
+  entityName: 'mcu-order'
+})
+
+const headerPrep: HeaderPrep = {
+  title: 'Order Lab PK',
+  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: () => {
+      recItem.value = null
+      recId.value = 0
+      isFormEntryDialogOpen.value = true
+      isReadonly.value = false
+    },
+  },
+}
+
+provide('rec_id', recId)
+provide('rec_action', recAction)
+provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
+
+const getMyDetail = async (id: number | string) => {
+  const result = await getDetail(id)
+  if (result.success) {
+    const currentValue = result.body?.data || {}
+    recItem.value = currentValue
+    isFormEntryDialogOpen.value = true
+  }
+}
+
+// Watch for row actions when recId or recAction changes
+watch([recId, recAction], () => {
+  switch (recAction.value) {
+    case ActionEvents.showDetail:
+      getMyDetail(recId.value)
+      title.value = 'Detail Order Lab PK'
+      isReadonly.value = true
+      break
+    case ActionEvents.showEdit:
+      getMyDetail(recId.value)
+      title.value = 'Edit Order Lab PK'
+      isReadonly.value = false
+      break
+    case ActionEvents.showConfirmDelete:
+      isRecordConfirmationOpen.value = true
+      break
+  }
+})
+
+watch([isFormEntryDialogOpen], async () => {
+  if (isFormEntryDialogOpen.value) {
+    isFormEntryDialogOpen.value = false;
+    const saveResp = await handleActionSave({ encounter_id, scope_code: "cp-lab" }, getMyList, () =>{}, toast)
+    if (saveResp.success) {
+      setQueryParams({
+        'mode': 'entry',
+        'id': saveResp.body?.data?.id.toString()
+      })
+    }
+  }
+})
+
+onMounted(async () => {
+})
+
+function cancel(data: McuOrder) {
+  recId.value = data.id
+  recItem.value = data
+  isRecordConfirmationOpen.value = true
+}
+
+function edit(data: McuOrder) {
+  setQueryParams({
+    'mode': 'entry',
+    'id': data.id.toString()
+  })
+  recItem.value = data
+}
+
+function submit(data: McuOrder) {
+}
+</script>
+
+<template>
+  <Header :prep="{ ...headerPrep }" />
+
+  <List
+    v-if="!isLoading.dataListLoading"
+    :data="data"
+    :pagination-meta="paginationMeta"
+    @cancel="cancel"
+    @edit="edit"
+    @submit="submit"
+  />
+
+  <RecordConfirmation
+    v-model:open="isRecordConfirmationOpen"
+    action="delete"
+    :record="recItem"
+    @confirm="() => handleActionRemove(recId, getMyList, toast)"
+    @cancel=""
+  />
+</template>
diff --git a/app/components/content/micro-lab-order/main.vue b/app/components/content/micro-lab-order/main.vue
new file mode 100644
index 00000000..033d093f
--- /dev/null
+++ b/app/components/content/micro-lab-order/main.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+//
+import List from './list.vue'
+import Entry from './entry.vue'
+
+const props = defineProps<{
+  encounter_id: number
+}>()
+
+const { mode } = useQueryCRUDMode()
+</script>
+
+<template>
+  <List v-if="mode === 'list'" :encounter_id="encounter_id" />
+  <Entry v-else :encounter_id="encounter_id" />
+</template>

From 5c92f8b9465b11c798db33602e1d5351abe7646b Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Sun, 30 Nov 2025 12:30:19 +0700
Subject: [PATCH 4/8] feat/mcu-order: added the components

---
 .../app/mcu-order/confirmation-info.vue       |  20 ++
 app/components/app/mcu-order/detail.vue       |   2 +-
 app/components/content/mcu-order/entry.vue    | 154 ++++++++++++++
 app/components/content/mcu-order/list.vue     | 198 ++++++++++++++++++
 app/components/content/mcu-order/main.vue     |  16 ++
 app/composables/useQueryCRUD.ts               |  63 +++++-
 app/models/mcu-order-item.ts                  |  21 +-
 app/models/mcu-order-sub-item.ts              |   4 +-
 app/services/mcu-order-item.service.ts        |   7 +-
 9 files changed, 475 insertions(+), 10 deletions(-)
 create mode 100644 app/components/app/mcu-order/confirmation-info.vue
 create mode 100644 app/components/content/mcu-order/entry.vue
 create mode 100644 app/components/content/mcu-order/list.vue
 create mode 100644 app/components/content/mcu-order/main.vue

diff --git a/app/components/app/mcu-order/confirmation-info.vue b/app/components/app/mcu-order/confirmation-info.vue
new file mode 100644
index 00000000..4f7c9a9d
--- /dev/null
+++ b/app/components/app/mcu-order/confirmation-info.vue
@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import type { McuOrder } from '~/models/mcu-order';
+
+defineProps<{
+  recItem: McuOrder
+}>()
+</script>
+
+<template>
+    <div class="flex mb-2">
+      <div class="w-20">Tanggal</div>
+      <div class="w-4">:</div>
+      <div class="">{{ recItem.createdAt?.substring(0, 10) }}</div>
+    </div>
+    <div class="flex">
+      <div class="w-20">DPJP</div>
+      <div class="w-4">:</div>
+      <div class="">{{ recItem.doctor?.employee?.person?.name }}</div>
+    </div>
+</template>
\ No newline at end of file
diff --git a/app/components/app/mcu-order/detail.vue b/app/components/app/mcu-order/detail.vue
index fe161595..8d86a98b 100644
--- a/app/components/app/mcu-order/detail.vue
+++ b/app/components/app/mcu-order/detail.vue
@@ -10,7 +10,7 @@ const props = defineProps<{
 
 <template>
     <div class="text-sm 2xl:text-base font-semibold mb-3">
-      Order {{ data?.createdAt?.substring(0, 10) }} - {{ data.status_code }}
+      Order {{ data?.createdAt?.substring(0, 10) }} - {{ data?.status_code }}
     </div>
     <div class="max-w-[1000px]">
       <DE.Block mode="preview" :col-count=5 class="!mb-3">
diff --git a/app/components/content/mcu-order/entry.vue b/app/components/content/mcu-order/entry.vue
new file mode 100644
index 00000000..f07310b3
--- /dev/null
+++ b/app/components/content/mcu-order/entry.vue
@@ -0,0 +1,154 @@
+<script setup lang="ts">
+import Nav from '~/components/pub/my-ui/nav-footer/ba-de-su.vue'
+import NavOk from '~/components/pub/my-ui/nav-footer/ok.vue'
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
+
+import { useQueryCRUDMode } from '~/composables/useQueryCRUD'
+import { type HeaderPrep } from '~/components/pub/my-ui/data/types'
+
+// mcu src category
+import ScrCategorySwitcher from '~/components/app/mcu-src-category/switcher.vue'
+import { getList as getMcuCategoryList } from '~/services/mcu-src-category.service'
+
+// mcu src
+import { type McuSrc } from '~/models/mcu-src'
+import { getList as getMcuSrcList } from '~/services/mcu-src.service'
+import McuSrcPicker from '~/components/app/mcu-src/picker-accordion.vue'
+
+// mcu order
+import { getDetail } from '~/services/mcu-order.service'
+import Detail from '~/components/app/mcu-order/detail.vue'
+
+// mcu order item, manually not using composable
+import {
+  getList as getMcuOrderItemList,
+  create as createMcuOrderItem,
+  remove as removeMcuOrderItem,
+} from '~/services/mcu-order-item.service'
+import { type McuOrderItem } from '~/models/mcu-order-item'
+import ItemListEntry from '~/components/app/mcu-order-item/list-entry.vue'
+
+// props
+const props = defineProps<{
+  encounter_id: number
+  scopeCode: string
+}>()
+
+// declaration & flows
+
+// MCU Order
+const { backToList, crudQueryParams } = useQueryCRUD()
+const id = crudQueryParams.value.recordId
+const dataRes = await getDetail(
+  typeof id === 'string' ? parseInt(id) : 0,
+  { includes: 'encounter,doctor,doctor-employee,doctor-employee-person' }
+)
+const data = dataRes.body?.data
+
+// MCU items
+const items = ref<McuOrderItem[]>([])
+
+// MCU Categories
+const mcuSrcCategoryRes = await getMcuCategoryList({ 'scope-code': props.scopeCode })
+const mcuSrcCategories = mcuSrcCategoryRes.body?.data
+const selectedMcuSrcCategory_code = ref('')
+
+// MCU Sources
+const mcuSrcs = ref<McuSrc[]>([])
+
+// const {
+//   data: items,
+//   fetchData: getItems,
+// } = usePaginatedList<McuOrderItem> ({
+//   fetchFn: async ({ page, search }) => {
+//     const result = await getMcuOrderItemList({ 'mcu-order-id': id, search, page })
+//     if (result.success) {
+//       items.value = result.body.data
+//     }
+//     return { success: result.success || false, body: result.body || {} }
+//   },
+//   entityName: 'mcu-order-item',
+// })
+
+const headerPrep: HeaderPrep = {
+  title: 'Detail dan List Item Order Radiologi ',
+  icon: 'i-lucide-box',
+}
+
+const pickerDialogOpen = ref(false)
+
+onMounted(async () => {
+  await getItems()
+})
+
+watch(selectedMcuSrcCategory_code, async () => {
+  const res = await getMcuSrcList({ 'mcu-src-category-code': selectedMcuSrcCategory_code.value })
+  mcuSrcs.value = res.body?.data
+})
+
+function navClick(type: 'back' | 'delete' | 'draft' | 'submit') {
+  if (type === 'back') {
+    backToList()
+  }
+}
+
+function requestItem() {
+  pickerDialogOpen.value = true
+}
+
+async function pickItem(item: McuSrc) {
+  const exItem = items.value.find(e => e.mcuSrc_code === item.code)
+  if (exItem) {
+    await removeMcuOrderItem(exItem.id)
+    await getItems()
+  } else {
+    const intId = parseInt(id?.toString() || '0')
+    await createMcuOrderItem({
+      mcuOrder_id: intId,
+      mcuSrc_code: item.code,
+    })
+    await getItems()
+  }
+}
+
+async function getItems() {
+  const itemsRes = await getMcuOrderItemList({ 'mcu-order-id': id, includes: 'mcuSrc,mcuSrc-mcuSrcCategory' })
+  if (itemsRes.success) {
+      items.value = itemsRes.body.data
+  } else {
+    items.value = []
+  }
+}
+</script>
+
+<template>
+  <Header
+    :prep="headerPrep"
+    :ref-search-nav="headerPrep.refSearchNav"
+    class="mb-4 xl:mb-5"
+  />
+
+  <Detail :data="data" />
+
+  <ItemListEntry
+    :data="items"
+    @requestItem="requestItem"/>
+  <Separator class="my-5" />
+
+  <div class="w-full flex justify-center">
+    <Nav @click="navClick" />
+  </div>
+
+  <Dialog
+    v-model:open="pickerDialogOpen"
+    title="Pilih Item"
+    size="2xl"
+    prevent-outside
+  >
+    <ScrCategorySwitcher :data="mcuSrcCategories" v-model="selectedMcuSrcCategory_code" />
+    <McuSrcPicker v-model="items" :data-source="mcuSrcs" @pick="pickItem" />
+    <Separator />
+    <NavOk @click="() => pickerDialogOpen = false" class="justify-center" />
+  </Dialog>
+</template>
diff --git a/app/components/content/mcu-order/list.vue b/app/components/content/mcu-order/list.vue
new file mode 100644
index 00000000..710a8951
--- /dev/null
+++ b/app/components/content/mcu-order/list.vue
@@ -0,0 +1,198 @@
+<script setup lang="ts">
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+
+import { usePaginatedList } from '~/composables/usePaginatedList'
+import { toast } from '~/components/pub/ui/toast'
+import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
+
+import { ActionEvents, type HeaderPrep } from '~/components/pub/my-ui/data/types'
+
+// Handlers
+import type { ToastFn } from '~/handlers/_handler'
+
+// Apps
+import {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  handleActionSave,
+  handleActionRemove,
+} from '~/handlers/mcu-order.handler'
+import { getList, getDetail, submit } from '~/services/mcu-order.service'
+import type { McuOrder } from '~/models/mcu-order'
+// import List from '~/components/app/mcu-order/micro-list.vue'
+import ConfirmationInfo from '~/components/app/mcu-order/confirmation-info.vue'
+
+// Props
+const props = defineProps<{
+  scopeCode: string
+}>()
+
+// Common preparations
+const route = useRoute()
+const { crudQueryParams } = useQueryCRUD()
+
+const title = ref('')
+const plainEid = route.params.id
+const encounter_id = (plainEid && typeof plainEid == 'string') ? parseInt(plainEid) : 0 // here the
+const isSubmitConfirmationOpen = ref(false)
+
+// Data
+const {
+  data,
+  isLoading,
+  paginationMeta,
+  searchInput,
+  fetchData: getMyList,
+} = usePaginatedList<McuOrder>({
+  fetchFn: async ({ page, search }) => {
+    const result = await getList({
+      search,
+      page,
+      'scope-code': props.scopeCode,
+      'encounter-id': encounter_id,
+      includes: 'doctor,doctor-employee,doctor-employee-person',
+    })
+    return { success: result.success || false, body: result.body || {} }
+  },
+  entityName: 'mcu-order'
+})
+
+// Header
+const headerPrep: HeaderPrep = {
+  title: 'Order Lab Mikro',
+  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 () => {
+      const saveResp = await handleActionSave({ encounter_id, scope_code: props.scopeCode }, () => {}, () =>{}, toast)
+      if (saveResp.success) {
+        crudQueryParams.value = { mode: 'entry', recordId: saveResp.body?.data?.id.toString() }
+      }
+    },
+  },
+}
+
+// List component
+let List: Component
+if(props.scopeCode == 'radiology') {
+  List = defineAsyncComponent(() => import('~/components/content/encounter/status.vue'))
+} else if(props.scopeCode == 'cp-lab') {
+  List = defineAsyncComponent(() => import('~/components/content/encounter/status.vue'))
+} else if (props.scopeCode == 'micro-lab') {
+  List = defineAsyncComponent(() => import('~/components/app/mcu-order/micro-list.vue'))
+} else {
+  List = defineAsyncComponent(() => import('~/components/content/encounter/status.vue'))
+}
+
+// Reactivities
+provide('rec_id', recId)
+provide('rec_action', recAction)
+provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
+
+watch([recId, recAction], () => {
+  switch (recAction.value) {
+    case ActionEvents.showDetail:
+      getMyDetail(recId.value)
+      title.value = 'Detail Order Lab PK'
+      isReadonly.value = true
+      break
+    case ActionEvents.showEdit:
+      getMyDetail(recId.value)
+      title.value = 'Edit Order Lab PK'
+      isReadonly.value = false
+      break
+    case ActionEvents.showConfirmDelete:
+      isRecordConfirmationOpen.value = true
+      break
+  }
+})
+
+///// Functions
+async function getMyDetail (id: number | string) {
+  const result = await getDetail(id)
+  if (result.success) {
+    const currentValue = result.body?.data || {}
+    recItem.value = currentValue
+    isFormEntryDialogOpen.value = true
+  }
+}
+
+function cancel(data: McuOrder) {
+  recId.value = data.id
+  recItem.value = data
+  isRecordConfirmationOpen.value = true
+}
+
+function edit(data: McuOrder) {
+  crudQueryParams.value = { mode: 'entry', recordId: data.id.toString() }
+}
+
+function confirmSubmit(data: McuOrder) {
+  recId.value = data.id
+  recItem.value = data
+  isSubmitConfirmationOpen.value = true
+}
+
+async function handleActionSubmit(id: number, refresh: () => void, toast: ToastFn) {
+  const result = await submit(id)
+  if (result.success) {
+    toast({ title: 'Berhasil', description: 'Resep telah di ajukan', variant: 'default' })
+    setTimeout(refresh, 300)
+  } else {
+    toast({ title: 'Gagal', description: 'Gagal menjalankan perintah', variant: 'destructive' })
+  }
+}
+</script>
+
+<template>
+  <Header :prep="{ ...headerPrep }" />
+
+  <List
+    v-if="!isLoading.dataListLoading"
+    :data="data"
+    :pagination-meta="paginationMeta"
+    @cancel="cancel"
+    @edit="edit"
+    @submit="confirmSubmit"
+  />
+
+  <RecordConfirmation
+    v-model:open="isRecordConfirmationOpen"
+    action="delete"
+    :record="recItem"
+    @confirm="() => handleActionRemove(recId, getMyList, toast)"
+    @cancel=""
+  >
+    <ConfirmationInfo :rec-item="recItem" />
+  </RecordConfirmation>
+
+  <RecordConfirmation
+    v-model:open="isSubmitConfirmationOpen"
+    action="delete"
+    customTitle="Ajukan Resep"
+    customMessage="Proses akan mengajukan resep ini untuk diproses lebih lanjut. Lanjutkan?"
+    customConfirmText="Ajukan"
+    :record="recItem"
+    @confirm="() => handleActionSubmit(recId, getMyList, toast)"
+    @cancel=""
+  >
+    <ConfirmationInfo :rec-item="recItem" />
+  </RecordConfirmation>
+</template>
diff --git a/app/components/content/mcu-order/main.vue b/app/components/content/mcu-order/main.vue
new file mode 100644
index 00000000..033d093f
--- /dev/null
+++ b/app/components/content/mcu-order/main.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+//
+import List from './list.vue'
+import Entry from './entry.vue'
+
+const props = defineProps<{
+  encounter_id: number
+}>()
+
+const { mode } = useQueryCRUDMode()
+</script>
+
+<template>
+  <List v-if="mode === 'list'" :encounter_id="encounter_id" />
+  <Entry v-else :encounter_id="encounter_id" />
+</template>
diff --git a/app/composables/useQueryCRUD.ts b/app/composables/useQueryCRUD.ts
index f81649bd..2147b49b 100644
--- a/app/composables/useQueryCRUD.ts
+++ b/app/composables/useQueryCRUD.ts
@@ -1,6 +1,58 @@
 import { computed } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 
+export function useQueryCRUD(modeKey: string = 'mode', recordIdKey: string = 'record-id') {
+  type params = {
+    mode: string,
+    recordId: any
+  }
+
+  const route = useRoute()
+  const router = useRouter()
+
+  const crudQueryParams = computed<params> ({
+    get: () => {
+      return {
+        mode: route.query[modeKey] && route.query[modeKey] === 'entry' ? 'entry' : 'list',
+        recordId: route.query[recordIdKey]
+      }
+    },
+    set: (val) => {
+      router.push({
+        path: route.path,
+        query: {
+          ...route.query,
+          [modeKey]: val.mode,
+          [recordIdKey]: val.recordId,
+        },
+      })
+    },
+  })
+
+  const goToEntry = (myRecord_id?: any) => {
+    if(myRecord_id) {
+      crudQueryParams.value.mode = 'entry'
+      crudQueryParams.value.recordId = myRecord_id
+    } else {
+      crudQueryParams.value.mode = 'entry'
+      crudQueryParams.value.recordId = undefined
+    }
+  }
+
+  const backToList = () => {
+    delete route.query[recordIdKey]
+    router.push({
+      path: route.path,
+      query: {
+        ...route.query,
+        mode: 'list',
+      },
+    })
+  }
+
+  return { crudQueryParams, goToEntry, backToList }
+}
+
 export function useQueryCRUDMode(key: string = 'mode') {
   const route = useRoute()
   const router = useRouter()
@@ -18,7 +70,13 @@ export function useQueryCRUDMode(key: string = 'mode') {
     },
   })
 
-  const goToEntry = () => (mode.value = 'entry')
+  const goToEntry = (myRecord_id?: any) => {
+    mode.value = 'entry'
+    if(myRecord_id) {
+      myRecord_id.value = myRecord_id
+    }
+  }
+
   const backToList = () => {
     router.push({
       path: route.path,
@@ -26,7 +84,7 @@ export function useQueryCRUDMode(key: string = 'mode') {
         ...route.query,
         mode: 'list',
         // HAPUS record-id
-        'record-id': undefined,
+        recordIdKey: undefined,
       },
     })
   }
@@ -54,3 +112,4 @@ export function useQueryCRUDRecordId(key: string = 'record-id') {
 
   return { recordId }
 }
+
diff --git a/app/models/mcu-order-item.ts b/app/models/mcu-order-item.ts
index 67038edf..ece036e4 100644
--- a/app/models/mcu-order-item.ts
+++ b/app/models/mcu-order-item.ts
@@ -2,16 +2,33 @@ import { type Base, genBase } from "./_base"
 
 export interface McuOrderItem extends Base {
   mcuOrder_id: number
-  mcuSrc_id: number
+  mcuSrc_code: string
+  note?: string
   examinationDate?: string
   result?: string
   status_code?: string
 }
 
+export interface CreateDto {
+  mcuOrder_id: number
+  mcuSrc_code: string
+  note?: string
+}
+
+export interface ReadList {
+  'mcu-order-id'?: number
+  'mcu-src-code'?: string
+  includes?: string
+}
+
+export interface UpdateDto extends CreateDto {
+  id: number
+}
+
 export function genMcuOrderItem(): McuOrderItem {
   return {
     ...genBase(),
     mcuOrder_id: 0,
-    mcuSrc_id: 0,
+    mcuSrc_code: '',
   }
 }
diff --git a/app/models/mcu-order-sub-item.ts b/app/models/mcu-order-sub-item.ts
index 271ed424..a64af0d1 100644
--- a/app/models/mcu-order-sub-item.ts
+++ b/app/models/mcu-order-sub-item.ts
@@ -1,8 +1,8 @@
 import { type Base, genBase } from "./_base"
 
 export interface McuOrderSubItem extends Base {
-  mcuSubSrc_id: number
   mcuOrderItem_id: number
+  mcuSubSrc_code: string
   result?: string
   status_code?: string
 }
@@ -10,7 +10,7 @@ export interface McuOrderSubItem extends Base {
 export function genMcuOrderSubItem(): McuOrderSubItem {
   return {
     ...genBase(),
-    mcuSubSrc_id: 0,
     mcuOrderItem_id: 0,
+    mcuSubSrc_code: '',
   }
 }
diff --git a/app/services/mcu-order-item.service.ts b/app/services/mcu-order-item.service.ts
index b7ffbbfe..4e8c852f 100644
--- a/app/services/mcu-order-item.service.ts
+++ b/app/services/mcu-order-item.service.ts
@@ -1,13 +1,14 @@
 import * as base from './_crud-base'
+import * as model from '~/models/mcu-order-item'
 
 const path = '/api/v1/mcu-order-item'
 const name = 'mcu-order-item'
 
-export function create(data: any) {
+export function create(data: model.CreateDto) {
   return base.create(path, data)
 }
 
-export function getList(params: any = null) {
+export function getList(params: model.ReadList | null = null) {
   return base.getList(path, params)
 }
 
@@ -15,7 +16,7 @@ export function getDetail(id: number | string, params?: any) {
   return base.getDetail(path, id, name, params)
 }
 
-export function update(id: number | string, data: any) {
+export function update(id: number | string, data: model.UpdateDto) {
   return base.update(path, id, data)
 }
 

From b2d3c14ddc71fd6d6a23c8a7fd9c922c8b62327e Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Sun, 30 Nov 2025 12:48:11 +0700
Subject: [PATCH 5/8] feat/mcu-order: adjustment

---
 app/components/app/mcu-order/list.vue           | 2 +-
 app/components/app/mcu-src/picker-accordion.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/components/app/mcu-order/list.vue b/app/components/app/mcu-order/list.vue
index df296419..4c749dc9 100644
--- a/app/components/app/mcu-order/list.vue
+++ b/app/components/app/mcu-order/list.vue
@@ -34,7 +34,7 @@ function navClick(type: 'cancel' | 'edit' | 'submit', data: McuOrder): void {
     <div class="mb-4 xl:mb-5">Belum Ada Data</div>
   </div>
   <template v-for="item, idx in data">
-    <div :class="'text-sm 2xl:text-base font-semibold ' + (item.status_code == 'new' ? 'mb-2' : 'mb-2')">
+    <div :class="'text-sm 2xl:text-base font-semibold ' + (item.status_code == 'new' ? 'mb-0' : 'mb-2')">
       Order #{{ data.length - idx }} - {{ item.createdAt?.substring(0, 10) }} - {{ item.status_code }}
     </div>
     <DE.Block mode="preview" :col-count=7 class="!mb-3">
diff --git a/app/components/app/mcu-src/picker-accordion.vue b/app/components/app/mcu-src/picker-accordion.vue
index a42834f9..79429e9d 100644
--- a/app/components/app/mcu-src/picker-accordion.vue
+++ b/app/components/app/mcu-src/picker-accordion.vue
@@ -37,7 +37,7 @@ function pick(item: McuSrc) {
     <div class="grid lg:grid-cols-4 2xl:grid-cols-5 gap-2 [&_button]:w-full">
       <div v-for="item, idx in dataSource" :key="idx" class="flex gap-2">
         <Button 
-          :variant="data.some(e => e.mcuSrc_id === item.id) ? 'default' : 'outline'"
+          :variant="data.some(e => e.mcuSrc_code === item.code) ? 'default' : 'outline'"
           type="button"
           @click="pick(item)"
         > 

From 95e27a8b6f6dddf24c31df329aa9077f08b0c64d Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Sun, 30 Nov 2025 13:00:04 +0700
Subject: [PATCH 6/8] feat/micro-lab-order-50: wip

---
 app/components/app/mcu-order/micro-list.vue   |   2 +-
 .../content/micro-lab-order/entry.vue         | 150 +---------------
 .../content/micro-lab-order/list.vue          | 165 +-----------------
 .../pub/my-ui/nav-footer/ca-ed-su.vue         |   2 +-
 app/handlers/encounter-init.handler.ts        |  12 +-
 5 files changed, 13 insertions(+), 318 deletions(-)

diff --git a/app/components/app/mcu-order/micro-list.vue b/app/components/app/mcu-order/micro-list.vue
index df296419..4c749dc9 100644
--- a/app/components/app/mcu-order/micro-list.vue
+++ b/app/components/app/mcu-order/micro-list.vue
@@ -34,7 +34,7 @@ function navClick(type: 'cancel' | 'edit' | 'submit', data: McuOrder): void {
     <div class="mb-4 xl:mb-5">Belum Ada Data</div>
   </div>
   <template v-for="item, idx in data">
-    <div :class="'text-sm 2xl:text-base font-semibold ' + (item.status_code == 'new' ? 'mb-2' : 'mb-2')">
+    <div :class="'text-sm 2xl:text-base font-semibold ' + (item.status_code == 'new' ? 'mb-0' : 'mb-2')">
       Order #{{ data.length - idx }} - {{ item.createdAt?.substring(0, 10) }} - {{ item.status_code }}
     </div>
     <DE.Block mode="preview" :col-count=7 class="!mb-3">
diff --git a/app/components/content/micro-lab-order/entry.vue b/app/components/content/micro-lab-order/entry.vue
index 4d0aa002..e6ef9600 100644
--- a/app/components/content/micro-lab-order/entry.vue
+++ b/app/components/content/micro-lab-order/entry.vue
@@ -1,155 +1,11 @@
 <script setup lang="ts">
-import Nav from '~/components/pub/my-ui/nav-footer/ba-de-su.vue'
-import NavOk from '~/components/pub/my-ui/nav-footer/ok.vue'
-import Header from '~/components/pub/my-ui/nav-header/prep.vue'
-import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
+import Entry from '~/components/content/mcu-order/entry.vue'
 
-import { useQueryCRUDMode } from '~/composables/useQueryCRUD'
-import { type HeaderPrep } from '~/components/pub/my-ui/data/types'
-
-// mcu src category
-import ScrCategorySwitcher from '~/components/app/mcu-src-category/switcher.vue'
-import { getList as getMcuCategoryList } from '~/services/mcu-src-category.service'
-
-// mcu src
-import { type McuSrc } from '~/models/mcu-src'
-import { getList as getMcuSrcList } from '~/services/mcu-src.service'
-import McuSrcPicker from '~/components/app/mcu-src/picker-accordion.vue'
-
-// mcu order
-import { getDetail } from '~/services/mcu-order.service'
-import Detail from '~/components/app/mcu-order/detail.vue'
-
-// mcu order item, manually not using composable
-import {
-  getList as getMcuOrderItemList,
-  create as createMcuOrderItem,
-  remove as removeMcuOrderItem,
-} from '~/services/mcu-order-item.service'
-import { type McuOrderItem } from '~/models/mcu-order-item'
-import ItemListEntry from '~/components/app/mcu-order-item/list-entry.vue'
-
-// props
-const props = defineProps<{
+defineProps<{
   encounter_id: number
 }>()
-
-// declaration & flows
-
-// MCU Order
-const { getQueryParam } = useQueryParam()
-const id = getQueryParam('id')
-const dataRes = await getDetail(
-  typeof id === 'string' ? parseInt(id) : 0,
-  { includes: 'encounter,doctor,doctor-employee,doctor-employee-person' }
-)
-const data = dataRes.body?.data
-
-// MCU items
-const items = ref<McuOrderItem[]>([])
-
-// MCU Categories
-const mcuSrcCategoryRes = await getMcuCategoryList()
-const mcuSrcCategories = mcuSrcCategoryRes.body?.data
-const selectedMcuSrcCategory_code = ref('')
-
-// MCU Sources
-const mcuSrcs = ref<McuSrc[]>([])
-
-// const {
-//   data: items,
-//   fetchData: getItems,
-// } = usePaginatedList<McuOrderItem> ({
-//   fetchFn: async ({ page, search }) => {
-//     const result = await getMcuOrderItemList({ 'mcu-order-id': id, search, page })
-//     if (result.success) {
-//       items.value = result.body.data
-//     }
-//     return { success: result.success || false, body: result.body || {} }
-//   },
-//   entityName: 'mcu-order-item',
-// })
-
-const { backToList } = useQueryCRUDMode()
-
-const headerPrep: HeaderPrep = {
-  title: 'Detail dan List Item Order Radiologi ',
-  icon: 'i-lucide-box',
-}
-
-const pickerDialogOpen = ref(false)
-
-onMounted(async () => {
-  await getItems()
-})
-
-watch(selectedMcuSrcCategory_code, async () => {
-  const res = await getMcuSrcList({ 'mcu-src-category-code': selectedMcuSrcCategory_code.value })
-  mcuSrcs.value = res.body?.data
-})
-
-function navClick(type: 'back' | 'delete' | 'draft' | 'submit') {
-  if (type === 'back') {
-    backToList()
-  }
-}
-
-function requestItem() {
-  pickerDialogOpen.value = true
-}
-
-async function pickItem(item: McuSrc) {
-  const exItem = items.value.find(e => e.mcuSrc_id === item.id)
-  if (exItem) {
-    await removeMcuOrderItem(exItem.id)
-    await getItems()
-  } else {
-    const intId = parseInt(id?.toString() || '0')
-    await createMcuOrderItem({
-      mcuOrder_id: intId,
-      mcuSrc_id: item.id,
-    })
-    await getItems()
-  }
-}
-
-async function getItems() {
-  const itemsRes = await getMcuOrderItemList({ 'mcu-order-id': id, includes: 'mcuSrc,mcuSrc-mcuSrcCategory' })
-  if (itemsRes.success) {
-      items.value = itemsRes.body.data
-  } else {
-    items.value = []
-  }
-}
 </script>
 
 <template>
-  <Header
-    :prep="headerPrep"
-    :ref-search-nav="headerPrep.refSearchNav"
-    class="mb-4 xl:mb-5"
-  />
-
-  <Detail :data="data" />
-
-  <ItemListEntry
-    :data="items"
-    @requestItem="requestItem"/>
-  <Separator class="my-5" />
-
-  <div class="w-full flex justify-center">
-    <Nav @click="navClick" />
-  </div>
-
-  <Dialog
-    v-model:open="pickerDialogOpen"
-    title="Pilih Item"
-    size="2xl"
-    prevent-outside
-  >
-    <ScrCategorySwitcher :data="mcuSrcCategories" v-model="selectedMcuSrcCategory_code" />
-    <McuSrcPicker v-model="items" :data-source="mcuSrcs" @pick="pickItem" />
-    <Separator />
-    <NavOk @click="() => pickerDialogOpen = false" class="justify-center" />
-  </Dialog>
+  <Entry :encounter_id="encounter_id" scope-code="micro-lab" />
 </template>
diff --git a/app/components/content/micro-lab-order/list.vue b/app/components/content/micro-lab-order/list.vue
index 73b9361c..c2bda748 100644
--- a/app/components/content/micro-lab-order/list.vue
+++ b/app/components/content/micro-lab-order/list.vue
@@ -1,169 +1,8 @@
 <script setup lang="ts">
-import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+import List from '~/components/content/mcu-order/list.vue'
 
-import { usePaginatedList } from '~/composables/usePaginatedList'
-import { toast } from '~/components/pub/ui/toast'
-import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
-
-import { ActionEvents, type HeaderPrep } from '~/components/pub/my-ui/data/types'
-
-// Handlers
-import {
-  recId,
-  recAction,
-  recItem,
-  isReadonly,
-  isFormEntryDialogOpen,
-  isRecordConfirmationOpen,
-  handleActionSave,
-  handleActionRemove,
-} from '~/handlers/mcu-order.handler'
-
-// Apps
-import { getList, getDetail } from '~/services/mcu-order.service'
-import List from '~/components/app/mcu-order/list.vue'
-import type { McuOrder } from '~/models/mcu-order'
-
-const route = useRoute()
-const { setQueryParams } = useQueryParam()
-
-const title = ref('')
-
-const plainEid = route.params.id
-const encounter_id = (plainEid && typeof plainEid == 'string') ? parseInt(plainEid) : 0 // here the
-
-const {
-  data,
-  isLoading,
-  paginationMeta,
-  searchInput,
-  handlePageChange,
-  handleSearch,
-  fetchData: getMyList,
-} = usePaginatedList<McuOrder>({
-  fetchFn: async ({ page, search }) => {
-    const result = await getList({
-      search,
-      page,
-      'scope-code': "cp-lab",
-      'encounter-id': encounter_id,
-      includes: 'doctor,doctor-employee,doctor-employee-person',
-    })
-    return { success: result.success || false, body: result.body || {} }
-  },
-  entityName: 'mcu-order'
-})
-
-const headerPrep: HeaderPrep = {
-  title: 'Order Lab PK',
-  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: () => {
-      recItem.value = null
-      recId.value = 0
-      isFormEntryDialogOpen.value = true
-      isReadonly.value = false
-    },
-  },
-}
-
-provide('rec_id', recId)
-provide('rec_action', recAction)
-provide('rec_item', recItem)
-provide('table_data_loader', isLoading)
-
-const getMyDetail = async (id: number | string) => {
-  const result = await getDetail(id)
-  if (result.success) {
-    const currentValue = result.body?.data || {}
-    recItem.value = currentValue
-    isFormEntryDialogOpen.value = true
-  }
-}
-
-// Watch for row actions when recId or recAction changes
-watch([recId, recAction], () => {
-  switch (recAction.value) {
-    case ActionEvents.showDetail:
-      getMyDetail(recId.value)
-      title.value = 'Detail Order Lab PK'
-      isReadonly.value = true
-      break
-    case ActionEvents.showEdit:
-      getMyDetail(recId.value)
-      title.value = 'Edit Order Lab PK'
-      isReadonly.value = false
-      break
-    case ActionEvents.showConfirmDelete:
-      isRecordConfirmationOpen.value = true
-      break
-  }
-})
-
-watch([isFormEntryDialogOpen], async () => {
-  if (isFormEntryDialogOpen.value) {
-    isFormEntryDialogOpen.value = false;
-    const saveResp = await handleActionSave({ encounter_id, scope_code: "cp-lab" }, getMyList, () =>{}, toast)
-    if (saveResp.success) {
-      setQueryParams({
-        'mode': 'entry',
-        'id': saveResp.body?.data?.id.toString()
-      })
-    }
-  }
-})
-
-onMounted(async () => {
-})
-
-function cancel(data: McuOrder) {
-  recId.value = data.id
-  recItem.value = data
-  isRecordConfirmationOpen.value = true
-}
-
-function edit(data: McuOrder) {
-  setQueryParams({
-    'mode': 'entry',
-    'id': data.id.toString()
-  })
-  recItem.value = data
-}
-
-function submit(data: McuOrder) {
-}
 </script>
 
 <template>
-  <Header :prep="{ ...headerPrep }" />
-
-  <List
-    v-if="!isLoading.dataListLoading"
-    :data="data"
-    :pagination-meta="paginationMeta"
-    @cancel="cancel"
-    @edit="edit"
-    @submit="submit"
-  />
-
-  <RecordConfirmation
-    v-model:open="isRecordConfirmationOpen"
-    action="delete"
-    :record="recItem"
-    @confirm="() => handleActionRemove(recId, getMyList, toast)"
-    @cancel=""
-  />
+  <List scope-code="micro-lab" />
 </template>
diff --git a/app/components/pub/my-ui/nav-footer/ca-ed-su.vue b/app/components/pub/my-ui/nav-footer/ca-ed-su.vue
index 1f0f5915..9bf7466b 100644
--- a/app/components/pub/my-ui/nav-footer/ca-ed-su.vue
+++ b/app/components/pub/my-ui/nav-footer/ca-ed-su.vue
@@ -7,7 +7,7 @@ const props = defineProps<{
 
 const defaultClass = props.defaultClass ?? 'm-2 flex gap-2 px-2'
 const additionalClass = props.class ?? ''
-const btnClass = props.smallMode ? '[&_button]:w-7 [&_button]:h-7 [&_button]:2xl:w-8 [&_button]:2xl:h-9 [&_button]:!p-0' : ''
+const btnClass = props.smallMode ? '[&_button]:w-7 [&_button]:h-7 [&_button]:2xl:w-8 [&_button]:2xl:h-8 [&_button]:!p-0' : ''
 
 type ClickType = 'cancel' | 'edit' | 'submit'
 
diff --git a/app/handlers/encounter-init.handler.ts b/app/handlers/encounter-init.handler.ts
index 886be1a1..7b440730 100644
--- a/app/handlers/encounter-init.handler.ts
+++ b/app/handlers/encounter-init.handler.ts
@@ -40,6 +40,7 @@ const ChemoMedicineProtocolListAsync = defineAsyncComponent(
 const DeviceOrderAsync = defineAsyncComponent(() => import('~/components/content/device-order/main.vue'))
 const PrescriptionAsync = defineAsyncComponent(() => import('~/components/content/prescription/main.vue'))
 const CpLabOrderAsync = defineAsyncComponent(() => import('~/components/content/cp-lab-order/main.vue'))
+const MicroLabOrderAsync = defineAsyncComponent(() => import('~/components/content/micro-lab-order/main.vue'))
 const CprjAsync = defineAsyncComponent(() => import('~/components/content/cprj/entry.vue'))
 const RadiologyAsync = defineAsyncComponent(() => import('~/components/content/radiology-order/main.vue'))
 const ConsultationAsync = defineAsyncComponent(() => import('~/components/content/consultation/list.vue'))
@@ -138,8 +139,8 @@ const defaultKeys: Record<string, any> = {
     classCode: ['ambulatory', 'emergency', 'inpatient'],
     unit: 'all',
   },
-  mcuLabMicro: {
-    id: 'mcu-lab-micro',
+  microLabOrder: {
+    id: 'micro-lab-order',
     title: 'Order Lab Mikro',
     classCode: ['ambulatory', 'emergency', 'inpatient'],
     unit: 'all',
@@ -311,10 +312,9 @@ export function injectComponents(id: string | number, data: EncounterListData, m
     currentKeys.mcuLabPc['component'] = CpLabOrderAsync
     currentKeys.mcuLabPc['props'] = { encounter_id: id }
   }
-  if (currentKeys?.mcuLabMicro) {
-    // TODO: add component for mcuLabMicro
-    currentKeys.mcuLabMicro['component'] = null
-    currentKeys.mcuLabMicro['props'] = { encounter_id: id }
+  if (currentKeys?.microLabOrder) {
+    currentKeys.microLabOrder['component'] = MicroLabOrderAsync
+    currentKeys.microLabOrder['props'] = { encounter_id: id }
   }
   if (currentKeys?.mcuLabPa) {
     // TODO: add component for mcuLabPa

From 1ee0f39e7d417d8f91a11cd463c0a9cf7bc94846 Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Mon, 1 Dec 2025 01:50:39 +0700
Subject: [PATCH 7/8] feat/micro-lab-order-50: added antibiotic

---
 .../app/antibiotic-in-use/entry.vue           |  0
 .../app/antibiotic-in-use/list.cfg.ts         | 28 +++++++++++++++++++
 app/components/app/antibiotic-in-use/list.vue | 17 +++++++++++
 app/handlers/antibiotic-in-use.ts             | 24 ++++++++++++++++
 app/handlers/antibiotic-src-category.ts       | 24 ++++++++++++++++
 app/handlers/antibiotic-src.ts                | 24 ++++++++++++++++
 app/models/antibiotic-in-use.ts               | 16 +++++++++++
 app/models/antibiotic-src-category.ts         | 14 ++++++++++
 app/models/antibiotic-src.ts                  | 16 +++++++++++
 app/models/mcu-order.ts                       |  5 +++-
 app/services/antibiotic-in-use.ts             | 25 +++++++++++++++++
 app/services/antibiotic-src-category.ts       | 25 +++++++++++++++++
 app/services/antibiotic-src.ts                | 25 +++++++++++++++++
 13 files changed, 242 insertions(+), 1 deletion(-)
 create mode 100644 app/components/app/antibiotic-in-use/entry.vue
 create mode 100644 app/components/app/antibiotic-in-use/list.cfg.ts
 create mode 100644 app/components/app/antibiotic-in-use/list.vue
 create mode 100644 app/handlers/antibiotic-in-use.ts
 create mode 100644 app/handlers/antibiotic-src-category.ts
 create mode 100644 app/handlers/antibiotic-src.ts
 create mode 100644 app/models/antibiotic-in-use.ts
 create mode 100644 app/models/antibiotic-src-category.ts
 create mode 100644 app/models/antibiotic-src.ts
 create mode 100644 app/services/antibiotic-in-use.ts
 create mode 100644 app/services/antibiotic-src-category.ts
 create mode 100644 app/services/antibiotic-src.ts

diff --git a/app/components/app/antibiotic-in-use/entry.vue b/app/components/app/antibiotic-in-use/entry.vue
new file mode 100644
index 00000000..e69de29b
diff --git a/app/components/app/antibiotic-in-use/list.cfg.ts b/app/components/app/antibiotic-in-use/list.cfg.ts
new file mode 100644
index 00000000..429e2dd8
--- /dev/null
+++ b/app/components/app/antibiotic-in-use/list.cfg.ts
@@ -0,0 +1,28 @@
+import type { Config, RecComponent } from '~/components/pub/my-ui/data-table'
+import { defineAsyncComponent } from 'vue'
+
+type SmallDetailDto = any
+
+const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
+
+export const config: Config = {
+  cols: [{}, {}],
+
+  headers: [[{ label: 'Kode' }, { label: 'Nama' }]],
+
+  keys: ['code', 'name'],
+
+  delKeyNames: [
+    { key: 'code', label: 'Kode' },
+    { key: 'name', label: 'Nama' },
+  ],
+
+  parses: {
+  },
+
+  components: {
+  },
+
+  htmls: {
+  },
+}
diff --git a/app/components/app/antibiotic-in-use/list.vue b/app/components/app/antibiotic-in-use/list.vue
new file mode 100644
index 00000000..fac15e5c
--- /dev/null
+++ b/app/components/app/antibiotic-in-use/list.vue
@@ -0,0 +1,17 @@
+<script setup lang="ts">
+// Pub components
+import DataTable from '~/components/pub/my-ui/data-table/data-table.vue'
+
+// Configs
+import { config } from './list.cfg'
+
+defineProps<{
+  data: any[]
+}>()
+</script>
+
+<template>
+  <div class="space-y-4">
+    <DataTable v-bind="config" :rows="data" />
+  </div>
+</template>
diff --git a/app/handlers/antibiotic-in-use.ts b/app/handlers/antibiotic-in-use.ts
new file mode 100644
index 00000000..d10f3b1c
--- /dev/null
+++ b/app/handlers/antibiotic-in-use.ts
@@ -0,0 +1,24 @@
+// Handlers
+import { genCrudHandler } from '~/handlers/_handler'
+
+// Services
+import { create, update, remove } from '~/services/antibiotic-in-use'
+
+export const {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isProcessing,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  onResetState,
+  handleActionSave,
+  handleActionEdit,
+  handleActionRemove,
+  handleCancelForm,
+} = genCrudHandler({
+  create,
+  update,
+  remove,
+})
diff --git a/app/handlers/antibiotic-src-category.ts b/app/handlers/antibiotic-src-category.ts
new file mode 100644
index 00000000..e68380b0
--- /dev/null
+++ b/app/handlers/antibiotic-src-category.ts
@@ -0,0 +1,24 @@
+// Handlers
+import { genCrudHandler } from '~/handlers/_handler'
+
+// Services
+import { create, update, remove } from '~/services/antibiotic-src-category'
+
+export const {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isProcessing,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  onResetState,
+  handleActionSave,
+  handleActionEdit,
+  handleActionRemove,
+  handleCancelForm,
+} = genCrudHandler({
+  create,
+  update,
+  remove,
+})
diff --git a/app/handlers/antibiotic-src.ts b/app/handlers/antibiotic-src.ts
new file mode 100644
index 00000000..1671471b
--- /dev/null
+++ b/app/handlers/antibiotic-src.ts
@@ -0,0 +1,24 @@
+// Handlers
+import { genCrudHandler } from '~/handlers/_handler'
+
+// Services
+import { create, update, remove } from '~/services/antibiotic-src'
+
+export const {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isProcessing,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  onResetState,
+  handleActionSave,
+  handleActionEdit,
+  handleActionRemove,
+  handleCancelForm,
+} = genCrudHandler({
+  create,
+  update,
+  remove,
+})
diff --git a/app/models/antibiotic-in-use.ts b/app/models/antibiotic-in-use.ts
new file mode 100644
index 00000000..e793fc12
--- /dev/null
+++ b/app/models/antibiotic-in-use.ts
@@ -0,0 +1,16 @@
+import { type Base, genBase } from "./_base"
+import type { AntibioticSrc } from "./antibiotic-src"
+
+export interface AntibioticInUse extends Base {
+  mcuOrder_id: number
+  antibioticSrc_code: string
+  antibioticSrc: AntibioticSrc
+}
+
+export function genDevice(): Pick<AntibioticInUse, 'mcuOrder_id' | 'antibioticSrc_code'> {
+  return {
+    ...genBase(),
+    mcuOrder_id: 0,
+    antibioticSrc_code: ''
+  }
+}
diff --git a/app/models/antibiotic-src-category.ts b/app/models/antibiotic-src-category.ts
new file mode 100644
index 00000000..6001b4e8
--- /dev/null
+++ b/app/models/antibiotic-src-category.ts
@@ -0,0 +1,14 @@
+import { type Base, genBase } from "./_base"
+
+export interface AntibioticSrcCategory extends Base {
+  code: string
+  name: string
+}
+
+export function genDevice(): AntibioticSrcCategory {
+  return {
+    ...genBase(),
+    code: '',
+    name: '',
+  }
+}
diff --git a/app/models/antibiotic-src.ts b/app/models/antibiotic-src.ts
new file mode 100644
index 00000000..ee272f54
--- /dev/null
+++ b/app/models/antibiotic-src.ts
@@ -0,0 +1,16 @@
+import { type Base, genBase } from "./_base"
+
+export interface AntibioticSrc extends Base {
+  code: string
+  name: string
+  antibioticSrcCategory_code: string
+}
+
+export function genDevice(): AntibioticSrc {
+  return {
+    ...genBase(),
+    code: '',
+    name: '',
+    antibioticSrcCategory_code: ''
+  }
+}
diff --git a/app/models/mcu-order.ts b/app/models/mcu-order.ts
index 35e4018c..859c0548 100644
--- a/app/models/mcu-order.ts
+++ b/app/models/mcu-order.ts
@@ -1,4 +1,5 @@
 import { type Base, genBase } from "./_base"
+import type { AntibioticInUse } from "./antibiotic-in-use"
 import { type Doctor, genDoctor } from "./doctor"
 import type { McuOrderItem } from "./mcu-order-item"
 
@@ -13,6 +14,7 @@ export interface McuOrder extends Base {
   temperature?: number
   mcuUrgencyLevel_code?: string
   items: McuOrderItem[]
+  antibioticInUseItems: AntibioticInUse[]
 }
 
 export function genMcuOrder(): McuOrder {
@@ -23,7 +25,8 @@ export function genMcuOrder(): McuOrder {
     doctor: genDoctor(),
     specimenPickTime: '',
     examinationDate: '',
-    items: []
+    items: [],
+    antibioticInUseItems: [],
   }
 }
 
diff --git a/app/services/antibiotic-in-use.ts b/app/services/antibiotic-in-use.ts
new file mode 100644
index 00000000..41038eb5
--- /dev/null
+++ b/app/services/antibiotic-in-use.ts
@@ -0,0 +1,25 @@
+// Base
+import * as base from './_crud-base'
+
+const name = 'antibiotic-in-use'
+const path = '/api/v1/' + name
+
+export function create(data: any) {
+  return base.create(path, data, name)
+}
+
+export function getList(params: any = null) {
+  return base.getList(path, params, name)
+}
+
+export function getDetail(id: number | string) {
+  return base.getDetail(path, id, name)
+}
+
+export function update(id: number | string, data: any) {
+  return base.update(path, id, data, name)
+}
+
+export function remove(id: number | string) {
+  return base.remove(path, id, name)
+}
diff --git a/app/services/antibiotic-src-category.ts b/app/services/antibiotic-src-category.ts
new file mode 100644
index 00000000..eac38f0e
--- /dev/null
+++ b/app/services/antibiotic-src-category.ts
@@ -0,0 +1,25 @@
+// Base
+import * as base from './_crud-base'
+
+const name = 'antibiotic-src-category'
+const path = '/api/v1/' + name
+
+export function create(data: any) {
+  return base.create(path, data, name)
+}
+
+export function getList(params: any = null) {
+  return base.getList(path, params, name)
+}
+
+export function getDetail(id: number | string) {
+  return base.getDetail(path, id, name)
+}
+
+export function update(id: number | string, data: any) {
+  return base.update(path, id, data, name)
+}
+
+export function remove(id: number | string) {
+  return base.remove(path, id, name)
+}
diff --git a/app/services/antibiotic-src.ts b/app/services/antibiotic-src.ts
new file mode 100644
index 00000000..4c2623bf
--- /dev/null
+++ b/app/services/antibiotic-src.ts
@@ -0,0 +1,25 @@
+// Base
+import * as base from './_crud-base'
+
+const name = 'antibiotic-src'
+const path = '/api/v1/' + name
+
+export function create(data: any) {
+  return base.create(path, data, name)
+}
+
+export function getList(params: any = null) {
+  return base.getList(path, params, name)
+}
+
+export function getDetail(id: number | string) {
+  return base.getDetail(path, id, name)
+}
+
+export function update(id: number | string, data: any) {
+  return base.update(path, id, data, name)
+}
+
+export function remove(id: number | string) {
+  return base.remove(path, id, name)
+}

From bae0a222b8b7e79fc6cc2507ffaec53c406ee669 Mon Sep 17 00:00:00 2001
From: Andrian Roshandy <andrianovsky95@gmail.com>
Date: Mon, 1 Dec 2025 01:51:04 +0700
Subject: [PATCH 8/8] feat/micro-lab-order-50: adjust for antibiotic

---
 app/components/app/mcu-order-item/list.cfg.ts | 6 ++++--
 app/components/app/mcu-order/micro-list.vue   | 4 ++++
 app/components/content/mcu-order/list.vue     | 2 +-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/app/components/app/mcu-order-item/list.cfg.ts b/app/components/app/mcu-order-item/list.cfg.ts
index 1dee1bf9..28441165 100644
--- a/app/components/app/mcu-order-item/list.cfg.ts
+++ b/app/components/app/mcu-order-item/list.cfg.ts
@@ -1,16 +1,18 @@
 import type { Config } from '~/components/pub/my-ui/data-table'
 
 export const config: Config = {
-  cols: [{}, {}],
+  cols: [{}, { width: 150 }, {}],
 
   headers: [
     [
       { label: 'Nama' },
+      { label: 'Jadwal Pemeriksaan' },
+      { label: 'Status' },
       { label: 'Catatan' },
     ],
   ],
 
-  keys: ['mcuSrc.name', 'mcuSrcCategory.name'],
+  keys: ['mcuSrc.name', 'examinationDate', 'status_code', 'note'],
 
   delKeyNames: [
     { key: 'mcuSrc.name', label: 'Nama' },
diff --git a/app/components/app/mcu-order/micro-list.vue b/app/components/app/mcu-order/micro-list.vue
index 4c749dc9..e63ad40b 100644
--- a/app/components/app/mcu-order/micro-list.vue
+++ b/app/components/app/mcu-order/micro-list.vue
@@ -4,10 +4,13 @@ import type { PaginationMeta } from '~/components/pub/my-ui/pagination/paginatio
 import Nav from '~/components/pub/my-ui/nav-footer/ca-ed-su.vue'
 
 import type { McuOrder } from '~/models/mcu-order';
+import AntibioticInUseList from '~/components/app/antibiotic-in-use/list.vue';
 import McuOrderItems from '~/components/app/mcu-order-item/list.vue';
+import type { AntibioticInUse } from '~/models/antibiotic-in-use';
 
 interface Props {
   data: McuOrder[]
+  antibioticInUses: AntibioticInUse[]
   paginationMeta: PaginationMeta
 }
 const props = defineProps<Props>()
@@ -59,6 +62,7 @@ function navClick(type: 'cancel' | 'edit' | 'submit', data: McuOrder): void {
         />
       </div>
     </DE.Block>
+    <AntibioticInUseList v-if="item.antibioticInUseItems?.length > 0" :data="[]" class="!mb-5" />
     <McuOrderItems :data="item.items || []" @click="console.log('click')" class="!mb-5" />
   </template>
 </template>
diff --git a/app/components/content/mcu-order/list.vue b/app/components/content/mcu-order/list.vue
index 710a8951..6fcff867 100644
--- a/app/components/content/mcu-order/list.vue
+++ b/app/components/content/mcu-order/list.vue
@@ -54,7 +54,7 @@ const {
       page,
       'scope-code': props.scopeCode,
       'encounter-id': encounter_id,
-      includes: 'doctor,doctor-employee,doctor-employee-person',
+      includes: 'doctor,doctor-employee,doctor-employee-person,items,items-mcuSrc',
     })
     return { success: result.success || false, body: result.body || {} }
   },