Merge pull request #470 from Safelite/feature/richardson/SSR-675.3
add timeSlotModalQuestion to schedule
This commit is contained in:
commit
91ee04c72c
3 changed files with 60 additions and 18 deletions
|
|
@ -29,7 +29,25 @@
|
|||
class="text-link-small"
|
||||
:customSelectableDatesCallback="getAvailableDatesMethod"
|
||||
validationRules="date-required"
|
||||
@date-clicked="openInshopTimeSlotsModal" />
|
||||
@dateClicked="openInshopTimeSlotsModal" />
|
||||
<timeSlotModalQuestion
|
||||
ref="timeSlotModalQuestion"
|
||||
v-model="selectedTimeSlotInfo"
|
||||
customComponentId="timeSlotModalQuestion"
|
||||
cmsWidgetName="TimeSlotModalQuestion"
|
||||
mobilePremiumCmsWidgetName="MobilePremiumTimeSlotModal"
|
||||
mobileCmsWidgetName="MobileTimeSlotModal"
|
||||
dropoffCmsWidgetName="DropOffTimeSlotModal"
|
||||
sameDayDropOffCmsWidgetName="SameDayDropOffTimeSlotModal"
|
||||
overnightDropOffCmsWidgetName="OvernightDropOffTimeSlotModal"
|
||||
:selectedDate="selectedDate"
|
||||
:appointmentType="appointmentType"
|
||||
:premiumAppointmentFee="mobilePremiumAppointmentFee"
|
||||
:timeSlotsForSelectedDate="timeSlotsForSelectedDate"
|
||||
:estimatedServiceMinutesMinimum="selectableDatesData.estimatedServiceMinutesMinimum"
|
||||
:estimatedServiceMinutesMaximum="selectableDatesData.estimatedServiceMinutesMaximum"
|
||||
validationRules="time-slot-selection-required"
|
||||
@timeSlotModalClosed="timeSlotModalClosed" />
|
||||
<siteFooter
|
||||
ref="navbar"
|
||||
class="mt-5"
|
||||
|
|
@ -47,6 +65,7 @@ import siteHeader from '@/iss-components/site-header/site-header.vue';
|
|||
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
|
||||
import locationAlerts from '@/layouts/schedule-page/location-alerts/location-alerts.vue';
|
||||
import datePicker from '@/digital-components/date-picker/date-picker.vue';
|
||||
import timeSlotModalQuestion from '@/layouts/schedule-page/time-slot-modal-question/time-slot-modal-question.vue';
|
||||
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
|
||||
import textBlock from '@/digital-components/text-block/text-block.vue';
|
||||
|
||||
|
|
@ -180,6 +199,7 @@ export default {
|
|||
siteSubHeader,
|
||||
locationAlerts,
|
||||
datePicker,
|
||||
timeSlotModalQuestion,
|
||||
siteFooter,
|
||||
textBlock,
|
||||
// eslint-disable-next-line vue/no-reserved-component-names
|
||||
|
|
@ -238,7 +258,12 @@ export default {
|
|||
return { mainStore };
|
||||
},
|
||||
data() {
|
||||
|
||||
return {
|
||||
selectedDate: this.getSelectedDate(),
|
||||
selectedTimeSlotInfo: this.getSelectedTimeSlotInfo(),
|
||||
selectableDatesData: [],
|
||||
mobilePremiumAppointmentFee: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
ChangeShopLinkText() {
|
||||
|
|
@ -406,22 +431,14 @@ export default {
|
|||
supportingItems.push(this.mobilePremiumAppointmentFee);
|
||||
}
|
||||
|
||||
this.dispatchStoreAction(
|
||||
this.storeActions.SAVE_SUPPORTING_ITEMS_SUPPRESSING_STATE_RESETTING,
|
||||
supportingItems,
|
||||
false
|
||||
);
|
||||
this.mainStore.saveSupportingItemsSuppressingStateResetting(supportingItems);
|
||||
} else {
|
||||
// if it's not a mobile and/or premium early bird, then make sure we remove any that may have been added
|
||||
const removeEarlyBirdIndex = supportingItems.findIndex((item) => item.partType === PREMIUM_FEE_PART_TYPE);
|
||||
|
||||
if (removeEarlyBirdIndex >= 0) {
|
||||
supportingItems.splice(removeEarlyBirdIndex, 1);
|
||||
this.dispatchStoreAction(
|
||||
this.storeActions.SAVE_SUPPORTING_ITEMS_SUPPRESSING_STATE_RESETTING,
|
||||
supportingItems,
|
||||
false
|
||||
);
|
||||
this.mainStore.saveSupportingItemsSuppressingStateResetting(supportingItems);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -429,7 +446,9 @@ export default {
|
|||
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
|
||||
},
|
||||
forwardButtonAction() {
|
||||
// validate and save here
|
||||
this.updateSupportingItems();
|
||||
this.mainStore.saveSchedule(this.selectedTimeSlotInfo.timeSlot);
|
||||
|
||||
this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD, this.$route);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -139,7 +139,8 @@ const getDefaultState = () => ({
|
|||
startTime: null,
|
||||
endTime: null,
|
||||
routeCode: null,
|
||||
jobMaxMinutes: null
|
||||
jobMaxMinutes: null,
|
||||
jobMinMinutes: null
|
||||
},
|
||||
referralNumber: null,
|
||||
referralDate: null,
|
||||
|
|
@ -1005,7 +1006,8 @@ export const useMainStore = defineStore({
|
|||
startTime: schedule.startTime,
|
||||
endTime: schedule.endTime,
|
||||
routeCode: schedule.routeCode,
|
||||
jobMaxMinutes: schedule.jobMaxMinutes
|
||||
jobMaxMinutes: schedule.jobMaxMinutes,
|
||||
jobMinMinutes: schedule.jobMinMinutes
|
||||
},
|
||||
referralDate: this.order.referralDate,
|
||||
referralNumber: this.order.referralNumber?.toString(),
|
||||
|
|
@ -1199,7 +1201,7 @@ export const useMainStore = defineStore({
|
|||
this.order.schedule.endTime = null;
|
||||
this.order.schedule.routeCode = null;
|
||||
this.order.schedule.jobMaxMinutes = null;
|
||||
// this.order.schedule.jobMinMinutes = null;
|
||||
this.order.schedule.jobMinMinutes = null;
|
||||
|
||||
// premium appointment fee used on schedule page also needs reset when schedule is reset
|
||||
const { supportingItems } = this.order.lineItems;
|
||||
|
|
@ -1404,6 +1406,10 @@ export const useMainStore = defineStore({
|
|||
this.order.lineItems.glassParts = glassParts;
|
||||
},
|
||||
saveSupportingItems(supportingItems) {
|
||||
// TODO: RESET_SERVICE_LOCATION_STATE_AND_DEPENDENCIES
|
||||
this.order.lineItems.supportingItems = supportingItems;
|
||||
},
|
||||
saveSupportingItemsSuppressingStateResetting(supportingItems) {
|
||||
this.order.lineItems.supportingItems = supportingItems;
|
||||
},
|
||||
saveVaps(vaps) {
|
||||
|
|
@ -1483,6 +1489,21 @@ export const useMainStore = defineStore({
|
|||
});
|
||||
},
|
||||
|
||||
// Schedule Actions
|
||||
saveSchedule(scheduleInfo) {
|
||||
this.updateSchedule(scheduleInfo);
|
||||
},
|
||||
updateSchedule(scheduleInfo) {
|
||||
if (scheduleInfo) {
|
||||
this.order.schedule.date = scheduleInfo.date;
|
||||
this.order.schedule.startTime = scheduleInfo.startTime;
|
||||
this.order.schedule.endTime = scheduleInfo.endTime;
|
||||
this.order.schedule.routeCode = scheduleInfo.routeCode;
|
||||
this.order.schedule.jobMaxMinutes = scheduleInfo.jobMaxMinutes;
|
||||
this.order.schedule.jobMinMinutes = scheduleInfo.jobMinMinutes;
|
||||
}
|
||||
},
|
||||
|
||||
// Analytics Actions
|
||||
logExperimentExposure({ userId, sessionKey, pageName, experiment }) {
|
||||
return globalMethods.callHttpClient({
|
||||
|
|
|
|||
|
|
@ -806,7 +806,8 @@ describe('Store', () => {
|
|||
startTime: getRandomString(6, 6),
|
||||
endTime: getRandomString(6, 6),
|
||||
routeCode: getRandomString(6, 6),
|
||||
jobMaxMinutes: getRandomString(6, 6)
|
||||
jobMaxMinutes: getRandomString(6, 6),
|
||||
jobMinMinutes: getRandomString(6, 6)
|
||||
};
|
||||
store.order.schedule = schedule;
|
||||
globalMethods.callHttpClient = jest.fn().mockReturnValue(Promise.resolve({}));
|
||||
|
|
@ -822,7 +823,8 @@ describe('Store', () => {
|
|||
startTime: schedule.startTime,
|
||||
endTime: schedule.endTime,
|
||||
routeCode: schedule.routeCode,
|
||||
jobMaxMinutes: schedule.jobMaxMinutes
|
||||
jobMaxMinutes: schedule.jobMaxMinutes,
|
||||
jobMinMinutes: schedule.jobMinMinutes
|
||||
})
|
||||
})
|
||||
}));
|
||||
|
|
|
|||
Loading…
Reference in a new issue