@eeplatform/nuxt-layer-common 1.7.51 → 1.7.53

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @eeplatform/nuxt-layer-common
 
+## 1.7.53
+
+### Patch Changes
+
+- 2cb09c5: Integrate track and strands to enrollment form
+
+## 1.7.52
+
+### Patch Changes
+
+- 01dfd23: Fix enrollment form - reset semeste, track, and strand when grade level changes
+
 ## 1.7.51
 
 ### Patch Changes

package/components/EnrollmentForm.vue

@@ -1295,10 +1295,11 @@
                         <v-col cols="12">
                           <v-autocomplete
                             v-model="enrollment.seniorHighInfo.track"
-                            item-title="title"
-                            item-value="value"
+                            item-title="name"
+                            item-value="_id"
                             :return-object="false"
-                            :items="tracks"
+                            :items="schoolTracks"
+                            :loading="loadingTracks"
                             :rules="[requiredRule]"
                           ></v-autocomplete>
                         </v-col>
@@ -1315,10 +1316,11 @@
                         <v-col cols="12">
                           <v-autocomplete
                             v-model="enrollment.seniorHighInfo.strand"
-                            item-title="title"
-                            item-value="value"
+                            item-title="name"
+                            item-value="_id"
                             :return-object="false"
                             :items="selectedTrackStrands"
+                            :loading="loadingStrands"
                             :rules="[requiredRule]"
                           ></v-autocomplete>
                         </v-col>
@@ -2273,15 +2275,29 @@ watch(selectedSchool, (val) => {
 
 watch(
   () => enrollment.value.gradeLevel,
-  () => {
+  (newGradeLevel) => {
     if (enrollment.value.returningLearnerInfo) {
       enrollment.value.returningLearnerInfo.lastGradeLevelCompleted = "";
     }
+
+    // Clear senior high fields when switching to a non-senior-high grade level
+    if (
+      enrollment.value.seniorHighInfo &&
+      !["grade-11", "grade-12"].includes(newGradeLevel)
+    ) {
+      enrollment.value.seniorHighInfo.semester = "";
+      enrollment.value.seniorHighInfo.track = "";
+      enrollment.value.seniorHighInfo.trackName = "";
+      enrollment.value.seniorHighInfo.strand = "";
+      enrollment.value.seniorHighInfo.strandName = "";
+    }
   }
 );
 
-const { gradeLevels, generateSchoolYears, motherTongueOptions, tracks } =
-  useBasicEdu();
+const { gradeLevels, generateSchoolYears, motherTongueOptions } = useBasicEdu();
+
+const { getAll: getAllTracks } = useTrack();
+const { getAll: getAllStrands } = useStrand();
 
 const gradeLevelOffering = ref<Record<string, any>[]>([]);
 
@@ -2289,6 +2305,52 @@ const { getAll: getGradeLevels } = useGradeLevel();
 
 const theSchool = computed(() => prop.school || enrollment.value.school);
 
+const schoolTracks = ref<Array<Record<string, any>>>([]);
+
+const { data: getTracksData, status: getTracksStatus } = await useLazyAsyncData(
+  `get-tracks-enrollment-form-${theSchool.value}`,
+  () => getAllTracks({ school: theSchool.value, limit: 100 }),
+  {
+    watch: [theSchool],
+  }
+);
+
+const loadingTracks = computed(() => getTracksStatus.value === "pending");
+
+watchEffect(() => {
+  if (getTracksData.value) {
+    schoolTracks.value = getTracksData.value.items;
+  }
+});
+
+const schoolStrands = ref<Array<Record<string, any>>>([]);
+
+const selectedTrackId = computed(
+  () => enrollment.value.seniorHighInfo?.track || ""
+);
+
+const { data: getStrandsData, status: getStrandsStatus } =
+  await useLazyAsyncData(
+    `get-strands-enrollment-form-${theSchool.value}-${selectedTrackId.value}`,
+    () =>
+      getAllStrands({
+        school: theSchool.value,
+        track: selectedTrackId.value,
+        limit: 100,
+      }),
+    {
+      watch: [theSchool, selectedTrackId],
+    }
+  );
+
+const loadingStrands = computed(() => getStrandsStatus.value === "pending");
+
+watchEffect(() => {
+  if (getStrandsData.value) {
+    schoolStrands.value = getStrandsData.value.items;
+  }
+});
+
 const { data: getGradeLevelReq, status: statusGradeLevel } =
   await useLazyAsyncData(
     "get-grade-level-offerings" + theSchool.value,
@@ -2316,12 +2378,7 @@ watchEffect(() => {
   }
 });
 
-const selectedTrackStrands = computed(
-  () =>
-    tracks.find(
-      (track) => track.value === enrollment.value.seniorHighInfo?.track
-    )?.strands || []
-);
+const selectedTrackStrands = computed(() => schoolStrands.value);
 
 const isSeniorHighSchool = computed(() => {
   const gradeLevel = enrollment.value.gradeLevel;
@@ -2338,9 +2395,11 @@ watch(
     enrollment.value.seniorHighInfo.strand = "";
     enrollment.value.seniorHighInfo.strandName = "";
 
-    const selectedTrack = tracks.find((track) => track.value === trackValue);
+    const selectedTrack = schoolTracks.value.find(
+      (track: Record<string, any>) => track._id === trackValue
+    );
     if (selectedTrack && enrollment.value.seniorHighInfo) {
-      enrollment.value.seniorHighInfo.trackName = selectedTrack.title ?? "";
+      enrollment.value.seniorHighInfo.trackName = selectedTrack.name ?? "";
     }
   }
 );
@@ -2352,10 +2411,10 @@ watch(
     if (!strandValue || !enrollment.value.seniorHighInfo) return;
 
     const selectedStrand = selectedTrackStrands.value.find(
-      (strand) => strand.value === strandValue
+      (strand: Record<string, any>) => strand._id === strandValue
     );
     if (selectedStrand && enrollment.value.seniorHighInfo) {
-      enrollment.value.seniorHighInfo.strandName = selectedStrand.title ?? "";
+      enrollment.value.seniorHighInfo.strandName = selectedStrand.name ?? "";
     }
   }
 );

package/composables/useStrand.ts

@@ -0,0 +1,21 @@
+export default function useStrand() {
+  function getAll({
+    page = 1,
+    search = "",
+    status = "active",
+    limit = 100,
+    school = "",
+    track = "",
+  } = {}) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/basic-education/strands/school/${school}`,
+      {
+        query: { page, search, status, limit, track },
+      }
+    );
+  }
+
+  return {
+    getAll,
+  };
+}

package/composables/useTrack.ts

@@ -0,0 +1,20 @@
+export default function useTrack() {
+  function getAll({
+    page = 1,
+    search = "",
+    status = "active",
+    limit = 100,
+    school = "",
+  } = {}) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/basic-education/tracks/school/${school}`,
+      {
+        query: { page, search, status, limit },
+      }
+    );
+  }
+
+  return {
+    getAll,
+  };
+}

package/package.json

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