Files

141 lines
3.8 KiB
Vue

<script setup lang="ts">
import { onMounted } from 'vue'
// Components
import AppSepEntryForm from '~/components/app/sep/entry-form.vue'
import AppViewPatient from '~/components/app/patient/view-patient.vue'
import AppViewHistory from '~/components/app/sep/view-history.vue'
import AppViewLetter from '~/components/app/sep/view-letter.vue'
// Handler
import { useIntegrationSepEntry } from '~/handlers/integration-sep-entry.handler'
import { useIntegrationSepDetail } from '~/handlers/integration-sep-detail.handler'
const {
histories,
letters,
patients,
doctors,
diagnoses,
facilitiesFrom,
facilitiesTo,
supportCodesList,
serviceTypesList,
registerMethodsList,
accidentsList,
purposeOfVisitsList,
proceduresList,
assessmentsList,
provincesList,
citiesList,
districtsList,
classLevelsList,
classLevelUpgradesList,
classPaySourcesList,
isServiceHidden,
isSaveLoading,
isLetterReadonly,
isLoadingPatient,
openPatient,
openLetter,
openHistory,
selectedLetter,
selectedObjects,
selectedServiceType,
selectedAdmissionType,
specialistsTree,
selectedPatient,
paginationMeta,
getLetterMappers,
getPatientsList,
getPatientByIdentifierSearch,
handleSaveLetter,
handleSavePatient,
handleEvent,
handleFetch,
handleInit,
} = useIntegrationSepEntry()
const { valueObjects, getSepDetail } = useIntegrationSepDetail()
const props = defineProps<{
mode: 'add' | 'edit' | 'detail' | 'link'
}>()
onMounted(async () => {
await handleInit()
if (['detail', 'link'].includes(props.mode)) {
await getSepDetail()
selectedObjects.value = { ...selectedObjects.value, ...valueObjects.value }
}
})
</script>
<template>
<div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
<Icon
name="i-lucide-panel-bottom"
class="me-2"
/>
<span class="font-semibold">{{ ['detail', 'link'].includes(props.mode) ? 'Detail' : 'Tambah' }} SEP</span>
</div>
<AppSepEntryForm
:mode="props.mode"
:is-save-loading="isSaveLoading"
:is-service="isServiceHidden"
:is-readonly="['detail', 'link'].includes(props.mode)"
:doctors="doctors"
:diagnoses="diagnoses"
:facilities-from="facilitiesFrom"
:facilities-to="facilitiesTo"
:service-types="serviceTypesList"
:register-methods="registerMethodsList"
:accidents="accidentsList"
:purposes="purposeOfVisitsList"
:procedures="proceduresList"
:assessments="assessmentsList"
:support-codes="supportCodesList"
:provinces="provincesList"
:cities="citiesList"
:districts="districtsList"
:class-levels="classLevelsList"
:class-level-upgrades="classLevelUpgradesList"
:class-pay-sources="classPaySourcesList"
:specialists="specialistsTree"
:objects="selectedObjects"
@fetch="handleFetch"
@event="handleEvent"
/>
<AppViewPatient
v-model:open="openPatient"
v-model:selected="selectedPatient"
:patients="patients"
:pagination-meta="paginationMeta"
@fetch="
(value) => {
if (value.search && value.search.length >= 3) {
// Use identifier search for specific searches (NIK, RM, etc.)
getPatientByIdentifierSearch(value.search)
} else {
// Use regular search for general searches
getPatientsList({ ...value, 'page-size': 10, includes: 'person' })
}
}
"
@save="handleSavePatient"
/>
<AppViewHistory
v-model:open="openHistory"
:histories="histories"
/>
<AppViewLetter
v-model:open="openLetter"
:letters="letters"
:menu="selectedAdmissionType !== '3' ? 'control' : 'reference'"
:selected="selectedLetter"
:pagination-meta="{ recordCount: 0, page: 1, pageSize: 10, totalPage: 0 } as any"
@fetch="(value) => getLetterMappers(value.admissionType, value.search)"
@save="handleSaveLetter"
/>
</template>