Merge pull request #1123 from dod-ccpo/add-test-templates-gitignore
Ignore js/test_templates
This commit is contained in:
commit
6619c77df5
3
.gitignore
vendored
3
.gitignore
vendored
@ -67,3 +67,6 @@ atst-overrides.ini
|
||||
|
||||
# binary file created by celery beat
|
||||
celerybeat-schedule
|
||||
|
||||
# templates created for JS tests
|
||||
js/test_templates
|
||||
|
@ -1,21 +0,0 @@
|
||||
<checkboxinput
|
||||
name='datafield'
|
||||
inline-template
|
||||
key='datafield'
|
||||
v-bind:initial-checked='initialvalue'
|
||||
v-bind:optional=false
|
||||
>
|
||||
<div>
|
||||
<div class='usa-input ' v-bind:class="[{ 'checked': isChecked }]">
|
||||
|
||||
<fieldset data-ally-disabled="true" v-on:change="onInput" class="usa-input__choices ">
|
||||
<legend>
|
||||
<input checked id="datafield" name="datafield" type="checkbox" v-model="isChecked" value="initialvalue">
|
||||
<label for="datafield">initialvalue value</label>
|
||||
|
||||
|
||||
</legend>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
</checkboxinput>
|
@ -1,601 +0,0 @@
|
||||
|
||||
<clin-fields
|
||||
|
||||
v-bind:initial-clin-index='0'
|
||||
v-bind:initial-total='0'
|
||||
v-bind:initial-obligated='0'
|
||||
v-bind:initial-start-date="'None'"
|
||||
v-bind:initial-end-date="'None'"
|
||||
v-bind:initial-clin-number="'None'"
|
||||
|
||||
v-bind:contract-start="'2019-09-14'"
|
||||
v-bind:contract-end="'2022-09-14'"
|
||||
inline-template>
|
||||
<div class="clin-card" v-if="showClin">
|
||||
<div class="card__title">
|
||||
<span class="h4" v-html='clinTitle'></span>
|
||||
<button
|
||||
v-if='clinIndex > 0'
|
||||
class="icon-link icon-link__remove-clin"
|
||||
v-on:click="openModal(removeModalId)"
|
||||
type="button">
|
||||
|
||||
<span class="icon icon--x " aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M2 2l12 12M14 15c-.256 0-.512-.098-.707-.293l-12-12c-.391-.391-.391-1.023 0-1.414s1.023-.391 1.414 0l12 12c.391.391.391 1.023 0 1.414-.195.195-.451.293-.707.293zm0-13L2 14"/><path d="M2 15c-.256 0-.512-.098-.707-.293-.391-.391-.391-1.023 0-1.414l12-12c.391-.391 1.023-.391 1.414 0s.391 1.023 0 1.414l-12 12C2.512 14.902 2.256 15 2 15z"/></svg>
|
||||
</span>
|
||||
|
||||
</button>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="form-row">
|
||||
<div class="h4 clin-card__title">
|
||||
CLIN Details
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
|
||||
<textinput
|
||||
v-cloak
|
||||
name='number'
|
||||
validation='anything'
|
||||
|
||||
|
||||
|
||||
|
||||
v-bind:optional=false
|
||||
key='number'
|
||||
:watch='true'
|
||||
inline-template>
|
||||
|
||||
<div
|
||||
class=' '
|
||||
v-bind:class="['usa-input usa-input--validation--' + validation, { 'usa-input--error': showError, 'usa-input--success': showValid, 'usa-input--validation--paragraph': paragraph, 'no-max-width': noMaxWidth }]">
|
||||
|
||||
|
||||
<label for=number>
|
||||
<div class="usa-input__title">
|
||||
CLIN
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<span v-show='showError'>
|
||||
<span class="icon icon--alert icon-validation" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span v-show='showValid'>
|
||||
<span class="icon icon--ok icon-validation" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
</span>
|
||||
|
||||
|
||||
</label>
|
||||
|
||||
|
||||
|
||||
|
||||
<masked-input
|
||||
v-on:input='onInput'
|
||||
v-on:blur='onBlur'
|
||||
v-on:change='onChange'
|
||||
v-bind:value='value'
|
||||
v-bind:mask='mask'
|
||||
v-bind:pipe='pipe'
|
||||
v-bind:keep-char-positions='keepCharPositions'
|
||||
v-bind:aria-invalid='showError'
|
||||
type='text'
|
||||
|
||||
id='number'
|
||||
|
||||
ref='input'
|
||||
placeholder=''>
|
||||
</masked-input>
|
||||
|
||||
|
||||
|
||||
<input
|
||||
type='hidden'
|
||||
v-bind:value='rawValue'
|
||||
|
||||
name='number'
|
||||
|
||||
/>
|
||||
|
||||
|
||||
<template v-if='showError'>
|
||||
<span class='usa-input__message' v-html='validationError'></span>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span class='usa-input__message'></span>
|
||||
</template>
|
||||
|
||||
|
||||
</div>
|
||||
</textinput>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
|
||||
<optionsinput
|
||||
name='jedi_clin_type'
|
||||
inline-template
|
||||
|
||||
|
||||
key='jedi_clin_type'
|
||||
v-bind:watch='true'
|
||||
v-bind:optional=false
|
||||
v-bind:null-option="'None'"
|
||||
>
|
||||
<div
|
||||
v-bind:class="['usa-input', { 'usa-input--error': showError, 'usa-input--success': showValid }]">
|
||||
|
||||
<fieldset data-ally-disabled="true" v-on:change="onInput" class="usa-input__choices ">
|
||||
|
||||
<legend>
|
||||
<div class="usa-input__title-inline">
|
||||
Corresponding IDIQ CLIN
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</legend>
|
||||
|
||||
|
||||
<select id="jedi_clin_type" name="jedi_clin_type"><option value="JEDI_CLIN_1">IaaS/PaaS (IDIQ CLIN 0001)</option><option value="JEDI_CLIN_2">IDIQ CLIN 0002</option><option value="JEDI_CLIN_3">IDIQ CLIN 0003</option><option value="JEDI_CLIN_4">IDIQ CLIN 0004</option></select>
|
||||
|
||||
<template v-if='showError'>
|
||||
<span class='usa-input__message' v-html='validationError'></span>
|
||||
</template>
|
||||
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
</optionsinput>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="form-row">
|
||||
<div class="h4 clin-card__title">
|
||||
CLIN Funding
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<clindollaramount
|
||||
v-cloak
|
||||
inline-template
|
||||
|
||||
:funding-valid='true'
|
||||
|
||||
|
||||
name='total_amount'
|
||||
|
||||
|
||||
key='total_amount'
|
||||
|
||||
|
||||
validation="clinDollars"
|
||||
:watch='true'>
|
||||
<div v-bind:class="['usa-input usa-input--validation--dollars', { 'usa-input--error': showFundingError, 'usa-input--success': showFundingValid}]">
|
||||
|
||||
<label for='total_amount'>
|
||||
|
||||
|
||||
|
||||
<div class="usa-input__title">Total CLIN Value</div>
|
||||
|
||||
<span v-show='showFundingError'>
|
||||
<span class="icon icon--alert icon-validation" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span v-show='showFundingValid'>
|
||||
<span class="icon icon--ok icon-validation" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<masked-input
|
||||
v-on:input='onInput'
|
||||
v-on:blur='onBlur'
|
||||
v-on:change='onChange'
|
||||
v-bind:value='value'
|
||||
v-bind:mask='mask'
|
||||
v-bind:pipe='pipe'
|
||||
v-bind:keep-char-positions='keepCharPositions'
|
||||
v-bind:aria-invalid='showError'
|
||||
type='text'
|
||||
:id='name'
|
||||
ref='input'>
|
||||
</masked-input>
|
||||
|
||||
<input type='hidden' v-bind:value='rawValue' :name='name' />
|
||||
<template v-if='!fundingValid'>
|
||||
<span class='usa-input__message'>Obligated amount must be less than or equal to total amount</span>
|
||||
</template>
|
||||
<template v-else-if='showError'>
|
||||
<span class='usa-input__message' v-html='validationError'></span>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span class='usa-input__message'></span>
|
||||
</template>
|
||||
</div>
|
||||
</clindollaramount>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<clindollaramount
|
||||
v-cloak
|
||||
inline-template
|
||||
|
||||
:funding-valid='fundingValid'
|
||||
|
||||
|
||||
name='obligated_amount'
|
||||
|
||||
|
||||
key='obligated_amount'
|
||||
|
||||
|
||||
validation="clinDollars"
|
||||
:watch='true'>
|
||||
<div v-bind:class="['usa-input usa-input--validation--dollars', { 'usa-input--error': showFundingError, 'usa-input--success': showFundingValid}]">
|
||||
|
||||
<label for='obligated_amount'>
|
||||
|
||||
|
||||
|
||||
<div class="usa-input__title">Obligated Funds</div>
|
||||
|
||||
<span v-show='showFundingError'>
|
||||
<span class="icon icon--alert icon-validation" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span v-show='showFundingValid'>
|
||||
<span class="icon icon--ok icon-validation" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<masked-input
|
||||
v-on:input='onInput'
|
||||
v-on:blur='onBlur'
|
||||
v-on:change='onChange'
|
||||
v-bind:value='value'
|
||||
v-bind:mask='mask'
|
||||
v-bind:pipe='pipe'
|
||||
v-bind:keep-char-positions='keepCharPositions'
|
||||
v-bind:aria-invalid='showError'
|
||||
type='text'
|
||||
:id='name'
|
||||
ref='input'>
|
||||
</masked-input>
|
||||
|
||||
<input type='hidden' v-bind:value='rawValue' :name='name' />
|
||||
<template v-if='!fundingValid'>
|
||||
<span class='usa-input__message'>Obligated amount must be less than or equal to total amount</span>
|
||||
</template>
|
||||
<template v-else-if='showError'>
|
||||
<span class='usa-input__message' v-html='validationError'></span>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span class='usa-input__message'></span>
|
||||
</template>
|
||||
</div>
|
||||
</clindollaramount>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="h5 clin-card__title">Percent Obligated</div>
|
||||
<p id="percent-obligated" v-html='percentObligated'></p>
|
||||
|
||||
<hr>
|
||||
<div class="form-row">
|
||||
<div class="h4 clin-card__title">
|
||||
Period of Performance
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<pop-date-range
|
||||
initial-min-start-date="2019-09-14"
|
||||
initial-max-end-date="2022-09-14"
|
||||
|
||||
v-bind:clin-index="clinIndex"
|
||||
|
||||
|
||||
initial-start-date="None"
|
||||
|
||||
|
||||
initial-end-date="None"
|
||||
|
||||
inline-template>
|
||||
|
||||
<div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<date-selector
|
||||
:mindate="initialMinStartDate"
|
||||
:maxdate="maxStartProp"
|
||||
:minrange='initialMinStartDate'
|
||||
:maxrange='initialMaxEndDate'
|
||||
|
||||
name-tag='start_date'
|
||||
initialmonth=""
|
||||
initialday=""
|
||||
initialyear=""
|
||||
|
||||
:optional='false'
|
||||
v-on:date-change='handleDateChange'
|
||||
inline-template>
|
||||
|
||||
<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">
|
||||
Start Date
|
||||
</div>
|
||||
|
||||
<p class='usa-input__help'>
|
||||
For example: 07 04 1776
|
||||
</p>
|
||||
|
||||
<div v-if='outsideRange && !minError' class="usa-input-error-message">
|
||||
PoP start date must be before or on September 14, 2022.
|
||||
</div>
|
||||
<div v-if='minError' class="usa-input-error-message">
|
||||
PoP start date must be on or after September 14, 2019.
|
||||
</div>
|
||||
<div v-if='maxError && !outsideRange' class="usa-input-error-message">
|
||||
PoP start date must be before end date.
|
||||
</div>
|
||||
</legend>
|
||||
|
||||
<div class="date-picker-component">
|
||||
<input :name="name" v-bind:value="formattedDate" v-on:change="onInput" type="hidden" />
|
||||
|
||||
<div class="usa-form-group usa-form-group-month">
|
||||
<label>Month</label>
|
||||
<input
|
||||
name="date-month"
|
||||
max="12"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (month && !isMonthValid) }"
|
||||
v-model="month"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-day">
|
||||
<label>Day</label>
|
||||
<input
|
||||
name="date-day"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (day && !isDayValid) }"
|
||||
v-bind:max="daysMaxCalculation"
|
||||
v-model="day"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-year">
|
||||
<label>Year</label>
|
||||
<input
|
||||
name="date-year"
|
||||
maxlength="4"
|
||||
type="number"
|
||||
v-model="year"
|
||||
max="2022"
|
||||
min="2019"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
|
||||
<span class="icon icon--ok icon--green" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
|
||||
</div>
|
||||
<div class="usa-form-group-date-ok" v-else>
|
||||
|
||||
<span class="icon icon--alert icon--red" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</date-selector>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<date-selector
|
||||
:mindate="minEndProp"
|
||||
:maxdate="initialMaxEndDate"
|
||||
:minrange='initialMinStartDate'
|
||||
:maxrange='initialMaxEndDate'
|
||||
|
||||
name-tag='end_date'
|
||||
initialmonth=""
|
||||
initialday=""
|
||||
initialyear=""
|
||||
|
||||
:optional='false'
|
||||
v-on:date-change='handleDateChange'
|
||||
inline-template>
|
||||
|
||||
<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">
|
||||
End Date
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class='usa-alert usa-alert-info' role='alert' aria-live='polite'>
|
||||
|
||||
<div class='usa-alert-body'>
|
||||
|
||||
|
||||
|
||||
<p class='usa-alert-text'>
|
||||
A CLIN's period of performance must end before September 14, 2022.
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class='usa-input__help'>
|
||||
For example: 07 04 1776
|
||||
</p>
|
||||
|
||||
<div v-if='outsideRange && !maxError' class="usa-input-error-message">
|
||||
PoP end date must be after or on September 14, 2019.
|
||||
</div>
|
||||
<div v-if='minError && !outsideRange' class="usa-input-error-message">
|
||||
PoP start date must be before end date.
|
||||
</div>
|
||||
<div v-if='maxError' class="usa-input-error-message">
|
||||
PoP end date must be before or on September 14, 2022.
|
||||
</div>
|
||||
</legend>
|
||||
|
||||
<div class="date-picker-component">
|
||||
<input :name="name" v-bind:value="formattedDate" v-on:change="onInput" type="hidden" />
|
||||
|
||||
<div class="usa-form-group usa-form-group-month">
|
||||
<label>Month</label>
|
||||
<input
|
||||
name="date-month"
|
||||
max="12"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (month && !isMonthValid) }"
|
||||
v-model="month"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-day">
|
||||
<label>Day</label>
|
||||
<input
|
||||
name="date-day"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (day && !isDayValid) }"
|
||||
v-bind:max="daysMaxCalculation"
|
||||
v-model="day"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-year">
|
||||
<label>Year</label>
|
||||
<input
|
||||
name="date-year"
|
||||
maxlength="4"
|
||||
type="number"
|
||||
v-model="year"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
|
||||
<span class="icon icon--ok icon--green" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
|
||||
</div>
|
||||
<div class="usa-form-group-date-ok" v-else>
|
||||
|
||||
<span class="icon icon--alert icon--red" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</date-selector>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</pop-date-range>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div v-show="$root.activeModal === removeModalId" v-cloak>
|
||||
<div :id='"modal--" + removeModalId' class='modal modal--dismissable'>
|
||||
<div class='modal__container'>
|
||||
<div class='modal__dialog' role='dialog' aria-modal='true'>
|
||||
<div class='modal__body'>
|
||||
<div class="task-order__modal-cancel">
|
||||
<h1 v-html='"Do you want to remove " + clinTitle + "?"'></h1>
|
||||
<div class="task-order__modal-cancel_buttons">
|
||||
<button
|
||||
v-on:click='closeModal(removeModalId)'
|
||||
class="usa-button usa-button-primary"
|
||||
type="button">
|
||||
No, go back
|
||||
</button>
|
||||
<button
|
||||
v-on:click="removeClin()"
|
||||
class="usa-button usa-button-primary"
|
||||
type="button">
|
||||
Yes, remove CLIN
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type='button' class='icon-link modal__dismiss' v-on:click='closeModal(removeModalId)'>
|
||||
|
||||
<span class="icon icon--x " aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M2 2l12 12M14 15c-.256 0-.512-.098-.707-.293l-12-12c-.391-.391-.391-1.023 0-1.414s1.023-.391 1.414 0l12 12c.391.391.391 1.023 0 1.414-.195.195-.451.293-.707.293zm0-13L2 14"/><path d="M2 15c-.256 0-.512-.098-.707-.293-.391-.391-.391-1.023 0-1.414l12-12c.391-.391 1.023-.391 1.414 0s.391 1.023 0 1.414l-12 12C2.512 14.902 2.256 15 2 15z"/></svg>
|
||||
</span>
|
||||
|
||||
<span>
|
||||
Close
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</clin-fields>
|
@ -1,245 +0,0 @@
|
||||
|
||||
|
||||
|
||||
<pop-date-range
|
||||
initial-min-start-date="2019-09-14"
|
||||
initial-max-end-date="2022-09-14"
|
||||
|
||||
v-bind:clin-index="1"
|
||||
|
||||
|
||||
initial-start-date="None"
|
||||
|
||||
|
||||
initial-end-date="None"
|
||||
|
||||
inline-template>
|
||||
|
||||
<div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<date-selector
|
||||
:mindate="initialMinStartDate"
|
||||
:maxdate="maxStartProp"
|
||||
:minrange='initialMinStartDate'
|
||||
:maxrange='initialMaxEndDate'
|
||||
|
||||
name-tag='start_date'
|
||||
initialmonth=""
|
||||
initialday=""
|
||||
initialyear=""
|
||||
|
||||
:optional='true'
|
||||
v-on:date-change='handleDateChange'
|
||||
inline-template>
|
||||
|
||||
<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">
|
||||
Start Date
|
||||
</div>
|
||||
|
||||
<p class='usa-input__help'>
|
||||
For example: 07 04 1776
|
||||
</p>
|
||||
|
||||
<div v-if='outsideRange && !minError' class="usa-input-error-message">
|
||||
PoP start date must be before or on September 14, 2022.
|
||||
</div>
|
||||
<div v-if='minError' class="usa-input-error-message">
|
||||
PoP start date must be on or after September 14, 2019.
|
||||
</div>
|
||||
<div v-if='maxError && !outsideRange' class="usa-input-error-message">
|
||||
PoP start date must be before end date.
|
||||
</div>
|
||||
</legend>
|
||||
|
||||
<div class="date-picker-component">
|
||||
<input :name="name" v-bind:value="formattedDate" v-on:change="onInput" type="hidden" />
|
||||
|
||||
<div class="usa-form-group usa-form-group-month">
|
||||
<label>Month</label>
|
||||
<input
|
||||
name="date-month"
|
||||
max="12"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (month && !isMonthValid) }"
|
||||
v-model="month"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-day">
|
||||
<label>Day</label>
|
||||
<input
|
||||
name="date-day"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (day && !isDayValid) }"
|
||||
v-bind:max="daysMaxCalculation"
|
||||
v-model="day"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-year">
|
||||
<label>Year</label>
|
||||
<input
|
||||
name="date-year"
|
||||
maxlength="4"
|
||||
type="number"
|
||||
v-model="year"
|
||||
max="2022"
|
||||
min="2019"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
|
||||
<span class="icon icon--ok icon--green" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
|
||||
</div>
|
||||
<div class="usa-form-group-date-ok" v-else>
|
||||
|
||||
<span class="icon icon--alert icon--red" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</date-selector>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<date-selector
|
||||
:mindate="minEndProp"
|
||||
:maxdate="initialMaxEndDate"
|
||||
:minrange='initialMinStartDate'
|
||||
:maxrange='initialMaxEndDate'
|
||||
|
||||
name-tag='end_date'
|
||||
initialmonth=""
|
||||
initialday=""
|
||||
initialyear=""
|
||||
|
||||
:optional='true'
|
||||
v-on:date-change='handleDateChange'
|
||||
inline-template>
|
||||
|
||||
<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">
|
||||
End Date
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class='usa-alert usa-alert-info' role='alert' aria-live='polite'>
|
||||
|
||||
<div class='usa-alert-body'>
|
||||
|
||||
|
||||
|
||||
<p class='usa-alert-text'>
|
||||
A CLIN's period of performance must end before September 14, 2022.
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class='usa-input__help'>
|
||||
For example: 07 04 1776
|
||||
</p>
|
||||
|
||||
<div v-if='outsideRange && !maxError' class="usa-input-error-message">
|
||||
PoP end date must be after or on September 14, 2019.
|
||||
</div>
|
||||
<div v-if='minError && !outsideRange' class="usa-input-error-message">
|
||||
PoP start date must be before end date.
|
||||
</div>
|
||||
<div v-if='maxError' class="usa-input-error-message">
|
||||
PoP end date must be before or on September 14, 2022.
|
||||
</div>
|
||||
</legend>
|
||||
|
||||
<div class="date-picker-component">
|
||||
<input :name="name" v-bind:value="formattedDate" v-on:change="onInput" type="hidden" />
|
||||
|
||||
<div class="usa-form-group usa-form-group-month">
|
||||
<label>Month</label>
|
||||
<input
|
||||
name="date-month"
|
||||
max="12"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (month && !isMonthValid) }"
|
||||
v-model="month"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-day">
|
||||
<label>Day</label>
|
||||
<input
|
||||
name="date-day"
|
||||
maxlength="2"
|
||||
min="1"
|
||||
type="number"
|
||||
v-bind:class="{ 'usa-input-error': (day && !isDayValid) }"
|
||||
v-bind:max="daysMaxCalculation"
|
||||
v-model="day"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="usa-form-group usa-form-group-year">
|
||||
<label>Year</label>
|
||||
<input
|
||||
name="date-year"
|
||||
maxlength="4"
|
||||
type="number"
|
||||
v-model="year"
|
||||
v-on:change="onInput"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
|
||||
<span class="icon icon--ok icon--green" aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
|
||||
</div>
|
||||
<div class="usa-form-group-date-ok" v-else>
|
||||
|
||||
<span class="icon icon--alert icon--red" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="#fdb81e">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"/>
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</date-selector>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</pop-date-range>
|
@ -1,375 +0,0 @@
|
||||
<to-form inline-template="">
|
||||
<form action="/task_orders//form/step_3" autocomplete="off" enctype="multipart/form-data" id="to_form" method="POST">
|
||||
<div class="sticky-cta" v-sticky='{ "stickyBitStickyOffset": 76 }'>
|
||||
<div class="sticky-cta-container">
|
||||
<div class="sticky-cta-text">
|
||||
<h3>Add Task Order (step 3 of 5)</h3>
|
||||
</div>
|
||||
<div class="sticky-cta-buttons">
|
||||
<span class="action-group">
|
||||
<input :disabled="!canSave" class="usa-button usa-button-primary" form="to_form" tabindex="0" type="submit" value="Next: Review Task Order"/>
|
||||
<a class="usa-button usa-button-secondary" href="/task_orders//form/step_2">
|
||||
Previous
|
||||
</a>
|
||||
<a class="action-group__action icon-link" v-on:click="openModal('cancel')">
|
||||
Cancel
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-cloak="" v-show="$root.activeModal === 'cancel'">
|
||||
<div class="modal modal--dismissable" id="modal--cancel">
|
||||
<div class="modal__container">
|
||||
<div aria-modal="true" class="modal__dialog" role="dialog">
|
||||
<div class="modal__body">
|
||||
<!-- Use these elements in caller for modal to be styled properly -->
|
||||
<!-- h1 for header text -->
|
||||
<!-- hr -->
|
||||
<!-- div class='action-group' for buttons -->
|
||||
<div class="task-order__modal-cancel">
|
||||
<h1>Do you want to save this draft?</h1>
|
||||
<div class="action-group">
|
||||
<button class="usa-button usa-button-primary" formaction="/portfolios/e4edf994-04f4-4aaa-ba30-39507e1068a8/task_orders/form/cancel?save=False" type="submit">No, delete it</button>
|
||||
<button class="usa-button usa-button-primary" formaction="/portfolios/e4edf994-04f4-4aaa-ba30-39507e1068a8/task_orders/form/cancel?save=True" type="submit">Yes, save for later</button>
|
||||
</div>
|
||||
</div>
|
||||
<button class="icon-link modal__dismiss" type="button" v-on:click='closeModal("cancel")'>
|
||||
<span aria-hidden="true" class="icon icon--x"><svg viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M2 2l12 12M14 15c-.256 0-.512-.098-.707-.293l-12-12c-.391-.391-.391-1.023 0-1.414s1.023-.391 1.414 0l12 12c.391.391.391 1.023 0 1.414-.195.195-.451.293-.707.293zm0-13L2 14"></path><path d="M2 15c-.256 0-.512-.098-.707-.293-.391-.391-.391-1.023 0-1.414l12-12c.391-.391 1.023-.391 1.414 0s.391 1.023 0 1.414l-12 12C2.512 14.902 2.256 15 2 15z"></path></svg>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="task-order">
|
||||
<div>
|
||||
<div class="task-order__header">
|
||||
<div class="h2">
|
||||
Enter Contract Line Items
|
||||
</div>
|
||||
<p>
|
||||
<strong>Task Order Number:</strong> 1234567890123
|
||||
</p>
|
||||
<p>
|
||||
Refer to your task order to locate your Contract Line Item Numbers (CLINs).
|
||||
</p>
|
||||
</div>
|
||||
<div v-for="clin in clins">
|
||||
<clin-fields inline-template="" v-bind:contract-end="'2022-09-14'" v-bind:contract-start="'2019-09-14'" v-bind:initial-clin-index="clinIndex" v-bind:initial-clin-type="'JEDI_CLIN_1'">
|
||||
<div class="clin-card" v-if="showClin">
|
||||
<div class="card__title">
|
||||
<span class="h4" v-html="clinTitle"></span>
|
||||
<button class="icon-link icon-link__remove-clin" type="button" v-if="clinIndex > 0" v-on:click="openModal(removeModalId)">
|
||||
<span aria-hidden="true" class="icon icon--x"><svg viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M2 2l12 12M14 15c-.256 0-.512-.098-.707-.293l-12-12c-.391-.391-.391-1.023 0-1.414s1.023-.391 1.414 0l12 12c.391.391.391 1.023 0 1.414-.195.195-.451.293-.707.293zm0-13L2 14"></path><path d="M2 15c-.256 0-.512-.098-.707-.293-.391-.391-.391-1.023 0-1.414l12-12c.391-.391 1.023-.391 1.414 0s.391 1.023 0 1.414l-12 12C2.512 14.902 2.256 15 2 15z"></path></svg>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="form-row">
|
||||
<div class="h4 clin-card__title">
|
||||
CLIN Details
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<textinput :name="'clins-' + clinIndex + '-number'" :watch="true" inline-template="">
|
||||
<div v-bind:class="['usa-input usa-input--validation--' + validation, { 'usa-input--error': showError, 'usa-input--success': showValid, 'usa-input--validation--paragraph': paragraph, 'no-max-width': noMaxWidth }]">
|
||||
<label :for="name">
|
||||
<span v-show="showError">
|
||||
<span aria-hidden="true" class="icon icon--alert icon-validation"><svg fill="#fdb81e" viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span v-show="showValid">
|
||||
<span aria-hidden="true" class="icon icon--ok icon-validation"><svg aria-hidden="true" class="svg-inline--fa fa-check-circle fa-w-16" data-icon="check-circle" data-prefix="fas" focusable="false" role="img" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z" fill="currentColor"></path></svg></span>
|
||||
</span>
|
||||
<div class="usa-input__title">CLIN</div>
|
||||
</label>
|
||||
<masked-input :id="name" ref="input" type="text" v-bind:aria-invalid="showError" v-bind:keep-char-positions="keepCharPositions" v-bind:mask="mask" v-bind:pipe="pipe" v-bind:value="value" v-on:blur="onBlur" v-on:change="onChange" v-on:input="onInput">
|
||||
</masked-input>
|
||||
<input :name="name" type="hidden" v-bind:value="rawValue">
|
||||
<template v-if="showError">
|
||||
<span class="usa-input__message" v-html="validationError"></span>
|
||||
</template>
|
||||
<template v-else="">
|
||||
<span class="usa-input__message"></span>
|
||||
</template>
|
||||
</input></div>
|
||||
</textinput>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<optionsinput :name="'clins-' + clinIndex + '-jedi_clin_type'" :optional="false" :watch="true" inline-template="">
|
||||
<div v-bind:class="['usa-input', { 'usa-input--error': showError, 'usa-input--success': showValid }]">
|
||||
<fieldset class="usa-input__choices" data-ally-disabled="true" v-on:change="onInput">
|
||||
<legend>
|
||||
<div class="usa-input__title">
|
||||
Corresponding IDIQ CLIN
|
||||
</div>
|
||||
</legend>
|
||||
<select :id="name" :name="name">
|
||||
<option value="JEDI_CLIN_1">IaaS/PaaS (IDIQ CLIN 0001)</option>
|
||||
<option value="JEDI_CLIN_2">IDIQ CLIN 0002</option>
|
||||
<option value="JEDI_CLIN_3">IDIQ CLIN 0003</option>
|
||||
<option value="JEDI_CLIN_4">IDIQ CLIN 0004</option>
|
||||
</select>
|
||||
</fieldset>
|
||||
</div>
|
||||
</optionsinput>
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
<div class="form-row">
|
||||
<div class="h4 clin-card__title">
|
||||
CLIN Funding
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<clindollaramount :funding-valid="true" :key="'clins-' + clinIndex + '-' + 'total' + '_amount'" :name="'clins-' + clinIndex + '-' + 'total' + '_amount'" :watch="true" inline-template="" v-cloak="" validation="clinDollars">
|
||||
<div v-bind:class="['usa-input usa-input--validation--dollars', { 'usa-input--error': showFundingError, 'usa-input--success': showFundingValid}]">
|
||||
<label :for="name">
|
||||
<div class="usa-input__title">Total CLIN Value</div>
|
||||
<span v-show="showFundingError">
|
||||
<span aria-hidden="true" class="icon icon--alert icon-validation"><svg fill="#fdb81e" viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span v-show="showFundingValid">
|
||||
<span aria-hidden="true" class="icon icon--ok icon-validation"><svg aria-hidden="true" class="svg-inline--fa fa-check-circle fa-w-16" data-icon="check-circle" data-prefix="fas" focusable="false" role="img" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z" fill="currentColor"></path></svg></span>
|
||||
</span>
|
||||
</label>
|
||||
<masked-input :id="name" ref="input" type="text" v-bind:aria-invalid="showError" v-bind:keep-char-positions="keepCharPositions" v-bind:mask="mask" v-bind:pipe="pipe" v-bind:value="value" v-on:blur="onBlur" v-on:change="onChange" v-on:input="onInput">
|
||||
</masked-input>
|
||||
<input :name="name" type="hidden" v-bind:value="rawValue"/>
|
||||
<template v-if="!fundingValid">
|
||||
<span class="usa-input__message">Obligated amount must be less than or equal to total amount</span>
|
||||
</template>
|
||||
<template v-else-if="showError">
|
||||
<span class="usa-input__message" v-html="validationError"></span>
|
||||
</template>
|
||||
<template v-else="">
|
||||
<span class="usa-input__message"></span>
|
||||
</template>
|
||||
</div>
|
||||
</clindollaramount>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<clindollaramount :funding-valid="fundingValid" :key="'clins-' + clinIndex + '-' + 'obligated' + '_amount'" :name="'clins-' + clinIndex + '-' + 'obligated' + '_amount'" :watch="true" inline-template="" v-cloak="" validation="clinDollars">
|
||||
<div v-bind:class="['usa-input usa-input--validation--dollars', { 'usa-input--error': showFundingError, 'usa-input--success': showFundingValid}]">
|
||||
<label :for="name">
|
||||
<div class="usa-input__title">Obligated Funds</div>
|
||||
<span v-show="showFundingError">
|
||||
<span aria-hidden="true" class="icon icon--alert icon-validation"><svg fill="#fdb81e" viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span v-show="showFundingValid">
|
||||
<span aria-hidden="true" class="icon icon--ok icon-validation"><svg aria-hidden="true" class="svg-inline--fa fa-check-circle fa-w-16" data-icon="check-circle" data-prefix="fas" focusable="false" role="img" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z" fill="currentColor"></path></svg></span>
|
||||
</span>
|
||||
</label>
|
||||
<masked-input :id="name" ref="input" type="text" v-bind:aria-invalid="showError" v-bind:keep-char-positions="keepCharPositions" v-bind:mask="mask" v-bind:pipe="pipe" v-bind:value="value" v-on:blur="onBlur" v-on:change="onChange" v-on:input="onInput">
|
||||
</masked-input>
|
||||
<input :name="name" type="hidden" v-bind:value="rawValue"/>
|
||||
<template v-if="!fundingValid">
|
||||
<span class="usa-input__message">Obligated amount must be less than or equal to total amount</span>
|
||||
</template>
|
||||
<template v-else-if="showError">
|
||||
<span class="usa-input__message" v-html="validationError"></span>
|
||||
</template>
|
||||
<template v-else="">
|
||||
<span class="usa-input__message"></span>
|
||||
</template>
|
||||
</div>
|
||||
</clindollaramount>
|
||||
</div>
|
||||
</div>
|
||||
<div class="h5 clin-card__title">Percent Obligated</div>
|
||||
<p id="percent-obligated" v-html="percentObligated"></p>
|
||||
<hr/>
|
||||
<div class="form-row">
|
||||
<div class="h4 clin-card__title">
|
||||
Period of Performance
|
||||
</div>
|
||||
</div>
|
||||
<pop-date-range initial-max-end-date="2022-09-14" initial-min-start-date="2019-09-14" inline-template="" v-bind:clin-index="clinIndex">
|
||||
<div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<date-selector :maxdate="maxStartProp" :maxrange="initialMaxEndDate" :mindate="initialMinStartDate" :minrange="initialMinStartDate" :name-tag="'clins-' + clinIndex + '-start_date'" :optional="false" inline-template="" v-on:date-change="handleDateChange">
|
||||
<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">
|
||||
Start Date
|
||||
</div>
|
||||
<p class="usa-input__help">
|
||||
For example: 07 04 1776
|
||||
</p>
|
||||
<div class="usa-input-error-message" v-if="outsideRange && !minError">
|
||||
PoP start date must be before or on September 14, 2022.
|
||||
</div>
|
||||
<div class="usa-input-error-message" v-if="minError">
|
||||
PoP start date must be on or after September 14, 2019.
|
||||
</div>
|
||||
<div class="usa-input-error-message" v-if="maxError && !outsideRange">
|
||||
PoP start date must be before end date.
|
||||
</div>
|
||||
</legend>
|
||||
<div class="date-picker-component">
|
||||
<input :name="name" type="hidden" v-bind:value="formattedDate" v-on:change="onInput"/>
|
||||
<div class="usa-form-group usa-form-group-month">
|
||||
<label>Month</label>
|
||||
<input max="12" maxlength="2" min="1" name="date-month" type="number" v-bind:class="{ 'usa-input-error': (month && !isMonthValid) }" v-model="month" v-on:change="onInput"/>
|
||||
</div>
|
||||
<div class="usa-form-group usa-form-group-day">
|
||||
<label>Day</label>
|
||||
<input maxlength="2" min="1" name="date-day" type="number" v-bind:class="{ 'usa-input-error': (day && !isDayValid) }" v-bind:max="daysMaxCalculation" v-model="day" v-on:change="onInput"/>
|
||||
</div>
|
||||
<div class="usa-form-group usa-form-group-year">
|
||||
<label>Year</label>
|
||||
<input max="2022" maxlength="4" min="2019" name="date-year" type="number" v-model="year" v-on:change="onInput"/>
|
||||
</div>
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
<span aria-hidden="true" class="icon icon--ok icon--green"><svg aria-hidden="true" class="svg-inline--fa fa-check-circle fa-w-16" data-icon="check-circle" data-prefix="fas" focusable="false" role="img" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z" fill="currentColor"></path></svg></span>
|
||||
</div>
|
||||
<div class="usa-form-group-date-ok" v-else="">
|
||||
<span aria-hidden="true" class="icon icon--alert icon--red"><svg fill="#fdb81e" viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</date-selector>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-col">
|
||||
<date-selector :maxdate="initialMaxEndDate" :maxrange="initialMaxEndDate" :mindate="minEndProp" :minrange="initialMinStartDate" :name-tag="'clins-' + clinIndex + '-end_date'" :optional="false" inline-template="" v-on:date-change="handleDateChange">
|
||||
<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">
|
||||
End Date
|
||||
</div>
|
||||
<div aria-live="polite" class="usa-alert usa-alert-info" role="alert">
|
||||
<div class="usa-alert-body">
|
||||
<p class="usa-alert-text">
|
||||
A CLIN's period of performance must end before September 14, 2022.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="usa-input__help">
|
||||
For example: 07 04 1776
|
||||
</p>
|
||||
<div class="usa-input-error-message" v-if="outsideRange && !maxError">
|
||||
PoP end date must be after or on September 14, 2019.
|
||||
</div>
|
||||
<div class="usa-input-error-message" v-if="minError && !outsideRange">
|
||||
PoP start date must be before end date.
|
||||
</div>
|
||||
<div class="usa-input-error-message" v-if="maxError">
|
||||
PoP end date must be before or on September 14, 2022.
|
||||
</div>
|
||||
</legend>
|
||||
<div class="date-picker-component">
|
||||
<input :name="name" type="hidden" v-bind:value="formattedDate" v-on:change="onInput"/>
|
||||
<div class="usa-form-group usa-form-group-month">
|
||||
<label>Month</label>
|
||||
<input max="12" maxlength="2" min="1" name="date-month" type="number" v-bind:class="{ 'usa-input-error': (month && !isMonthValid) }" v-model="month" v-on:change="onInput"/>
|
||||
</div>
|
||||
<div class="usa-form-group usa-form-group-day">
|
||||
<label>Day</label>
|
||||
<input maxlength="2" min="1" name="date-day" type="number" v-bind:class="{ 'usa-input-error': (day && !isDayValid) }" v-bind:max="daysMaxCalculation" v-model="day" v-on:change="onInput"/>
|
||||
</div>
|
||||
<div class="usa-form-group usa-form-group-year">
|
||||
<label>Year</label>
|
||||
<input maxlength="4" name="date-year" type="number" v-model="year" v-on:change="onInput"/>
|
||||
</div>
|
||||
<div v-if="isDateComplete">
|
||||
<div class="usa-form-group-date-ok" v-if="isDateValid">
|
||||
<span aria-hidden="true" class="icon icon--ok icon--green"><svg aria-hidden="true" class="svg-inline--fa fa-check-circle fa-w-16" data-icon="check-circle" data-prefix="fas" focusable="false" role="img" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z" fill="currentColor"></path></svg></span>
|
||||
</div>
|
||||
<div class="usa-form-group-date-ok" v-else="">
|
||||
<span aria-hidden="true" class="icon icon--alert icon--red"><svg fill="#fdb81e" viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 16c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zM8 2C4.691 2 2 4.691 2 8s2.691 6 6 6 6-2.691 6-6-2.691-6-6-6zm0 8c-.552 0-1-.447-1-1V4c0-.552.448-1 1-1s1 .448 1 1v5c0 .553-.448 1-1 1zm0 3c-.26 0-.52-.11-.71-.29-.18-.19-.29-.45-.29-.71 0-.271.11-.521.29-.71.38-.37 1.05-.37 1.42 0 .18.189.29.45.29.71s-.11.52-.29.71c-.19.18-.45.29-.71.29z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</date-selector>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</pop-date-range>
|
||||
</div>
|
||||
<div v-cloak="" v-show="$root.activeModal === removeModalId">
|
||||
<div :id='"modal--" + removeModalId' class="modal modal--dismissable">
|
||||
<div class="modal__container">
|
||||
<div aria-modal="true" class="modal__dialog" role="dialog">
|
||||
<div class="modal__body">
|
||||
<div class="task-order__modal-cancel">
|
||||
<h1 v-html='"Do you want to remove " + clinTitle + "?"'></h1>
|
||||
<div class="task-order__modal-cancel_buttons">
|
||||
<button class="usa-button usa-button-primary" type="button" v-on:click="closeModal(removeModalId)">
|
||||
No, go back
|
||||
</button>
|
||||
<button class="usa-button usa-button-primary" type="button" v-on:click="removeClin()">
|
||||
Yes, remove CLIN
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<button class="icon-link modal__dismiss" type="button" v-on:click="closeModal(removeModalId)">
|
||||
<span aria-hidden="true" class="icon icon--x"><svg viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M2 2l12 12M14 15c-.256 0-.512-.098-.707-.293l-12-12c-.391-.391-.391-1.023 0-1.414s1.023-.391 1.414 0l12 12c.391.391.391 1.023 0 1.414-.195.195-.451.293-.707.293zm0-13L2 14"></path><path d="M2 15c-.256 0-.512-.098-.707-.293-.391-.391-.391-1.023 0-1.414l12-12c.391-.391 1.023-.391 1.414 0s.391 1.023 0 1.414l-12 12C2.512 14.902 2.256 15 2 15z"></path></svg>
|
||||
</span>
|
||||
<span>
|
||||
Close
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</clin-fields>
|
||||
</div>
|
||||
<button class="icon-link icon-link__add-another-clin" id="add-clin" type="button" v-on:click="addClin">
|
||||
<span aria-hidden="true" class="icon icon--plus"><?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg height="16px" version="1.1" viewbox="0 0 16 16" width="16px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Generator: Sketch 55.2 (78181) - https://sketchapp.com -->
|
||||
<title>UI element / Icons / Plus / White</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<g fill="none" fill-rule="evenodd" id="Wizard_Services" stroke="none" stroke-width="1">
|
||||
<g fill="#0071BC" id="c5-Add-Services" transform="translate(-285.000000, -1059.000000)">
|
||||
<g id="Group-3" transform="translate(285.000000, 1035.000000)">
|
||||
<g id="Group-2" transform="translate(0.000000, 21.000000)">
|
||||
<g id="UI-element-/-Icons-/-Plus-/-White" transform="translate(0.000000, 3.000000)">
|
||||
<g id="Group">
|
||||
<path d="M8,16 C3.589,16 0,12.411 0,8 C0,3.589 3.589,0 8,0 C12.411,0 16,3.589 16,8 C16,12.411 12.411,16 8,16 Z M8,2 C4.691,2 2,4.691 2,8 C2,11.309 4.691,14 8,14 C11.309,14 14,11.309 14,8 C14,4.691 11.309,2 8,2 Z" id="Style"></path>
|
||||
<path d="M8,12 C7.448,12 7,11.4891429 7,10.8571429 L7,5.14285714 C7,4.512 7.448,4 8,4 C8.552,4 9,4.512 9,5.14285714 L9,10.8571429 C9,11.4891429 8.552,12 8,12 Z" id="Path"></path>
|
||||
<path d="M8,12 C7.448,12 7,11.4891429 7,10.8571429 L7,5.14285714 C7,4.512 7.448,4 8,4 C8.552,4 9,4.512 9,5.14285714 L9,10.8571429 C9,11.4891429 8.552,12 8,12 Z" id="Path" transform="translate(8.000000, 8.000000) rotate(-270.000000) translate(-8.000000, -8.000000) "></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg></span>
|
||||
<span>Add another CLIN</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</to-form>
|
@ -1,53 +0,0 @@
|
||||
<uploadinput
|
||||
inline-template
|
||||
|
||||
v-bind:initial-errors='true'
|
||||
|
||||
v-bind:watch='false'
|
||||
v-bind:portfolio-id="''"
|
||||
name='pdf'
|
||||
:optional='false'
|
||||
>
|
||||
<div>
|
||||
<div v-show="hasAttachment" class="uploaded-file">
|
||||
|
||||
<span class="icon icon--ok " aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
|
||||
<a class="uploaded-file__name" v-html="baseName" v-bind:href="downloadLink"></a>
|
||||
<a href="#" class="uploaded-file__remove" v-on:click="removeAttachment">Remove</a>
|
||||
</div>
|
||||
<div v-show="hasAttachment === false" v-bind:class='{ "usa-input": true, "usa-input--error": showErrors }'>
|
||||
|
||||
<p>
|
||||
|
||||
</p>
|
||||
<div v-if="!hideInput" class="upload-widget">
|
||||
<label class="upload-label" for="pdf">
|
||||
<span class="upload-button">
|
||||
Browse
|
||||
</span>
|
||||
</label>
|
||||
<input
|
||||
v-on:change="addAttachment"
|
||||
ref="attachmentInput"
|
||||
accept=""
|
||||
id="pdf"
|
||||
name="pdf"
|
||||
aria-label="Task Order Upload"
|
||||
v-bind:value="attachment"
|
||||
type="file">
|
||||
<input type="hidden" name="pdf-filename" id="pdf-filename" ref="attachmentFilename">
|
||||
<input type="hidden" name="pdf-object_name" id="pdf-object_name" ref="attachmentObjectName">
|
||||
</div>
|
||||
<template v-if="uploadError">
|
||||
<span class="usa-input__message">There was an error uploading your file. Please try again. If you encounter repeated problems uploading this file, please contact CCPO.</span>
|
||||
</template>
|
||||
<template v-if="sizeError">
|
||||
<span class="usa-input__message">The file you have selected is too large. Please choose a file no larger than 64MB.</span>
|
||||
</template>
|
||||
|
||||
<span class="usa-input__message">Test Error Message</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</uploadinput>
|
@ -1,52 +0,0 @@
|
||||
<uploadinput
|
||||
inline-template
|
||||
|
||||
v-bind:filename='filename'
|
||||
v-bind:object-name='objectName'
|
||||
|
||||
v-bind:watch='false'
|
||||
v-bind:portfolio-id="''"
|
||||
name='pdf'
|
||||
:optional='false'
|
||||
>
|
||||
<div>
|
||||
<div v-show="hasAttachment" class="uploaded-file">
|
||||
|
||||
<span class="icon icon--ok " aria-hidden="true"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" class="svg-inline--fa fa-check-circle fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg></span>
|
||||
|
||||
<a class="uploaded-file__name" v-html="baseName" v-bind:href="downloadLink"></a>
|
||||
<a href="#" class="uploaded-file__remove" v-on:click="removeAttachment">Remove</a>
|
||||
</div>
|
||||
<div v-show="hasAttachment === false" v-bind:class='{ "usa-input": true, "usa-input--error": showErrors }'>
|
||||
|
||||
<p>
|
||||
|
||||
</p>
|
||||
<div v-if="!hideInput" class="upload-widget">
|
||||
<label class="upload-label" for="pdf">
|
||||
<span class="upload-button">
|
||||
Browse
|
||||
</span>
|
||||
</label>
|
||||
<input
|
||||
v-on:change="addAttachment"
|
||||
ref="attachmentInput"
|
||||
accept=""
|
||||
id="pdf"
|
||||
name="pdf"
|
||||
aria-label="Task Order Upload"
|
||||
v-bind:value="attachment"
|
||||
type="file">
|
||||
<input type="hidden" name="pdf-filename" id="pdf-filename" ref="attachmentFilename">
|
||||
<input type="hidden" name="pdf-object_name" id="pdf-object_name" ref="attachmentObjectName">
|
||||
</div>
|
||||
<template v-if="uploadError">
|
||||
<span class="usa-input__message">There was an error uploading your file. Please try again. If you encounter repeated problems uploading this file, please contact CCPO.</span>
|
||||
</template>
|
||||
<template v-if="sizeError">
|
||||
<span class="usa-input__message">The file you have selected is too large. Please choose a file no larger than 64MB.</span>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</uploadinput>
|
@ -49,6 +49,7 @@ fi
|
||||
|
||||
if [ "${RUN_JS_TESTS}" = "true" ]; then
|
||||
output_divider "Render Vue components"
|
||||
mkdir js/test_templates | true
|
||||
run_python_render_vue_component
|
||||
output_divider "Run JavaScript unit test suite"
|
||||
run_javascript_tests
|
||||
|
Loading…
x
Reference in New Issue
Block a user