updated the download button for schools

backend/src/app.js

@@ -13,7 +13,7 @@ const districtRouter = require("./routes/district-router");
 const downloadRouter = require("./routes/download-router");
 const authorityRouter = require("./routes/authority-router");
 const offshoreRouter = require("./routes/offshore-router");
-const schoolRouter = require("./routes/school-router");
+//const schoolRouter = require("./routes/school-router");
 const app = express();
 const publicPath = path.join(__dirname, "public");
 
@@ -77,7 +77,7 @@ apiRouter.use("/v1/institute", instituteRouter);
 apiRouter.use("/v1/district", districtRouter);
 apiRouter.use("/v1/authority", authorityRouter);
 apiRouter.use("/v1/offshore", offshoreRouter);
-apiRouter.use("/v1/school", schoolRouter);
+//apiRouter.use("/v1/school", schoolRouter);
 
 //Handle 500 error
 app.use((err, _req, res, next) => {

frontend/src/assets/main.css

@@ -45,6 +45,9 @@ button.link-btn, .link-btn .v-btn__content {
   max-width: 1280px;
   padding: 0 2rem;
 }
+.v-btn-align-left {
+  justify-content: normal !important;
+}
 @media (hover: hover) {
   a:hover {
     background-color: hsla(160, 100%, 37%, 0.2);

frontend/src/components/AuthoritySelect.vue

@@ -56,16 +56,16 @@ function downloadAuthorityContacts() {
           <v-btn
             href="/api/v1/download/csv/school/INDEPEND?filepath=independschoolcontacts"
             block
-            class="text-none text-subtitle-1 my-1"
+            class="v-btn-align-left text-none text-subtitle-1 my-1"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /> </template>
 
             All Independent Schools</v-btn
           >
-          <v-btn block class="text-none text-subtitle-1 my-1" @click="downloadAuthorityContacts"
+          <v-btn block class="v-btn-align-left text-none text-subtitle-1 my-1" @click="downloadAuthorityContacts"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /></template> Contacts for All
             Authorities</v-btn
           >
-          <v-btn block class="text-none text-subtitle-1 my-1" @click="downloadAuthorityMailing"
+          <v-btn block class="v-btn-align-left text-none text-subtitle-1 my-1" @click="downloadAuthorityMailing"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /></template> Mailing for All
             Authorities</v-btn
           >

frontend/src/components/ContactTypeModel.vue

@@ -96,16 +96,18 @@ const searchContact = async () => {
         block
         variant="outlined"
         color="bcGovBlue"
-        class="text-none text-subtitle-1 my-1"
+        class="v-btn-align-left text-none text-subtitle-1 my-1"
         v-bind="props"
       >
         View Contacts by Type
       </v-btn>
+
     </template>
     <v-card>
       <v-card-title>
         <span class="text-h5">Contacts by Type</span>
       </v-card-title>
+      <v-divider></v-divider>
       <v-card-text>
         <v-autocomplete
           v-model="selectedContactType"

frontend/src/components/DistrictSelect.vue

@@ -53,18 +53,18 @@ function downloadDistrictsMailing() {
             rounded="lg"
             size="large"
             @click="goToDistrict"
-            class="text-none text-subtitle-1 ml-3"
+            class="v-btn-align-left text-none text-subtitle-1 ml-3"
           />
         </v-row>
         <v-row>
-          <v-btn block class="text-none text-subtitle-1 my-1" @click="downloadDistrictsMailing"
+          <v-btn block class="v-btn-align-left text-none text-subtitle-1 my-1" @click="downloadDistrictsMailing"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /></template> Mailing for All
             Districts</v-btn
           >
           <v-btn
             href="/api/v1/download/csv/institute/district/contact/paginated?pageSize=100&pageNumber=0&filepath=exceldistrictcontacts"
             block
-            class="text-none text-subtitle-1 my-1"
+            class="v-btn-align-left text-none text-subtitle-1 my-1"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /> </template>
 
             Contacts for All Districts</v-btn

frontend/src/components/DownloadSchoolsModal.vue

@@ -0,0 +1,70 @@
+<script setup lang="ts">
+import { useAppStore } from '@/stores/app'
+import { ref } from 'vue'
+
+const appStore = useAppStore()
+// used for open and close modal
+const dialog = ref(false)
+// varibles used for search
+</script>
+<template>
+  <v-dialog v-model="dialog" width="25%">
+    <template v-slot:activator="{ props }">
+      <v-btn
+        block
+        variant="outlined"
+        color="bcGovBlue"
+        class="text-none text-subtitle-1 my-1"
+        v-bind="props"
+      >
+      Download Schools
+      </v-btn>
+
+    </template>
+    <template v-slot:default="{ isActive }">
+      <v-card title="Download Schools">
+        <v-card-actions>
+          <v-column>
+            <v-row class="pt-2">
+              <v-col class="py-1 my-0"><v-btn
+                href="/api/v1/download/csv/school/PUBLIC?filepath=publicschoolcontacts"
+                block
+                class="v-btn-align-left text-none text-subtitle-1 my-1"
+                @click="dialog = false"
+                ><template v-slot:prepend> <v-icon icon="mdi-download" /> </template>
+                Public Schools (CSV)</v-btn
+              ></v-col>
+            </v-row>
+            <v-row>
+              <v-col class="py-1 my-0">   <v-btn
+                href="/api/v1/download/csv/school/INDEPEND?filepath=independentschoolcontacts"
+                block
+                style="text-align: left"
+                class="v-btn-align-left text-left text-none text-subtitle-1 my-1"
+                @click="dialog = false"
+                ><template v-slot:prepend> <v-icon icon="mdi-download" /> </template>
+
+                Independent Schools (CSV)</v-btn
+              ></v-col>
+            </v-row>
+            <v-row>
+              <v-col class="py-1 my-0"> <v-btn
+                href="/api/v1/download/csv/school/ALL?filepath=allschoolcontacts"
+                block
+                class="v-btn-align-left text-left text-none text-subtitle-1 my-1"
+                @click="dialog = false"
+                ><template v-slot:prepend> <v-icon icon="mdi-download" /> </template>
+               All Schools (CSV)</v-btn
+              ></v-col>
+            </v-row>
+        </v-column>
+        </v-card-actions>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="error" variant="text" @click="dialog = false"> Close </v-btn>
+        </v-card-actions>
+      </v-card>
+    </template>
+
+  </v-dialog>
+</template>

frontend/src/components/OffshoreSelect.vue

@@ -35,16 +35,16 @@ function downloadOffshoreSchoolReps() {
           <v-btn
             block
             color="bcGovBlue"
-            class="text-none text-subtitle-1 my-1"
+            class="v-btn-align-left text-none text-subtitle-1 my-1"
             variant="outlined"
             @click="viewOffshoreSchools"
             >View Offshore Schools</v-btn
           >
-          <v-btn block class="text-none text-subtitle-1 my-1" @click="downloadOffshoreSchoolInfo"
+          <v-btn block class="v-btn-align-left text-none text-subtitle-1 my-1" @click="downloadOffshoreSchoolInfo"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /></template>Offshore School
             Info</v-btn
           >
-          <v-btn block class="text-none text-subtitle-1 my-1" @click="downloadOffshoreSchoolReps"
+          <v-btn block class="v-btn-align-left text-none text-subtitle-1 my-1" @click="downloadOffshoreSchoolReps"
             ><template v-slot:prepend> <v-icon icon="mdi-download" /></template>Offshore School
             Representatives</v-btn
           >

frontend/src/components/SchoolSelect.vue

@@ -3,6 +3,7 @@ import { ref } from 'vue'
 import { useAppStore } from '@/stores/app'
 import router from '@/router'
 import { useSanitizeURL } from '@/composables/string'
+import DownloadSchoolsModal from '@/components/DownloadSchoolsModal.vue'
 
 // Type Imports
 import type { ListSchool } from '@/types/types'
@@ -89,17 +90,10 @@ function downloadAllSchoolsMailing() {
             </v-col>
             <v-spacer />
             <v-col>
-              <v-btn
-                href="/api/v1/download/csv/school/ALL?filepath=allschoolcontacts"
-                block
-                class="text-none text-subtitle-1 my-1"
-                ><template v-slot:prepend> <v-icon icon="mdi-download" /> </template>
-
-                All Schools Info</v-btn
-              >
+              <DownloadSchoolsModal></DownloadSchoolsModal>
             </v-col>
             <v-col>
-              <v-btn block class="text-none text-subtitle-1 ma-1" @click="downloadAllSchoolsMailing"
+              <v-btn block class="v-btn-align-left text-none text-subtitle-1 ma-1" @click="downloadAllSchoolsMailing"
                 ><template v-slot:prepend> <v-icon icon="mdi-download" /></template>Mailing for All
                 Schools</v-btn
               >