Merge pull request #2968 from Safelite/feature/CASH-1790-refactor-1
Feature/cash 1790 refactor 1
This commit is contained in:
commit
8ddce5cd25
3 changed files with 38 additions and 83 deletions
|
|
@ -281,7 +281,7 @@ export default {
|
|||
if (event.screenX === 0 && event.screenY === 0) {
|
||||
return;
|
||||
}
|
||||
this.$emit("date-clicked", date);
|
||||
this.$emit("date-selected", date);
|
||||
},
|
||||
getWeekStartDate(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
|
|
@ -846,12 +846,6 @@ export default {
|
|||
},
|
||||
},
|
||||
watch: {
|
||||
isLoading(newValue) {
|
||||
// if done loading dates, then set to first available date
|
||||
if (newValue === false && this.firstAvailableSelectableDate) {
|
||||
this.selectedDate = this.firstAvailableSelectableDate;
|
||||
}
|
||||
},
|
||||
modelValue(newValue) {
|
||||
this.resetField({
|
||||
value: newValue,
|
||||
|
|
|
|||
|
|
@ -133,8 +133,6 @@
|
|||
:isOvernightDropoff="isOvernightDropoff" />
|
||||
</div>
|
||||
<datePicker
|
||||
:currentZip="zipCode"
|
||||
:currentProviderNumber="selectedProvider?.providerNumber"
|
||||
v-show="appointmentType"
|
||||
customComponentId="dateQuestion"
|
||||
selectableDatesSetting="custom"
|
||||
|
|
@ -144,7 +142,7 @@
|
|||
class="text-link-small"
|
||||
:getMoreDatesCallback="getMoreScheduleData"
|
||||
validationRules="date-required"
|
||||
@date-clicked="handleDateClicked"
|
||||
@date-selected="handleDateSelected"
|
||||
:pricingByDayBasePrice="pricingByDayBasePrice"
|
||||
:pricingByDayUpcharge="pricingByDayUpcharge"
|
||||
:showPricingByDay="showPricingByDay"
|
||||
|
|
@ -167,7 +165,6 @@
|
|||
:timeSlotsForSelectedDate="timeSlotsForSelectedDate"
|
||||
:isSameDay="isSameDay"
|
||||
:selectedRouteCodeData="selectedRouteCodeData"
|
||||
:isDatePickerDoneInitializing="isDatePickerDoneInitializing"
|
||||
@waitListRequested="handleWaitListRequested" />
|
||||
<navbar
|
||||
cmsWidgetName="FunnelFooterWidget"
|
||||
|
|
@ -475,7 +472,6 @@ export default {
|
|||
experimentSettings.SHOW_MOBILE_FIRST_APPT,
|
||||
"true"
|
||||
),
|
||||
isDatePickerDoneInitializing: false,
|
||||
};
|
||||
},
|
||||
async beforeRouteEnter(to, from, next) {
|
||||
|
|
@ -638,12 +634,12 @@ export default {
|
|||
showTimeSlotQuestion() {
|
||||
if (
|
||||
this.selectedDate &&
|
||||
this.selectedDate.includes("mobile") &&
|
||||
!this.isMobileSelected
|
||||
this.appointmentTypeFromAppointmentTypeQuestion &&
|
||||
this.timeSlotsForSelectedDate
|
||||
) {
|
||||
this.setSelectedDateToFirstAvailable();
|
||||
return true;
|
||||
}
|
||||
return this.selectedDate && this.appointmentTypeFromAppointmentTypeQuestion;
|
||||
return false;
|
||||
},
|
||||
isMobileStaticRecalibrationApplicable() {
|
||||
return (
|
||||
|
|
@ -1181,8 +1177,6 @@ export default {
|
|||
async initializeDatePicker() {
|
||||
this.isShowMobileFirstAppt && this.showLoadingModal();
|
||||
|
||||
this.selectedDate = null;
|
||||
|
||||
const includeMobileTimeSlots = this.isServiceableMobile;
|
||||
const includeInshopTimeSlots = this.isServiceableInshop || this.isServiceableDropoff;
|
||||
const datePickerInitialData = await this.$refs.datePicker.loadInitialData({
|
||||
|
|
@ -1220,8 +1214,6 @@ export default {
|
|||
}
|
||||
|
||||
this.isShowMobileFirstAppt && this.hideLoadingModal();
|
||||
await this.$nextTick();
|
||||
this.isDatePickerDoneInitializing = true;
|
||||
},
|
||||
getScheduleApiResponse,
|
||||
getServiceZipCtuCodeFromStore() {
|
||||
|
|
@ -1572,28 +1564,40 @@ export default {
|
|||
handleWaitListRequested(value) {
|
||||
this.waitListRequested = value;
|
||||
},
|
||||
handleDateClicked(date) {
|
||||
// do something to mark this as upcharge day or not...
|
||||
if (date.isPricingByDayUpchargeDay) {
|
||||
this.includePricingByDayUpcharge = true;
|
||||
} else {
|
||||
this.includePricingByDayUpcharge = false;
|
||||
handleDateSelected(date) {
|
||||
const previousDate = this.selectedDate;
|
||||
|
||||
// check if date actually changed
|
||||
if (previousDate !== date.dateString) {
|
||||
this.selectedTimeSlotInfo = this.getEmptyTimeSlot();
|
||||
this.updateFooterButtonText(this.selectedTimeSlotInfo);
|
||||
}
|
||||
|
||||
// TODO: REMOVE AS PART OF CASH-1634
|
||||
// // do something to mark this as upcharge day or not...
|
||||
// if (date.isPricingByDayUpchargeDay) {
|
||||
// this.includePricingByDayUpcharge = true;
|
||||
// } else {
|
||||
// this.includePricingByDayUpcharge = false;
|
||||
// }
|
||||
},
|
||||
getEmptyTimeSlot() {
|
||||
return {
|
||||
timeSlot: {
|
||||
date: null,
|
||||
routeCode: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
jobMaxMinutes: null,
|
||||
jobMinMinutes: null,
|
||||
},
|
||||
isPremiumAppointment: null,
|
||||
};
|
||||
},
|
||||
updateTimeSlot(timeSlotObj) {
|
||||
if (!timeSlotObj?.routeCode) {
|
||||
this.appointmentType = AppointmentTypeStrings.IN_SHOP_OR_DROP_OFF;
|
||||
this.selectedTimeSlotInfo = {
|
||||
timeSlot: {
|
||||
date: null,
|
||||
routeCode: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
jobMaxMinutes: null,
|
||||
jobMinMinutes: null,
|
||||
},
|
||||
isPremiumAppointment: null,
|
||||
};
|
||||
this.selectedTimeSlotInfo = this.getEmptyTimeSlot();
|
||||
return;
|
||||
}
|
||||
const timeSlot = this.timeSlotsForSelectedDate?.timeSlots?.find(
|
||||
|
|
@ -1690,6 +1694,9 @@ export default {
|
|||
},
|
||||
handleAppointmentTypeChange(newAppointmentType) {
|
||||
this.updateFooterButtonText();
|
||||
// if time appointment type changes, clear any selected time slot
|
||||
this.selectedTimeSlotInfo = this.getEmptyTimeSlot();
|
||||
|
||||
if (newAppointmentType === AppointmentTypeStrings.MOBILE) {
|
||||
// Remember last shop selected if previous selection was inshop/dropoff
|
||||
if (
|
||||
|
|
@ -1698,17 +1705,6 @@ export default {
|
|||
AppointmentTypeStrings.IN_SHOP_OR_DROP_OFF) &&
|
||||
this.selectedProvider
|
||||
) {
|
||||
this.selectedTimeSlotInfo = {
|
||||
timeSlot: {
|
||||
date: null,
|
||||
routeCode: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
jobMaxMinutes: null,
|
||||
jobMinMinutes: null,
|
||||
},
|
||||
isPremiumAppointment: null,
|
||||
};
|
||||
this.lastSelectedInshopOrDropoffProvider = this.selectedProvider;
|
||||
}
|
||||
this.appointmentType = AppointmentTypeStrings.MOBILE;
|
||||
|
|
@ -1856,36 +1852,6 @@ export default {
|
|||
this.handleAppointmentTypeChange(newValue);
|
||||
},
|
||||
},
|
||||
selectedDate(newValue, oldValue) {
|
||||
if (!this.isDatePickerDoneInitializing) {
|
||||
return;
|
||||
} // needed otherwise it nulls selectedTimeSlotInfo too early and prevents a previously selected time slot from auto-selecting
|
||||
|
||||
// Clear time slot selection if date selected changes
|
||||
const selectedDate = this.getSelectedDateFromStore();
|
||||
if (oldValue && this.appointmentType === AppointmentTypeStrings.MOBILE) {
|
||||
oldValue = `${oldValue}-mobile`;
|
||||
}
|
||||
const hasValueChanged = newValue !== oldValue;
|
||||
const isDateDifferent = (newValue || oldValue) !== selectedDate;
|
||||
|
||||
if (hasValueChanged && isDateDifferent && !this.selectedMobileFirstAppointment) {
|
||||
this.selectedTimeSlotInfo = {
|
||||
timeSlot: {
|
||||
date: null,
|
||||
routeCode: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
jobMaxMinutes: null,
|
||||
jobMinMinutes: null,
|
||||
},
|
||||
isPremiumAppointment: null,
|
||||
};
|
||||
}
|
||||
},
|
||||
selectedTimeSlotInfo(newValue) {
|
||||
this.updateFooterButtonText(newValue);
|
||||
},
|
||||
},
|
||||
components: {
|
||||
funnelHeader,
|
||||
|
|
@ -1898,7 +1864,6 @@ export default {
|
|||
textBlock,
|
||||
timeSlotQuestion,
|
||||
mobileFirstModal,
|
||||
|
||||
alert,
|
||||
serviceZipModalQuestion,
|
||||
appointmentTypeQuestion,
|
||||
|
|
|
|||
|
|
@ -137,7 +137,6 @@ export default {
|
|||
isSameDay: Boolean,
|
||||
displayWaitList: Boolean,
|
||||
selectedRouteCodeData: Object,
|
||||
isDatePickerDoneInitializing: Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -191,9 +190,6 @@ export default {
|
|||
this.updateDropoffAndTimeSlotAnswersFromSelectedRouteCodeData(newValue);
|
||||
},
|
||||
timeSlotsForSelectedDate() {
|
||||
if (!this.isDatePickerDoneInitializing) {
|
||||
return;
|
||||
} // needed otherwise it nulls these too early and prevents a previously selected time slot from auto-selecting
|
||||
this.selectedAnswerForDropOffOrInshop = null;
|
||||
this.selectedAnswerForTimeSlots = null;
|
||||
this.autoSelectTimeSlotIfOnlyOneIsAvailable();
|
||||
|
|
|
|||
Loading…
Reference in a new issue