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

Merge branch 'release/2025.09.04' into feature/CASH-1063v2

Browse source
This commit is contained in:
Johnny Shultz 2025-08-15 16:11:07 -04:00 committed by GitHub
commit 358dcd942f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
17 changed files with 131 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/constants/error-messages.js
View file

@ -26,7 +26,7 @@ const errorMessages = {
VIN_FORMAT:
"Invalid VIN. Please make sure that you entered the correct 17-digit, alpha-numeric number. VINs do not contain the letters I, O, or Q",
OPTION_REQUIRED: "Please select an option",
RECAL_ACK_REQUIRED: "Please acknowledge recalibration alert",
RECAL_ACK_REQUIRED: "You must agree to the terms to submit",
VEHICLE_REQUIRED: "Please select a vehicle",
MOBILE_LOCATION_REQUIRED: "Please enter your service address",
DATE_REQUIRED: "Please select a date",
@ -37,6 +37,7 @@ const errorMessages = {
MODEL_REQUIRED: "Please select your vehicle model",
STYLE_REQUIRED: "Please select your vehicle style",
PROMO_REQUIRED: "Please enter a promo code",
INSURANCE_COMPANY_REQUIRED: "Please select an insurance company",
};
export { errorMessages };

10
src/constants/progress-bar-mapper.js
View file

@ -1,11 +1,11 @@
export const pageProgressMapper = {
//Combine progress bar slide percent and button steps
vehicle: {
percent: 10,
percent: 8,
step: 1,
},
"vehicle-damage": {
percent: 14,
percent: 11,
step: 1,
},
estimate: {
@ -49,7 +49,7 @@ export const pageProgressMapper = {
step: 1,
},
quote: {
percent: 39, //The first Step 2 must be 39 so the animated bar lines up with the dot
percent: 62,
step: 2,
},
"insurance-company": {
@ -61,7 +61,7 @@ export const pageProgressMapper = {
step: 2,
},
schedule: {
percent: 70.5, //The first Step 3 must be 70.5 so the animated bar lines up with the dot
percent: 76,
step: 3,
},
"mobile-details": {
@ -73,7 +73,7 @@ export const pageProgressMapper = {
step: 3,
},
"payment-method": {
percent: 97, //The first Step 4 must be 97 so the animated bar lines up with the dot
percent: 97,
step: 4,
},
payment: {

5
src/digital-components/date-picker/date-picker.vue
View file

@ -1039,6 +1039,7 @@ export default {
fieldset {
flex-grow: 1;
position: relative;
width: 100%;
.view-more-dates {
color: $blue;
@ -1109,11 +1110,11 @@ export default {
.month-year {
grid-area: 1 / 1 / 2 / 5;
font-family: UrbanistSemiBold;
font-family: UrbanistRegular;
color: $black;
justify-content: left;
margin-bottom: 0.5rem;
font-weight: 500;
font-weight: 600;
}
.legend {
grid-area: 1 / 5 / 2 / 8;

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

@ -9,8 +9,7 @@
tabindex="-1"
aria-labelledby="ModalComponentLabel"
@keypress.enter="onEnter"
aria-hidden="true"
@click.self="closeModal">
aria-hidden="true">
<!--Close modal when clicking other than close button-->
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">

16
src/experiment-components/service-package-radio-for-afterpay.vue
View file

@ -219,11 +219,6 @@ export default {
&.has-subheader {
& > .package-specs {
display: inline-flex;
@include media-breakpoint-up(md) {
& > div:first-of-type {
display: flex;
}
}
}
}
@ -338,16 +333,11 @@ export default {
&.sub-label {
color: $green;
display: inline-flex;
padding: 0.25rem 0;
text-transform: uppercase;
font-size: 0.75rem;
margin-left: auto;
@include media-breakpoint-up(md) {
background-color: $green-100;
padding: 0.25rem 0.5rem;
border-radius: 0.75rem;
}
}
}
span {
@ -374,6 +364,8 @@ export default {
}
div.discount-price {
color: $green;
font-family: UrbanistSemibold, Arial, Helvetica, sans-serif;
font-weight: 600;
}
@include media-breakpoint-up(md) {
position: absolute;
@ -457,6 +449,8 @@ export default {
font-weight: 600;
line-height: 20px;
font-size: 1.25rem;
font-family: UrbanistSemibold, Arial, Helvetica, sans-serif;
font-weight: 600;
span.strikethrough-price {
text-decoration: line-through;

6
src/experiment-components/service-package-radio.vue
View file

@ -291,6 +291,12 @@ export default {
height: 10px;
min-width: 10px;
}
&.has-subheader {
& > .package-specs {
display: inline-flex;
}
}
}
&:hover {

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

@ -11,9 +11,11 @@
@click-event="clickEvent" />
</h5>
</div>
<div v-if="subText" class="d-flex align-self-center overflow-hidden mt-1">
<p class="small fw-normal sub-text">
<span v-html="boldedSubHeaderText"></span>
<div
v-if="subText"
class="d-flex align-items-center justify-content-center container-fluid overflow-hidden mt-1">
<p class="text-center small fw-normal sub-text">
<span v-html="subText"></span>
</p>
</div>
</div>

1
src/fmg-components/save-progress-popup-question/save-progress-popup-question.vue
View file

@ -4,7 +4,6 @@
:ref="modalName"
:headerText="modalHeaderText"
suppressPageScroll
:staticBackdrop="true"
:onModalClosedCallback="onModalClosed"
:footerButtonText="modalButtonText"
@footer-button-event="saveProgress">

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

@ -1,16 +1,24 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
<div class="container page-container-grouped-styles estimate">
<div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
<div class="container-fluid page-container-grouped-styles">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6 col-xl-4 mt-4">
<funnelSubHeader class="pb-2" cmsWidgetName="FunnelSubHeaderWidget" />
<div>
<div class="vinlookupquestion" v-html="this.VinLookupQuestionText"></div>
<div v-html="this.VinLookupQuestionBodyText2"></div>
<div
class="select-an-option"
v-html="this.VinLookupQuestionFooterText"></div>
<p class="header-copy mb-2 text-md-center" v-html="HeaderText"></p>
<p
class="header-sub-copy mb-5 text-md-center"
v-html="VinLookupQuestionText"></p>
<p class="select-option mb-2" v-html="SelectOptionText"></p>
<buttonQuestion
cmsWidgetName="VinLookupMethod"
:answers="answersFromCms"
@ -229,6 +237,12 @@ export default {
VinLookupQuestionText() {
return this.getCmsContent("VinLookupQuestion", "BodyText");
},
HeaderText() {
return this.getCmsContent("VinLookupQuestion", "HeaderText");
},
SelectOptionText() {
return this.getCmsContent("VinLookupQuestion", "FooterText");
},
VinLookupQuestionBodyText2() {
return this.getCmsContent("VinLookupQuestion", "BodyText2");
},
@ -249,14 +263,27 @@ export default {
};
</script>
<style lang="scss" scoped>
.header-copy {
font-family: UrbanistSemibold, Arial, Helvetica, sans-serif;
}
</style>
<style lang="scss">
.vinlookupquestion p {
font-size: 1.25rem;
}
.header-sub-copy {
font-size: 0.875rem;
}
.select-an-option {
font-family: UrbanistSemibold;
font-weight: 600;
margin-bottom: 1rem;
}
.select-option {
font-family: UrbanistSemibold, Arial, Helvetica, sans-serif;
font-weight: 600;
}
</style>

4
src/layouts/insurance-company/insurance-company-question.vue
View file

@ -4,7 +4,8 @@
customInputId="autocomplete"
class="mb-4 mt-5"
cmsWidgetName="InsuranceCoQuestionWidget"
includeSearchIcon />
includeSearchIcon
:validationRules="validationRules" />
</template>
<script>
@ -35,6 +36,7 @@ export default {
props: {
originalList: Array,
modelValue: String,
validationRules: String,
},
data() {
return {

8
src/layouts/insurance-company/insurance-company.vue
View file

@ -9,8 +9,10 @@
<div v-if="originalList.length > 0">
<insurance-company-question
isRequired
v-model="parentAccountNumber"
:originalList="originalList" />
:originalList="originalList"
validationRules="insurance-company-required" />
</div>
<textLink
id="payOnMyOwnBackButton"
@ -55,6 +57,10 @@ import { partNumberStrings } from "@/constants/part-number-strings";
import { deepClone } from "@/helpers/object-helper";
import store from "@/store";
import { flushSaveSessionQueue } from "@/helpers/heritage-integration/order-helper";
import { errorMessages } from "@/constants/error-messages";
import { required, regex } from "@/helpers/validation-rules";
defineRule("insurance-company-required", required(errorMessages.INSURANCE_COMPANY_REQUIRED));
export default {
name: "insurance-company",

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

@ -60,14 +60,30 @@
class="service-questions" />
<textBlock cmsWidgetName="CallOrTextWidget" justifyText="left" />
<hr class="my-5" />
<div class="d-flex flex-row checkbox-group">
<checkboxQuestion
cmsWidgetName="RecalConfirmWidget"
class="mb-3"
isRequired="true"
<div class="d-flex flex-column checkbox-group">
<Field
name="recalAckOptIn"
:rules="'recal-ack-required'"
v-model="isRecalAckOptIn"
validationRules="recal-ack-required"
@text-link-clicked="openModal('RecalModal')" />
v-slot="{ meta, errors }">
<checkboxQuestion
cmsWidgetName="RecalConfirmWidget"
class="mb-3"
isRequired="true"
v-model="isRecalAckOptIn"
validationRules="recal-ack-required"
checkboxName="recalAckOptIn"
:class="{ 'is-invalid': meta.touched && errors.length > 0 }"
@text-link-clicked="openModal('RecalModal')" />
</Field>
<div id="form-test-error" class="row form-test-error">
<error-message
role="comment"
aria-atomic="true"
aria-live="polite"
class="small mt-1 text-danger d-block"
:name="'recalAckOptIn'"></error-message>
</div>
</div>
</div>
@ -158,6 +174,8 @@ import {
} from "@/helpers/pricing-helper.js";
import { consumeQueryFromStash } from "@/router/methods/helpers/querystring-stash";
import { debugLog } from "@/helpers/debug-log-helper";
import { ErrorMessage } from "vee-validate";
import { Field } from "vee-validate";
defineRule("payment-method-required", required(errorMessages.OPTION_REQUIRED));
defineRule("recal-ack-required", required(errorMessages.RECAL_ACK_REQUIRED));
@ -845,6 +863,7 @@ export default {
navbar,
funnelSubHeader,
Form,
Field,
loadingModal,
cart,
alert,
@ -854,6 +873,7 @@ export default {
checkboxQuestion,
contentGroupModal,
afterpayBreakout,
ErrorMessage,
},
};
</script>
@ -877,6 +897,17 @@ export default {
> * {
margin-top: 0;
}
:deep(.form-check-input:invalid),
:deep(.form-check-input[aria-invalid="true"]),
:deep(.is-invalid .form-check-input) {
border-color: $danger;
box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}
:deep(.is-invalid .form-check-label) {
color: $danger;
}
}
.questions-about-service {
.service-questions {

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

@ -903,7 +903,7 @@ export default {
padding-bottom: 2rem;
:deep(.nav-bar) {
position: initial;
button {
button.btn {
width: 100%;
justify-content: center;
}

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

@ -314,13 +314,14 @@ export default {
&.pricing-info {
color: $green;
font-size: 0.875rem;
font-family: UrbanistSemibold, Arial, Helvetica, sans-serif;
font-weight: 600;
@include media-breakpoint-up(md) {
position: absolute;
bottom: 0.75rem;
left: 0;
width: 100%;
margin-left: 1.25rem;
font-weight: 600;
}
span.strikethrough-price {
text-decoration: line-through;

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

@ -41,7 +41,7 @@
alertClass="alert-warning" />
<alert
ref="alertRecalNoMobile"
class="mt-5 mb-5"
class="mb-5"
cmsWidgetName="AlertRecalNoMobileWidget"
v-if="displayRecalibrationWarning"
@text-link-clicked="openModalAction"
@ -1777,25 +1777,6 @@ export default {
font-weight: 600;
}
.funnel-sub-header h5 {
font-weight: 500;
font-size: 1rem;
font-family: UrbanistSemibold;
span {
letter-spacing: 0;
}
}
.appointment-type .funnel-sub-header h5 {
font-family: UrbanistRegular;
font-size: 1.25rem;
}
.funnel-sub-header.my-5 h5 {
font-weight: 400;
font-size: 1.25rem;
}
:deep(.funnel-sub-header:not(.mb-5)) {
h5.dark-header {
font-weight: 600;
@ -1805,7 +1786,7 @@ export default {
.col-12 a {
font-family: UrbanistSemibold;
font-weight: 500;
font-weight: 600;
line-height: 26px;
text-underline-offset: 4px;
}
@ -1813,4 +1794,16 @@ export default {
.text-block.duration-text-block b {
font-family: UrbanistSemibold;
}
:deep(.alert-warning.widget-name-AlertRecalNoMobileWidget .alert-heading),
:deep(.alert-success.widget-name-AlertMobileFeeFreeWidget .alert-heading) {
color: $black;
font-weight: 600;
font-size: 1rem;
* {
color: $black;
font-weight: 600;
font-size: 1rem;
}
}
</style>

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

@ -138,6 +138,7 @@ div.appointment-type-question div.button-question div.col div.button-content {
padding-right: 0.5rem;
}
div.appointment-type-question div.button-question div.question-text span {
font-weight: 500;
font-weight: 600;
font-family: UrbanistRegular;
}
</style>

1
src/styles/common-error-styles.scss
View file

@ -133,6 +133,7 @@ html {
background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.7817 14.7328L11.8252 10.7762C12.8833 9.45005 13.3936 7.76911 13.2513 6.07849C13.1091 4.38788 12.325 2.81587 11.0601 1.6852C9.79515 0.554524 8.14538 -0.0490261 6.44946 -0.00154744C4.75353 0.0459312 3.14012 0.740836 1.94045 1.94051C0.740775 3.14018 0.0458701 4.75359 -0.00160848 6.44952C-0.0490871 8.14545 0.554463 9.79521 1.68514 11.0601C2.81581 12.325 4.38782 13.1091 6.07843 13.2514C7.76905 13.3937 9.44999 12.8834 10.7762 11.8252L14.7349 15.7839C14.8044 15.8527 14.8869 15.907 14.9774 15.9439C15.068 15.9808 15.165 15.9995 15.2628 15.9989C15.3606 15.9983 15.4573 15.9784 15.5475 15.9405C15.6376 15.9025 15.7194 15.8471 15.7881 15.7776C15.8568 15.708 15.9112 15.6256 15.9481 15.535C15.985 15.4444 16.0036 15.3474 16.0031 15.2496C16.0025 15.1518 15.9826 15.0551 15.9446 14.965C15.9067 14.8748 15.8513 14.7931 15.7817 14.7243V14.7328ZM6.63737 11.7913C5.61803 11.7913 4.62157 11.4891 3.77402 10.9228C2.92646 10.3564 2.26587 9.5515 1.87578 8.60975C1.4857 7.668 1.38363 6.63172 1.5825 5.63196C1.78136 4.6322 2.27222 3.71386 2.99301 2.99307C3.7138 2.27229 4.63214 1.78142 5.6319 1.58256C6.63166 1.38369 7.66793 1.48576 8.60969 1.87585C9.55144 2.26593 10.3564 2.92652 10.9227 3.77408C11.489 4.62163 11.7913 5.61809 11.7913 6.63743C11.7896 8.00382 11.2461 9.31376 10.2799 10.2799C9.3137 11.2461 8.00376 11.7897 6.63737 11.7913Z' fill='%23d4281c'/%3E%3C/svg%3E%0A");
border: 1px solid $red;
border-left: none;
border-radius: 0 0.5rem 0.5rem 0;
}
}
}