Merge pull request #499 from bcgov/release-196-jb8

Add Facility Header component
bcgov · Jan 5, 2024 · ca15976 · ca15976
2 parents 6a8361f + 82dfb81
commit ca15976
Show file tree

Hide file tree

Showing 9 changed files with 79 additions and 57 deletions.
diff --git a/frontend/src/components/RFI/NMF.vue b/frontend/src/components/RFI/NMF.vue
@@ -4,9 +4,9 @@
  <div class="text-center pt-4">
  <p class="text-h5">Child Care Operating Funding Program - {{ formattedProgramYear }} Program Confirmation Form</p>
  <p class="text-h5 font-weight-bold">Parent Fees – Request for Information</p>
- <p class="text-h5 blueText" v-if="currentFacility?.facilityAccountNumber"> Facility ID: {{currentFacility?.facilityAccountNumber}} </p>
- <p class="text-h5 blueText" v-if="currentFacility?.facilityName"> Facility Name: {{currentFacility?.facilityName}} </p>
- <p class="text-h5 blueText" v-if="currentFacility?.licenseNumber"> Licence Number: {{currentFacility?.licenseNumber}} </p>
+ <br>
+ <FacilityHeader :facilityAccountNumber="currentFacility?.facilityAccountNumber" :facilityName="currentFacility.facilityName" :licenseNumber="currentFacility?.licenseNumber"></FacilityHeader>
+
  </div>
 
  <div class="px-2 my-10">
@@ -167,10 +167,12 @@
 import alertMixin from '@/mixins/alertMixin';
 import { mapActions, mapState, mapMutations, mapGetters } from 'vuex';
 import NavButton from '@/components/util/NavButton';
+import FacilityHeader from '../guiComponents/FacilityHeader.vue';
 
 let model = { x: [], };
 
 export default {
+ components: { NavButton, FacilityHeader },
  name: 'CcfriRequestMoreInfo',
  mixins: [alertMixin],
  data() {
@@ -259,7 +261,7 @@ export default {
  this.isProcessing = false;
  }
  },
- components: { NavButton }
+
 };
 
 

diff --git a/frontend/src/components/RFI/RFILanding.vue b/frontend/src/components/RFI/RFILanding.vue
@@ -14,12 +14,8 @@
  <p class="text-h5">Child Care Operating Funding Program - {{ formattedProgramYear }} Program Confirmation
  Form</p>
  <p class="text-h5 font-weight-bold">Parent Fee Increase – Request for Information</p>
- <p class="text-h5 blueText" v-if="currentFacility?.facilityAccountNumber"> Facility ID:
- {{ currentFacility?.facilityAccountNumber }} </p>
- <p class="text-h5 blueText" v-if="currentFacility?.facilityName"> Facility Name:
- {{ currentFacility?.facilityName }} </p>
- <p class="text-h5 blueText" v-if="currentFacility?.licenseNumber"> Licence Number:
- {{ currentFacility?.licenseNumber }} </p>
+ <br>
+ <FacilityHeader :facilityAccountNumber="currentFacility?.facilityAccountNumber" :facilityName="currentFacility.facilityName" :licenseNumber="currentFacility?.licenseNumber"></FacilityHeader>
  </div>
 
  <div class="my-10">
@@ -1501,6 +1497,7 @@ import rules from '@/utils/rules';
 import RFIDocumentUpload from '@/components/RFI/RFIDocumentUpload';
 import NavButton from '@/components/util/NavButton';
 import {PROGRAM_YEAR_LANGUAGE_TYPES } from '@/utils/constants';
