Show validation icon only if the date is complete
This commit is contained in:
@@ -21,7 +21,7 @@
|
||||
:optional='{{ optional | string | lower }}'
|
||||
inline-template>
|
||||
|
||||
<fieldset class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && showValidation }">
|
||||
<fieldset class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && isDateComplete }">
|
||||
<legend>
|
||||
<div class="usa-input__title">
|
||||
{{ label }}
|
||||
@@ -83,7 +83,7 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="showValidation">
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
{{ Icon("ok", classes="icon--green") }}
|
||||
</div>
|
||||
|
@@ -36,7 +36,7 @@
|
||||
:optional='{{ optional | string | lower }}'
|
||||
inline-template>
|
||||
|
||||
<fieldset :name="name" class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && showValidation, 'usa-input--error': !isDateValid && showValidation }">
|
||||
<fieldset :name="name" class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && isDateComplete, 'usa-input--error': !isDateValid && isDateComplete }">
|
||||
<legend>
|
||||
<div class="usa-input__title">
|
||||
{{ "task_orders.form.pop_start" | translate }}
|
||||
@@ -99,7 +99,7 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="showValidation">
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
{{ Icon("ok", classes="icon--green") }}
|
||||
</div>
|
||||
@@ -130,7 +130,7 @@
|
||||
:optional='{{ optional | string | lower }}'
|
||||
inline-template>
|
||||
|
||||
<fieldset :name="name" class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && showValidation, 'usa-input--error': !isDateValid && showValidation }">
|
||||
<fieldset :name="name" class="usa-input date-picker" v-bind:class="{ 'usa-input--success': isDateValid && isDateComplete, 'usa-input--error': !isDateValid && isDateComplete }">
|
||||
<legend>
|
||||
<div class="usa-input__title">
|
||||
{{ 'task_orders.form.pop_end' | translate }}
|
||||
@@ -192,7 +192,7 @@
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div v-if="showValidation">
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
{{ Icon("ok", classes="icon--green") }}
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user