vehicle-parts components

This commit is contained in:
FrankRua 2022-02-22 16:10:44 -05:00
parent 32a7cd077d
commit cf59f376be
2 changed files with 33 additions and 27 deletions

View file

@ -8,7 +8,6 @@
<div class="container nested-radio" v-for="(value, name, index) in featureListData" :key="index">
<div class="row my-2">
<div class="col">
{{ selectedTint }}
<listCard v-model="selectedTint[name]" :isRadio="true" :isWide="true" :buttonImage="
require(`@/assets/img/tints/${getTintSourceImage(
glassLocation,
@ -22,7 +21,6 @@
selectedTint[name].buttonId === `${glassLocation}-${glassName}-${name}`
" class="row my-2">
<div class="col">
{{ selectedPart }}
<buttonQuestion v-model="selectedPart[glassLocation]" buttonType="radio" class="radioQuestion" questionText="ok now select your features" :answers="value" textPosition="text-start" :loaderEnabled="false" :isRequired="true" :groupName="`${glassLocation}-${glassName}-${name}`" v-on:update:modelValue="EmitPartSelection($event)" />
</div>
</div>

View file

@ -1,18 +1,26 @@
<template>
<div class="container-fluid shadow rounded-3 p-0 position-relative">
<div class="container-fluid shadow rounded-3 p-2 position-relative make-tall">
<funnelHeader ref="funnelHeader" />
<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=false />
<funnelSubHeader ref="funnelSubHeader" />
<funnelFooter ref="funnelFooter" @back-clicked="backButtonAction" />
{{ glassParts }}
<div v-for="(item, i) in Parts" :key="i">
<partQuestion :ref="`${refPrefix}-${item.glassLocation}`" v-model="glassParts[item.glassLocation + '-' + item.glassName]" :glassLocation="item.glassLocation" :glassName="item.glassName" :colorAnswers="item.colorAnswers" />
</div>
<funnelFooter ref="funnelFooter" @back-clicked="backButtonAction" />
</div>
</template>
<script>
// Components
import partQuestion from "@/layouts/vehicle-parts/part-question/part-question";
import funnelHeader from "@/common-components/funnel-header/funnel-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
import funnelFooter from "@/common-components/funnel-footer/funnel-footer";
// Supporting Files
import {
fetchCmsContentForPage
} from "@/helpers/cms-content-helper";
@ -42,31 +50,27 @@ export default {
// Call the "next" function to complete the transition to this page.
next((vm) => {
// vm.$refs.funnelHeader.initializeComponent(
// resultMap.cmsContent.FunnelHeaderWidget
// );
// vm.$refs.vehicleBanner.initializeComponent(
// resultMap.cmsContent.VehicleBannerWidget
// );
// vm.$refs.funnelSubHeader.initializeComponent(
// resultMap.cmsContent.FunnelSubHeaderWidget
// );
// vm.$refs.funnelFooter.initializeComponent(
// resultMap.cmsContent.FunnelFooterWidget
// );
vm.$refs.funnelHeader.initializeComponent(
resultMap.cmsContent.FunnelHeaderWidget
);
vm.$refs.vehicleBanner.initializeComponent(
resultMap.cmsContent.VehicleBannerWidget
);
vm.$refs.funnelSubHeader.initializeComponent(
resultMap.cmsContent.FunnelSubHeaderWidget
);
vm.$refs.funnelFooter.initializeComponent(
resultMap.cmsContent.FunnelFooterWidget
);
// Part Question dynamic component
for (const key of Object.keys(vm.$refs)) {
if (key.includes(vm.refPrefix) && vm.$refs[key][0] !== undefined) {
const partQuestionComp = vm.$refs[key][0];
// for (const key of Object.keys(vm.$refs)) {
// if (key.includes(vm.refPrefix) && vm.$refs[key][0] !== undefined) {
// const partQuestionComp = vm.$refs[key][0];
partQuestionComp.initializeComponent()
}
}
// partQuestionComp.initializeComponent()
// }
// }
});
},
@ -145,6 +149,10 @@ export default {
},
components: {
partQuestion,
funnelHeader,
vehicleBanner,
funnelSubHeader,
funnelFooter
},
mounted() {
console.log("mounted!");