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

Checkpoint before trying to simplify

Browse source
This commit is contained in:
Leah Schumann 2023-08-31 07:39:17 -04:00
parent 48654309de
commit c0b02c8c00
3 changed files with 63 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/constants/schedule-constants.js
View file

@ -4,7 +4,7 @@ const AppointmentTypeStrings = {
DROP_OFF: "Dropoff",
};
const PREMIUM_TIME_SLOT_ID_FLAG = "-premium";
const PREMIUM_TIME_SLOT_ID_FLAG = "-PREMIUM";
const PREMIUM_FEE_PART_TYPE = "EARLY BIRD";

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

@ -24,17 +24,17 @@
<timeSlotModalQuestion
ref="timeSlotModalQuestion"
customComponentId="timeSlotModalQuestion"
v-model="selectedTimeSlot"
cmsWidgetName="TimeSlotModalQuestion"
mobilePremiumCmsWidgetName="MobilePremiumTimeSlotModal"
mobileCmsWidgetName="MobileTimeSlotModal"
dropoffCmsWidgetName="DropOffTimeSlotModal"
sameDayDropOffCmsWidgetName="SameDayDropOffTimeSlotModal"
overnightDropOffCmsWidgetName="OvernightDropOffTimeSlotModal"
v-model="selectedTimeSlot"
overnightDropOffCmsWidgetName="OvernightDropOffTimeSlotModal"
:selectedDate="selectedDate"
:appointmentType="appointmentType"
:premiumAppointmentFee="mobilePremiumAppointmentFee"
:dateAndTimeSlotData="timeSlotsForSelectedDate"
:timeSlotsForSelectedDate="timeSlotsForSelectedDate"
:estimatedServiceMinutesMinimum="selectableDatesData.estimatedServiceMinutesMinimum"
:estimatedServiceMinutesMaximum="selectableDatesData.estimatedServiceMinutesMaximum"
@time-slot-modal-closed="timeSlotModalClosed"
@ -293,18 +293,22 @@ export default {
splitCopyOnCMSPlaceHolder,
arePagePrerequisitesValid() {
const serviceLocation = store.getters.order.serviceLocation;
const serviceLocationPreReqs =
serviceLocation.zipCode &&
serviceLocation.zipCodeCtu &&
serviceLocation.appointmentType &&
(serviceLocation.appointmentType === AppointmentTypeStrings.MOBILE ||
serviceLocation.provider.providerNumber);
const paymentInfo = store.getters.payment.isInsurance !== null;
const supportingItems = store.getters.lineItems.supportingItems !== null;
const damageInfo =
store.getters.order.damage.isRepair ||
(store.getters.order.lineItems?.glassParts != null &&
store.getters.order.lineItems.glassParts.length > 0);
return serviceLocationPreReqs && paymentInfo && supportingItems && damageInfo;
},
async getAvailableDatesMethod(startDate, endDate) {
@ -327,14 +331,19 @@ export default {
openInshopTimeSlotsModal() {
this.$refs["timeSlotModalQuestion"].openModal();
},
getSelectedTimeSlot() {
return store.getters.order.schedule;
},
getSelectedDate() {
return store.getters.order.schedule.date;
},
getSelectedRouteCode() {
return store.getters.order.schedule.routeCode;
getSelectedTimeSlot() {
const supportingItems = this.getSupportingItems();
const isPremiumAppointment = !!supportingItems.filter(
(lineItem) => lineItem.partType === PREMIUM_FEE_PART_TYPE
).length > 0;
const selectedTimeSlot = store.getters.order.schedule;
selectedTimeSlot.isPremiumAppointment = isPremiumAppointment
return selectedTimeSlot;
},
getSupportingItems() {
return store.getters.lineItems.supportingItems;
@ -376,8 +385,8 @@ export default {
// Ex: April 25
return dateObject.toLocaleDateString("en-us", { month: "short", day: "numeric" });
},
// Expected input: "HH:MM"
getDisplayTextForMilitaryTime(militaryTimeInput, shouldTrimMinutesIfEmpty = false) {
// Expected input: "HH:MM"
let hours = parseInt(militaryTimeInput.split(":")[0]);
const minutes = militaryTimeInput.split(":")[1];
const meridianNotation = hours > 11 ? "PM" : "AM";
@ -395,6 +404,10 @@ export default {
},
forwardButtonAction() {
this.updateSupportingItems();
// Remove the isPremiumAppointment flag to ensure it never gets into the store
delete this.selectedTimeSlot.isPremiumAppointment;
this.dispatchStoreAction(this.storeActions.SAVE_SCHEDULE, this.selectedTimeSlot, false);
this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route);
@ -455,6 +468,7 @@ export default {
endTime: null,
jobMaxMinutes: null,
jobMinMinutes: null,
isPremiumAppointment: null,
};
}
},

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

@ -22,7 +22,7 @@
:answers="availableTimeSlots"
groupName="chooseTimeSlot"
textPosition="text-center"
v-model="selectedTimeSlotId"
v-model="selectedRouteCode"
isRequired
validationRules="time-slot-required" />
<div
@ -84,17 +84,7 @@ export default {
name: "time-slot-modal-question",
emits: ["update:modelValue"],
props: {
modelValue: {
type: Object,
default: () => ({
routeCode: null,
date: null,
startTime: null,
endTime: null,
jobMaxMinutes: null,
jobMinMinutes: null,
}),
},
modelValue: Object,
cmsWidgetName: String,
mobileCmsWidgetName: String,
mobilePremiumCmsWidgetName: String,
@ -102,7 +92,7 @@ export default {
sameDayDropOffCmsWidgetName: String,
overnightDropOffCmsWidgetName: String,
appointmentType: String,
dateAndTimeSlotData: Object,
timeSlotsForSelectedDate: Object,
premiumAppointmentFee: Object,
estimatedServiceMinutesMinimum: Number,
estimatedServiceMinutesMaximum: Number,
@ -113,7 +103,7 @@ export default {
data() {
return {
isModalOpened: false,
selectedValue: null,
selectedRouteCode: this.getSelectedRouteCode(),
timeSlotModalListButton: timeSlotModalListButton,
};
},
@ -150,14 +140,8 @@ export default {
modalName() {
return "timeSlots";
},
selectedTimeSlotId: {
get: function () {
return this.modelValue?.routeCode;
},
set: function (newValue) {
// Button Question only supports Number, or String data types so we must convert to the full object before emitting
this.selectedValue = this.getSelectedTimeSlotObject(newValue);
},
modal() {
return this.$refs[this.modalName];
},
supplementalInformationBlock() {
let appointmentTypeCmsWidgetName;
@ -295,21 +279,21 @@ export default {
}
},
isSameDay() {
if (!this.dateAndTimeSlotData) {
if (!this.timeSlotsForSelectedDate) {
return false;
}
const selectedDate = this.dateAndTimeSlotData.date;
const selectedDate = this.timeSlotsForSelectedDate.date;
const todaysDate = new Date().toISOString().split("T")[0];
return selectedDate === todaysDate;
},
dateSelectedReadableDate() {
if (!this.dateAndTimeSlotData) {
if (!this.timeSlotsForSelectedDate) {
return null;
}
// This conversion ensures we don't get get GMT induced date changes
const dateObject = convertDateStringToDate(this.dateAndTimeSlotData.date);
const dateObject = convertDateStringToDate(this.timeSlotsForSelectedDate.date);
// Ex: Tuesday, April 22
return dateObject.toLocaleDateString("en-us", {
weekday: "long",
@ -318,21 +302,18 @@ export default {
});
},
availableTimeSlots() {
if (!this.dateAndTimeSlotData) {
if (!this.timeSlotsForSelectedDate) {
return null;
}
if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) {
return this.getAvailableTimeSlotsForDropOff(this.dateAndTimeSlotData.timeSlots);
return this.getAvailableTimeSlotsForDropOff(this.timeSlotsForSelectedDate.timeSlots);
} else if (this.appointmentType === AppointmentTypeStrings.MOBILE) {
return this.getAvailableTimeSlotsForMobile(this.dateAndTimeSlotData.timeSlots);
return this.getAvailableTimeSlotsForMobile(this.timeSlotsForSelectedDate.timeSlots);
} else {
return this.getAvailableTimeSlotsForInshop(this.dateAndTimeSlotData.timeSlots);
return this.getAvailableTimeSlotsForInshop(this.timeSlotsForSelectedDate.timeSlots);
}
},
modal() {
return this.$refs[this.modalName];
},
},
methods: {
openModal() {
@ -348,7 +329,7 @@ export default {
this.$emit("time-slot-modal-closed");
},
async setSelectedTimeSlot() {
this.$emit("update:modelValue", this.selectedValue);
this.$emit("update:modelValue", this.getSelectedTimeSlotObject(this.selectedRouteCode));
this.closeModal();
},
getRelevantDropOffCmsWidgetNameForSelectedTimeSlot(
@ -416,6 +397,7 @@ export default {
getPremiumAppointmentTimeSlot(timeSlotData) {
const formattedPrice =
"+$" + this.getTotalLineItemPrice(this.premiumAppointmentFee).toFixed(2);
return {
// Unique value is required for each <input> and the premium appoinment shares a timeSlot ID
value: this.addPremiumFlagToInput(timeSlotData.id),
@ -426,31 +408,49 @@ export default {
},
};
},
getSelectedRouteCode() {
if (!this.modelValue?.routeCode) {
return null;
}
if (this.modelValue?.isPremiumAppointment) {
return this.addPremiumFlagToInput(this.modelValue?.routeCode);
} else {
return this.modelValue?.routeCode;
}
},
autoSelectTimeSlotIfOnlyOneIsAvailable(newAvailableTimeSlotsValue) {
const numberOfOptions = newAvailableTimeSlotsValue?.length;
if (numberOfOptions === 1) {
this.selectedTimeSlotId = newAvailableTimeSlotsValue[0].value;
this.selectedRouteCode = newAvailableTimeSlotsValue[0].value;
}
},
addPremiumFlagToInput(timeSlotId) {
return (timeSlotId += PREMIUM_TIME_SLOT_ID_FLAG);
},
removePremiumFlagFromInput(timeSlotId) {
return timeSlotId.substring(0, timeSlotId.length - PREMIUM_TIME_SLOT_ID_FLAG.length);
return timeSlotId.replace(PREMIUM_TIME_SLOT_ID_FLAG, "");
},
getSelectedTimeSlotObject(timeSlotId) {
const timeSlot = this.dateAndTimeSlotData?.timeSlots?.find(
console.log(timeSlotId)
const timeSlotIdIncludesPremium = timeSlotId?.includes(PREMIUM_TIME_SLOT_ID_FLAG);
if (timeSlotIdIncludesPremium) {
timeSlotId = this.removePremiumFlagFromInput(timeSlotId);
}
const timeSlot = this.timeSlotsForSelectedDate?.timeSlots?.find(
(timeSlot) => timeSlot.id == timeSlotId
);
if (timeSlot) {
return {
date: this.dateAndTimeSlotData.date,
date: this.timeSlotsForSelectedDate.date,
routeCode: timeSlot.id,
startTime: timeSlot.startTime,
endTime: timeSlot.endTime,
jobMaxMinutes: this.estimatedServiceMinutesMaximum.toString(),
jobMinMinutes: this.estimatedServiceMinutesMinimum.toString(),
isPremiumAppointment: timeSlotIdIncludesPremium ? true : false
};
}
@ -461,6 +461,7 @@ export default {
routeCode: null,
jobMaxMinutes: null,
jobMinMinutes: null,
isPremiumAppointment: null
};
},
},