feat/procedure-room-order: wip #3
This commit is contained in:
Andrian Roshandy
@@ -0,0 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
</template>
|
||||
@@ -0,0 +1,54 @@
|
||||
import type { Config, RecComponent } from '~/components/pub/my-ui/data-table'
|
||||
import { defineAsyncComponent } from 'vue'
|
||||
import type { ProcedureRoomOrder } from '~/models/procedure-room-order'
|
||||
|
||||
const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
|
||||
|
||||
export const config: Config = {
|
||||
cols: [{}, {}, {}, {}, {}, { width: 50 }],
|
||||
|
||||
headers: [[
|
||||
{ label: 'Tgl. Order' },
|
||||
{ label: 'No. Order' },
|
||||
{ label: 'Ruangan' },
|
||||
{ label: 'Status' },
|
||||
{ label: 'Resume' },
|
||||
{ label: '' },
|
||||
]],
|
||||
|
||||
keys: ['date', 'number', 'room', 'status', 'resume', 'action'],
|
||||
|
||||
delKeyNames: [
|
||||
{ key: 'createdAt', label: 'Tgl. Order' },
|
||||
{ key: 'id', label: 'No. Order' },
|
||||
],
|
||||
|
||||
parses: {
|
||||
date: (rec: any) => {
|
||||
const recX = rec as ProcedureRoomOrder
|
||||
return recX.createdAt ? recX.createdAt.substring(0, 10) : ''
|
||||
|
||||
},
|
||||
number: (rec: any) => {
|
||||
const recX = rec as ProcedureRoomOrder
|
||||
return `ORT-${recX.id}`
|
||||
},
|
||||
room: (rec: any) => {
|
||||
const recX = rec as ProcedureRoomOrder
|
||||
return recX.procedureRoom?.infra?.name || '--belum terdata0--'
|
||||
},
|
||||
},
|
||||
|
||||
components: {
|
||||
action(rec, idx) {
|
||||
const res: RecComponent = {
|
||||
idx,
|
||||
rec: rec as object,
|
||||
component: action,
|
||||
}
|
||||
return res
|
||||
},
|
||||
},
|
||||
|
||||
htmls: {},
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
<script setup lang="ts">
|
||||
// Components
|
||||
import PaginationView from '~/components/pub/my-ui/pagination/pagination-view.vue'
|
||||
|
||||
// Types
|
||||
import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
|
||||
|
||||
// Configs
|
||||
import { config } from './list.cfg'
|
||||
import type { Config } from '~/components/pub/my-ui/data-table'
|
||||
|
||||
interface Props {
|
||||
data: any[]
|
||||
paginationMeta: PaginationMeta
|
||||
tableConfig?: Config
|
||||
}
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
tableConfig: () => config,
|
||||
})
|
||||
|
||||
const emit = defineEmits<{
|
||||
pageChange: [page: number]
|
||||
}>()
|
||||
|
||||
function handlePageChange(page: number) {
|
||||
emit('pageChange', page)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="space-y-4">
|
||||
<PubMyUiDataTable
|
||||
v-bind="props.tableConfig"
|
||||
:rows="data"
|
||||
:skeleton-size="paginationMeta?.pageSize"
|
||||
/>
|
||||
<PaginationView :pagination-meta="paginationMeta" @page-change="handlePageChange" />
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,54 @@
|
||||
<script setup lang="ts">
|
||||
//
|
||||
import * as CH from '~/components/pub/my-ui/content-header'
|
||||
|
||||
//
|
||||
import PRSwitcher from '~/components/app/procedure-room/switcher.vue'
|
||||
|
||||
import PRMultiOptPicker from '~/components/app/procedure-room/multi-opt-picker.vue'
|
||||
import PRSingleOptPicker from '~/components/app/procedure-room/single-opt-picker.vue'
|
||||
|
||||
// Material Package & Item
|
||||
import type { MaterialPackageItem } from '~/models/material-package-item'
|
||||
import { getValueLabelList } from '~/services/material-package.service'
|
||||
import { getList as getMaterialPackageItemList } from '~/services/material-package-item.service'
|
||||
import MPSwitcher from '~/components/app/material-package/switcher.vue'
|
||||
import MPIQuickList from '~/components/app/material-package-item/quick-list.vue'
|
||||
|
||||
const vFn = () => {} // Void function
|
||||
const headerConfig: CH.Config = {
|
||||
title: 'Order Ruang Tindakan',
|
||||
icon: 'i-lucide-box',
|
||||
}
|
||||
|
||||
const procedureRoomType = ref('procedure')
|
||||
watch(procedureRoomType, async (newValue) => {
|
||||
|
||||
})
|
||||
const materialPackageItems = await getValueLabelList()
|
||||
const selectedMaterialPackage = ref('')
|
||||
|
||||
const materialPackageItemList = ref<MaterialPackageItem[]>([])
|
||||
watch(selectedMaterialPackage, async (newValue) => {
|
||||
const res = await getMaterialPackageItemList({ 'material-package-code': newValue, includes: 'material' })
|
||||
if (res.success) {
|
||||
materialPackageItemList.value = res.body.data
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<CH.ContentHeader v-bind="headerConfig" />
|
||||
|
||||
<Separator class="mb-4" />
|
||||
|
||||
<PRSwitcher v-model="procedureRoomType" />
|
||||
|
||||
<PRMultiOptPicker v-if="procedureRoomType == 'procedure'" />
|
||||
|
||||
<PRSingleOptPicker v-else />
|
||||
|
||||
<MPSwitcher :items="materialPackageItems" v-model="selectedMaterialPackage" />
|
||||
|
||||
<MPIQuickList :data="materialPackageItemList" />
|
||||
</template>
|
||||
@@ -0,0 +1,174 @@
|
||||
<script setup lang="ts">
|
||||
// Composables
|
||||
import { usePaginatedList } from '~/composables/usePaginatedList'
|
||||
|
||||
// Pubs component
|
||||
import { toast } from '~/components/pub/ui/toast'
|
||||
import { type HeaderPrep } from '~/components/pub/my-ui/data/types'
|
||||
import Header from '~/components/pub/my-ui/nav-header/prep.vue'
|
||||
import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
|
||||
|
||||
// Handlers
|
||||
import {
|
||||
recId,
|
||||
recAction,
|
||||
recItem,
|
||||
isReadonly,
|
||||
isRecordConfirmationOpen,
|
||||
handleActionRemove,
|
||||
handleActionSave,
|
||||
} from '~/handlers/procedure-room-order.handler'
|
||||
|
||||
// Services
|
||||
import { getList, getDetail } from '~/services/procedure-room-order.service'
|
||||
import List from '~/components/app/procedure-room-order/list.vue'
|
||||
import type { ProcedureRoomOrder } from '~/models/procedure-room-order'
|
||||
// import { submit } from '~/services/prescription.service'
|
||||
import type { ToastFn } from '~/handlers/_handler'
|
||||
|
||||
const route = useRoute()
|
||||
const { setQueryParams } = useQueryParam()
|
||||
|
||||
const isSubmitConfirmationOpen = ref(false)
|
||||
|
||||
const plainEid = route.params.id
|
||||
const encounter_id = (plainEid && typeof plainEid == 'string') ? parseInt(plainEid) : 0
|
||||
|
||||
const {
|
||||
data,
|
||||
isLoading,
|
||||
paginationMeta,
|
||||
searchInput,
|
||||
fetchData: getMyList,
|
||||
} = usePaginatedList<ProcedureRoomOrder>({
|
||||
fetchFn: async (params: any) => {
|
||||
const result = await getList({
|
||||
'encounter-id': encounter_id,
|
||||
// includes: '',
|
||||
search: params.search,
|
||||
page: params.page,
|
||||
'page-number': params['page-number'] || 0,
|
||||
'page-size': params['page-size'] || 10,
|
||||
})
|
||||
return { success: result.success || false, body: result.body || {} }
|
||||
},
|
||||
entityName: 'prescription'
|
||||
})
|
||||
|
||||
const vFn = () => {} // Void function
|
||||
const headerPrep: HeaderPrep = {
|
||||
title: 'Order Ruang Tindakan',
|
||||
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
|
||||
setQueryParams({
|
||||
'mode': 'entry',
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
provide('rec_id', recId)
|
||||
provide('rec_action', recAction)
|
||||
provide('rec_item', recItem)
|
||||
provide('table_data_loader', isLoading)
|
||||
|
||||
function confirmCancel(data: ProcedureRoomOrder) {
|
||||
recId.value = data.id
|
||||
recItem.value = data
|
||||
isRecordConfirmationOpen.value = true
|
||||
}
|
||||
|
||||
function goToEdit(data: ProcedureRoomOrder) {
|
||||
setQueryParams({
|
||||
'mode': 'entry',
|
||||
'id': data.id.toString()
|
||||
})
|
||||
recItem.value = data
|
||||
}
|
||||
|
||||
function confirmSubmit(data: ProcedureRoomOrder) {
|
||||
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="confirmCancel"
|
||||
@edit="goToEdit"
|
||||
@submit="confirmSubmit"
|
||||
/>
|
||||
|
||||
<RecordConfirmation
|
||||
v-model:open="isRecordConfirmationOpen"
|
||||
action="delete"
|
||||
:record="recItem"
|
||||
@confirm="() => handleActionRemove(recId, getMyList, toast)"
|
||||
@cancel=""
|
||||
>
|
||||
<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>
|
||||
</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=""
|
||||
>
|
||||
<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>
|
||||
</RecordConfirmation>
|
||||
</template>
|
||||
@@ -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>
|
||||
@@ -18,6 +18,7 @@ export type MedObstacleCode = 'hearing' | 'sight' | 'physical' | 'emotional' | '
|
||||
export type LearnMethodCode = 'demo' | 'discuss-leaflet'
|
||||
export type LangClassCode = 'ind' | 'region' | 'foreign'
|
||||
export type TranslatorSrcCode = 'team' | 'family'
|
||||
export type ProcedureRoomTypeCode = 'procedure' | 'operation'
|
||||
|
||||
export const subjectCodes: Record<SubjectCode, string> = {
|
||||
detail: 'Detail',
|
||||
@@ -224,3 +225,8 @@ export const translatorSrcCodes: Record<TranslatorSrcCode, string> = {
|
||||
team: 'Tim Penerjemah',
|
||||
family: 'Keluarga',
|
||||
}
|
||||
|
||||
export const procedureRoomTypeCodes: Record<ProcedureRoomTypeCode, string> = {
|
||||
procedure: 'Ruang Tindakan',
|
||||
operation: 'Ruang Operasi',
|
||||
}
|
||||
|
||||
@@ -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 ProcedureRoomOrderAsync = defineAsyncComponent(() => import('~/components/content/procedure-room-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'))
|
||||
@@ -162,8 +163,8 @@ const defaultKeys: Record<string, any> = {
|
||||
classCode: ['ambulatory', 'emergency', 'inpatient'],
|
||||
unit: 'all',
|
||||
},
|
||||
actionRoomOrder: {
|
||||
id: 'action-room-order',
|
||||
procedureRoomOrder: {
|
||||
id: 'procedure-room-order',
|
||||
title: 'Order Ruang Tindakan',
|
||||
classCode: ['ambulatory', 'emergency', 'inpatient'],
|
||||
unit: 'all',
|
||||
@@ -209,13 +210,13 @@ const defaultKeys: Record<string, any> = {
|
||||
title: 'SPRI',
|
||||
classCode: ['ambulatory', 'emergency'],
|
||||
unit: 'all',
|
||||
},
|
||||
},
|
||||
refBack: {
|
||||
id: 'reference-back',
|
||||
title: 'PRB',
|
||||
classCode: ['ambulatory', 'emergency', 'inpatient'],
|
||||
unit: 'all',
|
||||
},
|
||||
},
|
||||
screening: {
|
||||
id: 'screening',
|
||||
title: 'Skrinning MPP',
|
||||
@@ -369,10 +370,9 @@ export function injectComponents(id: string | number, data: EncounterListData, m
|
||||
currentKeys.paLabOrder['component'] = null
|
||||
currentKeys.paLabOrder['props'] = { encounter_id: id }
|
||||
}
|
||||
if (currentKeys?.actionRoomOrder) {
|
||||
// TODO: add component for actionRoomOrder
|
||||
currentKeys.actionRoomOrder['component'] = null
|
||||
currentKeys.actionRoomOrder['props'] = { encounter_id: id }
|
||||
if (currentKeys?.procedureRoomOrder) {
|
||||
currentKeys.procedureRoomOrder['component'] = ProcedureRoomOrderAsync
|
||||
currentKeys.procedureRoomOrder['props'] = { encounter_id: id }
|
||||
}
|
||||
if (currentKeys?.mcuResult) {
|
||||
// TODO: add component for mcuResult
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { genCrudHandler } from '~/handlers/_handler'
|
||||
import { create, update, remove } from '~/services/procedure-room-order.service'
|
||||
|
||||
export const {
|
||||
recId,
|
||||
recAction,
|
||||
recItem,
|
||||
isReadonly,
|
||||
isProcessing,
|
||||
isFormEntryDialogOpen,
|
||||
isRecordConfirmationOpen,
|
||||
onResetState,
|
||||
handleActionSave,
|
||||
handleActionEdit,
|
||||
handleActionRemove,
|
||||
handleCancelForm,
|
||||
} = genCrudHandler({ create, update, remove})
|
||||
+20
-3
@@ -1,10 +1,27 @@
|
||||
export interface Infra {
|
||||
id?: number
|
||||
import { type Base, genBase } from "./_base";
|
||||
import { genProcedureRoom, type ProcedureRoom } from "./procedure-room";
|
||||
|
||||
export interface Infra extends Base {
|
||||
code: string
|
||||
name: string
|
||||
infraGroup_code: string
|
||||
parent_id?: number | string | null
|
||||
unit_id?: number | string | null
|
||||
specialist_id?: number | string | null
|
||||
subspecialist_id?: number | string | null
|
||||
unit_id?: number | string | null
|
||||
procedureRoom?: ProcedureRoom
|
||||
}
|
||||
|
||||
export function genInfra(): Infra {
|
||||
return {
|
||||
...genBase(),
|
||||
code: '',
|
||||
name: '',
|
||||
infraGroup_code: '',
|
||||
parent_id: null,
|
||||
unit_id: null,
|
||||
specialist_id: null,
|
||||
subspecialist_id: null,
|
||||
procedureRoom: genProcedureRoom(),
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,22 @@
|
||||
import { type Base, genBase } from "./_base";
|
||||
import { genMaterialPackage, type MaterialPackage } from "./material-package";
|
||||
import { genProcedureRoom, type ProcedureRoom } from "./procedure-room";
|
||||
|
||||
export interface ProcedureRoomOrder extends Base {
|
||||
encounter_id: number
|
||||
infra_code: string
|
||||
procedureRoom: ProcedureRoom
|
||||
materialPackage_code: string
|
||||
materialPackage: MaterialPackage
|
||||
}
|
||||
|
||||
export function genProcedureRoomOrder(): ProcedureRoomOrder {
|
||||
return {
|
||||
...genBase(),
|
||||
encounter_id: 0,
|
||||
infra_code: '',
|
||||
procedureRoom: genProcedureRoom(),
|
||||
materialPackage_code: '',
|
||||
materialPackage: genMaterialPackage(),
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
// Base
|
||||
import type { ProcedureRoomOrder } from '~/models/procedure-room-order'
|
||||
import * as base from './_crud-base'
|
||||
|
||||
const name = 'procedure-room'
|
||||
const path = `/api/v1/${name}`
|
||||
|
||||
export function create(data: ProcedureRoomOrder) {
|
||||
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: ProcedureRoomOrder) {
|
||||
return base.update(path, id, data, name)
|
||||
}
|
||||
|
||||
export function remove(id: number | string) {
|
||||
return base.remove(path, id, name)
|
||||
}
|
||||
Reference in New Issue
Block a user