Skip to content

Commit 92896c7

Browse files
pcatkinspcatkins
committed
Professional development changes
1 parent 260cc4a commit 92896c7

File tree

3 files changed

+92
-28
lines changed

3 files changed

+92
-28
lines changed

‎src/ECER.Clients.RegistryPortal/ecer.clients.registryportal.client/src/components/ECEFiveYearRenewalRequirements.vue‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -91,8 +91,10 @@
9191
<ul class="ml-10">
9292
<li>Be relevant to the field of early childhood education</li>
9393
<li v-if="!expired">
94-
Have been completed within the term of your current certificate (between {{ formattedLatestCertificationEffectiveDate }} and
95-
{{ formattedLatestCertificationExpiryDate }})
94+
Have been completed within the dates of your current certificate:
95+
<strong>{{ formattedLatestCertificationEffectiveDate }}</strong>
96+
to
97+
<strong>{{ formattedLatestCertificationExpiryDate }}</strong>
9698
</li>
9799
<li v-else>Have been completed within the last 5 years</li>
98100
</ul>

‎src/ECER.Clients.RegistryPortal/ecer.clients.registryportal.client/src/components/ECEOneYearRenewalRequirements.vue‎

Lines changed: 27 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,13 @@
101101
<p>The course or workshop must:</p>
102102
<ul class="ml-10">
103103
<li>Be relevant to the field of early childhood education</li>
104-
<li>Have been completed within the last 5 years</li>
104+
<li v-if="!expired">
105+
Have been completed within the dates of your current certificate:
106+
<strong>{{ formattedLatestCertificationEffectiveDate }}</strong>
107+
to
108+
<strong>{{ formattedLatestCertificationExpiryDate }}</strong>
109+
</li>
110+
<li v-else>Have been completed within the last 5 years</li>
105111
</ul>
106112
<p>You'll need to provide the following information about each course or workshop:</p>
107113
<ul class="ml-10">
@@ -116,12 +122,13 @@
116122
</template>
117123

118124
<script lang="ts">
119-
import { defineComponent } from "vue";
125+
import { defineComponent, type PropType } from "vue";
120126
121127
import Alert from "@/components/Alert.vue";
122128
import ECEHeader from "@/components/ECEHeader.vue";
123129
import { useApplicationStore } from "@/store/application";
124130
import { useCertificationStore } from "@/store/certification";
131+
import { formatDate } from "@/utils/format";
125132
126133
export default defineComponent({
127134
name: "ECEOneYearRenewalRequirements",
@@ -133,13 +140,25 @@ export default defineComponent({
133140
},
134141
},
135142
setup() {
136-
const certificationStore = useCertificationStore();
137143
const applicationStore = useApplicationStore();
138-
139-
return {
140-
certificationStore,
141-
applicationStore,
142-
};
144+
const certificationStore = useCertificationStore();
145+
return { applicationStore, certificationStore };
146+
},
147+
computed: {
148+
formattedLatestCertificationExpiryDate(): string {
149+
const fromCertificateId = this.applicationStore.draftApplication.fromCertificate;
150+
if (fromCertificateId) {
151+
return formatDate(this.certificationStore.certificationExpiryDate(fromCertificateId) ?? "", "LLL d, yyyy");
152+
}
153+
return formatDate("", "LLL d, yyyy"); // Default to empty if no fromCertificate is specified
154+
},
155+
formattedLatestCertificationEffectiveDate(): string {
156+
const fromCertificateId = this.applicationStore.draftApplication.fromCertificate;
157+
if (fromCertificateId) {
158+
return formatDate(this.certificationStore.certificationEffectiveDate(fromCertificateId) ?? "", "LLL d, yyyy");
159+
}
160+
return formatDate("", "LLL d, yyyy"); // Default to empty if no fromCertificate is specified
161+
},
143162
},
144163
});
145164
</script>

‎src/ECER.Clients.RegistryPortal/ecer.clients.registryportal.client/src/components/inputs/EceProfessionalDevelopment.vue‎

