Removed collapse toggle on radio-service Added in cashOrInsurance utilization Removed reference to quote in the modal class Changed modal close button text to use Footer from CMS
102 lines
2.7 KiB
Vue
102 lines
2.7 KiB
Vue
|
|
<template>
|
|
<Form
|
|
@submit="onSubmit"
|
|
@invalid-submit="onInvalidSubmit"
|
|
ref="theForm"
|
|
v-slot="{ meta }"
|
|
>
|
|
<div class="page-container-grouped-styles">
|
|
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
|
|
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage=false />
|
|
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
|
|
<div class="fade-on-route-transition sub-container make-tall">
|
|
<cashOrInsuranceQuestion
|
|
ref="cashOrInsurance"
|
|
cmsWidgetName="CashOrInsuranceQuestionWidget"
|
|
v-model="isInsurance"
|
|
groupName="CashOrInsuranceQuestion"
|
|
/>
|
|
<radioServicePackage/>
|
|
<textBlock
|
|
cmsWidgetName="footerTest"
|
|
justifyText="left"
|
|
typeStyle="caption"
|
|
fontWeight=""
|
|
/>
|
|
<funnel-footer
|
|
cmsWidgetName="FunnelFooterWidget"
|
|
:isForwardActionDisabled="!meta.valid"
|
|
:isBackButtonHidden=shouldHideBackButton
|
|
@back-clicked="backButtonAction"
|
|
@ForwardClicked="forwardButtonAction"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</Form>
|
|
</template>
|
|
|
|
<script>
|
|
// Components
|
|
import funnelHeader from "@/common-components/funnel-header/funnel-header";
|
|
import funnelFooter from "@/common-components/funnel-footer/funnel-footer";
|
|
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
|
|
import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
|
|
import radioServicePackage from "@/ux-components/radio-service-package/radio-service-package";
|
|
import cashOrInsuranceQuestion from "./cash-or-insurance-question/cash-or-insurance-question";
|
|
import textBlock from "@/common-components/text-block/text-block";
|
|
|
|
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
|
|
import { Form } from "vee-validate";
|
|
|
|
|
|
export default {
|
|
name: "quote",
|
|
async beforeRouteEnter(to, from, next) {
|
|
// Call APIs
|
|
const cmsContent = await fetchCmsContentForPage(to.query.fmgPage);
|
|
|
|
// Call the "next" function to complete the transition to this page.
|
|
next((vm) => {
|
|
vm.setCmsContent(cmsContent);
|
|
});
|
|
},
|
|
data(){
|
|
return {
|
|
isInsurance: false,
|
|
}
|
|
},
|
|
methods: {
|
|
arePagePrerequisitesValid() {
|
|
return true;
|
|
}
|
|
},
|
|
computed: {
|
|
years() {
|
|
return ["2011", "2012"];
|
|
},
|
|
answersFromCms() {
|
|
return ["Pay on my own", "Pay with insurance"];
|
|
},
|
|
selectedChipCountValues: {
|
|
get: function() {
|
|
return this.modelValue;
|
|
},
|
|
set: function(newValue) {
|
|
this.$emit("update:modelValue", newValue);
|
|
},
|
|
},
|
|
},
|
|
components: {
|
|
funnelHeader,
|
|
funnelFooter,
|
|
vehicleBanner,
|
|
funnelSubHeader,
|
|
Form,
|
|
radioServicePackage,
|
|
textBlock,
|
|
cashOrInsuranceQuestion
|
|
},
|
|
|
|
};
|
|
</script>
|