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

Merge branch 'release/2024.11.21' into Feature/Digital/CSR-2066

Browse source
This commit is contained in:
hiteshkumar87 2024-11-12 21:23:43 +05:30 committed by GitHub
commit d8c5c82876
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
50 changed files with 409 additions and 479 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
jest.config.js
View file

@ -32,7 +32,7 @@ module.exports = {
testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"],
coverageThreshold: {
global: {
statements: 76,
statements: 75,
},
},
// Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit

3
public/index.html
View file

@ -10,9 +10,6 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>

BIN
src/assets/fonts/averta-bold-webfont.woff Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-bold-webfont.woff2 Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-bolditalic-webfont.woff Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-bolditalic-webfont.woff2 Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-extrabold-webfont.woff Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-extrabold-webfont.woff2 Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-regular-webfont.woff Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-regular-webfont.woff2 Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-regularitalic-webfont.woff Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-regularitalic-webfont.woff2 Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-semibold-webfont.woff Normal file
View file

Binary file not shown.

BIN
src/assets/fonts/averta-semibold-webfont.woff2 Normal file
View file

Binary file not shown.

1
src/constants/store-actions.js
View file

@ -57,6 +57,7 @@ const storeActions = {
GET_RECAL_PARTS_AND_SAVE_TO_LINE_ITEMS: "getRecalPartsAndSaveToLineItems",
// DEPENDENCY MUTATIONS
RESET_VEHICLE_STATE_AND_DEPENDENCIES: "resetVehicleStateAndDependencies",
RESET_DAMAGE_STATE_AND_DEPENDENCIES: "resetDamageAndDependencies",
RESET_REGISTRATION_STATE_AND_DEPENDENCIES: "resetRegistrationAndDependencies",
RESET_PARTS_STATE_AND_DEPENDENCIES: "resetPartsAndDependencies",

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

@ -73,6 +73,11 @@ export default {
resetForm,
};
},
data() {
return {
isEnterClicked: false,
};
},
methods: {
async validateAndEmit() {
const validationResult = await this.validate();
@ -84,9 +89,14 @@ export default {
},
async onEnter(e) {
e.preventDefault();
if (this.isEnterClicked) return;
this.isEnterClicked = true;
document.getElementById("modalbtn")?.focus();
this.$refs.modalButtonMain.clicked();
document.getElementById(this.modalId)?.focus();
setTimeout(() => {
this.isEnterClicked = false;
}, 2000);
},
resetButtonStyle() {
this.$refs.modalButtonMain?.resetButtonStyle();
@ -156,7 +166,7 @@ export default {
width: 100%;
bottom: 0;
z-index: 5;
background-color: $gray-100;
background-color: $white;
}
&.modal-component {
.modal-dialog {

29
src/fmg-components/cart/cart.vue
View file

@ -96,7 +96,7 @@
</span>
<span
v-if="
!showCoverageAsVerified ||
!showCoverageAsVerified || cartItem.name === 'Recycling' ||
(showCoverageAsVerified && !cartItem.isCoveredByInsurance)
"
>{{
@ -110,7 +110,7 @@
<span>{{ subtotalText }}</span>
<span>{{ getLineItemAmount(subTotal, showCoverageAsPending) }}</span>
</div>
<div class="sales-tax">
<div class="sales-tax" v-show="showSalesTax">
<span>{{ salesTaxText }}</span>
<span>{{ getLineItemAmount(salesTax) }}</span>
</div>
@ -134,7 +134,8 @@
v-model="lineItems"
:addableVaps="availableVaps"
:pageName="pageName"
modalWidgetName="PromoModalWidget" />
modalWidgetName="PromoModalWidget"
@promoAdded="saveVaps" />
</div>
</div>
<div
@ -165,6 +166,7 @@ import baseMixin from "@/mixins/base-mixin.js";
import { deepClone } from "@/helpers/object-helper";
import { getHighestFullySatisfiedTier, getPackageContents } from "@/helpers/service-package-helper";
import { getPromoCodeWithoutBundleIdentifier } from "@/helpers/promotions-helper";
import { storeActions } from "@/constants/store-actions";
// Constants
import { partTypeStrings } from "@/constants/part-type-strings";
@ -281,10 +283,25 @@ export default {
: this.currencyFormatter.format(amount);
},
removeItem(cartItemType, category) {
async removeItem(cartItemType, category) {
this.lineItems[category] = this.lineItems[category].filter(
(lineItemsToKeep) => lineItemsToKeep.cartItemType != cartItemType
);
await this.dispatchStoreAction(storeActions.SAVE_VAPS, this.lineItems.vaps, false);
},
async saveVaps(lineItems) {
this.lineItems.vaps = [...lineItems.vaps];
this.lineItems.promos = [...lineItems.promos];
await this.dispatchStoreAction(storeActions.SAVE_VAPS, this.lineItems.vaps, false);
await this.dispatchStoreAction(
storeActions.SAVE_ACTIVE_AND_OR_INACTIVE_PROMOS,
{
activePromos: this.lineItems.promos,
},
false
);
},
getPromoCodeList() {
@ -318,6 +335,10 @@ export default {
showCoverageAsVerified() {
return this.showInsuranceCoverageAs === coverageStatus.VERIFIED;
},
showSalesTax() {
const tax = parseFloat(this.salesTax).toFixed(2);
return tax > 0;
},
currentDeductible() {
const deductible = this.insuranceDeductible;
if (!(deductible === 0 || deductible > 0)) {

4
src/fmg-components/funnel-header/funnel-header.vue
View file

@ -94,7 +94,7 @@ export default {
}
.logo-image {
max-width: 114px;
height: auto;
width: auto;
height: 1.1875rem;
}
</style>

4
src/fmg-components/funnel-header/menu-modal/menu-modal.vue
View file

@ -42,8 +42,8 @@
<div class="modal-body d-flex flex-column">
<textLink
linkType="newWindowLink"
text="Terms of use"
href="//www.safelite.com/terms-of-use"
text="Terms of service"
href="//www.safelite.com/terms-of-service"
target="_blank" />
<textLink
linkType="newWindowLink"

2
src/fmg-components/funnel-sub-header/funnel-sub-header.vue
View file

@ -53,7 +53,7 @@ export default {
return this.leftAlignHeader ? "justify-content-start" : "justify-content-center";
},
subText() {
return this.getCmsContent(this.cmsWidgetName, "SubheaderText");
return this.getCmsContent(this.cmsWidgetName, "HeaderSubText");
},
backButtonAccessibleText() {
return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText");

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

@ -8,11 +8,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
</div>
</div>
@ -56,7 +52,6 @@
<script>
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import alert from "@/ux-components/alert/alert";
import questionChain from "@/digital-components/question-chain/question-chain";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
@ -99,7 +94,6 @@ export default {
},
components: {
funnelHeader,
vehicleBanner,
alert,
questionChain,
funnelSubHeader,

16
src/fmg-components/promo-modal-question/promo-modal-question.vue
View file

@ -50,7 +50,7 @@
cmsWidgetName="AlertInshopPromoWidget"
alertClass="alert-danger"
v-bind:isDismissible="false" />
<div class="mt-4" v-for="(promoCode, i) in this.getPromoCodeList()" :key="i">
<div class="mt-4 d-flex align-items-center justify-content-between" v-for="(promoCode, i) in this.getPromoCodeList()" :key="i">
<span class="applied-promo"
>Promo code <span class="promo-code">{{ promoCode }}</span> applied
</span>
@ -220,7 +220,7 @@ export default {
additionalInfo: promoValidationResponse?.additionalInfo,
};
},
removeItem(promo) {
async removeItem(promo) {
this.lineItems[cartItemCategories.PROMOS] = this.lineItems[
cartItemCategories.PROMOS
].filter(
@ -320,6 +320,9 @@ export default {
this.lineItems.vaps?.push(...getVaps);
}
this.lineItems?.promos.push(...promoCodeData.promoCode);
this.$emit("promoAdded", this.lineItems);
this.closeModal();
} else {
this.getErrorMessage(promoCodeData.errorCode, promoCodeData.additionalInfo);
@ -354,19 +357,18 @@ export default {
</script>
<style lang="scss" scoped>
.applied-promo {
padding-right: 4rem;
font-size: 14px;
font-size: .875rem;
font-weight: 500;
line-height: 24px;
color: #0c7e47;
color: $green;
.promo-code {
text-transform: uppercase;
}
}
.alert {
color: #d4281c;
font-size: 14px;
color: $red;
font-size: .875rem;
font-weight: 500;
line-height: 24px;
}

134
src/fmg-components/vehicle-banner/vehicle-banner.spec.js
View file

@ -1,134 +0,0 @@
import { shallowMount } from "@vue/test-utils";
import vehicleBanner from "./vehicle-banner";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import store from "@/store";
import { vehicleCategories } from "@/constants/vehicle-categories.js";
jest.mock(
"@/store",
() => {
return {};
},
{ virtual: true }
);
describe("vehicleBanner", () => {
test("renders the blurrycar image", async () => {
// Arrange
const { wrapper } = setupMocks({
displayGenericVehicleImageProp: true,
imageUrlValue: "NULL",
displayUnmatchedVehicleIconProp: true,
});
// Assert
expect(wrapper.vm.vehicleImageToDisplay).toEqual(wrapper.vm.genericVehicleImage);
expect(wrapper.find("img").attributes("class")).toContain("vehicle-image");
wrapper.unmount();
});
});
describe("vehicleBanner", () => {
test("renders expected vehicle image", async () => {
// Arrange
const { wrapper } = setupMocks({
displayGenericVehicleImageProp: false,
imageUrlValue: "url_to_vehicle_image",
});
// Assert
expect(wrapper.vm.vehicleImageToDisplay).toEqual("url_to_vehicle_image");
expect(wrapper.find("img").attributes("class")).toContain("vehicle-image");
wrapper.unmount();
});
});
describe("vehicleBanner", () => {
test("should render car icon when imageUrl is null and category is default", async () => {
// Arrange
const { wrapper } = setupMocks({
displayGenericVehicleImageProp: false,
imageUrlValue: "NULL",
});
var iconUrl = wrapper.vm.vehicleImageToDisplay;
// Assert
expect(iconUrl).toEqual(undefined);
wrapper.unmount();
});
});
const params = [
["CAR", "car_icon_url"],
["TRUCK", "truck_icon_url"],
["VAN", "van_icon_url"],
["COMMERCIAL VAN", "commercial_van_icon_url"],
["SUV", "suv_icon_url"],
["OTHER", "car_icon_url"],
];
describe("vehicleBanner", () => {
test.each(params)(
"renders an icon instead of an image for %s and %s",
async (category, expectedIcon) => {
// Arrange
const { wrapper, cmsContent } = setupMocks({
displayGenericVehicleImageProp: false,
imageUrlValue: expectedIcon,
categoryValue: category,
});
//Act
var vehicleIcon = wrapper.vm.getUnmatchedVehicleIcon();
// Assert
expect(store.getters.vehicle.category).toEqual(category);
expect(wrapper.find("img").attributes("class")).toContain("vehicle-image");
wrapper.unmount();
}
);
});
function setupMocks({
displayGenericVehicleImageProp,
displayUnmatchedVehicleIconProp,
imageUrlValue,
categoryValue = "CAR",
}) {
const mockGetCmsContent = jest.fn();
mockGetCmsContent((cmsWidget, field) => {
return field;
});
const mockMixin = {
methods: {
getCmsContent: mockGetCmsContent,
},
};
//Mock store
store.dispatch = jest.fn(() => {});
store.getters = { vehicle: { category: categoryValue, imageUrl: imageUrlValue } };
const mountOptions = getMountOptions({
store: {
dispatch: store.dispatch,
getters: store.getters,
},
});
//Mock props
mountOptions.propsData = {
displayGenericVehicleImage: displayGenericVehicleImageProp,
displayUnmatchedVehicleIconProp: displayUnmatchedVehicleIconProp,
};
mountOptions.mixins = [mockMixin];
const wrapper = shallowMount(vehicleBanner, mountOptions);
//Mock CMS content
const cmsContent = {
GenericVehicleImage: "image_url",
CarUnmatchedVehicleIcon: "car_icon_url",
TruckUnmatchedVehicleIcon: "truck_icon_url",
VanUnmatchedVehicleIcon: "van_icon_url",
CommercialVanUnmatchedVehicleIcon: "commercial_van_icon_url",
SuvUnmatchedVehicleIcon: "suv_icon_url",
};
return { wrapper, cmsContent };
}

98
src/fmg-components/vehicle-banner/vehicle-banner.vue
View file

@ -1,98 +0,0 @@
<template>
<div class="vehicle_banner mb-4 text-center">
<img class="vehicle-image img-fluid" :src="vehicleImageToDisplay" alt="" />
</div>
</template>
<script>
export default {
name: "vehicle-banner",
props: {
displayGenericVehicleImage: {
type: Boolean,
required: true,
},
cmsWidgetName: String,
displayVehicleImage: {
type: String,
required: false,
default: null,
},
displayUnmatchedVehicleIcon: {
type: Boolean,
required: false,
default: false,
},
vehicleCategory: {
type: String,
required: false,
default: null,
},
},
computed: {
vehicleImageToDisplay() {
if (this.displayVehicleImage !== null) {
return this.displayVehicleImage;
}
if (this.displayGenericVehicleImage) {
return this.genericVehicleImage;
}
if (
this.$store.getters.vehicle.imageUrl === null ||
this.$store.getters.vehicle.imageUrl === "NULL" ||
this.displayUnmatchedVehicleIcon
) {
return this.getUnmatchedVehicleIcon();
}
return this.$store.getters.vehicle.imageUrl;
},
genericVehicleImage() {
return this.getCmsContent(this.cmsWidgetName, "GenericVehicleImage");
},
carUnmatchedVehicleIcon() {
return this.getCmsContent(this.cmsWidgetName, "CarUnmatchedVehicleIcon");
},
truckUnmatchedVehicleIcon() {
return this.getCmsContent(this.cmsWidgetName, "TruckUnmatchedVehicleIcon");
},
vanUnmatchedVehicleIcon() {
return this.getCmsContent(this.cmsWidgetName, "VanUnmatchedVehicleIcon");
},
commercialUnmatchedVehicleIcon() {
return this.getCmsContent(this.cmsWidgetName, "CommercialVanUnmatchedVehicleIcon");
},
suvUnmatchedVehicleIcon() {
return this.getCmsContent(this.cmsWidgetName, "SuvUnmatchedVehicleIcon");
},
},
methods: {
getUnmatchedVehicleIcon() {
const category = this.vehicleCategory ?? this.$store.getters.vehicle.category;
switch (category) {
case this.vehicleCategories.CAR:
return this.carUnmatchedVehicleIcon;
case this.vehicleCategories.SUV:
return this.suvUnmatchedVehicleIcon;
case this.vehicleCategories.TRUCK:
return this.truckUnmatchedVehicleIcon;
case this.vehicleCategories.VAN:
return this.vanUnmatchedVehicleIcon;
case this.vehicleCategories.COMMERCIALVAN:
return this.commercialUnmatchedVehicleIcon;
default:
return this.carUnmatchedVehicleIcon;
}
},
},
};
</script>
<style lang="scss" scoped>
.vehicle-image {
max-width: 290px;
object-fit: cover;
width: 100%;
height: 132px;
}
</style>

10
src/helpers/heritage-integration/navigation-helper.js
View file

@ -147,7 +147,15 @@ export async function navigateToHeritageFunnel({
) {
heritageParms["forceEndToEndInsurance"] = true;
}
router.navigateToExternalUrl(applicationConfig.HERITAGE_FUNNEL, heritageParms, callBackMethod);
// clear the heritage session that may still exist after an order was already submitted
if (window.sessionStorage.getItem("createNewSessionForHeritage") !== null) {
heritageParms["cns"] = "all";
window.sessionStorage.removeItem("createNewSessionForHeritage");
}
router.navigateToExternalUrl(applicationConfig.HERITAGE_FUNNEL, heritageParms, callBackMethod);
}
export async function skipVinLookup() {

8
src/layouts/address-lookup/address-lookup.vue
View file

@ -12,11 +12,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
ref="vehicleBanner"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" ref="funnelSubHeader" />
@ -103,7 +99,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import customerQuestions from "@/layouts/address-lookup/customer-questions/customer-questions";
import alert from "@/ux-components/alert/alert";
@ -480,7 +475,6 @@ export default {
components: {
funnelHeader,
navbar,
vehicleBanner,
funnelSubHeader,
customerQuestions,
textboxQuestion,

7
src/layouts/address-vehicles/address-vehicles.vue
View file

@ -7,10 +7,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
@ -54,7 +51,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import alert from "@/ux-components/alert/alert";
import addressVehiclesQuestion from "@/layouts/address-vehicles/address-vehicles-question/address-vehicles-question";
@ -243,7 +239,6 @@ export default {
components: {
Form,
funnelHeader,
vehicleBanner,
funnelSubHeader,
alert,
navbar,

7
src/layouts/bailout/bailout.vue
View file

@ -8,10 +8,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
@ -30,7 +27,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
@ -71,7 +67,6 @@ export default {
components: {
funnelHeader,
navbar,
vehicleBanner,
funnelSubHeader,
loadingModal,
},

154
src/layouts/confirmation/confirmation.spec.js
View file

@ -9,6 +9,10 @@ import { nextTick } from "vue";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import store from "@/store";
import router from "@/router";
import experimentMixin from "@/mixins/experiment-mixin.js";
import { experimentSettings } from "@/constants/experiments";
const mockExperimentSettings = experimentSettings;
// Mock our module for promises.
jest.mock("@/helpers/layout-helper.js", () => ({
@ -66,6 +70,9 @@ beforeEach(() => {
customer: {
emailAddress: "test@test.com",
},
policy: {
isNoComp: false,
},
},
damage: {},
payment: {
@ -237,7 +244,7 @@ describe("computed properties...", () => {
const testValue = wrapper.vm.AppointmentWordingText;
// Assert
expect(testValue).toEqual("wording Text 123, test,<br/> test, AZ 12345");
expect(testValue).toEqual("wording Text test, 123,<br/> test, AZ 12345");
});
test("AppointmentWordingText should return DROP_OFF text in expected format.", () => {
//Arrange
@ -419,7 +426,7 @@ describe("computed properties...", () => {
const testValue = wrapper.vm.ServiceLocationFullAddress;
// Assert
expect(testValue).toEqual("123, test,<br/> test, AZ 12345");
expect(testValue).toEqual("test, 123,<br/> test, AZ 12345");
});
test("ProviderFullAddress should return text in expected format.", () => {
//Arrange
@ -552,6 +559,140 @@ describe("computed properties...", () => {
// Assert
expect(testValue).toEqual("Duration: Overnight");
});
test("NoComp should return false for shouldHideRecalibration", () => {
//Arrange
const { wrapper } = setupMocks({});
wrapper.vm.submittedOrder = {
vehicle: {
imageUrl: "",
},
schedule: {
endTime: "10:00",
date: "2024-09-28",
jobMaxMinutes: 120,
jobMinMinutes: 60,
routeCode: "",
},
policy: {
isNoComp: true,
},
serviceLocation: store.getters.order.serviceLocation,
};
wrapper.vm.submittedOrder.serviceLocation.appointmentType = AppointmentTypeStrings.MOBILE;
// Act
const testValue = wrapper.vm.shouldHideRecalibration;
// Assert
expect(testValue).toEqual(false);
});
test("Itac should return false for shouldHideRecalibration", () => {
//Arrange
const { wrapper } = setupMocks({});
wrapper.vm.submittedOrder = {
vehicle: {
imageUrl: "",
},
schedule: {
endTime: "10:00",
date: "2024-09-28",
jobMaxMinutes: 120,
jobMinMinutes: 60,
routeCode: "",
},
policy: {
isItac: true,
},
serviceLocation: store.getters.order.serviceLocation,
};
wrapper.vm.submittedOrder.serviceLocation.appointmentType = AppointmentTypeStrings.MOBILE;
// Act
const testValue = wrapper.vm.shouldHideRecalibration;
// Assert
expect(testValue).toEqual(false);
});
test("Not Itac/NoComp with Recal should return true for shouldHideRecalibration", async () => {
//Arrange
const { wrapper } = setupMocks({});
const lineItems = {
glassParts: [
{
partType: "RECALIBRATION",
},
],
};
wrapper.vm.submittedOrder = {
vehicle: {
imageUrl: "",
},
schedule: {
endTime: "10:00",
date: "2024-09-28",
jobMaxMinutes: 120,
jobMinMinutes: 60,
routeCode: "",
},
policy: {
isItac: false,
isNoComp: false,
},
lineItems: {
glassParts: {
partType: "Recalibration",
},
},
serviceLocation: store.getters.order.serviceLocation,
};
wrapper.setData({ lineItems: lineItems });
await wrapper.vm.$nextTick();
// Act
const testValue = wrapper.vm.shouldHideRecalibration;
// Assert
expect(testValue).toEqual(true);
});
test("Itac/NoComp with Recal should return false for shouldHideRecalibration", async () => {
//Arrange
const { wrapper } = setupMocks({});
const lineItems = {
glassParts: [
{
partType: "RECALIBRATION",
},
],
};
wrapper.vm.submittedOrder = {
vehicle: {
imageUrl: "",
},
schedule: {
endTime: "10:00",
date: "2024-09-28",
jobMaxMinutes: 120,
jobMinMinutes: 60,
routeCode: "",
},
policy: {
isItac: true,
isNoComp: false,
},
serviceLocation: store.getters.order.serviceLocation,
};
wrapper.setData({ lineItems: lineItems });
await wrapper.vm.$nextTick();
// Act
const testValue = wrapper.vm.shouldHideRecalibration;
// Assert
expect(testValue).toEqual(false);
});
});
function setupMocks({ customMountOptions }) {
@ -565,10 +706,17 @@ function setupMocks({ customMountOptions }) {
getCmsContent: jest.fn().mockImplementation(() => {
return wordingText;
}),
getSettingValue: jest.fn(),
getSettingValue: jest.fn((settingName) => {
if (settingName === experimentSettings.RECAL_PRICE_REMOVE) {
return "true";
}
return "false";
}),
},
},
];
const wrapper = shallowMount(confirmation, mountOptions);
return { wrapper };
}

19
src/layouts/confirmation/confirmation.vue
View file

@ -16,10 +16,7 @@
</div>
<div class="main">
<div>
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayVehicleImage="vehicleBannerImageUrl"
:displayGenericVehicleImage="false" />
</div>
<div class="scheduleText">
@ -88,7 +85,6 @@
<script>
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import addToCalendar from "@/layouts/confirmation/add-to-calendar/add-to-calendar";
import cart from "@/fmg-components/cart/cart";
@ -177,6 +173,10 @@ export default {
return containsRecalParts(this?.lineItems);
},
shouldHideRecalibration() {
if (this.isNoComp || this.isItac) {
return false;
}
return (
this.getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)?.toLowerCase() ===
"true" && this.isRecalibrationOnOrder
@ -314,11 +314,7 @@ export default {
}
},
ServiceLocationFullAddress() {
return `${this.ServiceLocationAddress2 ? this.ServiceLocationAddress2 + "," : ""} ${
this.ServiceLocationAddress
},<br/> ${this.ServiceLocationCity}, ${this.ServiceLocationState} ${
this.ServiceLocationZipCode
}`;
return `${this.ServiceLocationAddress}${this.ServiceLocationAddress2 ? ", " + this.ServiceLocationAddress2 : ""},<br/> ${this.ServiceLocationCity}, ${this.ServiceLocationState} ${this.ServiceLocationZipCode}`;
},
ProviderFullAddress() {
return `${this.ProviderAddress},<br/> ${this.ProviderCity}, ${this.ProviderState} ${this.ProviderZipCode}`;
@ -447,7 +443,6 @@ export default {
funnelHeader,
Form,
navbar,
vehicleBanner,
addToCalendar,
cart,
textBlock,
@ -517,7 +512,7 @@ export default {
display: flex;
align-items: center;
justify-content: center;
padding: 1rem 0 1.5rem 0;
padding: 1.5rem 0;
p {
display: inline-block;

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

@ -8,8 +8,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" />
<div>
<div class="vinlookupquestion" v-html="this.VinLookupQuestionText"></div>
@ -40,7 +39,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import buttonQuestion from "@/digital-components/button-question/button-question";
import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
@ -218,7 +216,6 @@ export default {
},
components: {
funnelHeader,
vehicleBanner,
funnelSubHeader,
navbar,
buttonQuestion,

7
src/layouts/license-plate-lookup/license-plate-lookup.vue
View file

@ -7,10 +7,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
@ -97,7 +94,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import alert from "@/ux-components/alert/alert";
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
@ -403,7 +399,6 @@ export default {
components: {
funnelHeader,
navbar,
vehicleBanner,
funnelSubHeader,
textboxQuestion,
alert,

6
src/layouts/part-questions/part-questions.vue
View file

@ -57,12 +57,14 @@ export default {
vm.setCmsContent(resultMap.cmsContent);
if (store.getters.externalParameterState?.isExternalParameter) {
if (store.getters.externalParameterServiceZip.zipCode) {
const serviceState = store.getters.order.serviceLocation.state;
const serviceZipCtu = store.getters.order.serviceLocation.zipCodeCtu;
await baseMixin.methods.dispatchStoreAction(
storeActions.SAVE_SERVICE_ZIP_CODE_INFO,
{
zipCode: store.getters.externalParameterServiceZip.zipCode,
state: null,
zipCodeCtu: null,
state: serviceState ?? null,
zipCodeCtu: serviceZipCtu ?? null,
},
false
);

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

@ -8,12 +8,9 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader class="mb-5 mt-4" cmsWidgetName="FunnelSubHeaderWidget" />
<funnelSubHeader class="mb-5" cmsWidgetName="FunnelSubHeaderWidget" />
<hr class="my-0" />
@ -423,7 +420,32 @@ export default {
customer.emailAddress
);
return serviceLocationReqs && isInsuranceSet && scheduleReqs && customerReqs;
const preReqResult = serviceLocationReqs && isInsuranceSet() && scheduleReqs && customerReqs;
// prettier-ignore
{
const log = getQuerystringParameter(queryStrings.LOG);
if (eval(log) || !preReqResult) {
console.log("------------- payment-method.vue pagePrereqs start -----------------");
console.log(new Date() + " serviceLocationReqs::isMobile: " + isMobile);
console.log(new Date() + " serviceLocationReqs::mobileReqs: " + mobileReqs);
console.log(new Date() + " serviceLocationReqs::dropOffInshopReqs: " + dropOffInshopReqs);
console.log(new Date() + " serviceLocationReqs:: result " + serviceLocationReqs);
console.log(new Date() + " isInsuranceSet:: " + isInsuranceSet());
console.log(new Date() + " scheduleReqs::schedule.date:" + schedule.date);
console.log(new Date() + " scheduleReqs::schedule.startTime:" + schedule.startTime);
console.log(new Date() + " scheduleReqs::schedule.endTime:" + schedule.endTime);
console.log(new Date() + " scheduleReqs::schedule.jobMaxMinutes:" + schedule.jobMaxMinutes);
console.log(new Date() + " scheduleReqs::schedule.jobMinMinutes:" + schedule.jobMinMinutes);
console.log(new Date() + " customerReqs::customer.firstName:" + customer.firstName);
console.log(new Date() + " customerReqs::customer.lastName:" + customer.lastName);
console.log(new Date() + " customerReqs::customer.phoneNumber:" + customer.phoneNumber);
console.log(new Date() + " customerReqs::customer.emailAddress:" + customer.emailAddress);
console.log("------------- payment-method.vue pagePrereqs end -----------------");
}
}
return preReqResult;
},
getPaymentMethodFromStore() {
const piaType = store.getters.order.payment.piaType;
@ -596,10 +618,7 @@ export default {
return containsRecalParts(order.lineItems);
},
shouldHideRecalibration() {
return (
this.getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)?.toLowerCase() ===
"true" && this.isRecalibrationOnOrder
);
return this.$store.getters.shouldHideRecalibration;
},
showApplePay() {
return baseMixin.methods.showApplePay();

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

@ -139,8 +139,8 @@
type="hidden"
name="sgtermsofusedisplaytext"
value="By selecting submit, I agree to Safelite's" />
<input type="hidden" name="sgtermsofuseurl" value="http://www.safelite.com/terms-of-use/" />
<input type="hidden" name="sgtermsofuselinkdisplaytext" value="terms of use" />
<input type="hidden" name="sgtermsofuseurl" value="http://www.safelite.com/terms-of-service/" />
<input type="hidden" name="sgtermsofuselinkdisplaytext" value="Terms of service" />
<input type="hidden" name="sgtermsofcancelrefunddisplaytext" value="and" />
<input
type="hidden"

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

@ -8,13 +8,8 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader class="mb-5" cmsWidgetName="FunnelSubHeaderWidget" />
<cashOrInsuranceQuestion
ref="cashOrInsurance"
cmsWidgetName="CashOrInsuranceQuestionWidget"
@ -59,7 +54,7 @@
alertClass="alert-info" />
<promoModalQuestion
class="small mt-6 d-md-flex justify-content-md-center"
class="small mt-6 d-flex justify-content-center"
v-model="lineItems"
:addableVaps="addableVaps"
pageName="quote"
@ -67,12 +62,6 @@
:useDefaultCashParentAccount="true"
modalWidgetName="PromoModalWidget" />
<textBlock
cmsWidgetName="quoteDisclaimer"
justifyText="left"
typeStyle="caption"
class="mt-6 quote-disclaimer" />
<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
<contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" />
<contentGroupModal ref="RearWiperModal" cmsWidgetName="RearWiperModal" />
@ -84,6 +73,12 @@
:isBackButtonHidden="shouldHideBackButton"
@back-clicked="backButtonAction"
@ForwardClicked="forwardButtonAction" />
<textBlock
cmsWidgetName="quoteDisclaimer"
justifyText="center"
typeStyle="caption"
class="mb-5 quote-disclaimer" />
</div>
</div>
</div>
@ -94,7 +89,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import cashOrInsuranceQuestion from "./cash-or-insurance-question/cash-or-insurance-question";
import servicePackageQuestion from "./service-package-question/service-package-question";
@ -453,10 +447,20 @@ export default {
arePagePrerequisitesValid() {
const payment = store.getters.order.payment;
const preReqResult = (
store.getters.order.serviceLocation.zipCode &&
store.getters.order.serviceLocation.zipCodeCtu &&
(store.getters.order.damage.isRepair ||
(store.getters.order.lineItems?.glassParts != null &&
store.getters.order.lineItems.glassParts.length > 0)) &&
(payment.insuranceCoverage?.isVerified == null ||
payment.insuranceCoverage?.isVerified === false)
);
// prettier-ignore
{
const log = getQuerystringParameter(queryStrings.LOG);
if (eval(log)) {
if (eval(log) || !preReqResult) {
console.log("------------- quote.vue pagePrereqs start -----------------");
console.log(new Date() + " store.getters.order.serviceLocation.zipCode: " + store.getters.order.serviceLocation?.zipCode);
console.log(new Date() +" store.getters.order.serviceLocation.zipCodeCtu: " + store.getters.order.serviceLocation?.zipCodeCtu);
@ -467,15 +471,7 @@ export default {
}
}
return (
store.getters.order.serviceLocation.zipCode &&
store.getters.order.serviceLocation.zipCodeCtu &&
(store.getters.order.damage.isRepair ||
(store.getters.order.lineItems?.glassParts != null &&
store.getters.order.lineItems.glassParts.length > 0)) &&
(payment.insuranceCoverage?.isVerified == null ||
payment.insuranceCoverage?.isVerified === false)
);
return preReqResult;
},
vapsItemsSelectedAction(vapsItemsSelected) {
this.lineItems.vaps = vapsItemsSelected;
@ -596,7 +592,7 @@ export default {
});
}
let price = 0;
if (tier.value == "TierTwo" && this.isServicePackageDiscountOnOrder) {
if (tier.additionalButtonData?.servicePackageDiscount && this.isServicePackageDiscountOnOrder) {
lineItemsToPrice.push(...this.servicePackageDiscountParts);
}
price += baseMixin.methods.getTierOnePackagePrice(
@ -646,7 +642,6 @@ export default {
components: {
funnelHeader,
navbar,
vehicleBanner,
funnelSubHeader,
Form,
textBlock,

17
src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
View file

@ -71,7 +71,7 @@
</ul>
<!-- End of body text parsing -->
<div
class="package-footer fw-bold caption ms-n6 mt-4"
class="package-footer fw-bold caption ms-n4 mt-4"
v-if="this.buttonFooterCopy"
v-html="this.buttonFooterCopy"></div>
</div>
@ -166,14 +166,14 @@ export default {
position: relative;
cursor: pointer;
width: 100%;
padding: 1rem;
padding: 0.75rem;
border: 1px solid $gray-300;
box-shadow:
0px 4px 8px -4px rgba(0, 0, 0, 0.15),
0px 4px 24px -8px rgba(0, 0, 0, 0.2);
border-radius: 0.5rem;
overflow: hidden;
min-height: 60px;
min-height: 52px;
max-height: 126px;
@include media-breakpoint-up(md) {
max-height: 500px;
@ -182,14 +182,14 @@ export default {
transition: max-height 0.25s ease-in;
&.has-subheader {
min-height: 80px;
min-height: 72px;
}
&:before {
content: "";
position: relative;
top: 5px;
margin-right: 1rem;
margin-right: 0.5rem;
border-radius: 50%;
border: 1px solid $gray-500;
width: 16px;
@ -200,8 +200,8 @@ export default {
&:after {
content: "";
position: absolute;
left: 19px;
top: 24px;
left: 15px;
top: 20px;
border-radius: 50%;
width: 10px;
height: 10px;
@ -280,6 +280,7 @@ export default {
font-weight: 600;
display: flex;
justify-content: space-between;
align-items: center;
span {
&.pricing-info {
color: $green;
@ -341,7 +342,7 @@ export default {
}
}
ul {
margin: 1rem 0 0 -15px;
margin: 1rem 0 0 -5px;
padding: 0;
li {
font-size: 0.875rem;

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

@ -307,22 +307,6 @@ export default {
arePagePrerequisitesValid() {
const serviceLocation = store.getters.order.serviceLocation;
// prettier-ignore
{
const log = getQuerystringParameter(queryStrings.LOG);
if (eval(log)) {
console.log("------------- schedule.vue pagePrereqs start -----------------");
console.log(new Date() + " store.getters.order.serviceLocation.zipCode: " + serviceLocation.zipCode);
console.log(new Date() + " store.getters.order.serviceLocation.zipCodeCtu: " + serviceLocation.zipCodeCtu);
console.log(new Date() + " store.getters.order.serviceLocation.appointmentType: " + serviceLocation.appointmentType);
console.log(new Date() + " store.getters.order.serviceLocation.provider.providerNumber: " + serviceLocation.provider.providerNumber);
console.log(new Date() + " store.getters.payment.isInsurance: " + store.getters.payment?.isInsurance);
console.log(new Date() + " store.getters.order.damage.isRepair: " + store.getters.order.damage.isRepair);
console.log(new Date() + " store.getters.order.lineItems.glassParts: " + JSON.stringify(store.getters.order.lineItems?.glassParts));
console.log("------------- schedule.vue pagePrereqs end -------------------");
}
}
const serviceLocationPreReqs =
serviceLocation.zipCode &&
serviceLocation.zipCodeCtu &&
@ -337,7 +321,24 @@ export default {
(store.getters.order.lineItems?.glassParts != null &&
store.getters.order.lineItems.glassParts.length > 0);
return serviceLocationPreReqs && paymentInfo && damageInfo;
const preReqResult = serviceLocationPreReqs && paymentInfo && damageInfo;
// prettier-ignore
{
const log = getQuerystringParameter(queryStrings.LOG);
if (eval(log) || !preReqResult) {
console.log("------------- schedule.vue pagePrereqs start -----------------");
console.log(new Date() + " store.getters.order.serviceLocation.zipCode: " + serviceLocation.zipCode);
console.log(new Date() + " store.getters.order.serviceLocation.zipCodeCtu: " + serviceLocation.zipCodeCtu);
console.log(new Date() + " store.getters.order.serviceLocation.appointmentType: " + serviceLocation.appointmentType);
console.log(new Date() + " store.getters.order.serviceLocation.provider.providerNumber: " + serviceLocation.provider.providerNumber);
console.log(new Date() + " store.getters.payment.isInsurance: " + store.getters.payment?.isInsurance);
console.log(new Date() + " store.getters.order.damage.isRepair: " + store.getters.order.damage.isRepair);
console.log(new Date() + " store.getters.order.lineItems.glassParts: " + JSON.stringify(store.getters.order.lineItems?.glassParts));
console.log("------------- schedule.vue pagePrereqs end -------------------");
}
}
return preReqResult;
},
async getAvailableDatesMethod(startDate, endDate) {
const newShopTimeSlots = await getAvailableDates(
@ -445,6 +446,11 @@ export default {
forwardButtonAction() {
this.updateSupportingItems();
if (this.selectedTimeSlotInfo.timeSlot.jobMinMinutes == null) {
this.selectedTimeSlotInfo.timeSlot.jobMinMinutes = this.selectableDatesData?.estimatedServiceMinutesMinimum?.toString();
this.selectedTimeSlotInfo.timeSlot.jobMaxMinutes = this.selectableDatesData?.estimatedServiceMinutesMaximum?.toString();
}
this.dispatchStoreAction(
this.storeActions.SAVE_SCHEDULE,
this.selectedTimeSlotInfo.timeSlot,

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

@ -8,8 +8,8 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mt-5" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
<serviceZipModalQuestion
editScreenReaderTextCmsWidgetName="ScreenReaderZipEditWidget"
@ -389,14 +389,13 @@ export default {
) {
return true;
} else {
console.log(
"ins: servce-location invalid prereq:" +
store.getters.payment.parentAccountNumber +
":" +
store.getters.order.policy.policyNumber +
":" +
store.getters.order.serviceLocation.zipCode
);
// prettier-ignore
{
console.log(new Date() + "Insurance: servce-location invalid prereqs");
console.log(new Date() + "store.getters.payment.parentAccountNumber:" + store.getters.payment.parentAccountNumber);
console.log(new Date() + "store.getters.order.policy.policyNumber:" + store.getters.order.policy.policyNumber);
console.log(new Date() + "store.getters.order.serviceLocation.zipCode:" + store.getters.order.serviceLocation.zipCode);
}
return false;
}
} else {
@ -406,12 +405,12 @@ export default {
) {
return true;
} else {
console.log(
"cash: servce-location invalid prereq:" +
JSON.stringify(store.getters.lineItems.supportingItems) +
":" +
store.getters.order.serviceLocation.zipCode
);
// prettier-ignore
{
console.log(new Date() + "Cash: servce-location invalid prereqs");
console.log(new Date() + "store.getters.lineItems.supportingItems:" + JSON.stringify(store.getters.lineItems.supportingItems));
console.log(new Date() + "store.getters.order.serviceLocation.zipCode:" + store.getters.order.serviceLocation.zipCode);
}
return false;
}
}

5
src/layouts/service-zip/service-zip.vue
View file

@ -8,8 +8,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" />
<div>
<textboxQuestion
@ -65,7 +64,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import buttonQuestion from "@/digital-components/button-question/button-question";
import alert from "@/ux-components/alert/alert";
@ -278,7 +276,6 @@ export default {
},
components: {
funnelHeader,
vehicleBanner,
funnelSubHeader,
navbar,
Form,

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

@ -7,13 +7,8 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
<alert
ref="vehicleChangeAlert"
v-if="shouldDisplayVehicleChangeAlert"
@ -84,7 +79,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import sideDoorOptions from "@/layouts/vehicle-damage/side-door-options/side-door-options";
import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question";
@ -718,7 +712,6 @@ export default {
components: {
funnelHeader,
navbar,
vehicleBanner,
funnelSubHeader,
sideDoorOptions,
damageLocationQuestion,

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

@ -9,11 +9,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
ref="vehicleBanner"
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader
ref="funnelSubHeader"
cmsWidgetName="FunnelSubHeaderWidget" />
@ -60,7 +56,6 @@
// Components
import glassPartQuestion from "@/layouts/vehicle-parts/glass-part-question/glass-part-question";
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import alert from "@/ux-components/alert/alert";
@ -238,7 +233,6 @@ export default {
Form,
glassPartQuestion,
funnelHeader,
vehicleBanner,
funnelSubHeader,
navbar,
alert,

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

@ -48,14 +48,6 @@
validationRules="style-required"
placeHolderText="Select style"
customDropdownId="styleQuestionField" />
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="displayGeneric"
:displayVehicleImage="imageUrl"
:vehicleCategory="category"
:displayUnmatchedVehicleIcon="unmatchedVehicleIcon"
class="mt-5 vehicle-footer"
ref="banner" />
<alert
ref="AlertNoService"
v-if="displayNoServiceAlert"
@ -82,7 +74,6 @@
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import alert from "@/ux-components/alert/alert";
import vehicleQuestion from "@/layouts/vehicle/vehicle-question/vehicle-question";
@ -541,7 +532,6 @@ export default {
funnelHeader,
navbar,
funnelSubHeader,
vehicleBanner,
Form,
alert,
vehicleQuestion,

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

@ -8,13 +8,8 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4">
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
<textboxQuestion
class="mb-2 mt-5"
cmsWidgetName="VinNumberQuestionWidget"
@ -132,7 +127,6 @@
// Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import alert from "@/ux-components/alert/alert";
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
@ -506,7 +500,6 @@ export default {
components: {
funnelHeader,
navbar,
vehicleBanner,
funnelSubHeader,
textboxQuestion,
alert,

24
src/router/index.js
View file

@ -97,8 +97,6 @@ const routes = [
);
updateOrCreateFunnelCookie();
}
//Update external parameter state
updateExternalParameterState();
//Affiliate Cookies
const affiliateCookies = getAffiliateCookies();
@ -115,12 +113,16 @@ const routes = [
to.query.fmgPage
);
//Update external parameter state but not when returning from heritage
if (!to.query.fmgPage?.startsWith("service-location")) {
updateExternalParameterState();
}
// clear part related state because heritage selected a new vehicle
if (
to.query.fmgPage === fmgPageValues.VEHICLE &&
eval(getFunnelCookie()?.HasDelayedClaimRegistration)
) {
console.log(new Date() + "Router: Policy Vehicle Changed");
store.commit(storeMutations.RESET_GLASS_PARTS_STATE);
}
@ -637,6 +639,22 @@ function getRedirectedStartPage() {
}
function updateExternalParameterState() {
// if there is an existing external parameter state then they have already been through from an external source(LeadGen) and
// are returning. clear out prior related things that need to be selected again like parts and damage type.
if (
store.getters.externalParameterState?.isExternalParameter ==
externalParameterStatus.INACTIVE
) {
store.dispatch(storeActions.RESET_VEHICLE_STATE_AND_DEPENDENCIES);
store.dispatch(storeActions.SAVE_SERVICE_ZIP_CODE_INFO, {
state: null,
zipCode: null,
zipCodeCtu: null,
});
store.dispatch(storeActions.SAVE_EMAIL, null);
store.dispatch(storeActions.RESET_DAMAGE_STATE_AND_DEPENDENCIES);
}
const externalParameterYear = getQuerystringParameter(queryStrings.VEHICLE_YEAR);
const externalParameterMake = getQuerystringParameter(queryStrings.VEHICLE_MAKE);
const externalParameterModel = getQuerystringParameter(queryStrings.VEHICLE_MODEL);

20
src/store/index.js
View file

@ -819,10 +819,21 @@ export const getters = {
return false;
},
shouldHideRecalibration: (state) => {
var order;
if (window.sessionStorage.getItem("submittedOrder") !== null) {
order = JSON.parse(window.sessionStorage.getItem("submittedOrder"));
} else {
order = state.order;
}
if (order.payment.isInsurance) {
return false;
}
return (
experimentMixin.methods
.getSettingValue(experimentSettings.RECAL_PRICE_REMOVE)
?.toLowerCase() === "true" && getters.isRecalibrationOnOrder
?.toLowerCase() === "true" && getters.isRecalibrationOnOrder(state)
);
},
areRearWipersOnOrder: (state) => {
@ -1153,6 +1164,12 @@ export const actions = {
},
// Dependency Actions
resetVehicleStateAndDependencies(context) {
context.commit(storeMutations.RESET_VEHICLE_STATE);
context.dispatch(storeActions.RESET_DAMAGE_STATE_AND_DEPENDENCIES);
},
resetDamageAndDependencies(context) {
context.commit(storeMutations.RESET_DAMAGE_STATE);
@ -2937,6 +2954,7 @@ export const actions = {
// set to local storage
window.sessionStorage.setItem("submittedOrder", JSON.stringify(submittedOrder));
window.sessionStorage.setItem("createNewSessionForHeritage", true);
// clear vuex
context.commit(storeMutations.RESET_STATE);

81
src/styles/common-typography-styles.scss
View file

@ -76,68 +76,53 @@ caption,
font-weight: 500;
}
// Poppins styles from Google Fonts
// Averta Fonts
// Regular styles
.poppins-light {
font-family: "Poppins", sans-serif;
font-weight: 300;
@font-face {
font-family: 'AvertaBold';
src: url('@/assets/fonts/averta-bold-webfont.woff2') format('woff2'),
url('@/assets/fonts/averta-bold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
.poppins-regular {
font-family: "Poppins", sans-serif;
font-weight: 400;
@font-face {
font-family: 'AvertaBold_Italic';
src: url('@/assets/fonts/averta-bolditalic-webfont.woff2') format('woff2'),
url('@/assets/fonts/averta-bolditalic-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
.poppins-medium {
font-family: "Poppins", sans-serif;
font-weight: 500;
@font-face {
font-family: 'AvertaExtraBold';
src: url('@/assets/fonts/averta-extrabold-webfont.woff2') format('woff2'),
url('@/assets/fonts/averta-extrabold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
.poppins-semibold {
font-family: "Poppins", sans-serif;
font-weight: 600;
@font-face {
font-family: 'AvertaRegular';
src: url('@/assets/fonts/averta-regular-webfont.woff2') format('woff2'),
url('@/assets/fonts/averta-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
.poppins-bold {
font-family: "Poppins", sans-serif;
font-weight: 700;
@font-face {
font-family: 'AvertaRegular_Italic';
src: url('@/assets/fonts/averta-regularitalic-webfont.woff2') format('woff2'),
url('@/assets/fonts/averta-regularitalic-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
// Italic styles
@font-face {
font-family: 'AvertaSemibold';
src: url('@/assets/fonts/averta-semibold-webfont.woff2') format('woff2'),
url('@/assets/fonts/averta-semibold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
.poppins-light-italic {
font-family: "Poppins", sans-serif;
font-weight: 300;
font-style: italic;
}
.poppins-regular-italic {
font-family: "Poppins", sans-serif;
font-weight: 400;
font-style: italic;
}
.poppins-medium-italic {
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: italic;
}
.poppins-semibold-italic {
font-family: "Poppins", sans-serif;
font-weight: 600;
font-style: italic;
}
.poppins-bold-italic {
font-family: "Poppins", sans-serif;
font-weight: 700;
font-style: italic;
}
}

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

@ -115,7 +115,7 @@ $theme-colors: (
$body-color: $gray-600;
//Fonts
$font-family-sans-serif: Poppins, Arial, Helvetica, sans-serif;
$font-family-sans-serif: AvertaRegular, Arial, Helvetica, sans-serif;
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
monospace;
// stylelint-enable value-keyword-case

4
src/ux-components/list-button-horizontal/list-button-horizontal.vue
View file

@ -7,7 +7,7 @@
]"
v-model="selectedValue">
<div
class="button-content list-button-horizontal-content d-flex flex-column justify-content-center p-3">
class="button-content list-button-horizontal-content d-flex flex-column justify-content-center p-2">
<span class="m-0" :class="textPosition">
{{ buttonLabel }}
</span>
@ -105,7 +105,7 @@ export default {
span {
font-size: 1rem;
font-weight: 500;
font-weight: 600;
}
}

2
src/ux-components/list-card/list-card.vue
View file

@ -7,7 +7,7 @@
]"
v-model="selectedValue">
<div
class="d-flex w-100 align-items-center px-2 h-100 list-card-content button-content rounded-3"
class="d-flex w-100 align-items-center px-1 h-100 list-card-content button-content rounded-3"
:class="labelClasses">
<img
v-if="buttonImage"