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

Merge pull request #2951 from Safelite/feature/CASH-1873

Browse source 
CASH-1873: Show Mobile First modal on page load
This commit is contained in:
Chris 2025-11-21 07:59:13 -05:00 committed by GitHub
commit 25cba1fb0d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 19 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -76,6 +76,7 @@ export default {
let selectedTimeSlot = { let selectedTimeSlot = {
timeSlot: this.selectedAppontment.timeSlot, timeSlot: this.selectedAppontment.timeSlot,
routeCode: this.selectedAppontment.timeSlot.id, routeCode: this.selectedAppontment.timeSlot.id,
date: this.selectedAppontment.date,
}; };
this.$emit("confirm-appointment", selectedTimeSlot); this.$emit("confirm-appointment", selectedTimeSlot);
this.modal.closeModal(); this.modal.closeModal();

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

@ -469,6 +469,7 @@ export default {
navigatingForward: false, navigatingForward: false,
shopListButton: shopListButton, shopListButton: shopListButton,
lastSelectedInshopOrDropoffProvider: null, lastSelectedInshopOrDropoffProvider: null,
selectedMobileFirstAppointment: false,
}; };
}, },
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -597,7 +598,9 @@ export default {
pricedMobileFeePart, pricedMobileFeePart,
shopProviderData.data shopProviderData.data
); );
vm.initializeDatePicker(); vm.initializeDatePicker().then(() => {
vm.showMobileFirstModal();
});
}); });
}, },
computed: { computed: {
@ -858,7 +861,9 @@ export default {
); );
}, },
isMobileFirstModalOpen() { isMobileFirstModalOpen() {
return this.isMobileSelected ? this.$refs.mobileFirstModal?.getIsModalOpen() : false; return this.selectableDatesMobile.days
? this.$refs.mobileFirstModal?.getIsModalOpen()
: false;
}, },
}, },
methods: { methods: {
@ -1187,8 +1192,6 @@ export default {
moreShopTimeSlots.mobileTimeSlotsData.days moreShopTimeSlots.mobileTimeSlotsData.days
); );
this.showMobileFirstModal();
return moreShopTimeSlots; return moreShopTimeSlots;
}, },
@ -1678,7 +1681,9 @@ export default {
this.zipCode = newZipCode.zipCode; this.zipCode = newZipCode.zipCode;
this.zipCodeCtu = newZipCode.zipCodeCtu; this.zipCodeCtu = newZipCode.zipCodeCtu;
this.selectedDate = null; this.selectedDate = null;
this.initializeDatePicker(); this.initializeDatePicker().then(() => {
this.showMobileFirstModal();
});
}); });
}, },
updateSelectedProviderAndZipCode(newZipCode, newProvider) { updateSelectedProviderAndZipCode(newZipCode, newProvider) {
@ -1716,7 +1721,6 @@ export default {
} }
this.appointmentType = AppointmentTypeStrings.MOBILE; this.appointmentType = AppointmentTypeStrings.MOBILE;
this.updateSelectedProvider(); this.updateSelectedProvider();
this.showMobileFirstModal();
} else if (newAppointmentType) { } else if (newAppointmentType) {
if (this.appointmentType != AppointmentTypeStrings.MOBILE) { if (this.appointmentType != AppointmentTypeStrings.MOBILE) {
// Clear last shop selected if appointment type was changed in any manner other than from Mobile // Clear last shop selected if appointment type was changed in any manner other than from Mobile
@ -1742,7 +1746,7 @@ export default {
this.selectedDate = this.getFirstAvailableDate(); this.selectedDate = this.getFirstAvailableDate();
}, },
async showMobileFirstModal() { async showMobileFirstModal() {
if (this.appointmentType == AppointmentTypeStrings.MOBILE) { if (!this.selectedRouteCodeData?.routeCode) {
const isShowMobileFirstAppt = experimentMixin.methods.hasSettingEqualTo( const isShowMobileFirstAppt = experimentMixin.methods.hasSettingEqualTo(
experimentSettings.SHOW_MOBILE_FIRST_APPT, experimentSettings.SHOW_MOBILE_FIRST_APPT,
"true" "true"
@ -1824,9 +1828,6 @@ export default {
} }
}, },
async getFirstAvailableMobileApptByTOD(timeOfDay) { async getFirstAvailableMobileApptByTOD(timeOfDay) {
if (!this.selectableDatesMobile.days) {
await this.initializeDatePicker();
}
if (!this.selectableDatesMobile?.days?.length) { if (!this.selectableDatesMobile?.days?.length) {
return null; return null;
} else { } else {
@ -1853,6 +1854,10 @@ export default {
} }
}, },
updateTimeSlotandNavigateForward(timeSlotObj) { updateTimeSlotandNavigateForward(timeSlotObj) {
this.selectedMobileFirstAppointment = true;
this.appointmentType = AppointmentTypeStrings.MOBILE;
this.selectedDate = timeSlotObj.date;
this.updateSelectedProvider();
this.updateTimeSlot(timeSlotObj); this.updateTimeSlot(timeSlotObj);
this.forwardButtonAction(); this.forwardButtonAction();
}, },
@ -1872,7 +1877,7 @@ export default {
const hasValueChanged = newValue !== oldValue; const hasValueChanged = newValue !== oldValue;
const isDateDifferent = (newValue || oldValue) !== selectedDate; const isDateDifferent = (newValue || oldValue) !== selectedDate;
if (hasValueChanged && isDateDifferent) { if (hasValueChanged && isDateDifferent && !this.selectedMobileFirstAppointment) {
this.selectedTimeSlotInfo = { this.selectedTimeSlotInfo = {
timeSlot: { timeSlot: {
date: null, date: null,

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

@ -123,8 +123,8 @@ $body-color: $gray-600;
//Fonts //Fonts
$font-family-sans-serif: UrbanistRegular, Arial, Helvetica, sans-serif; $font-family-sans-serif: UrbanistRegular, Arial, Helvetica, sans-serif;
$font-family-monospace: UrbanistRegular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", $font-family-monospace:
monospace; UrbanistRegular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
// stylelint-enable value-keyword-case // stylelint-enable value-keyword-case
$font-family-base: $font-family-sans-serif; $font-family-base: $font-family-sans-serif;
$font-family-code: $font-family-monospace; $font-family-code: $font-family-monospace;