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

CSR-1137 | Merge conflicts

Browse source
This commit is contained in:
Scott Kiener 2023-05-18 14:33:25 -04:00
parent 01e294d7fb
commit 85b9ce11e2
6 changed files with 68 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/digital-components/date-picker/date-picker.vue
View file

@ -306,8 +306,7 @@ export default {
const monthsAfterToLoadOffset = 12; // TO BE MADE "CONSTANTS" const monthsAfterToLoadOffset = 12; // TO BE MADE "CONSTANTS"
const monthsBeforeToLoadOffset = 36; // TO BE MADE "CONSTANTS" const monthsBeforeToLoadOffset = 36; // TO BE MADE "CONSTANTS"
config.initialShopTimeSlotsResponse.days.forEach((selectableDate) => {
config.initialShopTimeSlotsResponse.forEach((selectableDate) => {
this.selectableDatesData.push(selectableDate); this.selectableDatesData.push(selectableDate);
}); });
@ -522,7 +521,7 @@ export default {
monthStart, monthStart,
monthEnd monthEnd
); );
moreSelectableDates.forEach((selectableDate) => { moreSelectableDates.days.forEach((selectableDate) => {
const index = this.selectableDatesData.findIndex( const index = this.selectableDatesData.findIndex(
(obj) => obj.dateString === selectableDate.dateString (obj) => obj.dateString === selectableDate.dateString
); );

8
src/digital-components/date-picker/mixins/constants.js
View file

@ -21,10 +21,6 @@ const MONTHS_OF_YEAR = [
"December", "December",
]; ];
<<<<<<< HEAD:src/constants/scheduling.js const DAYS_OF_WEEK = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
const daysOfWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
export { monthsOfYear, daysOfWeek }; export { TIMINGFUNC_MAP, BUFFER_OFFSET, MONTHS_OF_YEAR, DAYS_OF_WEEK };
=======
export { TIMINGFUNC_MAP, BUFFER_OFFSET, MONTHS_OF_YEAR };
>>>>>>> CSR-886:src/digital-components/date-picker/mixins/constants.js

2
src/digital-components/modal/modal.vue
View file

@ -100,7 +100,7 @@ export default {
isFooterButtonDisabled() { isFooterButtonDisabled() {
if (!this.meta.touched) { if (!this.meta.touched) {
return !this.meta.valid; return !this.meta.valid;
} }
return !this.meta.dirty || !this.meta.valid; return !this.meta.dirty || !this.meta.valid;
}, },
}, },

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

@ -46,9 +46,8 @@
:mobileEarlyBirdFee="mobileEarlyBirdFee" :mobileEarlyBirdFee="mobileEarlyBirdFee"
:dateAndTimeSlotData="timeSlotsForSelectedDate" :dateAndTimeSlotData="timeSlotsForSelectedDate"
:estimatedServiceMinutesMinimum="selectableDatesData.estimatedServiceMinutesMinimum" :estimatedServiceMinutesMinimum="selectableDatesData.estimatedServiceMinutesMinimum"
:estimatedServiceMinutesMaximum=" :estimatedServiceMinutesMaximum="selectableDatesData.estimatedServiceMinutesMaximum"
selectableDatesData.estimatedServiceMinutesMaximum" validationRules="time-slot-selection-required" />
validationRules="time-slot-selection-required"/>
<button @click="setAppointmentType('Inshop')">Set to Inshop</button> <button @click="setAppointmentType('Inshop')">Set to Inshop</button>
<button @click="setAppointmentType('Mobile')">Set to Mobile</button> <button @click="setAppointmentType('Mobile')">Set to Mobile</button>
<button @click="setAppointmentType('Dropoff')">Set to Dropoff</button> <button @click="setAppointmentType('Dropoff')">Set to Dropoff</button>
@ -106,11 +105,11 @@ const getAvailableDates = async (startDate, endDate) => {
false false
); );
const newShopTimeSlots = newShopTimeSlotsResponse.data; const newShopTimeSlots = newShopTimeSlotsResponse.data;
return convertApiResponse(newShopTimeSlots.days); return convertApiResponse(newShopTimeSlots);
}; };
const convertApiResponse = (responseData) => { const convertApiResponse = (responseData) => {
// DATA CONVERSION // DATA CONVERSION
responseData?.forEach((date) => { responseData?.days.forEach((date) => {
const dateString = date.date; const dateString = date.date;
date.dateString = dateString; date.dateString = dateString;
const dateStringPieces = dateString.split("-"); const dateStringPieces = dateString.split("-");
@ -131,7 +130,6 @@ export default {
weatherAlerts: [], weatherAlerts: [],
mobileEarlyBirdFee: null, mobileEarlyBirdFee: null,
TEMPORARYappointmentType: "Inshop", TEMPORARYappointmentType: "Inshop",
}; };
}, },
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -142,19 +140,17 @@ export default {
selectableDatesSetting: "custom", selectableDatesSetting: "custom",
initialViewRowsToShow: 5, initialViewRowsToShow: 5,
customSelectableDatesCallback: getAvailableDates, customSelectableDatesCallback: getAvailableDates,
const earlyBirdPromise = baseMixin.methods.dispatchStoreAction(
storeActions.GET_MOBILE_EARLY_BIRD_FEE // Price EARLY BIRD pre-emptively to allow for asynchronous call to pricing
); // const pricingPromise = baseMixin.methods.dispatchStoreAction(
// Price EARLY BIRD pre-emptively to allow for asynchronous call to pricing // storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
// const pricingPromise = baseMixin.methods.dispatchStoreAction( // {
// storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA, // availableLineItems: [
// { // {partNumber: "EARLY BIRD"}
// availableLineItems: [ // ],
// {partNumber: "EARLY BIRD"} // },
// ], // false
// }, // );
// false
// );
/* vvvvv SAVE THESE FOR TESTING PURPOSES FOR NOW vvvvv /* vvvvv SAVE THESE FOR TESTING PURPOSES FOR NOW vvvvv
@ -173,6 +169,9 @@ export default {
*/ */
}); });
const earlyBirdPromise = baseMixin.methods.dispatchStoreAction(
storeActions.GET_MOBILE_EARLY_BIRD_FEE
);
const alertReasonsPromise = getAlertReasons(store.getters.order.serviceLocation.zipCodeCtu); const alertReasonsPromise = getAlertReasons(store.getters.order.serviceLocation.zipCodeCtu);
// Settle promises and get results // Settle promises and get results
@ -210,6 +209,7 @@ export default {
vm.mobileEarlyBirdFee.laborAmount = 15; vm.mobileEarlyBirdFee.laborAmount = 15;
vm.mobileEarlyBirdFee.sellingPrice = 0; vm.mobileEarlyBirdFee.sellingPrice = 0;
vm.mobileEarlyBirdFee.kitPrice = 0; vm.mobileEarlyBirdFee.kitPrice = 0;
vm.selectableDatesData = resultMap.datePickerInitialData.initialShopTimeSlotsResponse;
// if (resultMap.earlyBird) { // if (resultMap.earlyBird) {
// vm.mobileEarlyBirdFee = resultMap.pricingResults; // vm.mobileEarlyBirdFee = resultMap.pricingResults;
// } // }
@ -234,7 +234,7 @@ export default {
if (this.selectedDate === null) { if (this.selectedDate === null) {
return null; return null;
} }
return this.selectableDatesData.find( return this.selectableDatesData.days.find(
(selectableDate) => selectableDate.dateString === this.selectedDate.dateString (selectableDate) => selectableDate.dateString === this.selectedDate.dateString
); );
}, },
@ -267,20 +267,12 @@ export default {
// NEED TODO - WHAT ARE PAGE REQ'S FOR THIS PAGE? // NEED TODO - WHAT ARE PAGE REQ'S FOR THIS PAGE?
}, },
async getAvailableDatesMethod(startDate, endDate) { async getAvailableDatesMethod(startDate, endDate) {
/* TODO - DO WE NEED TO KEEP AN AGGREGATE OF ALL DATES RETURNED const newShopTimeSlots = await getAvailableDates(startDate, endDate);
FOR TIMESLOTS in this.selectableDatesData? IS selectableDatesData EVEN NEEDED? // ADD API CALL RESULTS TO EXISTING DATE DATA
this.selectableDatesData.days = this.selectableDatesData.days.concat(
// // ADD API CALL RESULTS TO EXISTING DATE DATA newShopTimeSlots.days
// this.selectableDatesData = this.selectableDatesData.concat( );
// this.convertApiResponse(newShopTimeSlots.days) return newShopTimeSlots;
// );
// // console.log("this.selectableDatesData is now: ", this.selectableDatesData);
// // RETURN AGGREGATE DATE DATA
// return this.selectableDatesData;
*/
return await getAvailableDates(startDate, endDate);
}, },
setData(alertReasonsData) { setData(alertReasonsData) {
if (alertReasonsData) { if (alertReasonsData) {
@ -320,7 +312,7 @@ export default {
this.$refs["timeSlotModalQuestion"].openModal(); this.$refs["timeSlotModalQuestion"].openModal();
}, },
getTimeSlotObjectFromTimeSlotId(timeSlotId) { getTimeSlotObjectFromTimeSlotId(timeSlotId) {
const timeSlots = this.selectableDatesData.find( const timeSlots = this.selectableDatesData.days.find(
(selectableDate) => selectableDate.dateString === this.selectedDate.dateString (selectableDate) => selectableDate.dateString === this.selectedDate.dateString
).timeSlots; ).timeSlots;
return timeSlots.find((timeSlot) => timeSlot.id === timeSlotId); return timeSlots.find((timeSlot) => timeSlot.id === timeSlotId);

52
src/layouts/schedule/time-slot-modal-question/time-slot-modal-question.vue
View file

@ -20,10 +20,13 @@
groupName="ChooseTimeSlot" groupName="ChooseTimeSlot"
textPosition="text-center" textPosition="text-center"
v-model="selectedTimeSlot" v-model="selectedTimeSlot"
isRequired isRequired
validationRules="time-slot-required" validationRules="time-slot-required"
class="mt-5"/> class="mt-5" />
<div class="mt-1 mb-2" v-if="supplementalInformationBlock" v-html="supplementalInformationBlock"></div> <div
class="mt-1 mb-2"
v-if="supplementalInformationBlock"
v-html="supplementalInformationBlock"></div>
<textBlock <textBlock
v-show="shouldShowDropoffDisclaimerText" v-show="shouldShowDropoffDisclaimerText"
:customText="dropoffDisclaimerText" :customText="dropoffDisclaimerText"
@ -40,8 +43,9 @@ import textBlock from "@/digital-components/text-block/text-block";
import buttonQuestion from "@/digital-components/button-question/button-question"; import buttonQuestion from "@/digital-components/button-question/button-question";
import timeslotModalListButton from "./timeslot-modal-list-button/timeslot-modal-list-button"; import timeslotModalListButton from "./timeslot-modal-list-button/timeslot-modal-list-button";
import { daysOfWeek, monthsOfYear } from "@/constants/scheduling.js"; // TODO: Move this somewhere more global
import {defineRule, useField} from "vee-validate"; import { DAYS_OF_WEEK, MONTHS_OF_YEAR } from "@/digital-components/date-picker/mixins/constants.js";
import { defineRule, useField } from "vee-validate";
import { errorMessages } from "@/constants/error-messages"; import { errorMessages } from "@/constants/error-messages";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
@ -52,7 +56,7 @@ defineRule("time-slot-required", required(errorMessages.OPTION_REQUIRED));
const AppointmentTypeStrings = { const AppointmentTypeStrings = {
IN_SHOP: "Inshop", IN_SHOP: "Inshop",
MOBILE: "Mobile", MOBILE: "Mobile",
DROP_OFF: "Dropoff" DROP_OFF: "Dropoff",
}; };
export default { export default {
@ -68,7 +72,7 @@ export default {
mobileEarlyBirdFee: Object, mobileEarlyBirdFee: Object,
estimatedServiceMinutesMinimum: Number, estimatedServiceMinutesMinimum: Number,
estimatedServiceMinutesMaximum: Number, estimatedServiceMinutesMaximum: Number,
validationRules: String validationRules: String,
}, },
data() { data() {
return { return {
@ -77,11 +81,10 @@ export default {
}; };
}, },
setup(props) { setup(props) {
const { handleChange } = const { handleChange } = useField("time-slot-modal-question", props.validationRules);
useField("time-slot-modal-question", props.validationRules);
return { return {
handleChange handleChange,
}; };
}, },
watch: { watch: {
@ -100,7 +103,10 @@ export default {
if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) { if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) {
return null; return null;
} else if (this.appointmentType === AppointmentTypeStrings.MOBILE) { } else if (this.appointmentType === AppointmentTypeStrings.MOBILE) {
appointmentTypeCmsWidgetName = this.selectedTimeSlot === this.earlyBirdButtonText ? this.earlyBirdCmsWidgetName : this.mobileCmsWidgetName; appointmentTypeCmsWidgetName =
this.selectedTimeSlot === this.earlyBirdButtonText
? this.earlyBirdCmsWidgetName
: this.mobileCmsWidgetName;
} else { } else {
appointmentTypeCmsWidgetName = this.dropoffCmsWidgetName; appointmentTypeCmsWidgetName = this.dropoffCmsWidgetName;
if (this.isSameDay) { if (this.isSameDay) {
@ -133,8 +139,8 @@ export default {
} }
// This conversion ensures we don't get get GMT induced date changes // This conversion ensures we don't get get GMT induced date changes
const dateObject = new Date(`${this.dateAndTimeSlotData.dateString}T00:00:00`); const dateObject = new Date(`${this.dateAndTimeSlotData.dateString}T00:00:00`);
const weekdayName = daysOfWeek[dateObject.getDay()]; const weekdayName = DAYS_OF_WEEK[dateObject.getDay()];
const month = monthsOfYear[dateObject.getMonth()]; const month = MONTHS_OF_YEAR[dateObject.getMonth()];
const numberDayOfMonth = dateObject.getDate(); const numberDayOfMonth = dateObject.getDate();
// Ex. Tuesday, April 23 // Ex. Tuesday, April 23
return `${weekdayName}, ${month} ${numberDayOfMonth}`; return `${weekdayName}, ${month} ${numberDayOfMonth}`;
@ -147,7 +153,10 @@ export default {
if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) { if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) {
durationSubHeaderText += "All day"; durationSubHeaderText += "All day";
} else { } else {
durationSubHeaderText += this.getDisplayTextForDurationLength(this.estimatedServiceMinutesMinimum, this.estimatedServiceMinutesMaximum); durationSubHeaderText += this.getDisplayTextForDurationLength(
this.estimatedServiceMinutesMinimum,
this.estimatedServiceMinutesMaximum
);
} }
return durationSubHeaderText; return durationSubHeaderText;
}, },
@ -157,14 +166,16 @@ export default {
} }
let availableTimeSlots; let availableTimeSlots;
if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) { if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) {
availableTimeSlots = [{value: "Dropoff", buttonLabel: this.dropoffButtonText}] availableTimeSlots = [{ value: "Dropoff", buttonLabel: this.dropoffButtonText }];
} else { } else {
availableTimeSlots = this.dateAndTimeSlotData.timeSlots.map((timeslot) => { availableTimeSlots = this.dateAndTimeSlotData.timeSlots.map((timeslot) => {
let readableTime; let readableTime;
if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) { if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) {
readableTime = this.getDisplayTextForMilitaryTime(timeslot.startTime); readableTime = this.getDisplayTextForMilitaryTime(timeslot.startTime);
} else if (this.appointmentType === AppointmentTypeStrings.MOBILE) { } else if (this.appointmentType === AppointmentTypeStrings.MOBILE) {
readableTime = `${this.getDisplayTextForMilitaryTime(timeslot.startTime)} - ${this.getDisplayTextForMilitaryTime(timeslot.endTime)}`; readableTime = `${this.getDisplayTextForMilitaryTime(
timeslot.startTime
)} - ${this.getDisplayTextForMilitaryTime(timeslot.endTime)}`;
} }
return { return {
value: timeslot.id, value: timeslot.id,
@ -172,13 +183,16 @@ export default {
}; };
}); });
} }
if (this.appointmentType === AppointmentTypeStrings.MOBILE) { if (this.appointmentType === AppointmentTypeStrings.MOBILE) {
const offerPremium = this.dateAndTimeSlotData.timeSlots[0].offerPremium; const offerPremium = this.dateAndTimeSlotData.timeSlots[0].offerPremium;
const hasEarlyBird = this.mobileEarlyBirdFee?.partType === "EARLY BIRD"; const hasEarlyBird = this.mobileEarlyBirdFee?.partType === "EARLY BIRD";
if (offerPremium && hasEarlyBird) { if (offerPremium && hasEarlyBird) {
availableTimeSlots.unshift({value: this.dateAndTimeSlotData.timeSlots[0].id + "-earlybird", buttonLabel: this.earlyBirdButtonText, buttonLabelSubCopy: this.getTotalLineItemPrice(this.mobileEarlyBirdFee)}); availableTimeSlots.unshift({
value: this.dateAndTimeSlotData.timeSlots[0].id + "-earlybird",
buttonLabel: this.earlyBirdButtonText,
buttonLabelSubCopy: this.getTotalLineItemPrice(this.mobileEarlyBirdFee),
});
} }
} }
return availableTimeSlots; return availableTimeSlots;
@ -218,7 +232,7 @@ export default {
displayTextForDurationLength = `${durationMinimum} - ${durationMaximum} minutes`; displayTextForDurationLength = `${durationMinimum} - ${durationMaximum} minutes`;
} }
return displayTextForDurationLength; return displayTextForDurationLength;
} },
}, },
components: { components: {
modal, modal,

6
src/layouts/schedule/time-slot-modal-question/timeslot-modal-list-button/timeslot-modal-list-button.vue
View file

@ -43,9 +43,9 @@ export default {
}; };
}, },
computed: { computed: {
formattedButtonLabelSubCopy() { formattedButtonLabelSubCopy() {
return this.buttonLabelSubCopy?.toFixed(2); return this.buttonLabelSubCopy?.toFixed(2);
} },
}, },
methods: { methods: {
displayLoader() { displayLoader() {