Added textbox components to license-plate-lookup page

This commit is contained in:
Kroell 2022-12-29 16:13:37 -05:00
parent ad3708a583
commit 98ef72f8b7

View file

@ -1,24 +1,30 @@
<template> <template>
<VeeValidateForm @submit="onSubmit" @invalid-submit="onInvalidSubmit"> <VeeValidateForm
@submit="onSubmit"
@invalid-submit="onInvalidSubmit" >
<div class="page-container-grouped-styles overflow-auto"> <div class="page-container-grouped-styles overflow-auto">
<SiteHeader <siteHeader
cms-widget-name="SiteHeaderWidget" cms-widget-name="SiteHeaderWidget" />
/> <vehicleBanner
<VehicleBanner
cms-widget-name="VehicleBannerWidget" cms-widget-name="VehicleBannerWidget"
:display-generic-vehicle-image="false" :display-generic-vehicle-image="false" />
/> <siteSubHeader
<SiteSubHeader cms-widget-name="SiteSubHeaderWidget" />
cms-widget-name="SiteSubHeaderWidget" <div class="fade-on-route-transition sub-container make-tall mt-5">
/> <textboxQuestion
<div class="fade-on-route-transition sub-container make-tall"> inputId="licensePlateField"
<p>License Plate Lookup Page Placeholder</p> cmsWidgetName="LicensePlateNumberQuestionWidget"
<SiteFooter v-model="licensePlate" />
<textboxQuestion
class="mt-4"
inputId="registrationZipField"
cmsWidgetName="RegistrationZipQuestionWidget"
v-model="registrationZip" />
<siteFooter
cms-widget-name="SiteFooterWidget" cms-widget-name="SiteFooterWidget"
:is-forward-action-disabled="isForwardActionDisabled" :is-forward-action-disabled="isForwardActionDisabled"
@back-clicked="backButtonAction" @back-clicked="backButtonAction"
@forward-clicked="forwardButtonAction" @forward-clicked="forwardButtonAction" />
/>
</div> </div>
</div> </div>
</VeeValidateForm> </VeeValidateForm>
@ -31,20 +37,22 @@ import { Form } from 'vee-validate';
import BaseFormMixin from '@/mixins/base-form-mixin.js'; import BaseFormMixin from '@/mixins/base-form-mixin.js';
// Import Component // Import Component
import SiteFooter from '@/common-components/site-footer/site-footer.vue'; import siteFooter from '@/common-components/site-footer/site-footer.vue';
import SiteHeader from '@/common-components/site-header/site-header.vue'; 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';
export default { export default {
name: 'license-plate-lookup', name: 'license-plate-lookup',
mixins: [BaseFormMixin], mixins: [BaseFormMixin],
components: { components: {
VeeValidateForm: Form, VeeValidateForm: Form,
SiteFooter, siteFooter,
SiteHeader, siteHeader,
SiteSubHeader, siteSubHeader,
VehicleBanner, vehicleBanner,
textboxQuestion,
}, },
data() { data() {
return {}; return {};