pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #1039 from dod-ccpo/user-profile-validation

Browse Source 
User profile validation
This commit is contained in:
leigh-mil 2019-08-30 09:40:28 -04:00 committed by GitHub
commit 5d8280b84d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 35 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
js/components/date_selector.js
View File

@ -36,6 +36,7 @@ export default {
month: this.initialmonth,
year: this.initialyear,
name: this.nameTag,
showValidation: false,
}
},
@ -160,6 +161,8 @@ export default {
methods: {
onInput: function(e) {
this.showValidation = true
emitEvent('field-change', this, {
value: this.formattedDate,
name: this.name,

2
js/components/options_input.js
View File

@ -36,7 +36,7 @@ export default {
const showError = (this.initialErrors && this.initialErrors.length) || false
return {
showError: showError,
showValid: !showError && !!this.initialValue,
showValid: false,
validationError: this.initialErrors.join(' '),
value: this.initialValue,
}

5
js/components/text_input.js
View File

@ -31,7 +31,6 @@ export default {
type: Boolean,
default: false,
},
insetForm: Boolean,
},
data: function() {
@ -61,7 +60,7 @@ export default {
this._checkIfValid({
value: this.value,
invalidate: true,
showValidationIcon: !this.insetForm,
showValidationIcon: false,
})
if (this.mask && this.validation !== 'email') {
@ -103,6 +102,8 @@ export default {
onBlur: function(e) {
if (!(this.optional && e.target.value === '')) {
this._checkIfValid({ value: e.target.value.trim(), invalidate: true })
} else if (this.modified && !this.optional) {
this._checkIfValid({ value: e.target.value.trim(), invalidate: true })
}
this.value = e.target.value.trim()

11
templates/components/date_picker.html
View File

@ -20,7 +20,7 @@
:optional='{{ optional | string | lower }}'
inline-template>
<fieldset class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid }">
<fieldset class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && showValidation }">
<legend>
<div class="usa-input__title">
{{ label }}
@ -76,8 +76,13 @@
</div>
<div class="usa-form-group-date-ok" v-if="isDateValid">
{{ Icon("ok", classes="icon--green") }}
<div v-if="showValidation">
<div class="usa-form-group-date-ok" v-if="isDateValid">
{{ Icon("ok", classes="icon--green") }}
</div>
<div class="usa-form-group-date-ok" v-else>
{{ Icon("alert", classes="icon--red")}}
</div>
</div>
</div>
</fieldset>

10
templates/components/options_input.html
View File

@ -1,7 +1,15 @@
{% from "components/icon.html" import Icon %}
{% from "components/tooltip.html" import Tooltip %}
{% macro OptionsInput(field, tooltip, inline=False, label=True, show_validation=True, disabled=False, watch=False, optional=True) -%}
{% macro OptionsInput(
field,
tooltip,
inline=False,
label=True,
show_validation=True,
disabled=False,
watch=False,
optional=True) -%}
<optionsinput
name='{{ field.name }}'
inline-template

6
templates/components/phone_input.html
View File

@ -1,12 +1,12 @@
{% from "components/text_input.html" import TextInput %}
{% macro PhoneInput(phone_number, phone_ext, placeholder_phone="") %}
{% macro PhoneInput(phone_number, phone_ext, placeholder_phone="", phone_optional=True, extension_optional=True) %}
<div class='phone-input'>
<div class='phone-input__phone'>
{{ TextInput(phone_number, placeholder=placeholder_phone, validation='usPhone') }}
{{ TextInput(phone_number, placeholder=placeholder_phone, validation='usPhone', optional=phone_optional) }}
</div>
<div class='phone-input__extension'>
{{ TextInput(phone_ext, validation='phoneExt')}}
{{ TextInput(phone_ext, validation='phoneExt', optional=extension_optional) }}
</div>
</div>
{%- endmacro %}

4
templates/components/text_input.html
View File

@ -17,8 +17,7 @@
optional=True,
showLabel=True,
watch=False,
show_validation=True,
inset_form=False) -%}
show_validation=True) -%}
<textinput
v-cloak
@ -29,7 +28,6 @@
{% if initial_value or field.data is not none %}initial-value='{{ initial_value or field.data }}'{% endif %}
{% if field.errors %}v-bind:initial-errors='{{ field.errors | list }}'{% endif %}
v-bind:optional={{ optional|lower }}
v-bind:inset-form={{ inset_form|lower }}
key='{{ field.name }}'
:watch='{{ watch | string | lower }}'
inline-template>

8
templates/fragments/edit_user_form.html
View File

@ -11,16 +11,16 @@
<div class='panel__content'>
<div class='form-row'>
<div class='form-col form-col--half'>
{{ TextInput(form.first_name, validation='requiredField') }}
{{ TextInput(form.first_name, validation='requiredField', optional=False) }}
</div>
<div class='form-col form-col--half'>
{{ TextInput(form.last_name, validation='requiredField') }}
{{ TextInput(form.last_name, validation='requiredField', optional=False) }}
</div>
</div>
{{ TextInput(form.email, validation='email') }}
{{ PhoneInput(form.phone_number, form.phone_ext) }}
{{ TextInput(form.email, validation='email', optional=False) }}
{{ PhoneInput(form.phone_number, form.phone_ext, phone_optional=False) }}
{{ OptionsInput(form.service_branch) }}
{{ OptionsInput(form.citizenship) }}

2
templates/portfolios/admin.html
View File

@ -17,7 +17,7 @@
{{ portfolio_form.csrf_token }}
<div class='form-row'>
<div class='form-col form-col--half'>
{{ TextInput(portfolio_form.name, validation="portfolioName", inset_form=True) }}
{{ TextInput(portfolio_form.name, validation="portfolioName") }}
</div>
<div class='edit-portfolio-name action-group'>
{{ SaveButton(text='Save', additional_classes='usa-button-big') }}

4
templates/portfolios/applications/settings.html
View File

@ -25,8 +25,8 @@
</p>
<div class="form-row">
<div class="form-col form-col--two-thirds">
{{ TextInput(application_form.name, inset_form=True) }}
{{ TextInput(application_form.description, paragraph=True, inset_form=True) }}
{{ TextInput(application_form.name) }}
{{ TextInput(application_form.description, paragraph=True) }}
</div>
<div class="form-col form-col--third">
{% if user_can(permissions.DELETE_APPLICATION) %}