Use date-selector component to display errors related to date fields

This commit is contained in:
leigh-mil
2019-09-24 14:18:21 -04:00
parent e26edcd1bb
commit 53cef32af5
4 changed files with 66 additions and 5 deletions

View File

@@ -135,11 +135,6 @@
{% else %}
{{ PopDateRange(watch=True, optional=False, mindate=contract_start | dateFromString(formatter="%Y-%m-%d"), maxdate=contract_end | dateFromString(formatter="%Y-%m-%d")) }}
{% endif %}
<div class="form-row">
<div class="usa-input-error-message form-has-errors">
<p v-for="error in popErrors" :key="error" v-html='error'></p>
</div>
</div>
</div>
<div v-show="$root.activeModal === removeModalId" v-cloak>

View File

@@ -41,6 +41,13 @@
<p class='usa-input__help'>
{{ "task_orders.form.pop_example" | translate | safe }}
</p>
<div v-if='minError' class="usa-input-error-message">
PoP start date must be on or after {{ mindate | formattedDate(formatter="%B %d, %Y") }}.
</div>
<div v-if='maxError' class="usa-input-error-message">
PoP start date must be before end date.
</div>
</legend>
<div class="date-picker-component">
@@ -130,6 +137,13 @@
<p class='usa-input__help'>
{{ 'task_orders.form.pop_example' | translate }}
</p>
<div v-if='minError' class="usa-input-error-message">
PoP end date must be after start date.
</div>
<div v-if='maxError' class="usa-input-error-message">
PoP end date must be on or after {{ maxdate | formattedDate(formatter="%B %d, %Y") }}.
</div>
</legend>
<div class="date-picker-component">