feat/role-check: updat flow for input encounter

This commit is contained in:
2025-12-15 12:10:04 +07:00
parent 49ffad1dde
commit bd48cc5907
13 changed files with 1163 additions and 499 deletions
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,476 @@
<script setup lang="ts">
import type { FormErrors } from '~/types/error'
import { Form } from '~/components/pub/ui/form'
import { toTypedSchema } from '@vee-validate/zod'
import Block from '~/components/pub/my-ui/form/block.vue'
import Combobox from '~/components/pub/my-ui/combobox/combobox.vue'
import FieldGroup from '~/components/pub/my-ui/form/field-group.vue'
import Field from '~/components/pub/my-ui/form/field.vue'
import Label from '~/components/pub/my-ui/form/label.vue'
import { educationCodes, genderCodes, occupationCodes, religionCodes } from '~/lib/constants'
import { mapToComboboxOptList } from '~/lib/utils'
interface DivisionFormData {
name: string
code: string
parentId: string
}
const props = defineProps<{
division: {
msg: {
placeholder: string
search: string
empty: string
}
}
items: {
value: string
label: string
code: string
}[]
schema: any
initialValues?: Partial<DivisionFormData>
errors?: FormErrors
}>()
const emit = defineEmits<{
submit: [values: DivisionFormData, resetForm: () => void]
cancel: [resetForm: () => void]
}>()
const educationOpts = mapToComboboxOptList(educationCodes)
const occupationOpts = mapToComboboxOptList(occupationCodes)
const religionOpts = mapToComboboxOptList(religionCodes)
const genderOpts = mapToComboboxOptList(genderCodes)
const formSchema = toTypedSchema(props.schema)
// Form submission handler
function onSubmitForm(values: any, { resetForm }: { resetForm: () => void }) {
const formData: DivisionFormData = {
name: values.name || '',
code: values.code || '',
parentId: values.parentId || '',
}
emit('submit', formData, resetForm)
}
</script>
<template>
<Form
v-slot="{ handleSubmit, resetForm }"
as=""
keep-values
:validation-schema="formSchema"
:initial-values="initialValues"
>
<form
id="entry-form"
@submit="handleSubmit($event, (values) => onSubmitForm(values, { resetForm }))"
>
<div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
<div class="flex flex-col justify-between">
<Block>
<FieldGroup>
<Label label-for="residentIdentityNumber">KTP</Label>
<Field
id="residentIdentityNumber"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="residentIdentityNumber"
>
<FormItem>
<FormControl>
<Input
id="residentIdentityNumber"
type="text"
maxlength="16"
placeholder="Nomor KTP"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- FrontTitle -->
<FieldGroup :column="3">
<Label label-for="frontTitle">Gelar Depan</Label>
<Field
id="frontTitle"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="frontTitle"
>
<FormItem>
<FormControl>
<Input
id="frontTitle"
type="text"
placeholder="Dr., Ir., dll"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<FieldGroup :column="3">
<Label
label-for="name"
position="dynamic"
>
Nama
</Label>
<Field
id="name"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="name"
>
<FormItem>
<FormControl>
<Input
id="name"
type="text"
placeholder="Nama lengkap"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- EndTitle -->
<FieldGroup :column="3">
<Label
label-for="endTitle"
position="dynamic"
>
Gelar Belakang
</Label>
<Field
id="endTitle"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="endTitle"
>
<FormItem>
<FormControl>
<Input
id="endTitle"
type="text"
placeholder="S.Kom, M.Kes, dll"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- BirthDate -->
<FieldGroup :column="2">
<Label label-for="birthDate">Tanggal Lahir</Label>
<Field
id="birthDate"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="birthDate"
>
<FormItem>
<FormControl>
<Input
id="birthDate"
type="date"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- BirthRegency_Code -->
<FieldGroup :column="2">
<Label label-for="birthRegencyCode">Tempat Lahir</Label>
<Field
id="birthRegencyCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="birthRegencyCode"
>
<FormItem>
<FormControl>
<Combobox
id="parentId"
v-bind="componentField"
:items="educationOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- Gender_Code -->
<FieldGroup>
<Label label-for="genderCode">Jenis Kelamin</Label>
<Field
id="genderCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="genderCode"
>
<FormItem>
<FormControl>
<Combobox
id="genderCode"
v-bind="componentField"
:items="genderOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- PassportNumber -->
<FieldGroup :column="2">
<Label label-for="passportNumber">Paspor</Label>
<Field
id="passportNumber"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="passportNumber"
>
<FormItem>
<FormControl>
<Input
id="passportNumber"
type="text"
placeholder="Nomor Paspor"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- DrivingLicenseNumber -->
<FieldGroup :column="2">
<Label label-for="drivingLicenseNumber">SIM</Label>
<Field
id="drivingLicenseNumber"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="drivingLicenseNumber"
>
<FormItem>
<FormControl>
<Input
id="drivingLicenseNumber"
type="text"
placeholder="Nomor SIM"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- Religion_Code -->
<FieldGroup :column="2">
<Label label-for="religionCode">Agama</Label>
<Field
id="religionCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="religionCode"
>
<FormItem>
<FormControl>
<Combobox
id="religionCode"
v-bind="componentField"
:items="religionOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<FieldGroup :column="2">
<Label label-for="ethnicCode">Suku</Label>
<Field
id="ethnicCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="ethnicCode"
>
<FormItem>
<FormControl>
<Combobox
id="ethnicCode"
v-bind="componentField"
:items="occupationOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- Language_Code -->
<FieldGroup :column="2">
<Label label-for="languageCode">Bahasa</Label>
<Field
id="languageCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="languageCode"
>
<FormItem>
<FormControl>
<Combobox
id="parentId"
v-bind="componentField"
:items="educationOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- Education_Code -->
<FieldGroup :column="2">
<Label label-for="educationCode">Pendidikan</Label>
<Field
id="educationCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="educationCode"
>
<FormItem>
<FormControl>
<Combobox
id="educationCode"
v-bind="componentField"
:items="educationOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- Occupation_Code -->
<FieldGroup :column="2">
<Label label-for="occupationCode">Pekerjaan</Label>
<Field
id="occupationCode"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="occupationCode"
>
<FormItem>
<FormControl>
<Combobox
id="occupationCode"
v-bind="componentField"
:items="occupationOpts"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
<!-- Occupation_Name -->
<FieldGroup :column="2">
<Label label-for="occupationName">Detail Pekerjaan</Label>
<Field
id="occupationName"
:errors="errors"
>
<FormField
v-slot="{ componentField }"
name="occupationName"
>
<FormItem>
<FormControl>
<Input
id="occupationName"
type="text"
placeholder="Contoh: Guru SMP, Petani"
autocomplete="off"
v-bind="componentField"
/>
</FormControl>
<FormMessage />
</FormItem>
</FormField>
</Field>
</FieldGroup>
</Block>
</div>
</div>
</form>
</Form>
</template>
+8 -5
View File
@@ -15,13 +15,14 @@ import { useIntegrationSepEntry } from '~/handlers/integration-sep-entry.handler
// Props
const props = defineProps<{
id: number
classCode?: 'ambulatory' | 'emergency' | 'inpatient' | 'outpatient'
subclassCode?: 'reg' | 'rehab' | 'chemo' | 'emg' | 'eon' | 'op' | 'icu' | 'hcu' | 'vk'
classCode?: 'ambulatory' | 'emergency' | 'inpatient'
subclassCode?: 'regular' | 'rehab' | 'chemo' | 'emg' | 'eon' | 'op' | 'icu' | 'hcu' | 'vk'
formType: string
}>()
const route = useRoute()
const formRef = ref<InstanceType<typeof AppEncounterEntryForm> | null>(null)
// const patientMode = ref<'new' | 'exists'>('exists')
const {
paymentsList,
@@ -56,7 +57,6 @@ const {
getDoctorInfo,
getValidateMember,
getValidateSepNumber,
handleFetchDoctors,
} = useEncounterEntry(props)
const { recSepId, openHistory, histories, getMonitoringHistoryMappers } = useIntegrationSepEntry()
@@ -82,11 +82,13 @@ function handleFetch(value?: any) {
async function handleEvent(menu: string, value?: any) {
if (menu === 'search') {
// patientMode.value = 'exists'
getPatientsList({ 'page-size': 10, includes: 'person' }).then(() => {
openPatient.value = true
})
} else if (menu === 'add') {
navigateTo('/client/patient/add')
// navigateTo('/client/patient/add')
// patientMode.value = 'new'
} else if (menu === 'add-sep') {
if (isSepValid.value) {
return
@@ -167,6 +169,7 @@ onMounted(async () => {
Kunjungan
</div>
<!-- :patientMode="patientMode" -->
<AppEncounterEntryForm
ref="formRef"
:mode="props.formType"
@@ -226,10 +229,10 @@ onMounted(async () => {
/>
Batal
</Button>
<!-- :disabled="isSaveDisabled" -->
<Button
type="button"
class="h-[40px] min-w-[120px] text-white"
:disabled="isSaveDisabled"
@click="handleSaveClick"
>
<Icon
+7 -4
View File
@@ -35,7 +35,7 @@ import FilterForm from '~/components/app/encounter/filter-form.vue'
// Props
const props = defineProps<{
classCode?: 'ambulatory' | 'emergency' | 'inpatient'
subclassCode?: 'reg' | 'rehab' | 'chemo' | 'emg' | 'eon' | 'op' | 'icu' | 'hcu' | 'vk'
subclassCode?: 'regular' | 'rehab' | 'chemo' | 'emg' | 'eon' | 'op' | 'icu' | 'hcu' | 'vk' | undefined
canCreate?: boolean
canUpdate?: boolean
canDelete?: boolean
@@ -162,7 +162,6 @@ async function getPatientList() {
'Responsible_Doctor-employee',
'Responsible_Doctor-employee-person',
'EncounterDocuments',
'unit',
'vclaimReference', // vclaimReference | vclaimSep
]
const includesParams = includesParamsArrays.join(',')
@@ -172,8 +171,11 @@ async function getPatientList() {
if (props.classCode) {
params['class-code'] = props.classCode
}
if (props.subclassCode) {
params['subclass-code'] = props.subclassCode
if (props.subclassCode == 'regular') {
params['specialist-code'] = 'rehab'
params['specialist-code-opt'] = 'ne'
} else {
params['specialist-code'] = 'rehab'
}
const result = await getEncounterList(params)
if (result.success) {
@@ -365,6 +367,7 @@ function handleRemoveConfirmation() {
</script>
<template>
{{ subclassCode }}
<CH.ContentHeader v-bind="hreaderPrep">
<FilterNav
:active-positon="activeServicePosition"