diff --git a/ts/rmo/view/ReportSubmitted.vue b/ts/rmo/view/ReportSubmitted.vue index 0d1fd984..1750b021 100644 --- a/ts/rmo/view/ReportSubmitted.vue +++ b/ts/rmo/view/ReportSubmitted.vue @@ -46,6 +46,11 @@ Please provide your contact information in case the district has any follow-up questions.

+
-
@@ -279,6 +288,7 @@ import { ref, onMounted } from "vue"; import { computedAsync } from "@vueuse/core"; import { useRouter } from "vue-router"; +import ErrorNotification from "@/rmo/components/ErrorNotification.vue"; import Tooltip from "@/components/Tooltip.vue"; import { formatReportID } from "@/format"; import { useRoutes } from "@/rmo/route/use"; @@ -302,6 +312,8 @@ interface Props { const props = defineProps(); +const errorMessage = ref(""); +const isSubmitting = ref(false); const formData = ref({ can_sms: true, consent: true, @@ -326,6 +338,8 @@ const district = computedAsync(async (): Promise => { return await storeDistrict.byURI(report.value.district); }); const handleSubmit = async () => { + isSubmitting.value = true; + errorMessage.value = ""; try { const response = await fetch("/api/publicreport-notification", { method: "POST", @@ -339,14 +353,15 @@ const handleSubmit = async () => { }); if (response.ok) { - // Handle success (e.g., show a success message) router.push(routes.RegisterNotificationsComplete(props.id)); } else { - // Handle error - console.error("Form submission failed"); + errorMessage.value = "Something went wrong. Your request could not be completed. Please try again."; } } catch (error) { - console.error("Error submitting form:", error); + errorMessage.value = + error instanceof Error ? error.message : "Upload failed"; + } finally { + isSubmitting.value = false; } };