feat: implement encounter entry form for patient, doctor, payment, and SEP management

app/components/app/encounter/entry-form.vue

@@ -23,6 +23,7 @@ import { paymentMethodCodes } from '~/const/key-val/common'
 
 // App things
 import { genEncounter, type Encounter } from '~/models/encounter'
+import { se } from 'date-fns/locale'
 
 // Props
 const props = defineProps<{
@@ -48,7 +49,7 @@ const model = defineModel<Encounter>()
 model.value = genEncounter()
 
 // Common preparation
-const defaultCBItems = [{ label: 'Pilih', value: '' }];
+const defaultCBItems = [{ label: 'Pilih', value: '' }]
 const paymentMethodItems = CB.recStrToItem(paymentMethodCodes)
 
 // Emit preparation
@@ -95,7 +96,10 @@ const isInsurancePayment = computed(() => ['insurance', 'jkn'].includes(paymentM
 const isDateLoading = ref(false)
 const debouncedSepNumber = refDebounced(sepNumber, 500)
 const debouncedCardNumber = refDebounced(cardNumber, 500)
+const sepFileReview = ref<any>(null)
+const sippFileReview = ref<any>(null)
 const unitFullName = ref('') // Unit, specialist, subspecialist
+const formRef = ref<HTMLFormElement | null>(null) // Expose submit method for parent component
 
 if (mode === 'add') {
   // Set default sepDate to current date in YYYY-MM-DD format
@@ -106,11 +110,10 @@ if (mode === 'add') {
   registerDate.value = `${year}-${month}-${day}`
 }
 
-watch(() => props.selectedDoctor, (doctor) => {
-    unitFullName.value = doctor.subspecialist?.name ??
-      doctor.specialist?.name ??
-      doctor.unit?.name ??
-      'tidak diketahui'
+watch(
+  () => props.selectedDoctor,
+  (doctor) => {
+    unitFullName.value = doctor.subspecialist?.name ?? doctor.specialist?.name ?? doctor.unit?.name ?? 'tidak diketahui'
     model.value!.unit_code = doctor.unit_code || ''
     model.value!.specialist_code = doctor.specialist_code || ''
     model.value!.subspecialist_code = doctor.subspecialist_code || ''
@@ -126,12 +129,13 @@ watch(
       nationalIdentity.value = objects?.nationalIdentity || ''
       medicalRecordNumber.value = objects?.medicalRecordNumber || ''
       doctorCode.value = objects?.doctorCode || ''
-      // subSpecialistCode.value = objects?.subSpecialistCode || ''
       paymentMethodCode.value = objects?.paymentMethodCode || ''
       patientCategory.value = objects?.patientCategory || ''
       cardNumber.value = objects?.cardNumber || ''
       sepType.value = objects?.sepType || ''
       sepNumber.value = objects?.sepNumber || ''
+      sepFileReview.value = objects?.sepFileReview || ''
+      sippFileReview.value = objects?.sippFileReview || ''
       isDateLoading.value = true
       setTimeout(() => {
         registerDate.value = objects?.registerDate || ''
@@ -186,7 +190,7 @@ function onAddSep() {
     paymentMethodCode: paymentMethodCode.value,
     sepFile: sepFile.value,
     sippFile: sippFile.value,
-    sepType: sepType.value
+    sepType: sepType.value,
   }
   emit('event', 'add-sep', formValues)
 }
@@ -197,12 +201,21 @@ function onSearchSep() {
 
 // Submit handler
 const onSubmit = handleSubmit((values) => {
-  console.log('✅ Validated form values:', JSON.stringify(values, null, 2))
-  emit('event', 'save', values)
+  let payload: any = values
+  if (props.mode === 'edit') {
+    payload = {
+      ...payload,
+      sepFileReview: sepFileReview.value,
+      sippFileReview: sippFileReview.value,
+    }
+    return
+  }
+  emit('event', 'save', payload)
 })
 
-// Expose submit method for parent component
-const formRef = ref<HTMLFormElement | null>(null)
+function openFile(path: string) {
+  window.open(path, '_blank')
+}
 
 function submitForm() {
   // Trigger form submit using native form submit
@@ -347,7 +360,10 @@ defineExpose({
             <span class="text-red-500">*</span>
           </DE.Label>
           <DE.Field :errMessage="errors.unit_code">
-            <Input :value="unitFullName" :disabled="true"/>
+            <Input
+              :value="unitFullName"
+              :disabled="true"
+            />
           </DE.Field>
         </DE.Cell>
 
@@ -415,7 +431,7 @@ defineExpose({
                 placeholder="Pilih Kelompok Peserta"
               />
             </DE.Field>
-             <span class="text-sm text-gray-500">
+            <span class="text-sm text-gray-500">
               {{ noteReference }}
             </span>
           </DE.Cell>
@@ -434,7 +450,7 @@ defineExpose({
                 placeholder="Masukkan nomor kartu BPJS"
               />
             </DE.Field>
-             <div
+            <div
               v-if="isMemberValid"
               class="mt-1 flex items-center gap-2"
             >
@@ -559,6 +575,14 @@ defineExpose({
             <span class="mt-1 text-sm text-gray-500">
               {{ noteFile }}
             </span>
+            <a
+              v-if="sepFileReview"
+              class="text-bluered-500 mt-1 text-sm"
+              href="#"
+              @click="openFile(sepFileReview.filePath)"
+            >
+              {{ sepFileReview?.fileName }}
+            </a>
           </DE.Cell>
 
           <DE.Cell>
@@ -575,6 +599,14 @@ defineExpose({
             <span class="mt-1 text-sm text-gray-500">
               {{ noteFile }}
             </span>
+            <a
+              v-if="sippFileReview"
+              class="text-bluered-500 mt-1 text-sm"
+              href="#"
+              @click="openFile(sippFileReview.filePath)"
+            >
+              {{ sippFileReview?.fileName }}
+            </a>
           </DE.Cell>
         </DE.Block>
       </template>