Enhance validation in PersonEdit: Introduce hasValidationError and validationError helpers for form inputs. Improve error feedback for fields such as firstName, lastName, gender, and others. Refactor postPerson to handle validation exceptions and map errors to specific fields. Update related methods, styles, and API error type definitions.

src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/CreateModal.vue

@@ -2,9 +2,9 @@
 import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
 import Create from "ChillMainAssets/vuejs/OnTheFly/components/Create.vue";
 import { CreateComponentConfig } from "ChillMainAssets/types";
-import {trans, SAVE} from "translator";
-import {useTemplateRef} from "vue";
-import {Person} from "ChillPersonAssets/types";
+import { trans, SAVE } from "translator";
+import { useTemplateRef } from "vue";
+import { Person } from "ChillPersonAssets/types";
 
 const emit = defineEmits<{
   (e: "onPersonCreated", payload: { person: Person }): void;
@@ -14,17 +14,16 @@ const emit = defineEmits<{
 const props = defineProps<CreateComponentConfig>();
 const modalDialogClass = { "modal-xl": true, "modal-scrollable": true };
 
-type CreateComponentType = InstanceType<typeof Create>
+type CreateComponentType = InstanceType<typeof Create>;
 
 const create = useTemplateRef<CreateComponentType>("create");
 
 function save(): void {
-  console.log('save from CreateModal');
+  console.log("save from CreateModal");
   create.value?.save();
 }
 
-defineExpose({save})
-
+defineExpose({ save });
 </script>
 
 <template>
@@ -49,7 +48,9 @@ defineExpose({save})
         </div>
       </template>
       <template #footer>
-        <button class="btn btn-save" type="button" @click.prevent="save">{{ trans(SAVE) }}</button>
+        <button class="btn btn-save" type="button" @click.prevent="save">
+          {{ trans(SAVE) }}
+        </button>
       </template>
     </modal>
   </teleport>