+import FacilityHeader from '../guiComponents/FacilityHeader.vue';
 
 let model = {
  expansionList: [],
@@ -1514,6 +1511,7 @@ let model = {
 // let model = {x: [], q1, q2, q3, datePicker, expenseList, fundingList, IndigenousExpenseList, expansionList,model.wageList};
 
 export default {
+ components: {FacilityHeader, RFIDocumentUpload, NavButton},
  mixins: [alertMixin, globalMixin],
  name: 'CcfriRequestMoreInfo',
  data() {
@@ -1901,7 +1899,7 @@ export default {
  },
  },
 
- components: {RFIDocumentUpload, NavButton}
+
 };
 
 

diff --git a/frontend/src/components/ccfriApplication/group/AddNewFees.vue b/frontend/src/components/ccfriApplication/group/AddNewFees.vue
@@ -9,21 +9,18 @@
  <div class="row pt-4 justify-center">
  <span class="text-h5">Child Care Fee Reduction Initiative (CCFRI)</span>
  </div>
- <br>
- <div class="row pt-4 justify-center" v-if="currentFacility.facilityAccountNumber">
- <span class="text-h5">{{currentFacility.facilityAccountNumber}}</span>
- </div>
- <br>
- <p class="text-h5 text-center" style="color: rgb(0, 52, 102)"> Facility Name: {{currentFacility.facilityName}} </p> <br><br>
- <p>
- Enter the fees you charged a new parent for full-time care at this facility for the months below. <br><br>
- If you have more than one fee for the same category, <strong> enter the highest fee. </strong><br><br>
- <strong>Enter the fee before CCFRI is applied. </strong> <br><br>
- <span v-if="languageYearLabel != programYearTypes.HISTORICAL"> <strong>New for 2024/25:</strong> CCFRI regions align with the BCSSA's grouping of school districts into 6 regional chapters. Use the <a href="https://bcmcf.ca1.qualtrics.com/jfe/form/SV_eVcEWJC8HTelRCS" target="_blank">BCSSA region lookup</a> to find your region.</span> <br><br>
- Note: Fee increases will be reviewed and additional information may be requested, which may result in increased processing times. If approved, this fee will be posted on the Ministry website. <br><br>
- </p>
-
- <v-skeleton-loader max-height="475px" v-if="loading" :loading="loading" type="image, image"></v-skeleton-loader>
+ <br><br>
+ <FacilityHeader :facilityAccountNumber="currentFacility?.facilityAccountNumber" :facilityName="currentFacility.facilityName" :licenseNumber="currentFacility?.licenseNumber"></FacilityHeader>
+ <br><br>
+ <p>
+ Enter the fees you charged a new parent for full-time care at this facility for the months below. <br><br>
+ If you have more than one fee for the same category, <strong> enter the highest fee. </strong><br><br>
+ <strong>Enter the fee before CCFRI is applied. </strong> <br><br>
+ <span v-if="languageYearLabel != programYearTypes.HISTORICAL"> <strong>New for 2024/25:</strong> CCFRI regions align with the BCSSA's grouping of school districts into 6 regional chapters. Use the <a href="https://bcmcf.ca1.qualtrics.com/jfe/form/SV_eVcEWJC8HTelRCS" target="_blank">BCSSA region lookup</a> to find your region.</span> <br><br>
+ Note: Fee increases will be reviewed and additional information may be requested, which may result in increased processing times. If approved, this fee will be posted on the Ministry website. <br><br>
+ </p>
+
+ <v-skeleton-loader max-height="475px" v-if="loading" :loading="loading" type="image, image"></v-skeleton-loader>
 
  <div v-else>
  <v-card v-if="isReadOnly && CCFRIFacilityModel.existingFeesCorrect" elevation="6" class="px-0 py-0 mx-auto my-10 rounded-lg col-12 "
@@ -466,6 +463,7 @@ import globalMixin from '@/mixins/globalMixin';
 import { isEqual, cloneDeep } from 'lodash';
 import NavButton from '@/components/util/NavButton';
 import ApiService from '@/common/apiService';
+import FacilityHeader from '../../guiComponents/FacilityHeader.vue';
 
 function dateFunction (date1, date2){
 
@@ -485,7 +483,7 @@ function dateFunction (date1, date2){
 }
 
 export default {
- components: { NavButton },
+ components: { NavButton, FacilityHeader },
  mixins: [alertMixin, globalMixin],
  data() {
  return {

diff --git a/frontend/src/components/ccfriApplication/group/CcfriEceLanding.vue b/frontend/src/components/ccfriApplication/group/CcfriEceLanding.vue
@@ -29,9 +29,9 @@
  <v-card-text>
  <v-row>
  <v-col cols="" class="col-12 col-md-7">
- <p class="text--primary " v-if="facilityAccountNumber"><strong> {{ facilityAccountNumber }}</strong></p>
+ <p class="text--primary " v-if="facilityAccountNumber"><strong> Facility ID: {{ facilityAccountNumber }}</strong></p>
  <p class="text--primary "><strong> Facility Name: {{ facilityName }}</strong></p>
- <p class="text--primary"> Licence: {{ licenseNumber }}</p>
+ <p class="text--primary"><strong>Licence Number: {{ licenseNumber }}</strong> </p>
  <strong>
  <p class="text--primary ">Opt In: {{ ccfriOptInStatus == "IN" ? "IN" : ccfriOptInStatus == "1" ? "IN" :
  ccfriOptInStatus == "0" ? "OUT" : "NOT SELECTED" }} </p>

diff --git a/frontend/src/components/ccfriApplication/group/ExistingFacilityFees.vue b/frontend/src/components/ccfriApplication/group/ExistingFacilityFees.vue
@@ -14,6 +14,7 @@
  <br>
  <v-skeleton-loader max-height="475px" v-if="loading" :loading="loading" type="image" class="pb-6"> <br><br></v-skeleton-loader>
 
+
  <v-card v-else elevation="6" class="pa-4 mx-auto my-10 rounded-lg col-12 "
  min-height="230"
  rounded
@@ -22,15 +23,7 @@
  :ripple="false"
  >
  <v-card-text>
- <p class="text-h5 text--primary text-center" v-if="currentFacility.facilityAccountNumber">
- Facility ID: {{currentFacility.facilityAccountNumber}}
- </p>
- <p class="text-h5 text--primary text-center">
- {{currentFacility.facilityName}}
- </p>
- <p class="text-h5 text--primary text-center" v-if="currentFacility.licenseNumber">
- Licence Number: {{currentFacility.licenseNumber}}
- </p>
+ <FacilityHeader :facilityAccountNumber="currentFacility?.facilityAccountNumber" :facilityName="currentFacility.facilityName" :licenseNumber="currentFacility?.licenseNumber"></FacilityHeader>
  <br>
  <!--get current year from CCOF year id -NOT first in array-->
  <p class="text-h6 text--primary text-center">
@@ -116,17 +109,19 @@
 
 </template>
 
+
 <script>
 
 import { PATHS, pcfUrlGuid } from '@/utils/constants';
-import { sleep, deepCloneObject } from '@/utils/common';
+import { deepCloneObject } from '@/utils/common';
 import { mapState, mapActions, mapGetters, mapMutations} from 'vuex';
 import alertMixin from '@/mixins/alertMixin';
 import NavButton from '@/components/util/NavButton';
 import ApiService from '@/common/apiService';
+import FacilityHeader from '../../guiComponents/FacilityHeader.vue';
 
 export default {
- components: { NavButton },
+ components: { NavButton, FacilityHeader },
  mixins: [alertMixin],
  data() {
  return {

diff --git a/frontend/src/components/eceweApplication/EceweFacilities.vue b/frontend/src/components/eceweApplication/EceweFacilities.vue
@@ -50,15 +50,15 @@
  <v-card elevation="4" class="py-2 px-5 mx-2 rounded-lg col-9" width="75%">
  <v-row>
  <v-col cols="12" class="d-flex">
- <span>{{navBarList[index].facilityAccountNumber}}</span>
+ <span><strong> Facility ID: {{navBarList[index].facilityAccountNumber}}</strong></span>
  </v-col>
  </v-row>
  <v-row>
  <v-col cols="5" class="flex-column">
- <span>{{navBarList[index].facilityName}}</span>
+ <span><strong> Facility Name: {{navBarList[index].facilityName}}</strong></span>
  </v-col>
  <v-col v-if="!uiFacilities[index].update" cols="4" class="flex-column text-center">
- Status: Opt-{{uiFacilities[index].optInOrOut == 1?'In':'Out'}}
+ <strong> Status: Opt-{{uiFacilities[index].optInOrOut == 1?'In':'Out'}} </strong>
  </v-col>
  <v-col v-else-if="uiFacilities[index].update" cols="3" class="d-flex justify-center align-center pt-0">
  <v-radio-group
@@ -92,7 +92,7 @@
  </v-row>
  <v-row>
  <v-col cols="12">
- Licence #: {{navBarList[index].licenseNumber}}
+ <strong>Licence Number: {{navBarList[index].licenseNumber}}</strong>
  </v-col>
  </v-row>
  </v-card>

diff --git a/frontend/src/components/guiComponents/FacilityHeader.vue b/frontend/src/components/guiComponents/FacilityHeader.vue
@@ -0,0 +1,36 @@
+<template>
+ <div class=" text-center" >
+ <div class="" v-if="facilityAccountNumber">
+ <p class="text-h5 blueText">Facility ID: {{facilityAccountNumber}} </p>
+ </div>
+ <br>
+ <p class="text-h5 blueText"> Facility Name: {{facilityName}} </p>
+ <br>
+ <p class="text-h5 blueText" v-if="licenseNumber"> Licence Number:
+ {{ licenseNumber }} </p>
+
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'FacilityHeader',
+ props: {
+ facilityAccountNumber: String,
+ facilityName: String,
+ licenseNumber: String
+ }
+};
+</script>
+
+<style>
+
+.blueBorder{
+ border-top: 5px solid #003366 !important;
+}
+
+.blueText {
+ color: rgb(0, 52, 102);
+}
+
+</style>
diff --git a/frontend/src/components/mtfi/CurrentFeeVerification.vue b/frontend/src/components/mtfi/CurrentFeeVerification.vue
@@ -8,22 +8,14 @@
  <div class="row pt-4 justify-center">
  <span class="text-h5">Child Care Fee Reduction Initiative (CCFRI)</span>
  </div>
+ <br><br>
+ <FacilityHeader :facilityAccountNumber="currentFacility?.facilityAccountNumber" :facilityName="currentFacility.facilityName" :licenseNumber="currentFacility?.licenseNumber"></FacilityHeader>
  <br>
- <div class="row pt-4 justify-center">
- <span class="text-h5">Facility Name: {{ currentFacility?.facilityName }}</span>
- </div>
- <div class="row pt-4 justify-center">
- <span class="text-h5">Licence Number: {{ currentFacility?.licenseNumber }}</span>
- </div>
- <br>
-
-
 
  <div v-if="languageYearLabel != programYearTypes.HISTORICAL" class="row pt-4 justify-center">
  <span class="text-h6"> <strong>New for 2024/25:</strong> CCFRI regions align with the BCSSA's grouping of school districts into 6 regional chapters. Use the <a href="https://bcmcf.ca1.qualtrics.com/jfe/form/SV_eVcEWJC8HTelRCS" target="_blank">BCSSA region lookup</a> to find your region.</span> <br><br>
  </div>
 
-
  <br><br>
  <div class="row pt-4 justify-center">
  <span class="text-h6">Our records show this facility's approved parent fees are as follows:</span>
@@ -682,6 +674,7 @@ import NavButton from '@/components/util/NavButton';
 import { deepCloneObject } from '../../utils/common';
 import { isEqual } from 'lodash';
 import ApiService from '@/common/apiService';
+import FacilityHeader from '../guiComponents/FacilityHeader.vue';
 
 function dateFunction (date1, date2){
 
@@ -705,6 +698,7 @@ let model = { };
 
 export default {
  name: 'MTFI-Fees',
+ components: { NavButton, FacilityHeader },
  mixins: [alertMixin, globalMixin],
  data() {
  return {
@@ -1062,7 +1056,6 @@ export default {
  async beforeRouteLeave(_to, _from, next) {
  next();
  },
- components: {NavButton}
 };
 </script>
 

diff --git a/frontend/src/components/mtfi/MtfiSelectFacility.vue b/frontend/src/components/mtfi/MtfiSelectFacility.vue
@@ -38,9 +38,9 @@
  <v-card-text>
  <v-row>
  <v-col class="col-12 col-xl-10 col-lg-10 col-md-9">
- <p class="text--primary">Facility ID: {{facilityAccountNumber}}</p>
+ <p class="text--primary"> <strong> Facility ID: {{facilityAccountNumber}} </strong></p>
  <p class="text--primary"><strong>Facility Name: {{facilityName}}</strong></p>
- <p class="text--primary">Licence #: {{licenseNumber}}</p>
+ <p class="text--primary"><strong>Licence Number: {{licenseNumber}}</strong></p>
  </v-col>
  <v-col v-if="ccfriOptInStatus==1" class="d-flex align-center justify-center">
  <v-checkbox style="transform: scale(1.5)" v-model="checkbox[index]" :disabled="isReadOnly" :loading="processing"></v-checkbox>