Lines changed: 61 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,35 @@
33
<div v-if="mode === 'add'">
44
<v-row v-if="mode === 'add'">
55
<v-col>
6-
<h3>{{ `${professionalDevelopmentFormMode === "add" ? "Add" : "Edit"} course or workshop` }}</h3>
6+
<p>To meet the professional development requirement, you need to have completed 40 hours of training.</p>
77
<br />
8-
<p>The course or workshop must:</p>
8+
<p>Each course or workshop must:</p>
99
<br />
1010
<ul class="ml-10">
11-
<li>Be relevant to the field of early childhood education</li>
11+
<li>Be related to early childhood education</li>
1212
<li v-if="certificationStore.certificateStatus(applicationStore.draftApplication.fromCertificate) === 'Active'">
13-
{{
14-
`Have been completed within the term of your current certificate (Between ${formatDate(certificationStore.certificationEffectiveDate(applicationStore.draftApplication.fromCertificate) || "", "LLLL d, yyyy")} to ${formatDate(certificationStore.certificationExpiryDate(applicationStore.draftApplication.fromCertificate) || "", "LLLL d, yyyy")})`
15-
}}
13+
Have been completed within the dates of your current certificate:
14+
<strong>
15+
{{ formatDate(certificationStore.certificationEffectiveDate(applicationStore.draftApplication.fromCertificate) || "", "LLLL d, yyyy") }}
16+
</strong>
17+
to
18+
<strong>
19+
{{ formatDate(certificationStore.certificationExpiryDate(applicationStore.draftApplication.fromCertificate) || "", "LLLL d, yyyy") }}
20+
</strong>
1621
</li>
1722
<li v-else-if="certificationStore.certificateStatus(applicationStore.draftApplication.fromCertificate) === 'Expired'">
1823
Have been completed within the last 5 years
1924
</li>
2025
</ul>
26+
<template v-if="professionalDevelopmentFormMode === 'add'">
27+
<br />
28+
<p>
29+
To add additional professional development, save this form, and add the next. Continue until you have reached the required 40 hours or training.
30+
</p>
31+
</template>
2132
</v-col>
2233
</v-row>
23-
<v-form ref="professionalDevelopmentForm">
34+
<v-form ref="professionalDevelopmentForm" class="mt-6">
2435
<v-row>
2536
<v-col>
2637
<h3>Course or workshop information</h3>
@@ -251,11 +262,44 @@
251262
<!-- List view -->
252263
<div v-else>
253264
<v-row>
254-
<v-col sm="12" md="10" lg="8" xl="6">
255-
<p>
256-
You must have completed at least 40 hours of professional development relevant to early childhood education. Add the courses or workshops you’ve
257-
taken.
258-
</p>
265+
<v-col>
266+
<p>To meet the professional development requirement, you need to have completed 40 hours of training.</p>
267+
<br />
268+
<p><strong>What courses or workshops are eligible?</strong></p>
269+
<br />
270+
<p>Each course or workshop must:</p>
271+
<br />
272+
<ul class="ml-10">
273+
<li>Be related to early childhood education</li>
274+
<li v-if="certificationStore.certificateStatus(applicationStore.draftApplication.fromCertificate) === 'Active'">
275+
Have been completed within the dates of your current certificate:
276+
<strong>
277+
{{ formatDate(certificationStore.certificationEffectiveDate(applicationStore.draftApplication.fromCertificate) || "", "LLLL d, yyyy") }}
278+
</strong>
279+
to
280+
<strong>
281+
{{ formatDate(certificationStore.certificationExpiryDate(applicationStore.draftApplication.fromCertificate) || "", "LLLL d, yyyy") }}
282+
</strong>
283+
</li>
284+
<li v-else-if="certificationStore.certificateStatus(applicationStore.draftApplication.fromCertificate) === 'Expired'">
285+
Have been completed within the last 5 years
286+
</li>
287+
</ul>
288+
</v-col>
289+
</v-row>
290+
<v-row v-if="totalHours < hoursRequired">
291+
<v-col>
292+
<Callout type="warning" title="Adding your courses and/or workshops">
293+
<p class="mt-4">
294+
You will be asked to provide details for
295+
<strong>each course or workshop</strong>
296+
. If you have taken multiple courses or workshops, please add them separately.
297+
</p>
298+
<br />
299+
<p>As you add entries, the number of hours will increase in the progress bar, up to the 40 hours required.</p>
300+
<br />
301+
<p>There is no need to add courses or workshops past the 40 hour requirement.</p>
302+
</Callout>
259303
</v-col>
260304
</v-row>
261305
<v-row>
@@ -280,12 +324,10 @@
280324

281325
<v-row>
282326
<v-col sm="12" md="10" lg="8" xl="6">
283-
<p v-if="totalHours >= hoursRequired">
284-
No additional professional development may be added. You provided the required 40 hours. After you submit your application, the registry will review
285-
and verify the professional development added. If needed, the registry will contact you for additional information.
327+
<p v-if="isDisabled" class="mb-4">
328+
You have provided the required number of hours. No more courses can be added. If needed, we will follow up for more info.
286329
</p>
287330
<v-btn
288-
v-else
289331
prepend-icon="mdi-plus"
290332
rounded="lg"
291333
color="primary"
@@ -319,6 +361,7 @@ import type { VForm, VInput } from "vuetify/components";
319361
320362
import EceDateInput from "@/components/inputs/EceDateInput.vue";
321363
import EceTextField from "@/components/inputs/EceTextField.vue";
364+
import Callout from "@/components/Callout.vue";
322365
import type { FileItem } from "@/components/UploadFileItem.vue";
323366
import { useAlertStore } from "@/store/alert";
324367
import { useApplicationStore } from "@/store/application";
@@ -349,7 +392,7 @@ export interface ProfessionalDevelopmentExtended extends Components.Schemas.Prof
349392
350393
export default defineComponent({
351394
name: "EceProfessionalDevelopment",
352-
components: { ProgressBar, FileUploader, ProfessionalDevelopmentCard, EceDateInput, EceTextField },
395+
components: { ProgressBar, FileUploader, ProfessionalDevelopmentCard, EceDateInput, EceTextField, Callout },
353396
props: {
354397
modelValue: {
355398
type: Object as () => ProfessionalDevelopmentExtended[],
@@ -405,7 +448,7 @@ export default defineComponent({
405448
computed: {
406449
...mapWritableState(useWizardStore, { mode: "listComponentMode" }),
407450
isDisabled() {
408-
return false;
451+
return this.totalHours >= this.hoursRequired;
409452
},
410453
totalHours() {
411454
return this.modelValue.reduce((acc, professionalDevelopment) => {

0 commit comments

Comments
 (0)