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

Merge branch 'develop' into feature/CSR-1392

Browse source
This commit is contained in:
CarlNation 2023-10-06 10:25:14 -04:00
commit 5901f01b5a
27 changed files with 179 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
jest.config.js
View file

@ -31,5 +31,5 @@ module.exports = {
}, },
}, },
// Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit // Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit
// silent: true, silent: true,
}; };

13
src/digital-components/button-question/button-question.vue
View file

@ -192,7 +192,7 @@ export default {
classes = "d-flex flex-row p-0"; classes = "d-flex flex-row p-0";
break; break;
case "listCard": case "listCard":
classes = "row g-2 g-md-5 justify-content-center mb-1"; classes = "row g-2 g-md-5 justify-content-center mb-1 flex-nowrap";
if (this.isWide) { if (this.isWide) {
classes += "flex-column"; classes += "flex-column";
} }
@ -304,6 +304,17 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.vehicle-damage {
@include media-breakpoint-up(md) {
.col-12 {
width: 66.66666667%;
}
.col {
width: 33.3333333%;
flex: 0 0 auto;
}
}
}
.button-question-overflow { .button-question-overflow {
height: calc(100vh - 274px); height: calc(100vh - 274px);

5
src/digital-components/modal/modal.vue
View file

@ -164,7 +164,6 @@ export default {
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {
box-shadow: none; box-shadow: none;
border-radius: 0; border-radius: 0;
height: 100vh;
margin: 0 auto; margin: 0 auto;
} }
.modal-body { .modal-body {
@ -195,6 +194,10 @@ export default {
button { button {
margin: 0; margin: 0;
} }
@include media-breakpoint-up(md) {
position: relative;
background-color: transparent;
}
} }
} }
&.show .modal-dialog { &.show .modal-dialog {

7
src/fmg-components/layouts/questions-page-layout/questions-page-layout.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6">
<vehicleBanner <vehicleBanner
cmsWidgetName="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" /> :displayGenericVehicleImage="false" />
@ -23,7 +23,10 @@
:manualHeadline="alertFewMoreQuestionsHeader" :manualHeadline="alertFewMoreQuestionsHeader"
:manualCopy="alertFewMoreQuestionsCopy" :manualCopy="alertFewMoreQuestionsCopy"
v-bind:isDismissible="false" /> v-bind:isDismissible="false" />
</div>
</div>
<div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4 col-xxl-3">
<div v-for="(questionsDatum, i) in questionsData" :key="questionsDatum.key"> <div v-for="(questionsDatum, i) in questionsData" :key="questionsDatum.key">
<questionChain <questionChain
ref="questionChain" ref="questionChain"

6
src/layouts/customer-details/customer-details.vue
View file

@ -1,13 +1,13 @@
<template> <template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }"> <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row justify-content-center">
<div class="col"> <div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" /> <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="my-5" /> <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="my-5" />
<textboxQuestion <textboxQuestion
class="mb-4" class="mb-4"

2
src/layouts/estimate/estimate.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" /> <vehicleBanner cmsWidgetName="VehicleBannerWidget" />
<funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" /> <funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" />
<div v-if="!skipVin"> <div v-if="!skipVin">

21
src/layouts/payment-method/payment-method.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<vehicleBanner <vehicleBanner
cmsWidgetName="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" /> :displayGenericVehicleImage="false" />
@ -66,6 +66,15 @@
alt="PayPal" /> alt="PayPal" />
</button> </button>
</div> </div>
<div>
<button v-on:click="afterpay">
<img
src="https://business.afterpay.com/rs/539-RJA-633/images/AP_logo_badge_6328x2204_blackmint_png.png"
width="100"
height="26"
alt="Afterpay" />
</button>
</div>
<navbar <navbar
cmsWidgetName="FunnelFooterWidget" cmsWidgetName="FunnelFooterWidget"
:isForwardActionDisabled="!meta.valid" :isForwardActionDisabled="!meta.valid"
@ -221,6 +230,16 @@ export default {
this.$route this.$route
); );
}, },
async afterpay() {
this.$refs.loadingModal.showModal();
this.dispatchStoreAction(storeActions.SAVE_PIA_ERROR_CODE, null, false);
await this.dispatchStoreAction(storeActions.RESET_SAVE_SESSION_PROMISE);
await this.dispatchStoreAction(storeActions.SAVE_PAY_NOW_TYPE, "ap", false);
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_PAY_NOW,
this.$route
);
},
}, },
computed: { computed: {
damageInfo() { damageInfo() {

25
src/layouts/payment/payment.vue
View file

@ -11,6 +11,7 @@
<hr class="mt-0" /> <hr class="mt-0" />
<div id="card-container"> <div id="card-container">
<iframe <iframe
ref="paymentFrame"
class="hop-iframe payment-iframe" class="hop-iframe payment-iframe"
name="card-frame" name="card-frame"
id="card-frame" id="card-frame"
@ -32,7 +33,7 @@
<form <form
ref="myForm" ref="myForm"
id="card-data" id="card-data"
:target="isPaypal ? '_top' : 'card-frame'" :target="paypalPayment ? '_top' : 'card-frame'"
method="POST" method="POST"
:action="checkoutUrl"> :action="checkoutUrl">
<input type="hidden" name="paymentType" :value="paymentType" /> <input type="hidden" name="paymentType" :value="paymentType" />
@ -219,11 +220,9 @@ export default {
lineItems: "Labor|189.99|1||Repair supplies|7.99|1", lineItems: "Labor|189.99|1||Repair supplies|7.99|1",
sgHeaderline1: this.getHeaderLine1(), sgHeaderline1: this.getHeaderLine1(),
sgHeaderline2: this.getHeaderLine2(), sgHeaderline2: this.getHeaderLine2(),
paypalPayment: this.isPaypal(),
}; };
}, },
async mounted() {
this.fetchSignatureInfo();
},
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
// Call APIs // Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage); const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
@ -239,8 +238,9 @@ export default {
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
// 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(async (vm) => {
vm.setCmsContent(resultMap.cmsContent); vm.setCmsContent(resultMap.cmsContent);
vm.fetchSignatureInfo();
}); });
}, },
methods: { methods: {
@ -299,7 +299,9 @@ export default {
}, },
forwardButtonAction() {}, forwardButtonAction() {},
async fetchSignatureInfo() { async fetchSignatureInfo() {
this.$refs.loadingModal.showModal(); if (this.isPaypal()) {
this.$refs.loadingModal.showModal();
}
const signatureInfo = await this.dispatchStoreAction(storeActions.GET_SIGNATURE); const signatureInfo = await this.dispatchStoreAction(storeActions.GET_SIGNATURE);
this.authToken = signatureInfo.data.token; this.authToken = signatureInfo.data.token;
this.authSignature = signatureInfo.data.signature; this.authSignature = signatureInfo.data.signature;
@ -307,6 +309,17 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.myForm.submit(); this.$refs.myForm.submit();
if (this.paymentType == "ap") {
const iframe = this.$refs.paymentFrame;
if (iframe) {
iframe.onload = () => {
if (iframe.contentWindow) {
iframe.contentWindow.postMessage("afterpay", "*");
}
};
}
}
}); });
}, },
}, },

