feat(sep): add error message

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

@@ -19,11 +19,11 @@ import type { PatientEntity } from '~/models/patient'
 // Helpers
 import { toTypedSchema } from '@vee-validate/zod'
 import { useForm } from 'vee-validate'
-import { is } from "date-fns/locale"
 
 const props = defineProps<{
   isLoading?: boolean
   isReadonly?: boolean
+  isService?: boolean
   mode?: string
   doctors: any[]
   diagnoses: any[]
@@ -43,6 +43,7 @@ const props = defineProps<{
   cities: any[]
   districts: any[]
   patient?: PatientEntity | null | undefined
+  objects?: any
   values?: any
 }>()
 
@@ -51,12 +52,8 @@ const emit = defineEmits<{
   (e: 'fetch', value?: any): void
 }>()
 
-const mode = props.mode !== undefined ? props.mode : 'add'
-const isLoading = props.isLoading !== undefined ? props.isLoading : false
-const isReadonly = props.isReadonly !== undefined ? props.isReadonly : false
-
 // Validation schema (moved to shared file)
-const { handleSubmit, errors, defineField, meta } = useForm<IntegrationBpjsFormData>({
+const { handleSubmit, errors, defineField } = useForm<IntegrationBpjsFormData>({
   validationSchema: toTypedSchema(IntegrationBpjsSchema),
 })
 
@@ -103,17 +100,15 @@ const titleLetterDate = computed(() =>
 const isAccidentally = computed(() => accident.value === '1' || accident.value === '2')
 const isProvinceSelected = computed(() => accidentProvince.value !== '')
 const isCitySelected = computed(() => accidentCity.value !== '')
+const mode = props.mode !== undefined ? props.mode : 'add'
+const isLoading = props.isLoading !== undefined ? props.isLoading : false
+const isReadonly = props.isReadonly !== undefined ? props.isReadonly : false
+const isService = ref(props.isService || false)
 
 if (mode === 'add') {
   // sepDate.value = new Date().toISOString()
 }
 
-// Submit handler
-const onSubmit = handleSubmit((values) => {
-  console.log('✅ Validated form values:', JSON.stringify(values, null, 2))
-  emit('event', 'save-sep', values)
-})
-
 watch(props, (value) => {
   const patient = value.patient || ({} as PatientEntity)
   if (Object.keys(patient).length > 0) {
@@ -124,6 +119,18 @@ watch(props, (value) => {
     phoneNumber.value = '-'
   }
 })
+
+// Submit handler
+const onSubmit = handleSubmit((values) => {
+  console.log('✅ Validated form values:', JSON.stringify(values, null, 2))
+  emit('event', 'save-sep', values)
+})
+
+onMounted(() => {
+  if (!isService.value) {
+    serviceType.value = '2'
+  }
+})
 </script>
 
 <template>
@@ -155,7 +162,7 @@ watch(props, (value) => {
           </Field>
         </Cell>
 
-        <Cell>
+        <Cell v-if="isService">
           <Label height="compact">Pelayanan</Label>
           <Field :errMessage="errors.serviceType">
             <Select
@@ -374,7 +381,7 @@ watch(props, (value) => {
           </Field>
         </Cell>
 
-        <Cell>
+        <Cell v-if="serviceType === '1'">
           <Label height="compact">
             Faskes Asal
             <span class="text-red-500">*</span>
@@ -484,8 +491,11 @@ watch(props, (value) => {
         :cellFlex="false"
       >
         <Cell>
-          <Label height="dynamic">Kelas Rawat</Label>
-          <Field>
+          <Label height="dynamic">
+            Kelas Rawat
+            <span class="text-red-500">*</span>
+          </Label>
+          <Field :errMessage="errors.classLevel">
             <Select
               id="classLevel"
               v-model="classLevel"
@@ -498,8 +508,11 @@ watch(props, (value) => {
         </Cell>
 
         <Cell>
-          <Label height="dynamic">Kelas Rawat Naik</Label>
-          <Field>
+          <Label height="dynamic">
+            Kelas Rawat Naik
+            <span class="text-red-500">*</span>
+          </Label>
+          <Field :errMessage="errors.classLevelUpgrade">
             <Select
               id="classLevelUpgrade"
               v-model="classLevelUpgrade"
@@ -512,8 +525,11 @@ watch(props, (value) => {
         </Cell>
 
         <Cell>
-          <Label height="dynamic">Pembiayaan</Label>
-          <Field>
+          <Label height="dynamic">
+            Pembiayaan
+            <span class="text-red-500">*</span>
+          </Label>
+          <Field :errMessage="errors.classPaySource">
             <Select
               id="classPaySource"
               v-model="classPaySource"
@@ -534,8 +550,11 @@ watch(props, (value) => {
         :cellFlex="false"
       >
         <Cell>
-          <Label height="dynamic">Penanggung Jawab</Label>
-          <Field>
+          <Label height="dynamic">
+            Penanggung Jawab
+            <span class="text-red-500">*</span>
+          </Label>
+          <Field :errMessage="errors.responsiblePerson">
             <Input
               id="responsiblePerson"
               v-model="responsiblePerson"
@@ -547,7 +566,6 @@ watch(props, (value) => {
         </Cell>
       </Block>
 
-
       <Block
         labelSize="thin"
         class="!pt-0"
@@ -893,9 +911,10 @@ watch(props, (value) => {
           Preview
         </Button>
         <Button
-          type="submit"
+          type="button"
           class="h-[40px] min-w-[120px] text-white"
-          :disabled="isLoading || !meta.valid"
+          :disabled="isLoading"
+          @click="onSubmit"
         >
           <Icon
             name="i-lucide-save"