Enhance Error Handling and Validation Feedback in Form Components

- Updated error handling in `EditSubmissionModal.vue`, `OpenCompleteForm.vue`, and `OpenForm.vue` to utilize a new `formValidationError` method for improved user feedback on validation issues.
- Introduced `formValidationError` function in `useAlert.js` to format and display validation errors more effectively, including detailed error messages for multiple fields.
- These changes aim to provide clearer and more actionable feedback to users when form submissions fail due to validation errors, enhancing the overall user experience.

client/components/open/components/EditSubmissionModal.vue

@@ -61,6 +61,9 @@ const updateForm = (form, onFailure) => {
     })
     .catch((error) => {
       console.error(error)
+      if (error?.data) {
+        useAlert().formValidationError(error.data)
+      }
       loading.value = false
       onFailure()
     })

client/components/open/forms/OpenCompleteForm.vue

@@ -340,8 +340,8 @@ export default {
         }
       }).catch((error) => {
         console.error(error)
-        if (error.response && error.data && error.data.message) {
-          useAlert().error(error.data.message)
+        if (error.response && error.data) {
+          useAlert().formValidationError(error.data)
         }
         this.loading = false
         onFailure()

client/components/open/forms/OpenForm.vue

@@ -456,7 +456,11 @@ export default {
         opnFetch('/forms/' + this.form.slug + '/submissions/' + this.form.submission_id).then((data) => {
           return {submission_id: this.form.submission_id, id: this.form.submission_id, ...data.data}
         }).catch((error) => {
-          useAlert().error(error?.data?.message || 'Something went wrong')
+          if (error?.data?.errors) {
+            useAlert().formValidationError(error.data)
+          } else {
+            useAlert().error(error?.data?.message || 'Something went wrong')
+          }
           return null
         })
       )
@@ -628,8 +632,8 @@ export default {
     },
     handleValidationError(error) {
       console.error(error)
-      if (error?.data?.message) {
-        useAlert().error(error.data.message)
+      if (error?.data) {
+        useAlert().formValidationError(error.data)
       }
       this.dataForm.busy = false
     },