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

vehicle-parts components

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/layouts/vehicle-parts/part-question/part-question.vue
View file

@ -8,7 +8,6 @@
<div class="container nested-radio" v-for="(value, name, index) in featureListData" :key="index"> <div class="container nested-radio" v-for="(value, name, index) in featureListData" :key="index">
<div class="row my-2"> <div class="row my-2">
<div class="col"> <div class="col">
{{ selectedTint }}
<listCard v-model="selectedTint[name]" :isRadio="true" :isWide="true" :buttonImage=" <listCard v-model="selectedTint[name]" :isRadio="true" :isWide="true" :buttonImage="
require(`@/assets/img/tints/${getTintSourceImage( require(`@/assets/img/tints/${getTintSourceImage(
glassLocation, glassLocation,
@ -22,7 +21,6 @@
selectedTint[name].buttonId === `${glassLocation}-${glassName}-${name}` selectedTint[name].buttonId === `${glassLocation}-${glassName}-${name}`
" class="row my-2"> " class="row my-2">
<div class="col"> <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)" /> <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>
</div> </div>

58
src/layouts/vehicle-parts/vehicle-parts.vue
View file

@ -1,18 +1,26 @@
<template> <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" /> <funnelHeader ref="funnelHeader" />
<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=false /> <vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=false />
<funnelSubHeader ref="funnelSubHeader" /> <funnelSubHeader ref="funnelSubHeader" />
<funnelFooter ref="funnelFooter" @back-clicked="backButtonAction" />
{{ glassParts }}
<div v-for="(item, i) in Parts" :key="i"> <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" /> <partQuestion :ref="`${refPrefix}-${item.glassLocation}`" v-model="glassParts[item.glassLocation + '-' + item.glassName]" :glassLocation="item.glassLocation" :glassName="item.glassName" :colorAnswers="item.colorAnswers" />
</div> </div>
<funnelFooter ref="funnelFooter" @back-clicked="backButtonAction" />
</div> </div>
</template> </template>
<script> <script>
// Components
import partQuestion from "@/layouts/vehicle-parts/part-question/part-question"; 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 { import {
fetchCmsContentForPage fetchCmsContentForPage
} from "@/helpers/cms-content-helper"; } from "@/helpers/cms-content-helper";
@ -42,31 +50,27 @@ export default {
// Call the "next" function to complete the transition to this page. // Call the "next" function to complete the transition to this page.
next((vm) => { next((vm) => {
// vm.$refs.funnelHeader.initializeComponent( vm.$refs.funnelHeader.initializeComponent(
// resultMap.cmsContent.FunnelHeaderWidget resultMap.cmsContent.FunnelHeaderWidget
// ); );
vm.$refs.vehicleBanner.initializeComponent(
// vm.$refs.vehicleBanner.initializeComponent( resultMap.cmsContent.VehicleBannerWidget
// resultMap.cmsContent.VehicleBannerWidget );
// ); vm.$refs.funnelSubHeader.initializeComponent(
// vm.$refs.funnelSubHeader.initializeComponent( resultMap.cmsContent.FunnelSubHeaderWidget
// resultMap.cmsContent.FunnelSubHeaderWidget );
// ); vm.$refs.funnelFooter.initializeComponent(
resultMap.cmsContent.FunnelFooterWidget
// vm.$refs.funnelFooter.initializeComponent( );
// resultMap.cmsContent.FunnelFooterWidget
// );
// Part Question dynamic component // 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)) { // partQuestionComp.initializeComponent()
if (key.includes(vm.refPrefix) && vm.$refs[key][0] !== undefined) { // }
const partQuestionComp = vm.$refs[key][0]; // }
partQuestionComp.initializeComponent()
}
}
}); });
}, },
@ -145,6 +149,10 @@ export default {
}, },
components: { components: {
partQuestion, partQuestion,
funnelHeader,
vehicleBanner,
funnelSubHeader,
funnelFooter
}, },
mounted() { mounted() {
console.log("mounted!"); console.log("mounted!");