Merge branch 'feat/mcu-order' into feat/micro-lab-order-50

This commit is contained in:
Andrian Roshandy
2025-11-30 12:43:11 +07:00
9 changed files with 474 additions and 10 deletions
@@ -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>
+1 -1
View File
@@ -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">
+154
View File
@@ -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>
+198
View File
@@ -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>
+16
View File
@@ -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>
+61 -2
View File
@@ -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 }
}
+18 -2
View File
@@ -2,17 +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: '',
}
}
+2 -2
View File
@@ -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: '',
}
}
+4 -3
View File
@@ -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)
}