Skip to content

Commit f209af9

Browse files
felder101felder101
authored
Production Release (#839)
Sprint 58 issues include: Dependabot Alert: tar-fs can extract outside the specified dir with a specific tarball #831 BUG: Remove Ability to Access Training - Admin W/O Admin Permission #711 BUG: Address Large Layout Shifts affecting Performance on the Training Report #729
1 parent 6517acd commit f209af9

File tree

10 files changed

+438
-286
lines changed

10 files changed

+438
-286
lines changed

‎training-front-end/package-lock.json‎

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎training-front-end/src/components/AdminGSPC.vue‎

Lines changed: 156 additions & 132 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,20 @@
11
<script setup>
2-
import { ref, reactive } from 'vue';
2+
import {ref, reactive, computed} from 'vue';
33
import USWDSAlert from './USWDSAlert.vue'
44
import ValidatedTextArea from './form-components/ValidatedTextArea.vue';
55
import ValidatedMemorableDatepicker from './form-components/ValidatedMemorableDatepicker.vue';
66
import { useVuelidate } from '@vuelidate/core';
77
import { required, helpers } from '@vuelidate/validators';
88
import SpinnerGraphic from './SpinnerGraphic.vue'
99
import { RepositoryFactory } from "./RepositoryFactory.vue";
10+
import { useStore } from "@nanostores/vue";
11+
import { profile } from "../stores/user.js";
1012
1113
const adminRepository = RepositoryFactory.get('admin')
1214
const { withMessage } = helpers
13-
15+
16+
const user = useStore(profile)
17+
const isAdminUser = computed(() => user.value.roles.includes('Admin'))
1418
const showSuccessMessage = ref(false)
1519
const showFailedMessage = ref(false)
1620
const showFollowUpSuccessMessage = ref(false)
@@ -145,87 +149,152 @@
145149
}
146150
</script>
147151
<template>
148-
<div class="padding-top-4 padding-bottom-4 grid-container">
149-
<ul class="usa-card-group">
150-
<li class="usa-card tablet:grid-col-12">
151-
<div class="usa-card__container">
152-
<div class="usa-card__header">
153-
<h2 class="usa-card__heading">
154-
Send Invitations for GSA SmartPay Program Certification
155-
</h2>
152+
<section
153+
v-if="isAdminUser"
154+
class="usa-prose"
155+
>
156+
<div class="padding-top-4 padding-bottom-4 grid-container">
157+
<ul class="usa-card-group">
158+
<li class="usa-card tablet:grid-col-12">
159+
<div class="usa-card__container">
160+
<div class="usa-card__header">
161+
<h2 class="usa-card__heading">
162+
Send Invitations for GSA SmartPay Program Certification
163+
</h2>
164+
</div>
165+
<div class="usa-card__body">
166+
<p>
167+
After the attendees finish the necessary coursework for the GSA SmartPay Program Certification (GSPC), as
168+
stated in Smart Bulletin 22 during the GSA SmartPay Training Forum, you can use the form below to send
169+
each attendee an email containing a link. This link will enable them to certify their hands-on experience
170+
and obtain a PDF copy of their GSPC.
171+
</p>
172+
<p>
173+
Please fill out the form below by entering the attendees' email addresses as a comma-separated list and
174+
selecting an expiration date for their certificate. The expiration date should be three years from the
175+
date of the GSA SmartPay Training Forum. This form will verify the entered email addresses and notify you
176+
if any are invalid.
177+
</p>
178+
<form
179+
ref="form"
180+
class="usa-form usa-form--large margin-bottom-3"
181+
data-test="gspc-form"
182+
@submit.prevent="submitGspcInvites"
183+
>
184+
<ValidatedTextArea
185+
v-model="user_input.emailAddresses"
186+
client:load
187+
:validator="v_all_info$.emailAddresses"
188+
label="Email Addresses of GSA SmartPay Forum Attendees"
189+
name="email-list"
190+
:required="true"
191+
@update:paste="handlePaste"
192+
/>
193+
<ValidatedMemorableDatepicker
194+
v-model="user_input.certificationExpirationDate"
195+
client:load
196+
:validator="v_all_info$.certificationExpirationDate"
197+
label="Certification Expiration Date"
198+
name="certification-expiration-date"
199+
hint-text="For example: January 19 2000"
200+
:required="true"
201+
/>
202+
<div>
203+
<USWDSAlert
204+
v-if="showFailedMessage"
205+
status="error"
206+
class="usa-alert--slim"
207+
:has-heading="false"
208+
>
209+
Emails failed to send to: {{ failedEmailList }}
210+
</USWDSAlert>
211+
<USWDSAlert
212+
v-if="showSuccessMessage"
213+
status="success"
214+
class="usa-alert--slim"
215+
:has-heading="false"
216+
>
217+
Emails sending to {{ successCount }} people.
218+
</USWDSAlert>
219+
</div>
220+
<div class="grid-row grid-gap margin-top-3">
221+
<div class="grid-col">
222+
<input
223+
class="usa-button"
224+
type="submit"
225+
value="Send Invitations"
226+
:disabled="isLoading"
227+
data-test="submit"
228+
>
229+
<button
230+
id="cancel"
231+
type="button"
232+
class="usa-button usa-button--outline"
233+
:disabled="isLoading"
234+
@click="cancel"
235+
>
236+
Cancel
237+
</button>
238+
</div>
239+
<!--display spinner along with submit button in one row for desktop-->
240+
<div
241+
v-if="showSpinner"
242+
class="display-none tablet:display-block tablet:grid-col-1 tablet:padding-top-3 tablet:margin-left-neg-1"
243+
>
244+
<SpinnerGraphic />
245+
</div>
246+
</div>
247+
<!--display spinner under submit button for mobile view-->
248+
<div
249+
v-if="showSpinner"
250+
class="tablet:display-none margin-top-1 text-center"
251+
>
252+
<SpinnerGraphic />
253+
</div>
254+
</form>
255+
</div>
156256
</div>
157-
<div class="usa-card__body">
158-
<p>
159-
After the attendees finish the necessary coursework for the GSA SmartPay Program Certification (GSPC), as
160-
stated in Smart Bulletin 22 during the GSA SmartPay Training Forum, you can use the form below to send
161-
each attendee an email containing a link. This link will enable them to certify their hands-on experience
162-
and obtain a PDF copy of their GSPC.
163-
</p>
164-
<p>
165-
Please fill out the form below by entering the attendees' email addresses as a comma-separated list and
166-
selecting an expiration date for their certificate. The expiration date should be three years from the
167-
date of the GSA SmartPay Training Forum. This form will verify the entered email addresses and notify you
168-
if any are invalid.
169-
</p>
170-
<form
171-
ref="form"
172-
class="usa-form usa-form--large margin-bottom-3"
173-
data-test="gspc-form"
174-
@submit.prevent="submitGspcInvites"
175-
>
176-
<ValidatedTextArea
177-
v-model="user_input.emailAddresses"
178-
client:load
179-
:validator="v_all_info$.emailAddresses"
180-
label="Email Addresses of GSA SmartPay Forum Attendees"
181-
name="email-list"
182-
:required="true"
183-
@update:paste="handlePaste"
184-
/>
185-
<ValidatedMemorableDatepicker
186-
v-model="user_input.certificationExpirationDate"
187-
client:load
188-
:validator="v_all_info$.certificationExpirationDate"
189-
label="Certification Expiration Date"
190-
name="certification-expiration-date"
191-
hint-text="For example: January 19 2000"
192-
:required="true"
193-
/>
257+
</li>
258+
<li class="usa-card tablet:grid-col-12">
259+
<div class="usa-card__container">
260+
<div class="usa-card__header">
261+
<h2 class="usa-card__heading">
262+
Send Follow Ups for GSA SmartPay Program Certification
263+
</h2>
264+
</div>
265+
<div class="usa-card__body">
266+
<p>
267+
Sends out follow up GSPC invite emails to users who have
268+
<ul>
269+
<li>Received the original GSPC invite within the last 6 months</li>
270+
<li>Hasn't already completed the GSPC survey</li>
271+
<li>Hasn't already received both follow up notifications</li>
272+
<li>Hasn't received the last GSPC email within 12 hours</li>
273+
</ul>
274+
</p>
275+
<p>
276+
The system will send the subsequent needed notification based on the last one received by the user.
277+
</p>
194278
<div>
195279
<USWDSAlert
196-
v-if="showFailedMessage"
197-
status="error"
198-
class="usa-alert--slim"
199-
:has-heading="false"
200-
>
201-
Emails failed to send to: {{ failedEmailList }}
202-
</USWDSAlert>
203-
<USWDSAlert
204-
v-if="showSuccessMessage"
280+
v-if="showFollowUpSuccessMessage"
205281
status="success"
206282
class="usa-alert--slim"
207283
:has-heading="false"
208284
>
209-
Emails sending to {{ successCount }} people.
285+
Sending out GSPC follow up emails.
210286
</USWDSAlert>
211287
</div>
212288
<div class="grid-row grid-gap margin-top-3">
213289
<div class="grid-col">
214-
<input
215-
class="usa-button"
216-
type="submit"
217-
value="Send Invitations"
218-
:disabled="isLoading"
219-
data-test="submit"
220-
>
221290
<button
222-
id="cancel"
291+
id="send-out-follow-ups"
223292
type="button"
224-
class="usa-button usa-button--outline"
293+
class="usa-button"
225294
:disabled="isLoading"
226-
@click="cancel"
295+
@click="sendGspcFollowUps"
227296
>
228-
Cancel
297+
Send Out Follow Ups
229298
</button>
230299
</div>
231300
<!--display spinner along with submit button in one row for desktop-->
@@ -236,78 +305,33 @@
236305
<SpinnerGraphic />
237306
</div>
238307
</div>
239-
<!--display spinner under submit button for mobile view-->
240308
<div
241309
v-if="showSpinner"
242310
class="tablet:display-none margin-top-1 text-center"
243311
>
244312
<SpinnerGraphic />
245313
</div>
246-
</form>
247-
</div>
248-
</div>
249-
</li>
250-
<li class="usa-card tablet:grid-col-12">
251-
<div class="usa-card__container">
252-
<div class="usa-card__header">
253-
<h2 class="usa-card__heading">
254-
Send Follow Ups for GSA SmartPay Program Certification
255-
</h2>
256-
</div>
257-
<div class="usa-card__body">
258-
<p>
259-
Sends out follow up GSPC invite emails to users who have
260-
<ul>
261-
<li>Received the original GSPC invite within the last 6 months</li>
262-
<li>Hasn't already completed the GSPC survey</li>
263-
<li>Hasn't already received both follow up notifications</li>
264-
<li>Hasn't received the last GSPC email within 12 hours</li>
265-
</ul>
266-
</p>
267-
<p>
268-
The system will send the subsequent needed notification based on the last one received by the user.
269-
</p>
270-
<div>
271-
<USWDSAlert
272-
v-if="showFollowUpSuccessMessage"
273-
status="success"
274-
class="usa-alert--slim"
275-
:has-heading="false"
276-
>
277-
Sending out GSPC follow up emails.
278-
</USWDSAlert>
279-
</div>
280-
<div class="grid-row grid-gap margin-top-3">
281-
<div class="grid-col">
282-
<button
283-
id="send-out-follow-ups"
284-
type="button"
285-
class="usa-button"
286-
:disabled="isLoading"
287-
@click="sendGspcFollowUps"
288-
>
289-
Send Out Follow Ups
290-
</button>
291-
</div>
292-
<!--display spinner along with submit button in one row for desktop-->
293-
<div
294-
v-if="showSpinner"
295-
class="display-none tablet:display-block tablet:grid-col-1 tablet:padding-top-3 tablet:margin-left-neg-1"
296-
>
297-
<SpinnerGraphic />
298-
</div>
299-
</div>
300-
<div
301-
v-if="showSpinner"
302-
class="tablet:display-none margin-top-1 text-center"
303-
>
304-
<SpinnerGraphic />
305314
</div>
306315
</div>
307-
</div>
308-
</li>
309-
</ul>
310-
</div>
316+
</li>
317+
</ul>
318+
</div>
319+
</section>
320+
<section v-else>
321+
<USWDSAlert
322+
status="error"
323+
class="usa-alert"
324+
heading="You are not authorized to access."
325+
>
326+
Your email account is not authorized to access. If you should be authorized, you can contact the
327+
<a
328+
class="usa-link"
329+
href="mailto:gsa_smartpay@gsa.gov"
330+
>
331+
GSA SmartPay team
332+
</a> to gain access.
333+
</USWDSAlert>
334+
</section>
311335
</template>
312336
<style>
313337
.usa-textarea {

0 commit comments

Comments
 (0)