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

Merge pull request #2924 from Safelite/feature/CASH-1535

Browse source 
CASH-1535: Mobile First Modal updates
This commit is contained in:
Chris 2025-10-30 13:50:23 -04:00 committed by GitHub
commit 723d8c0762
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 41 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/layouts/schedule/mobile-first-modal/mobile-first-modal.vue
View file

@ -7,7 +7,8 @@
:onModalClosedCallback="onModalClosed"
:footerButtonText="modalFooterText"
:isFooterButtonPrimary="true"
@footer-button-event="confirmAppointment">
@footer-button-event="confirmAppointment"
@isModalOpened="setIsModalOpen">
<p class="modal-body-inner" v-html="modalBodyText"></p>
<template v-slot:modal-header-slot>
<span>{{ modalSubHeaderText }}</span>
@ -48,6 +49,7 @@ export default {
},
data() {
return {
isModalOpen: false,
selectedAppontment: {
estimatedServiceMinutes: {
minimum: null,
@ -81,6 +83,12 @@ export default {
setSelectedAppointment(appointment) {
this.selectedAppontment = appointment;
},
getIsModalOpen() {
return this.isModalOpen;
},
setIsModalOpen(isOpen) {
this.isModalOpen = isOpen;
},
},
computed: {
modalName() {

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

@ -2,7 +2,13 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm">
<loadingModal ref="loadingModal" />
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
<div class="container page-container-grouped-styles">
<mobileFirstModal
modalWidgetName="MobileFirstModalWidget"
ref="mobileFirstModal"
@confirm-appointment="updateTimeSlotandNavigateForward" />
<div
class="container page-container-grouped-styles"
:class="[isMobileFirstModalOpen ? 'hidden-background' : '']">
<div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
<mobileFeeWaiverAlert
@ -32,10 +38,6 @@
</div>
<div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
<mobileFirstModal
modalWidgetName="MobileFirstModalWidget"
ref="mobileFirstModal"
@confirm-appointment="updateTimeSlotandNavigateForward" />
<alert
ref="alertMobileOnly"
class="mt-5 mb-5"
@ -855,6 +857,9 @@ export default {
)
);
},
isMobileFirstModalOpen() {
return this.isMobileSelected ? this.$refs.mobileFirstModal?.getIsModalOpen() : false;
},
},
methods: {
splitCopyOnCMSPlaceHolder,
@ -1788,30 +1793,27 @@ export default {
"schedule",
false
);
}
if (isShowMobileFirstAppt) {
if (
firstMobilePMDate &&
numberOfDaysToFirstMobilePMDate <= pmMobileDays
) {
preSelectedMobileAppointment = firstMobilePMAppt;
} else if (
firstMobilePMDate &&
numberOfDaysToFirstMobilePMDate >= noPMMobileDays
) {
let firstMobileAMAppt = this.getFirstAvailableMobileApptByTOD("AM");
preSelectedMobileAppointment = firstMobileAMAppt
? firstMobileAMAppt
: null;
!preSelectedMobileAppointment &&
(preSelectedMobileAppointment = firstMobilePMAppt);
}
this.$refs.mobileFirstModal.setSelectedAppointment(
preSelectedMobileAppointment
);
this.$refs.mobileFirstModal.openModal();
if (isShowMobileFirstAppt) {
if (firstMobilePMDate && numberOfDaysToFirstMobilePMDate <= pmMobileDays) {
preSelectedMobileAppointment = firstMobilePMAppt;
} else if (
firstMobilePMDate &&
numberOfDaysToFirstMobilePMDate >= noPMMobileDays
) {
let firstMobileAMAppt = this.getFirstAvailableMobileApptByTOD("AM");
preSelectedMobileAppointment = firstMobileAMAppt
? firstMobileAMAppt
: null;
!preSelectedMobileAppointment &&
(preSelectedMobileAppointment = firstMobilePMAppt);
}
this.$refs.mobileFirstModal.setSelectedAppointment(
preSelectedMobileAppointment
);
this.$refs.mobileFirstModal.openModal();
}
}
}
@ -1914,6 +1916,9 @@ export default {
margin-bottom: 0.25rem;
}
}
&.hidden-background {
display: none;
}
}
.alert.alert-warning {
.alert-heading {