@eeplatform/nuxt-layer-common 1.7.32 → 1.7.34

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @eeplatform/nuxt-layer-common
 
+## 1.7.34
+
+### Patch Changes
+
+- 86ed8a6: Fix enrollment form
+
+## 1.7.33
+
+### Patch Changes
+
+- a893a78: Fix birthdate format
+
 ## 1.7.32
 
 ### Patch Changes

package/components/EnrollmentForm.vue

@@ -378,13 +378,9 @@
                   />
                 </v-col>
                 <v-col cols="12">
-                  <v-mask-input
+                  <InputMaskDate
                     v-model="enrollment.learnerInfo.birthDate"
-                    mask="##/##/####"
-                    placeholder="MM/DD/YYYY"
-                    density="comfortable"
-                    variant="outlined"
-                  ></v-mask-input>
+                  ></InputMaskDate>
                 </v-col>
               </v-row>
             </v-col>
@@ -1083,12 +1079,7 @@
                         v-model="
                           enrollment.parentGuardianInfo.father.contactNumber
                         "
-                        :mask="{
-                          mask: '09NN-NNN-NNNN',
-                          tokens: {
-                            N: { pattern: /[0-9]/ },
-                          },
-                        }"
+                        mask="####-###-####"
                         placeholder="09XX-XXX-XXXX"
                         variant="outlined"
                         density="comfortable"
@@ -1163,12 +1154,7 @@
                         v-model="
                           enrollment.parentGuardianInfo.mother.contactNumber
                         "
-                        :mask="{
-                          mask: '09NN-NNN-NNNN',
-                          tokens: {
-                            N: { pattern: /[0-9]/ },
-                          },
-                        }"
+                        mask="####-###-####"
                         placeholder="09XX-XXX-XXXX"
                         variant="outlined"
                         density="comfortable"
@@ -1243,12 +1229,7 @@
                           enrollment.parentGuardianInfo.legalGuardian
                             .contactNumber
                         "
-                        :mask="{
-                          mask: '09NN-NNN-NNNN',
-                          tokens: {
-                            N: { pattern: /[0-9]/ },
-                          },
-                        }"
+                        mask="####-###-####"
                         placeholder="09XX-XXX-XXXX"
                         variant="outlined"
                         density="comfortable"
@@ -1469,8 +1450,6 @@ const prop = defineProps({
     default: "",
   },
 });
-
-import { VMaskInput } from "vuetify/labs/VMaskInput";
 const { requiredRule, debounce } = useUtils();
 
 const enrollment = defineModel<TTLearner>({
@@ -2264,6 +2243,10 @@ watch(
   (trackValue) => {
     if (!trackValue || !enrollment.value.seniorHighInfo) return;
 
+    // Clear strand when track changes
+    enrollment.value.seniorHighInfo.strand = "";
+    enrollment.value.seniorHighInfo.strandName = "";
+
     const selectedTrack = tracks.find((track) => track.value === trackValue);
     if (selectedTrack && enrollment.value.seniorHighInfo) {
       enrollment.value.seniorHighInfo.trackName = selectedTrack.title ?? "";
@@ -2534,7 +2517,7 @@ watchEffect(() => {
 import { useMask } from "vuetify";
 
 watchEffect(() => {
-  const mask = useMask({ mask: "##/##/####" });
+  const mask = useMask({ mask: "##-##-####" });
   const date = mask.mask(enrollment.value.learnerInfo.birthDate);
   if (
     enrollment.value.learnerInfo.birthDate &&

package/components/Input/MaskDate.vue

@@ -0,0 +1,30 @@
+<template>
+  <v-mask-input
+    v-bind="attrs"
+    v-model="formattedValue"
+    mask="##-##-####"
+    placeholder="MM-DD-YYYY"
+    density="comfortable"
+    variant="outlined"
+  >
+    <template v-for="(_, name) in $slots" #[name]="slotProps">
+      <slot :name="name" v-bind="slotProps || {}" />
+    </template>
+  </v-mask-input>
+</template>
+
+<script setup lang="ts">
+import { VMaskInput } from "vuetify/labs/VMaskInput";
+
+const attrs = useAttrs();
+const formattedValue = ref("");
+
+const modelData = defineModel({ type: String });
+
+import { useMask } from "vuetify";
+
+watch(formattedValue, () => {
+  const mask = useMask({ mask: "##-##-####" });
+  modelData.value = mask.mask(formattedValue.value);
+});
+</script>

package/package.json

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