CASH-464: reduce to 2 rows on initial load and set to first avail date if none saved
This commit is contained in:
parent
fbf9bf5bfc
commit
4e63f0975b
1 changed files with 17 additions and 11 deletions
|
|
@ -241,14 +241,14 @@ export default {
|
||||||
let includePricingByDayUpcharge = false;
|
let includePricingByDayUpcharge = false;
|
||||||
|
|
||||||
// Check to see if date should be pre-selected
|
// Check to see if date should be pre-selected
|
||||||
let preSelectedDate = await store.getters.order.schedule.date;
|
let preSelectedSlot = await store.getters.order.schedule;
|
||||||
if (!preSelectedDate || preSelectedDate.startTime === null) {
|
if (!preSelectedSlot.date || preSelectedSlot?.date?.length < 1) {
|
||||||
preSelectedDate = null;
|
preSelectedSlot = null;
|
||||||
} else {
|
} else {
|
||||||
// Check to see if pre-selected date should have pricing by day upcharge
|
// Check to see if pre-selected date should have pricing by day upcharge
|
||||||
if (showPricingByDay) {
|
if (showPricingByDay) {
|
||||||
// is this preSelectedDate a premium day?
|
// is this preSelectedDate a premium day?
|
||||||
const dayIndex = convertDateStringToDate(preSelectedDate).getDay();
|
const dayIndex = convertDateStringToDate(preSelectedSlot?.date).getDay();
|
||||||
const dayObject = DAYS_OF_WEEK[dayIndex];
|
const dayObject = DAYS_OF_WEEK[dayIndex];
|
||||||
if (dayObject.isPricingByDayUpchargeDay) {
|
if (dayObject.isPricingByDayUpchargeDay) {
|
||||||
includePricingByDayUpcharge = true;
|
includePricingByDayUpcharge = true;
|
||||||
|
|
@ -268,9 +268,9 @@ export default {
|
||||||
const datePickerInitialDataPromise = await datePicker.methods.loadInitialData({
|
const datePickerInitialDataPromise = await datePicker.methods.loadInitialData({
|
||||||
// setup config options for date-picker
|
// setup config options for date-picker
|
||||||
selectableDatesSetting: "custom",
|
selectableDatesSetting: "custom",
|
||||||
initialViewRowsToShow: 5,
|
initialViewRowsToShow: 2,
|
||||||
customSelectableDatesCallback: getAvailableDates,
|
customSelectableDatesCallback: getAvailableDates,
|
||||||
preSelectedDate: preSelectedDate,
|
preSelectedDate: preSelectedSlot ? preSelectedSlot.date : preSelectedSlot,
|
||||||
});
|
});
|
||||||
|
|
||||||
// Get pricingByDayUpcharge needed for Pricing By Day
|
// Get pricingByDayUpcharge needed for Pricing By Day
|
||||||
|
|
@ -340,7 +340,7 @@ export default {
|
||||||
vm.setCmsContent(resultMap.cmsContent);
|
vm.setCmsContent(resultMap.cmsContent);
|
||||||
vm.$refs.datePicker.initializeComponent(datePickerInitialData);
|
vm.$refs.datePicker.initializeComponent(datePickerInitialData);
|
||||||
vm.$refs.locationAlerts.initializeComponent(resultMap.alertReasons);
|
vm.$refs.locationAlerts.initializeComponent(resultMap.alertReasons);
|
||||||
vm.selectableDatesData = resultMap.datePickerInitialData.initialShopTimeSlotsResponse;
|
vm.selectableDatesData = datePickerInitialData.initialShopTimeSlotsResponse;
|
||||||
vm.mobilePremiumAppointmentFee = resultMap.premiumFeeWithPrice
|
vm.mobilePremiumAppointmentFee = resultMap.premiumFeeWithPrice
|
||||||
? resultMap.premiumFeeWithPrice[0]
|
? resultMap.premiumFeeWithPrice[0]
|
||||||
: null;
|
: null;
|
||||||
|
|
@ -354,6 +354,16 @@ export default {
|
||||||
vm.showPricingByDay = showPricingByDay;
|
vm.showPricingByDay = showPricingByDay;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
const selectableDatesData = this.selectableDatesData;
|
||||||
|
|
||||||
|
// if no date selected on load, then use first available date
|
||||||
|
if (!this.selectedDate && selectableDatesData?.days?.length > 0) {
|
||||||
|
this.selectedDate = selectableDatesData.days[0].date;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
computed: {
|
computed: {
|
||||||
ChangeShopLinkText() {
|
ChangeShopLinkText() {
|
||||||
return this.getCmsContent("ChangeShopLink", "Text");
|
return this.getCmsContent("ChangeShopLink", "Text");
|
||||||
|
|
@ -368,10 +378,6 @@ export default {
|
||||||
timeSlotsForSelectedDate() {
|
timeSlotsForSelectedDate() {
|
||||||
if (!this.selectedDate) return null;
|
if (!this.selectedDate) return null;
|
||||||
|
|
||||||
let tempOutput = this.selectableDatesData.days?.find(
|
|
||||||
(selectableDate) => selectableDate.date === this.selectedDate
|
|
||||||
);
|
|
||||||
|
|
||||||
return this.selectableDatesData.days?.find(
|
return this.selectableDatesData.days?.find(
|
||||||
(selectableDate) => selectableDate.date === this.selectedDate
|
(selectableDate) => selectableDate.date === this.selectedDate
|
||||||
);
|
);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue