munawwirul_jamal/simrsx-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: Add & integrate add, edit, detail page

Browse Source
This commit is contained in:
hasyim_kai
2025-11-05 13:19:07 +07:00
parent 331f4a6b20
commit a361922e32
15 changed files with 475 additions and 211 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/content/outpatient/encounter/add.vue
+10 -3
View File
@@ -23,8 +23,10 @@ const controlLetterForm = ref<ExposedForm<any> | null>(null)
// #region State & Computed
const router = useRouter()
const isConfirmationOpen = ref(false)
const selectedUnitId = ref<number|null>(null)
const selectedSpecialistId = ref<number|null>(null)
const selectedDpjpId = ref<number|null>(null)
const selectedSubSpecialistId = ref<number|null>(null)
// #endregion
// #region Lifecycle Hooks
@@ -95,8 +97,9 @@ function handleCancelAdd() {
isConfirmationOpen.value = false
}
provide("selectedUnitId", selectedUnitId);
provide("selectedSpecialistId", selectedSpecialistId);
provide("selectedDpjpId", selectedDpjpId);
provide("selectedSubSpecialistId", selectedSubSpecialistId);
// #endregion
// #region Watchers
@@ -107,7 +110,11 @@ provide("selectedDpjpId", selectedDpjpId);
<div class="mb-5 border-b border-b-slate-300 pb-3 text-lg font-semibold xl:text-xl">Tambah Surat Kontrol</div>
<AppOutpatientEncounterEntryForm
ref="controlLetterForm"
:schema="ControlLetterSchema" />
: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" />
app/components/content/outpatient/encounter/detail.vue
+14 -14
View File
@@ -8,24 +8,22 @@ import { getDetail } from '~/services/control-letter.service'
// Components
import Header from '~/components/pub/my-ui/nav-header/prep.vue'
import type { ControlLetter } from '~/models/control-letter'
// #region Props & Emits
const props = defineProps<{
patientId: number
}>()
// #endregion
// #region State & Computed
const route = useRoute()
const router = useRouter()
const patient = ref(
withBase<Patient>({
person: {} as Person,
personAddresses: [],
personContacts: [],
personRelatives: [],
}),
)
const encounterId = typeof route.params.id == 'string' ? parseInt(route.params.id) : 0
const controlLetterId = typeof route.params.control_letter_id == 'string' ? parseInt(route.params.control_letter_id) : 0
const controlLetter = ref<ControlLetter | null>(null)
const headerPrep: HeaderPrep = {
title: 'Detail Surat Kontrol',
@@ -36,10 +34,9 @@ const headerPrep: HeaderPrep = {
// #region Lifecycle Hooks
onMounted(async () => {
// await getPatientDetail()
const result = await getPatientDetail(props.patientId)
const result = await getDetail(controlLetterId)
if (result.success) {
patient.value = result.body.data || {}
controlLetter.value = result.body?.data
}
})
// #endregion
@@ -56,7 +53,10 @@ function handleAction(type: string) {
switch (type) {
case 'edit':
// TODO: Handle edit action
console.log('outpatient-encounter-id-edit')
navigateTo({
name: 'rehab-encounter-id-control-letter-control_letter_id-edit',
params: { id: encounterId, "control_letter_id": controlLetterId },
})
break
case 'cancel':
@@ -73,5 +73,5 @@ function handleAction(type: string) {
<template>
<Header :prep="headerPrep" :ref-search-nav="headerPrep.refSearchNav" />
<AppOutpatientEncounterPreview :patient="patient" @click="handleAction" />
<AppOutpatientEncounterPreview :instance="controlLetter" @click="handleAction" />
</template>
app/components/content/outpatient/encounter/edit.vue
+58 -47
View File
@@ -22,45 +22,51 @@ import {
isRecordConfirmationOpen,
onResetState,
handleActionSave,
handleCancelForm,
} from '~/handlers/patient.handler'
handleActionEdit,
} from '~/handlers/control-letter.handler'
import { toast } from '~/components/pub/ui/toast'
import { getPatientDetail } from '~/services/patient.service'
import { withBase } from '~/models/_base'
import type { Person } from '~/models/person'
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 = defineProps<{
callbackUrl?: string
patientId: number
}>()
// form related state
const personPatientForm = ref<ExposedForm<any> | null>(null)
const controlLetterForm = ref<ExposedForm<any> | null>(null)
// #endregion
// #region State & Computed
const route = useRoute()
const router = useRouter()
const encounterId = typeof route.params.id == 'string' ? parseInt(route.params.id) : 0
const controlLetterId = typeof route.params.control_letter_id == 'string' ? parseInt(route.params.control_letter_id) : 0
const isConfirmationOpen = ref(false)
const patient = ref(
withBase<Patient>({
person: {} as Person,
personAddresses: [],
personContacts: [],
personRelatives: [],
}),
)
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 () => {
// await getPatientDetail()
const result = await getPatientDetail(props.patientId)
const result = await getDetail(controlLetterId)
if (result.success) {
patient.value = result.body.data || {}
const responseData = {...result.body.data, date: formatDateYyyyMmDd(result.body.data.date)}
selectedUnitId.value = responseData?.unit_id
selectedSpecialistId.value = responseData?.specialist_id
selectedSubSpecialistId.value = responseData?.subspecialist_id
controlLetter.value = responseData
controlLetterForm.value?.setValues(responseData)
}
})
// #endregion
@@ -71,12 +77,30 @@ function goBack() {
}
async function handleConfirmAdd() {
// handleActionClick('submit')
console.log(`tersubmit wak`)
const response = await handleActionEdit(
controlLetterId,
await composeFormData(),
() => { },
() => { },
toast,
)
goBack()
}
function handleCancelAdd() {
isConfirmationOpen.value = false
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 = encounterId
return new Promise((resolve) => resolve(formData))
}
// #endregion region
@@ -84,29 +108,6 @@ function handleCancelAdd() {
async function handleActionClick(eventType: string) {
if (eventType === 'submit') {
isConfirmationOpen.value = true
// const patient: Patient = await composeFormData()
// let createdPatientId = 0
// const response = await handleActionSave(
// patient,
// () => {},
// () => {},
// toast,
// )
// const data = (response?.body?.data ?? null) as PatientBase | null
// if (!data) return
// createdPatientId = data.id
// // If has callback provided redirect to callback with patientData
// if (props.callbackUrl) {
// await navigateTo(props.callbackUrl + '?patient-id=' + patient.id)
// return
// }
// // Navigate to patient list or show success message
// await navigateTo('/outpatient/encounter')
// return
}
if (eventType === 'cancel') {
@@ -116,9 +117,16 @@ async function handleActionClick(eventType: string) {
}
goBack()
// handleCancelForm()
}
}
function handleCancelAdd() {
isConfirmationOpen.value = false
}
provide("selectedUnitId", selectedUnitId);
provide("selectedSpecialistId", selectedSpecialistId);
provide("selectedSubSpecialistId", selectedSubSpecialistId);
// #endregion
// #region Watchers
@@ -128,8 +136,11 @@ async function handleActionClick(eventType: string) {
<template>
<div class="mb-5 border-b border-b-slate-300 pb-3 text-lg font-semibold xl:text-xl">Update Surat Kontrol</div>
<AppOutpatientEncounterEntryForm
ref="personPatientForm"
:schema="PatientSchema"
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">
app/components/content/outpatient/encounter/list.vue
+4 -4
View File
@@ -107,8 +107,8 @@ watch([recId, recAction], () => {
switch (recAction.value) {
case ActionEvents.showDetail:
navigateTo({
name: 'outpatient-encounter-id',
params: { id: recId.value },
name: 'rehab-encounter-id-control-letter-control_letter_id',
params: { id: encounterId, "control_letter_id": recId.value },
})
break
@@ -116,8 +116,8 @@ watch([recId, recAction], () => {
// TODO: Handle edit action
// isFormEntryDialogOpen.value = true
navigateTo({
name: 'outpatient-encounter-id-edit',
params: { id: recId.value },
name: 'rehab-encounter-id-control-letter-control_letter_id-edit',
params: { id: encounterId, "control_letter_id": recId.value },
})
break