Files
2025-12-05 14:15:54 +07:00

152 lines
3.9 KiB
Vue

<script setup lang="ts">
import { useRouter } from 'vue-router'
import type { ExposedForm } from '~/types/form'
import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
import { getDetail, update } from '~/services/control-letter.service'
import {
// for form entry
isReadonly,
isProcessing,
isFormEntryDialogOpen,
isRecordConfirmationOpen,
onResetState,
handleActionSave,
handleActionEdit,
} from '~/handlers/control-letter.handler'
import { toast } from '~/components/pub/ui/toast'
import Confirmation from '~/components/pub/my-ui/confirmation/confirmation.vue'
import type { ControlLetter } from '~/models/control-letter'
import { ControlLetterSchema } from '~/schemas/control-letter.schema'
import { formatDateYyyyMmDd } from '~/lib/date'
// #region Props & Emits
const props = withDefaults(defineProps<{
encounter_id: number
callbackUrl?: string
record_id: number
}>(), {
})
// form related state
const controlLetterForm = ref<ExposedForm<any> | null>(null)
// #endregion
// #region State & Computed
const router = useRouter()
const isConfirmationOpen = ref(false)
const controlLetter = ref({})
const selectedUnitId = ref<number|null>(null)
const selectedSpecialistId = ref<number|null>(null)
const selectedSubSpecialistId = ref<number|null>(null)
// #endregion
// #region Lifecycle Hooks
onMounted(async () => {
const result = await getDetail(props.record_id)
if (result.success) {
const responseData = {...result.body.data, date: formatDateYyyyMmDd(result.body.data.date)}
selectedUnitId.value = responseData?.unit_code
selectedSpecialistId.value = responseData?.specialist_code
selectedSubSpecialistId.value = responseData?.subspecialist_code
controlLetter.value = responseData
controlLetterForm.value?.setValues(responseData)
}
})
// #endregion
// #region Functions
function goBack() {
router.go(-1)
}
async function handleConfirmAdd() {
const response = await handleActionEdit(
props.record_id,
await composeFormData(),
() => { },
() => { },
toast,
)
goBack()
}
async function composeFormData(): Promise<ControlLetter> {
const [controlLetter,] = await Promise.all([
controlLetterForm.value?.validate(),
])
const results = [controlLetter]
const allValid = results.every((r) => r?.valid)
// exit, if form errors happend during validation
if (!allValid) return Promise.reject('Form validation failed')
const formData = controlLetter?.values
formData.encounter_id = props.encounter_id
return new Promise((resolve) => resolve(formData))
}
// #endregion region
// #region Utilities & event handlers
async function handleActionClick(eventType: string) {
if (eventType === 'submit') {
isConfirmationOpen.value = true
}
if (eventType === 'back') {
if (props.callbackUrl) {
await navigateTo(props.callbackUrl)
return
}
goBack()
}
}
function handleCancelAdd() {
isConfirmationOpen.value = false
}
provide("selectedUnitId", selectedUnitId);
provide("selectedSpecialistId", selectedSpecialistId);
provide("selectedSubSpecialistId", selectedSubSpecialistId);
// #endregion
// #region Watchers
// #endregion
</script>
<template>
<div class="mb-5 border-b border-b-slate-300 pb-3 text-lg font-semibold xl:text-xl">Update Surat Kontrol</div>
<AppControlLetterEntryForm
ref="controlLetterForm"
:schema="ControlLetterSchema"
:selected-unit-id="selectedUnitId"
:selected-specialist-id="selectedSpecialistId"
:selected-sub-specialist-id="selectedSubSpecialistId"
/>
<div class="my-2 flex justify-end py-2">
<Action :enable-draft="false" @click="handleActionClick" />
</div>
<Confirmation
v-model:open="isConfirmationOpen"
title="Simpan Data"
message="Apakah Anda yakin ingin menyimpan data ini?"
confirm-text="Simpan"
@confirm="handleConfirmAdd"
@cancel="handleCancelAdd"
/>
</template>
<style scoped>
/* component style */
</style>