@eeplatform/nuxt-layer-common 1.7.44 → 1.7.46

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @eeplatform/nuxt-layer-common
 
+## 1.7.46
+
+### Patch Changes
+
+- a7df34e: Fix enrollment form birthdate and age validation
+
+## 1.7.45
+
+### Patch Changes
+
+- 3965149: Fix enrollment birthdate validation
+
 ## 1.7.44
 
 ### Patch Changes

package/components/EnrollmentForm.vue

@@ -381,6 +381,7 @@
                 <v-col cols="12">
                   <InputMaskDate
                     v-model="enrollment.learnerInfo.birthDate"
+                    :rules="birthdateRules"
                   ></InputMaskDate>
                 </v-col>
               </v-row>
@@ -1462,6 +1463,41 @@ const prop = defineProps({
 });
 const { requiredRule, debounce } = useUtils();
 
+const birthdateMask = useMask({ mask: "##-##-####" });
+
+function parseBirthdate(v: string): Date {
+  const masked = birthdateMask.mask(v);
+  const [month, day, year] = masked.split("-");
+  return new Date(`${year}-${month}-${day}`);
+}
+
+const birthdateRules = [
+  (v: any) => !!v || "Birthdate is required",
+  (v: any) => {
+    if (!v) return true;
+    const date = parseBirthdate(v);
+    return date.toString() !== "Invalid Date" || "Invalid date";
+  },
+  (v: any) => {
+    if (!v) return true;
+    const date = parseBirthdate(v);
+    if (date.toString() === "Invalid Date") return true;
+    return date <= new Date() || "Birthdate cannot be in the future";
+  },
+  (v: any) => {
+    if (!v) return true;
+    const date = parseBirthdate(v);
+    if (date.toString() === "Invalid Date") return true;
+    const today = new Date();
+    let age = today.getFullYear() - date.getFullYear();
+    const monthDiff = today.getMonth() - date.getMonth();
+    if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < date.getDate())) {
+      age--;
+    }
+    return age >= 5 || "Learner must be at least 5 years old (Kindergarten age)";
+  },
+];
+
 const enrollment = defineModel<TLearner>({
   default: () => useEnrollment().enrollment,
 });
@@ -2548,13 +2584,11 @@ watchEffect(() => {
 import { useMask } from "vuetify";
 
 watchEffect(() => {
-  const mask = useMask({ mask: "##-##-####" });
-  const date = mask.mask(enrollment.value.learnerInfo.birthDate);
   if (
     enrollment.value.learnerInfo.birthDate &&
-    new Date(date).toString() !== "Invalid Date"
+    parseBirthdate(enrollment.value.learnerInfo.birthDate).toString() !== "Invalid Date"
   ) {
-    const birthDate = new Date(date);
+    const birthDate = parseBirthdate(enrollment.value.learnerInfo.birthDate);
 
     const today = new Date();
     let age = today.getFullYear() - birthDate.getFullYear();

package/package.json

@@ -2,7 +2,7 @@
   "name": "@eeplatform/nuxt-layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "1.7.44",
+  "version": "1.7.46",
   "main": "./nuxt.config.ts",
   "publishConfig": {
     "access": "public"