WIP format vehicle-parts.

This commit is contained in:
Bryan Mauger 2023-09-18 17:01:53 -04:00
parent 015fd50202
commit 68e0929c7d

View file

@ -1,42 +1,52 @@
<template> <template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm"> <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm">
<div class="page-container-grouped-styles vehicle-parts small-question-text"> <div class="vehicle-parts small-question-text">
<loadingModal ref="loadingModal" /> <loadingModal ref="loadingModal" />
<funnelHeader ref="funnelHeader" cmsWidgetName="FunnelHeaderWidget" /> <div class="container-fluid">
<vehicleBanner <div class="row">
ref="vehicleBanner" <div class="col">
cmsWidgetName="VehicleBannerWidget" <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
:displayGenericVehicleImage="false" />
<funnelSubHeader ref="funnelSubHeader" cmsWidgetName="FunnelSubHeaderWidget" />
<div class="fade-on-route-transition sub-container make-tall">
<div class="prevent-squish my-5">
<div class="row">
<div class="col pb-0">
<alert
class="rounded border-0 shadow-sm"
alertClass="alert-warning"
cmsWidgetName="AlertWidget"
:isDismissible="false" />
</div>
</div> </div>
</div> </div>
<div v-for="(item, i) in PartsOrQuestions" :key="i"> <div class="row">
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) --> <div class="col-md-2 col-lg-3">&nbsp;</div>
<hr v-if="i > 0" /> <div class="col-md-8 col-lg-6">
<glassPartQuestion <vehicleBanner
:ref="`${RefPrefix}-${item.glassLocation}-${item.glassName}`" ref="vehicleBanner"
v-model="selectedGlassParts[item.glassLocation + '-' + item.glassName]" cmsWidgetName="VehicleBannerWidget"
:glassLocation="item.glassLocation" :displayGenericVehicleImage="false" />
:glassName="item.glassName" <funnelSubHeader ref="funnelSubHeader" cmsWidgetName="FunnelSubHeaderWidget" />
:colorAnswers="item.colorAnswers" <div class="prevent-squish my-5">
:alreadyPopulatedPartsData="alreadyPopulatedPartsData" /> <div class="row">
<div class="col pb-0">
<alert
class="rounded border-0 shadow-sm"
alertClass="alert-warning"
cmsWidgetName="AlertWidget"
:isDismissible="false" />
</div>
</div>
</div>
<div v-for="(item, i) in PartsOrQuestions" :key="i">
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) -->
<hr v-if="i > 0" />
<glassPartQuestion
:ref="`${RefPrefix}-${item.glassLocation}-${item.glassName}`"
v-model="selectedGlassParts[item.glassLocation + '-' + item.glassName]"
:glassLocation="item.glassLocation"
:glassName="item.glassName"
:colorAnswers="item.colorAnswers"
:alreadyPopulatedPartsData="alreadyPopulatedPartsData" />
</div>
<navbar
cmsWidgetName="FunnelFooterWidget"
ref="navbar"
:isForwardActionDisabled="isForwardActionDisabled"
@back-clicked="navigateBack"
@ForwardClicked="forwardButtonAction" />
</div>
</div> </div>
<navbar <div class="col-md-2 col-lg-3">&nbsp;</div>
cmsWidgetName="FunnelFooterWidget"
ref="navbar"
:isForwardActionDisabled="isForwardActionDisabled"
@back-clicked="navigateBack"
@ForwardClicked="forwardButtonAction" />
</div> </div>
</div> </div>
</Form> </Form>