From f5704536d1542b96dfd57ccc7cf5b8a13e0e4a54 Mon Sep 17 00:00:00 2001
From: Khafid Prayoga <khafidp@pm.me>
Date: Tue, 25 Nov 2025 21:12:18 +0700
Subject: [PATCH] feat(treatment-report): add error handling and toast
 notification

Implement error handling in treatment report form submission and display toast notifications when errors occur. The form now emits error events and prevents default form submission behavior.
---
 .../app/treatment-report/entry-form.vue           | 15 +++++++++++++--
 app/components/content/treatment-report/add.vue   | 13 ++++++++++++-
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/app/components/app/treatment-report/entry-form.vue b/app/components/app/treatment-report/entry-form.vue
index 77367f97..8e19cc64 100644
--- a/app/components/app/treatment-report/entry-form.vue
+++ b/app/components/app/treatment-report/entry-form.vue
@@ -35,7 +35,9 @@ interface Props {
 const props = defineProps<Props>()
 const emit = defineEmits<{
   (e: 'submit', payload: FormData): void
+  (e: 'error', errors: Error): void
 }>()
+
 const { isLoading, mode = 'create' } = props
 const isReadonly = computed(() => {
   if (isLoading) {
@@ -48,6 +50,7 @@ const isReadonly = computed(() => {
 
   return false
 })
+
 const formSchema = toTypedSchema(TreatmentReportSchema)
 
 const { handleSubmit, values, resetForm, setFieldValue, setValues, validate } = useForm<FormData>({
@@ -75,12 +78,20 @@ defineExpose({
 // #endregion region
 
 // #region Utilities & event handlers
-const onSubmit = handleSubmit((formValues: FormData) => emit('submit', formValues))
+// const onSubmit = handleSubmit((formValues: FormData) => emit('submit', formValues))
+const onSubmit = handleSubmit(
+  (values) => {
+    emit('submit', values)
+  },
+  (errors) => {
+    emit('error', new Error('Silahkan lengkapi form terlebih dahulu'))
+  },
+)
 // #endregion
 </script>
 
 <template>
-  <form @submit="onSubmit">
+  <form @submit.prevent="onSubmit">
     <Fragment
       v-slot="{ section }"
       title="Tim Pelaksana Tindakan"
diff --git a/app/components/content/treatment-report/add.vue b/app/components/content/treatment-report/add.vue
index e92cd473..d16104ab 100644
--- a/app/components/content/treatment-report/add.vue
+++ b/app/components/content/treatment-report/add.vue
@@ -1,10 +1,11 @@
 <script setup lang="ts">
 // type
 import { genDoctor, type Doctor } from '~/models/doctor'
+import type { TreatmentReportFormData } from '~/schemas/treatment-report.schema'
 
 // components
+import { toast } from '~/components/pub/ui/toast'
 import AppTreatmentReportEntry from '~/components/app/treatment-report/entry-form.vue'
-import type { TreatmentReportFormData } from '~/schemas/treatment-report.schema'
 
 const doctors = ref<Doctor[]>([])
 
@@ -17,6 +18,16 @@ const doctors = ref<Doctor[]>([])
 <template>
   <AppTreatmentReportEntry
     :isLoading="false"
+    @submit="(val) => console.log(val)"
+    @error="
+      (err: Error) => {
+        toast({
+          title: 'Terjadi Kesalahan',
+          description: err.message,
+          variant: 'destructive',
+        })
+      }
+    "
     :doctors="doctors"
     :initialValues="
       {