jason/DigitalConsumer.ISS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

error messages for license plate and zip input, start of validation rules

Browse source
This commit is contained in:
Kroell 2023-01-03 11:11:33 -05:00
parent 2a2df2b276
commit 928f9fd4c1
1 changed files with 28 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
src/layouts/license-plate-lookup/license-plate-lookup.vue
View file

@ -15,7 +15,8 @@
cmsWidgetName="LicensePlateNumberQuestionWidget" cmsWidgetName="LicensePlateNumberQuestionWidget"
v-model="licensePlate" v-model="licensePlate"
isRequired isRequired
disableAutoFill /> disableAutoFill
validationRules="license-plate-required" />
</div> </div>
<div class="mt-4"> <div class="mt-4">
<textboxQuestion <textboxQuestion
@ -23,12 +24,14 @@
cmsWidgetName="RegistrationZipQuestionWidget" cmsWidgetName="RegistrationZipQuestionWidget"
v-model="registrationZipCode" v-model="registrationZipCode"
isRequired isRequired
disableAutoFill /> disableAutoFill
mask="#####"
validationRules="zip-required|zip-format"/>
</div> </div>
<alert <!-- <alert
cmsWidgetName="AlertVinNotFoundWidget" cmsWidgetName="AlertVinNotFoundWidget"
alertClass="alert-danger" alertClass="alert-danger"
:isDismissable="false" /> :isDismissable="false" /> -->
<siteFooter <siteFooter
cms-widget-name="SiteFooterWidget" cms-widget-name="SiteFooterWidget"
:is-forward-action-disabled="isForwardActionDisabled" :is-forward-action-disabled="isForwardActionDisabled"
@ -51,6 +54,14 @@ import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue'; import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue'; import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import textboxQuestion from '../../common-components/textbox-question/textbox-question.vue'; import textboxQuestion from '../../common-components/textbox-question/textbox-question.vue';
import { required, regex } from '@/helpers/validation-rules';
import { defineRule } from 'vee-validate';
import { errorMessages } from '@/constants/error-messages';
// Define Validation Rules
defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
defineRule("zip-required", required(errorMessages.REGISTRATION_ZIP_REQUIRED));
defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
export default { export default {
name: 'license-plate-lookup', name: 'license-plate-lookup',
@ -65,10 +76,10 @@ export default {
alert, alert,
}, },
data() { data() {
return { // return {
licensePlate: this.getLicensePlateFromStore(), // licensePlate: this.getLicensePlateFromStore(),
registrationZipCode: this.getRegistrationZipFromStore(), // registrationZipCode: this.getRegistrationZipFromStore(),
}; // };
}, },
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage); const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
@ -87,6 +98,9 @@ export default {
vm.setCmsContent(resultMap.cmsContent); vm.setCmsContent(resultMap.cmsContent);
}); });
}, },
props: {
validationRules: String,
},
computed: { computed: {
isForwardActionDisabled() { isForwardActionDisabled() {
return true; return true;
@ -111,12 +125,12 @@ export default {
resetDependentState() { resetDependentState() {
}, },
getLicensePlateFromStore() { // getLicensePlateFromStore() {
return this.mainStore.order.vehicle.registration.licensePlate; // return this.mainStore.order.vehicle.registration.licensePlate;
}, // },
getRegistrationZipFromStore() { // getRegistrationZipFromStore() {
return this.mainStore.order.vehicle.registration.zipCode; // return this.mainStore.order.vehicle.registration.zipCode;
} // }
}, },
}; };