2
src/layouts/quote/quote.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<vehicleBanner <vehicleBanner
cmsWidgetName="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" /> :displayGenericVehicleImage="false" />

8
src/layouts/review/review.vue
View file

@ -2,13 +2,13 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm"> <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm">
<!-- When customer-details is added: v-slot="{ meta }" --> <!-- When customer-details is added: v-slot="{ meta }" -->
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row justify-content-center">
<div class="col"> <div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" /> <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<vehicleBanner <vehicleBanner
cmsWidgetName="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" /> :displayGenericVehicleImage="false" />

2
src/layouts/schedule/schedule.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" /> <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" />
<template v-if="ChangeShopLink.length"> <template v-if="ChangeShopLink.length">
<textBlock <textBlock

4
src/layouts/service-location/appointment-type-question/appointment-type-question.vue
View file

@ -8,7 +8,7 @@
:answers="answersToDisplay" :answers="answersToDisplay"
:groupName="groupName" :groupName="groupName"
buttonTypeString="listCard" buttonTypeString="listCard"
v-model="selectedValues" v-model="selectedValue"
:suppressError="suppressError" :suppressError="suppressError"
:validationRules="validationRules" :validationRules="validationRules"
isRequired /> isRequired />
@ -55,7 +55,7 @@ export default {
}) })
: []; : [];
}, },
selectedValues: { selectedValue: {
get: function () { get: function () {
return this.modelValue; return this.modelValue;
}, },

15
src/layouts/service-location/classes/provider-address.js Normal file
View file

@ -0,0 +1,15 @@
export class ProviderAddress {
constructor(
streetAddress = null,
city = null,
state = null,
zipCode = null,
zipCodeCtu = null
) {
this.streetAddress = streetAddress;
this.city = city;
this.state = state;
this.zipCode = zipCode;
this.zipCodeCtu = zipCodeCtu;
}
}

8
src/layouts/service-location/classes/provider.js Normal file
View file

@ -0,0 +1,8 @@
import { ProviderAddress } from "./provider-address";
export class Provider {
constructor(providerNumber = null, address = null) {
this.providerNumber = providerNumber;
this.address = address ?? new ProviderAddress();
}
}

1
src/layouts/service-location/helpers/service-location-helper/service-location-helper.js
View file

@ -1,5 +1,4 @@
import { storeActions } from "@/constants/store-actions"; import { storeActions } from "@/constants/store-actions";
import store from "@/store";
import baseMixin from "@/mixins/base-mixin.js"; import baseMixin from "@/mixins/base-mixin.js";
export async function getPricedMobileFeePart(serviceZipCode, pageNameToLog) { export async function getPricedMobileFeePart(serviceZipCode, pageNameToLog) {

3
src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue
View file

@ -314,9 +314,10 @@ export default {
margin-top: 0em; margin-top: 0em;
} }
#mobileLocationLinkPromptId { .update-mobile-location-text-link {
white-space: pre-line; white-space: pre-line;
} }
.text-black { .text-black {
color: $black; color: $black;
} }

10
src/layouts/service-location/service-location.spec.js
View file

@ -7,7 +7,10 @@ import { getMountOptions } from "@/helpers/unit-test-helper";
import store from "@/store"; import store from "@/store";
import baseMixin from "@/mixins/base-mixin"; import baseMixin from "@/mixins/base-mixin";
import { getServiceabilityDetails } from "@/layouts/service-location/helpers/service-location-helper/service-location-helper"; import {
getServiceabilityDetails,
Provider,
} from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
// Define Mocks // Define Mocks
jest.mock("@/helpers/cms-content-helper", () => ({ jest.mock("@/helpers/cms-content-helper", () => ({
@ -16,6 +19,8 @@ jest.mock("@/helpers/cms-content-helper", () => ({
}), }),
})); }));
jest.mock("./classes/provider");
const mockGetPricedMobileFeePart = (mockServiceZipCode) => { const mockGetPricedMobileFeePart = (mockServiceZipCode) => {
let mobileFeePart = {}; let mobileFeePart = {};
@ -397,6 +402,7 @@ describe("service-location.vue", () => {
await wrapper.setData({ await wrapper.setData({
selectedAppointmentType: "Mobile", selectedAppointmentType: "Mobile",
providerData: { mobileProviderNumber: "01820" },
}); });
const mobileLocationQuestionsComponent = wrapper.findComponent({ const mobileLocationQuestionsComponent = wrapper.findComponent({
@ -448,6 +454,7 @@ describe("service-location.vue", () => {
await wrapper.setData({ await wrapper.setData({
selectedAppointmentType: "Mobile", selectedAppointmentType: "Mobile",
providerData: { mobileProviderNumber: "01820" },
}); });
const mobileLocationQuestionsComponent = wrapper.findComponent({ const mobileLocationQuestionsComponent = wrapper.findComponent({
@ -511,6 +518,7 @@ describe("service-location.vue", () => {
await wrapper.setData({ await wrapper.setData({
selectedAppointmentType: "Mobile", selectedAppointmentType: "Mobile",
providerData: { mobileProviderNumber: "01820" },
}); });
const mobileLocationQuestionsComponent = wrapper.findComponent({ const mobileLocationQuestionsComponent = wrapper.findComponent({

58
src/layouts/service-location/service-location.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" /> <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" />
<serviceZipModalQuestion <serviceZipModalQuestion
@ -60,7 +60,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center appointment-type"> <div class="row justify-content-md-center appointment-type">
<div class="col-md-8"> <div class="col-md-6 col-xxl-4">
<appointmentTypeQuestion <appointmentTypeQuestion
v-model="selectedAppointmentType" v-model="selectedAppointmentType"
v-show="isAppointmentTypeDisplayed" v-show="isAppointmentTypeDisplayed"
@ -74,7 +74,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<mobileLocationModalQuestions <mobileLocationModalQuestions
customComponentId="mobileLocationQuestions" customComponentId="mobileLocationQuestions"
v-if="selectedAppointmentType === 'Mobile'" v-if="selectedAppointmentType === 'Mobile'"
@ -95,6 +95,7 @@
v-model="selectedProvider" v-model="selectedProvider"
:selectedAppointmentType="selectedAppointmentType" :selectedAppointmentType="selectedAppointmentType"
:isDisplayed="isShopQuestionDisplayed" :isDisplayed="isShopQuestionDisplayed"
@updated-shop-list="setUpdatedShopList"
cmsWidgetName="ShopQuestionWidget" /> cmsWidgetName="ShopQuestionWidget" />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" /> <contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />
@ -135,6 +136,9 @@ import {
getPricedMobileFeePart, getPricedMobileFeePart,
getServiceabilityDetails, getServiceabilityDetails,
} from "@/layouts/service-location/helpers/service-location-helper/service-location-helper"; } from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
import { Provider } from "@/layouts/service-location/classes/provider";
import store from "@/store"; import store from "@/store";
// Validation // Validation
@ -176,6 +180,7 @@ export default {
mobileFeePart: null, mobileFeePart: null,
zipContainsMilitaryBase: false, zipContainsMilitaryBase: false,
zipCodeCtu: null, zipCodeCtu: null,
providerData: null,
}; };
}, },
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -229,7 +234,12 @@ export default {
resultMap.serviceabilityDetails, resultMap.serviceabilityDetails,
resultMap.mobileFeePart resultMap.mobileFeePart
); );
// Initialize the Shop Question component
vm.$refs.shopQuestion.initializeComponent(resultMap.shopQuestionInitialData); vm.$refs.shopQuestion.initializeComponent(resultMap.shopQuestionInitialData);
// Initialize the page level shop data
vm.providerData = resultMap.shopQuestionInitialData;
}); });
}, },
computed: { computed: {
@ -333,6 +343,9 @@ export default {
displayNoShopsAlert() { displayNoShopsAlert() {
return !this.isServiceableInshop && !this.isServiceableMobile; return !this.isServiceableInshop && !this.isServiceableMobile;
}, },
recalibrationInformationModal() {
return this.$refs.recalibrationInformationModal;
},
}, },
methods: { methods: {
arePagePrerequisitesValid() { arePagePrerequisitesValid() {
@ -403,6 +416,15 @@ export default {
this.isRecalibrationServiceableMobile = this.isRecalibrationServiceableMobile =
serviceabilityDetails.isRecalibrationServiceableMobile; serviceabilityDetails.isRecalibrationServiceableMobile;
}, },
async reloadShopData(zipCode) {
await this.$refs.shopQuestion.reloadShopData(zipCode);
},
setUpdatedShopList(providerData) {
this.providerData = providerData;
},
openRecalibrationInformationModal() {
this.recalibrationInformationModal.openModal();
},
backButtonAction() { backButtonAction() {
this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route); this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
}, },
@ -472,11 +494,25 @@ export default {
this.updateAndSaveSupportingItems(); this.updateAndSaveSupportingItems();
this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route); this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route);
}, },
openModalAction(modalName) { },
this.$refs[modalName].openModal(); watch: {
selectedAppointmentType: {
handler(newValue) {
if (newValue === "Mobile") {
this.selectedProvider = new Provider(this.providerData.mobileProviderNumber);
} else {
this.selectedProvider = new Provider();
}
},
}, },
async reloadShopData() { providerData: {
await this.$refs.shopQuestion.reloadShopData(this.zipCode); handler(newValue) {
if (newValue === "Mobile") {
this.selectedProvider = new Provider(this.providerData.mobileProviderNumber);
} else {
this.selectedProvider = new Provider();
}
},
}, },
}, },
components: { components: {
@ -496,14 +532,6 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.appointment-type {
@include media-breakpoint-up(md) {
.col {
flex: 0 0 auto;
width: 33.33333333%;
}
}
}
.question-text { .question-text {
& > span { & > span {
text-align: center; text-align: center;

24
src/layouts/service-location/shop-question/shop-question.vue
View file

@ -54,6 +54,8 @@ import { nextTick } from "vue";
import { getAvailabilityRating } from "@/layouts/service-location/helpers/service-location-helper/service-location-helper"; import { getAvailabilityRating } from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
import { Provider } from "@/layouts/service-location/classes/provider";
defineRule("option-required", required(errorMessages.OPTION_REQUIRED)); defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
export default { export default {
@ -136,6 +138,7 @@ export default {
}, },
initializeComponent(shopQuestionInitialData) { initializeComponent(shopQuestionInitialData) {
this.shopProviders = shopQuestionInitialData.shopProviders; this.shopProviders = shopQuestionInitialData.shopProviders;
this.$emit("updated-shop-list", shopQuestionInitialData);
}, },
async getNextShopsFromList(numberToGet = 3) { async getNextShopsFromList(numberToGet = 3) {
const shopIterator = (array, n) => { const shopIterator = (array, n) => {
@ -206,9 +209,9 @@ export default {
await this.getNextShopsFromList(); await this.getNextShopsFromList();
}, },
getSelectedProviderObject(providerNumber) { getSelectedProviderObject(providerNumber) {
const provider = this.shopProviders?.find( const provider =
(provider) => provider.providerNumber == providerNumber this.shopProviders?.find((provider) => provider.providerNumber == providerNumber) ??
); new Provider();
return provider; return provider;
}, },
@ -222,18 +225,15 @@ export default {
}, },
watch: { watch: {
selectedAppointmentType: { selectedAppointmentType: {
async handler(newValue) { // Question: Does it matter if this fires when clicking Mobile? Ideally it should not, but it doesn't seem to effect anything
// What we DON'T want to do here is create a dependency by checking if the selectedAppointmentType is Mobile as that has
// nothing to do with this component. We could mitigate this by showing / hiding this component with v-if but that messes
// up the component initialization on page load.
async handler() {
this.resetAnswers(); this.resetAnswers();
await nextTick(); await nextTick();
this.getNextShopsFromList();
this.selectedProviderNumber = null;
await nextTick();
if (newValue !== "Mobile") {
this.getNextShopsFromList();
}
}, },
}, },
shopProviders: { shopProviders: {

2
src/layouts/vehicle-damage/vehicle-damage.vue
View file

@ -24,7 +24,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-8 col-xl-6"> <div class="col-md-8 col-xl-6 col-xxl-4">
<damageLocationQuestion <damageLocationQuestion
ref="damageLocation" ref="damageLocation"
cmsWidgetName="DamageLocationQuestion" cmsWidgetName="DamageLocationQuestion"

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

@ -28,6 +28,10 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4 col-xxl-3">
<div v-for="(item, i) in PartsOrQuestions" :key="i"> <div v-for="(item, i) in PartsOrQuestions" :key="i">
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) --> <!-- Render horizontal lines if there is multi-glass (aka if i > 0) -->
<hr v-if="i > 0" /> <hr v-if="i > 0" />

4
src/layouts/vehicle/vehicle.vue
View file

@ -6,8 +6,8 @@
<funnelHeader cmsWidgetName="FunnelHeaderWidget" /> <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="siteSubHeader" /> <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="siteSubHeader" />
<vehicleQuestion <vehicleQuestion
ref="vehicleYearQuestion" ref="vehicleYearQuestion"

2
src/layouts/vin-lookup/vin-lookup.vue
View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-md-center"> <div class="row justify-content-md-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 col-xxl-3">
<vehicleBanner <vehicleBanner
cmsWidgetName="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" /> :displayGenericVehicleImage="false" />

3
src/mixins/base-mixin.js
View file

@ -65,9 +65,6 @@ export default {
}, },
async getZipCodeData(zipCode, pageNameToLog = null) { async getZipCodeData(zipCode, pageNameToLog = null) {
const pageName = pageNameToLog ?? this.$options?.name; const pageName = pageNameToLog ?? this.$options?.name;
if (pageName == null) {
console.log("Missed a spot.");
}
const serviceZipValidationResponse = await this.dispatchStoreActionWithLogging( const serviceZipValidationResponse = await this.dispatchStoreActionWithLogging(
storeActions.VALIDATE_ZIP, storeActions.VALIDATE_ZIP,

1
src/store/index.js
View file

@ -1381,6 +1381,7 @@ export const actions = {
? convertGlassPieceToBackEndCompatibleFormat(order.damage.glassToReplace) ? convertGlassPieceToBackEndCompatibleFormat(order.damage.glassToReplace)
: []; : [];
var payload = { var payload = {
zipCode: order.serviceLocation.provider.zipCode,
providerNumber: providerNumber, providerNumber: providerNumber,
startDate: startDate, startDate: startDate,
endDate: endDate, endDate: endDate,

3
src/styles/common-styles.scss
View file

@ -5,9 +5,6 @@ body {
background-color: #fff; background-color: #fff;
color: #4d5151; color: #4d5151;
.container-fluid { .container-fluid {
max-width: 1400px;
padding: 0 1.5rem;
position: relative;
.prevent-squish { .prevent-squish {
overflow-x: unset; overflow-x: unset;
} }

8
src/styles/ux-variables.scss
View file

@ -188,3 +188,11 @@ $modal-backdrop-opacity: 0;
//Disable default !important behavior //Disable default !important behavior
$enable-important-utilities: false; $enable-important-utilities: false;
//Bootstrap Grid Breakpoints - Use these breakpoints only
$grid-breakpoints: (
xs: 0,
md: 768px,
xl: 1200px,
xxl: 1440px,
);