Merge branch 'develop' into feature/CSR-2130

This commit is contained in:
CarlNation 2024-07-18 10:13:30 -04:00
commit 6d9f7bcb4f
9 changed files with 95 additions and 64 deletions

View file

@ -33,15 +33,15 @@ const endpoints = {
method: "GET",
},
LookupVehicleByVin: {
url: "/vehicle/api/v1/vehicle/Lookup",
url: "/vehicle/api/v1/vehicle/lookup",
method: "POST",
},
LookupVinByPlate: {
url: "/vehicle/api/v1/vehicle/lookup-vin-by-plate",
url: "/vehicle/api/v1/vehicle/lookup-by-plate",
method: "POST",
},
LookupVinByAddress: {
url: "/vehicle/api/v1/vehicle/lookup-vin-by-address",
url: "/vehicle/api/v1/vehicle/lookup-by-address",
method: "POST",
},
LookupVinByImage: {

View file

@ -4,6 +4,7 @@ const experimentUniverses = {
const experimentSettings = {
GOOGLE_CUSTOM_DIMENSION_INDEX: "Google Custom Dimension Index",
SUPPRESS_VIN_CAPTURE: "SuppressVinCapture",
DISPLAY_AVAILABILITY_INDICATORS: "DisplayAvailabilityIndicators",
PIA_EXPERIENCE: "PIA Experience",
PIA_INSURANCE: "DisplayPIAInsurance",

View file

@ -213,7 +213,7 @@ export default {
classes = "ui-checkbox d-flex";
break;
case "servicePackageRadio":
classes = "package-main d-md-flex justify-content-center";
classes = "package-main d-md-flex justify-content-md-center";
break;
}
return classes;
@ -255,7 +255,7 @@ export default {
buttonFooterCopy: answer.buttonFooterCopy ?? answer.buttonFooterCopy,
buttonImage: answer.buttonImage ?? answer.AnswerImageUrl,
buttonImageId: answer.buttonImageId ?? answer.ImageId,
additionalButtonData: answer.additionalButtonData,
additionalButtonData: answer.additionalButtonData ?? answer.additionalButtonData,
groupName: this.formatString(this.groupName),
value:
answer.value ??

View file

@ -5,6 +5,9 @@ import { lazyLoadComponent } from "@/router/dynamic-routing/component-loader.js"
import { saveSession } from "@/helpers/heritage-integration/order-helper.js";
import { fmgPageValues } from "@/router/router-constants/fmgPage-values";
import { storeActions } from "@/constants/store-actions.js";
import { settleAllPromises } from "@/helpers/layout-helper";
import experimentMixin from "@/mixins/experiment-mixin";
import { experimentSettings } from "@/constants/experiments";
import { includesWindshieldReplacement } from "@/helpers/damage-helper";
import store from "@/store";
import router from "@/router";
@ -139,7 +142,11 @@ export async function skipVinLookup() {
? await store.dispatch(storeActions.IS_VIN_OPTIONAL_VEHICLE)
: false;
return isVinOptionalVehicle || !includesWindshieldReplacement();
return (
isVinOptionalVehicle ||
!includesWindshieldReplacement() ||
experimentMixin.methods.hasSettingEqualTo(experimentSettings.SUPPRESS_VIN_CAPTURE, "true")
);
}
export async function skipVinLookupNotRepair() {
@ -151,7 +158,11 @@ export async function skipVinLookupNotRepair() {
? await store.dispatch(storeActions.IS_VIN_OPTIONAL_VEHICLE)
: false;
return isVinOptionalVehicle || !includesWindshieldReplacement();
return (
isVinOptionalVehicle ||
!includesWindshieldReplacement() ||
experimentMixin.methods.hasSettingEqualTo(experimentSettings.SUPPRESS_VIN_CAPTURE, "true")
);
}
async function getLazyLoadedComponent(pageName) {

View file

@ -115,6 +115,16 @@ describe("getPageToRouteExistingOrderTo", () => {
store.commit(storeMutations.UPDATE_IS_REPAIR, false);
store.commit(storeMutations.UPDATE_MAKE, "acura");
const mockExperimentsList = [
{
universeName: "ConceptFunnel",
settings: {
SuppressVinCapture: false,
},
},
];
store.commit(storeMutations.UPDATE_EXPERIMENTS, mockExperimentsList);
// Mock out the lazy load calls for all components.
mockLazyLoadComponentReturnValues({
[fmgPageValues.VEHICLE]: true,

View file

@ -1,7 +1,7 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles quote">
<div class="container-fluid page-container-grouped-styles">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
@ -23,7 +23,7 @@
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-lg-4">
<div class="col-md-12 col-xl-8">
<servicePackageQuestion
ref="servicePackage"
cashCmsWidgetName="CashServicePackageQuestionWidget"
@ -49,13 +49,14 @@
:lineItems="lineItems" />
<recalDisclaimer
class="mb-0"
cmsWidgetName="RecalDisclaimerWidget"
v-if="isRecalibrationOnOrder"
v-on="{ textLinkClicked: openModalAction }"
alertClass="alert-info" />
<promoModalQuestion
class="small mt-4"
class="small mt-6 d-md-flex justify-content-md-center"
v-model="lineItems"
:addableVaps="addableVaps"
pageName="quote"
@ -67,7 +68,7 @@
cmsWidgetName="quoteDisclaimer"
justifyText="left"
typeStyle="caption"
class="mt-4" />
class="mt-6" />
<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
<contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" />

View file

@ -12,9 +12,7 @@
]"
for="testradio">
<div class="package-specs">
<div
v-if="this.additionalButtonData.servicePackageDiscount"
class="row justify-content-between">
<div v-if="this.additionalButtonData.servicePackageDiscount" class="row">
<div class="col md-6">
<p class="m-0">
<span v-html="this.buttonLabel"></span>
@ -140,18 +138,24 @@ export default {
<style lang="scss">
.package-main {
.package-wrapper {
margin: 1rem 0;
@include media-breakpoint-up(md) {
margin: 0.5rem 0;
}
position: relative;
margin: 0.5rem 0;
@include media-breakpoint-up(md) {
margin: 1rem 0.5rem;
display: flex;
flex-direction: column;
align-self: flex-end;
}
label {
display: block;
height: 100%;
@include media-breakpoint-up(md) {
display: flex;
min-height: 320px;
}
@include media-breakpoint-up(xl) {
display: flex;
min-height: 276px;
}
}
input[type="radio"] {
@ -172,21 +176,13 @@ export default {
border-radius: 0.5rem;
overflow: hidden;
min-height: 60px;
@include media-breakpoint-up(md) {
max-height: 500px;
height: 100%;
}
&.has-subheader {
min-height: 80px;
}
&.has-text {
border-radius: 0 0 0.5rem 0.5rem;
border: 1px solid #469d2a;
@include media-breakpoint-up(md) {
border-radius: 0.5rem;
padding-top: 3.75rem;
}
border: 1px solid #469d2a; //Temp color
}
&:before {
@ -263,26 +259,35 @@ export default {
.package-footer {
color: $red;
font-weight: 600;
}
.package-specs {
display: flex;
flex-direction: column;
width: 100%;
max-height: 0;
transition: all 0.5s ease;
@include media-breakpoint-up(md) {
max-height: 500px;
}
p {
font-weight: 500;
font-weight: 600;
display: flex;
justify-content: space-between;
span {
&.pricing-info {
color: $green;
font-size: 0.875rem;
@include media-breakpoint-up(md) {
position: absolute;
bottom: 0.75rem;
left: 0;
width: 100%;
text-align: center;
font-size: 1.125rem;
color: $gray-500;
}
span.strikethrough-price {
text-decoration: line-through;
font-size: 0.75rem;
@ -300,23 +305,30 @@ export default {
}
span {
&.service-package-discount {
color: #469d2a;
color: #469d2a; //Temp color
text-align: end;
font-weight: 500;
font-size: 13px;
div.strikethrough-discount-price {
text-decoration: line-through;
margin-right: 0;
font-weight: 500;
font-size: 14px;
font-weight: 400;
font-size: 0.875rem;
line-height: 20px;
color: $gray-550;
color: $gray-500;
padding-right: 2px;
}
div.discount-price {
color: #469d2a;
color: #469d2a; //Temp color
font-weight: 600;
font-size: 26px;
font-size: 1.625rem;
}
@include media-breakpoint-up(md) {
position: absolute;
bottom: 0.75rem;
left: 0;
width: 100%;
text-align: center;
}
}
}
@ -327,6 +339,7 @@ export default {
margin-bottom: 0.5rem;
font-size: 0.875rem;
line-height: 1.714;
color: $gray-550;
a {
line-height: 1.714;
padding: 0;
@ -353,28 +366,19 @@ export default {
}
}
.discount-text {
line-height: 36px;
height: 2rem;
display: flex;
border-top-right-radius: 0.5rem;
border-top-left-radius: 0.5rem;
background-color: #469d2a;
background-color: #469d2a; //Temp color
align-items: center;
justify-content: center;
padding: 5px;
width: 100%;
color: white;
height: 2.875rem;
@include media-breakpoint-up(md) {
position: absolute;
z-index: 1;
~ label {
.package-label {
&:after {
top: 68px;
}
}
}
}
text-transform: uppercase;
font-size: 0.875rem;
font-weight: 600;
letter-spacing: 0.75px;
}
}
}

View file

@ -10,6 +10,7 @@ import router from "@/router";
import { navigationScenarios } from "@/router/router-constants/navigation-scenarios";
import { saveSession } from "@/helpers/heritage-integration/order-helper.js";
import vinPagesMixin from "@/mixins/vin-pages-mixin";
import { experimentSettings } from "../../constants/experiments";
// Constants
@ -23,6 +24,16 @@ let mockCmsContent = {
let mockStoreActionData = {};
let mockStoreData = {};
let mockExperimentSettings = {
experiments: [
{
universeName: "ConceptFunnel",
settings: {
SuppressVinCapture: false,
},
},
],
};
function resetMockStoreData() {
mockStoreData = {
@ -159,12 +170,14 @@ function resetMockStoreData() {
function applyMockStoreDataToGetters() {
store.getters = {
experimentSettings: mockExperimentSettings,
order: mockStoreData,
damage: mockStoreData.damage,
payment: mockStoreData.payment,
policy: mockStoreData.policy,
};
store.state.order = mockStoreData;
store.state.applicationUser.experiments = mockExperimentSettings;
}
async function mockDispatchStoreAction(actionName) {

View file

@ -37,18 +37,9 @@ body {
max-width: 100%;
}
}
// Quote page desktop
&.quote {
.col-md-6,
.col-lg-4 {
max-width: 1200px;
}
.col-md-6.col-lg-4 {
@include media-breakpoint-up(lg) {
width: 100%;
max-width: 910px;
}
}
//Quote page max-width for service packages
.col-xl-8 {
max-width: 1200px;
}
//END set max-width on columns
}