Load category codes on app start

bcgov · Aug 10, 2023 · a4cb263 · a4cb263
1 parent 074e701
commit a4cb263
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 10 deletions.
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
@@ -14,7 +14,7 @@ onBeforeMount(async () => {
   console.log('Independent Authorities loaded')
   await appStore.setSchoolList()
   console.log('school list loaded')
-  await appStore.setDistrictContactTypeCodes()
+  await appStore.setCodes()
   console.log('district contact type codes loaded')
 })
 </script>

diff --git a/frontend/src/stores/app.ts b/frontend/src/stores/app.ts
@@ -20,20 +20,27 @@ interface School {
 
 }
 
-interface DistrictContactTypeCodes {
+interface DistrictContactTypeCode {
   districtContactTypeCode: string;
   label: string;
   description?: string;
 }
 
+interface CategoryCode {
+  schoolCategoryCode: string,
+  label: string;
+  description: string;
+}
+
 import InstituteService from '../services/InstituteService'
 
 export const useAppStore = defineStore('app', {
   state: () => ({
     districts: [] as District[],
     authorities: [] as Authority[],
     schools: [] as School[],
-    districtContactTypeCodes: [] as DistrictContactTypeCodes[],
+    districtContactTypeCodes: [] as DistrictContactTypeCode[],
+    categoryCodes: [] as CategoryCode[],
   }),
   actions: {
     convertToCSV(jsonArray) {
@@ -103,13 +110,21 @@ export const useAppStore = defineStore('app', {
       })
 
     },
-    setDistrictContactTypeCodes(): void {
+    setCodes(): void {
+      // set district contact type codes
       InstituteService.getDistrictContactTypeCodes().then((response) => {
         this.districtContactTypeCodes = response.data
       })
       .catch((error) => {
         console.error(error)
       })
+
+      // set category codes
+      InstituteService.getCategoryCodes().then((response) => {
+        this.categoryCodes = response.data
+      }).catch((error) => {
+        console.error(error)
+      })
     }
 
   },
@@ -144,6 +159,12 @@ export const useAppStore = defineStore('app', {
     },
     getDistrictContactTypeCodesLabel: (state) => {
       return (searchCode: string | String) => state.districtContactTypeCodes.find((contactCode) => searchCode === contactCode.districtContactTypeCode)?.label
+    },
+    getCategoryCodes: (state) => {
+      return state.categoryCodes
+    },
+    getCategoryCodesLabel: (state) => {
+      return (searchCode: string | String ) => state.categoryCodes.find((categoryCode) => searchCode === categoryCode.schoolCategoryCode)?.label
     }
   }
 });
diff --git a/frontend/src/views/DistrictView.vue b/frontend/src/views/DistrictView.vue
@@ -24,6 +24,18 @@ const contactHeaders = [
   { title: 'Email', key: 'email' }
 ]
 
+const schoolHeaders = [
+  { title: 'School Name', key: 'displayName' },
+  { title: 'Mincode', key: 'mincode' },
+  { title: 'Category', key: 'schoolCategoryCode' },
+  { title: 'Type', key: 'facilityTypeCode' },
+  //{ title: 'Grades', key: ''},
+  { title: 'Phone', key: 'phoneNumber' },
+  { title: 'Fax', key: 'faxNumber' },
+  { title: 'Email', key: 'email' },
+  { title: 'Website', key: 'website' }
+]
+
 onMounted(async () => {
   const route = useRoute()
   // Set the districtId inside the onMounted hook
@@ -73,6 +85,7 @@ onMounted(async () => {
 
     <v-card-text>
       <v-window v-model="tab">
+        <!-- District Contacts tab contents -->
         <v-window-item :value="tabOptions.contacts"
           >CONTACTS
           <v-data-table
@@ -92,15 +105,20 @@ onMounted(async () => {
               {{
                 appStore.getDistrictContactTypeCodesLabel(item.selectable.districtContactTypeCode)
               }}
-              <!-- {{
-                districtContactTypeCodes.value.find(
-                  (code) => item.selectable.districtContactTypeCode === code.districtContactTypeCode
-                ).label
-              }} -->
             </template>
           </v-data-table>
         </v-window-item>
-        <v-window-item :value="tabOptions.schools">SCHOOLS</v-window-item>
+        <!-- District Schools tab contents -->
+        <v-window-item :value="tabOptions.schools"
+          >SCHOOLS
+          <v-data-table
+            items-per-page="-1"
+            :headers="schoolHeaders"
+            :items="district.value.districtSchools"
+          >
+            <template v-slot:item.schoolCategoryCode="{ item }"> hello world </template>
+          </v-data-table>
+        </v-window-item>
       </v-window>
     </v-card-text>
   </div>