156 lines
4.2 KiB
Vue
156 lines
4.2 KiB
Vue
<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>
|