Add funding validation to clinfields vue component

This commit is contained in:
graham-dds 2019-09-11 10:19:01 -04:00
parent 257fe648a8
commit bf19add617

View File

@ -6,7 +6,10 @@ import { emitEvent } from '../lib/emitters'
import Modal from '../mixins/modal'
import optionsinput from './options_input'
import textinput from './text_input'
import clindollaramount from './clin_dollar_amount'
const TOTAL_AMOUNT = 'total_amount'
const OBLIGATED_AMOUNT = 'obligated_amount'
const START_DATE = 'start_date'
const END_DATE = 'end_date'
const POP = 'period_of_performance'
@ -19,12 +22,21 @@ export default {
DateSelector,
optionsinput,
textinput,
clindollaramount,
},
mixins: [Modal],
props: {
initialClinIndex: Number,
initialTotal: {
type: Number,
default: 0,
},
initialObligated: {
type: Number,
default: 0,
},
initialStartDate: {
type: String,
default: null,
@ -54,6 +66,10 @@ export default {
const end = !!this.initialEndDate
? new Date(this.initialEndDate)
: undefined
const fundingValidation =
this.initialObligated && this.initialTotal
? false
: this.initialObligated <= this.initialTotal
const popValidation = !this.initialStartDate ? false : start < end
const clinNumber = !!this.initialClinNumber
? this.initialClinNumber
@ -63,6 +79,7 @@ export default {
return {
clinIndex: this.initialClinIndex,
clinNumber: clinNumber,
startDate: start,
endDate: end,
popValid: popValidation,
@ -93,6 +110,9 @@ export default {
)}.`,
},
],
totalAmount: this.initialTotal || 0,
obligatedAmount: this.initialObligated || 0,
fundingValid: fundingValidation,
}
},
@ -101,14 +121,37 @@ export default {
},
created: function() {
emitEvent('clin-change', this, {
id: this._uid,
obligatedAmount: this.initialObligated,
totalAmount: this.initialTotal,
})
emitEvent('field-mount', this, {
optional: false,
name: 'clins-' + this.clinIndex + '-' + POP,
valid: this.checkPopValid(),
})
emitEvent('field-mount', this, {
optional: false,
name: TOTAL_AMOUNT,
valid: this.checkFundingValid(),
})
emitEvent('field-mount', this, {
optional: false,
name: OBLIGATED_AMOUNT,
valid: this.checkFundingValid(),
})
},
methods: {
clinChangeEvent: function() {
emitEvent('clin-change', this, {
id: this._uid,
obligatedAmount: this.initialObligated,
totalAmount: this.initialTotal,
})
},
checkPopValid: function() {
return (
this.popDateOrder() &&
@ -153,9 +196,30 @@ export default {
return true
},
checkFundingValid: function() {
return this.obligatedAmount <= this.totalAmount
},
validateFunding: function() {
if (this.totalAmount && this.obligatedAmount) {
this.fundingValid = this.checkFundingValid()
}
emitEvent('field-change', this, {
name: OBLIGATED_AMOUNT,
valid: this.checkFundingValid(),
})
},
handleFieldChange: function(event) {
if (this._uid === event.parent_uid) {
if (event.name.includes(START_DATE)) {
if (event.name.includes(TOTAL_AMOUNT)) {
this.totalAmount = parseFloat(event.value)
this.validateFunding()
} else if (event.name.includes(OBLIGATED_AMOUNT)) {
this.obligatedAmount = parseFloat(event.value)
this.validateFunding()
} else if (event.name.includes(START_DATE)) {
if (!!event.value) this.startDate = new Date(event.value)
if (!!event.valid) this.startDateValid = event.valid
this.validatePop()
@ -186,6 +250,10 @@ export default {
return `CLIN`
}
},
percentObligated: function() {
const percentage = (this.obligatedAmount / this.totalAmount) * 100
return !!percentage ? `${percentage.toFixed(1)}%` : '0%'
},
removeModalId: function() {
return `remove-clin-${this.clinIndex}`