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

Merge pull request #2740 from Safelite/feature/CASH-1186

Browse source 
Feature/cash 1186
This commit is contained in:
AdamCaouetteSafelite 2025-08-07 14:48:13 -04:00 committed by GitHub
commit fdaf629f86
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 81 additions and 73 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1483,6 +1483,8 @@ export default {
display: block;
position: relative;
height: 2rem;
font-size: 0.875rem;
padding-top: 0;
width: 100%;
justify-content: center;
background: transparent;

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

@ -5,40 +5,9 @@
<div class="container page-container-grouped-styles">
<div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
<alert
ref="alertMilitaryBaseZip"
class="my-5"
cmsWidgetName="AlertMilitaryBaseZipWidget"
v-if="displayMilitaryZipAlert"
alertClass="alert-warning" />
<alert
ref="alertMobileOnly"
class="my-5"
cmsWidgetName="AlertMobileOnlyWidget"
v-if="displayServiceableMobileOnly"
alertClass="alert-warning" />
<alert
ref="alertRecalNoMobile"
class="my-5"
cmsWidgetName="AlertRecalNoMobileWidget"
v-if="displayRecalibrationWarning"
@text-link-clicked="openModalAction"
alertClass="alert-warning" />
<alert
ref="alertInshopOnly"
class="my-5"
cmsWidgetName="AlertInshopOnlyWidget"
v-if="displayServiceableInshopOnly"
alertClass="alert-warning" />
<alert
ref="alertNoShops"
class="my-5"
cmsWidgetName="AlertNoShopsWidget"
v-if="displayNoShopsAlert"
alertClass="alert-warning" />
<alert
ref="alertMobileFeeFree"
class="my-5"
class="mb-5"
cmsWidgetName="AlertMobileFeeFreeWidget"
v-if="showMobileFreeAlert"
alertClass="alert-success" />
@ -46,7 +15,7 @@
</div>
<div class="row appointment-type">
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
<funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="my-5" />
<funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="mb-5" />
<appointmentTypeQuestion
v-model="appointmentTypeFromAppointmentTypeQuestion"
v-show="isAppointmentTypeDisplayed"
@ -62,6 +31,41 @@
labelBold="true" />
</div>
</div>
<div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
<alert
ref="alertMobileOnly"
class="mt-5 mb-5"
cmsWidgetName="AlertMobileOnlyWidget"
v-if="displayServiceableMobileOnly"
alertClass="alert-warning" />
<alert
ref="alertRecalNoMobile"
class="mt-5 mb-5"
cmsWidgetName="AlertRecalNoMobileWidget"
v-if="displayRecalibrationWarning"
@text-link-clicked="openModalAction"
alertClass="alert-warning" />
<alert
ref="alertInshopOnly"
class="mt-5 mb-5"
cmsWidgetName="AlertInshopOnlyWidget"
v-if="displayServiceableInshopOnly"
alertClass="alert-warning" />
<alert
ref="alertMilitaryBaseZip"
class="mt-5 mb-5"
cmsWidgetName="AlertMilitaryBaseZipWidget"
v-if="displayMilitaryZipAlert"
alertClass="alert-warning" />
<alert
ref="alertNoShops"
class="mt-5 mb-5"
cmsWidgetName="AlertNoShopsWidget"
v-if="displayNoShopsAlert"
alertClass="alert-warning" />
</div>
</div>
<div
v-if="appointmentType && appointmentType === appointmentTypeStrings.MOBILE"
class="col-12 col-md-10 col-lg-8 col-xl-7">
@ -695,7 +699,12 @@ export default {
);
},
isAppointmentTypeDisplayed() {
return this.zipCode && !this.displayNoShopsAlert;
return (
this.zipCode &&
!this.displayNoShopsAlert &&
this.isServiceableMobile &&
this.isServiceableInshop
);
},
requiresInshopRecalibration() {
// Specifically check for isRecalibrationServiceableMobile === false, not null or true.
@ -1739,47 +1748,24 @@ export default {
<style lang="scss">
.container {
&.page-schedule {
padding: 0 1rem;
.text-link-small {
a,
.btn-link {
width: auto;
margin: 0 auto;
height: auto;
font-size: 0.875rem;
line-height: 1.75;
padding: 0;
border-radius: 0;
&:focus {
outline: 1px solid $blue;
}
@include media-breakpoint-up(md) {
font-size: 1rem;
}
}
.question-text {
margin-bottom: 1.5rem;
& > span {
display: flex;
justify-content: flex-start;
margin-bottom: 0.25rem;
}
.funnel-sub-header {
h5.dark-header {
margin-bottom: 0.25rem;
}
}
.change-location a {
font-family: UrbanistSemibold;
}
.date-picker {
border-top: 1px solid $gray-500;
margin-top: 1.5rem;
}
.time-slots-question {
padding: 0 0.75rem;
}
}
.question-text > span {
display: flex;
justify-content: flex-start;
}
}
.alert.alert-warning {
.alert-heading {
color: $black;
font-family: UrbanistSemibold;
font-size: 1rem;
}
}
.shop-question-button .list-button-content {
background: $blue-100;
box-shadow: 0 0 0 1px $primary;
@ -1801,6 +1787,7 @@ export default {
.appointment-type .funnel-sub-header h5 {
font-family: UrbanistRegular;
font-size: 1.25rem;
}
.funnel-sub-header.my-5 h5 {
@ -1814,4 +1801,8 @@ export default {
line-height: 26px;
text-underline-offset: 4px;
}
.text-block.duration-text-block b {
font-family: UrbanistSemibold;
}
</style>

2
src/layouts/schedule/shop-location/shop-location.vue
View file

@ -1,6 +1,6 @@
<template>
<div id="shop-location">
<textBlock :customText="questionText" typeStyle="button-question" />
<textBlock :customText="questionText" typeStyle="button-question" class="mb-2" />
<div>
<div>
<label v-for="addressItem in addressDetails" :key="addressItem">

15
src/layouts/schedule/time-slot-question/time-slot-question.vue
View file

@ -9,6 +9,7 @@
isRequired
insertOrLabelBeforeFinalOption
groupName="chooseDropOffOrInshop"
class="choose-dropoff-or-inshop"
validationRules="time-slot-required">
<div>
<alert
@ -49,6 +50,7 @@
cmsWidgetName="WaitListLabelWidget"
typeStyle="medium"
fontWeight="600"
class="waitlist-label"
marginTopSizeOverride="0" />
<checkboxQuestion
class="mt-3"
@ -651,6 +653,15 @@ export default {
margin-bottom: 8px;
}
}
.button-question.choose-dropoff-or-inshop
.button-inner-wrapper
.col:first-child
.button-content.list-button-content
> span::after {
content: "TM";
vertical-align: super;
font-size: 50%;
}
.waitlist {
box-shadow: 0px 1px 4px 0px #00000033;
border-radius: 8px;
@ -658,6 +669,10 @@ export default {
padding: 16px;
text-align: left;
.waitlist-label {
font-family: UrbanistSemibold;
}
.ui-checkbox {
padding-left: 0px;
input {