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

Merge branch 'develop' into defect/digital/SSR-1205

Browse source 
# Conflicts:
#	src/iss-components/cart-dropdown/cart-dropdown.vue
This commit is contained in:
Josh Dassinger 2024-05-06 14:30:47 -05:00
commit 0b3511b3aa
8 changed files with 199 additions and 178 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/iss-components/shop-list-button/shop-list-button.vue
View file

@ -32,7 +32,8 @@
:allowPageInteraction="true" /> :allowPageInteraction="true" />
<div <div
v-else v-else
id="availabilityIndicator"> id="availabilityIndicator"
class="d-flex align-items-center">
<div <div
id="availabilityBadge" id="availabilityBadge"
class="availability-badge" class="availability-badge"

14
src/iss-components/site-sub-header/site-sub-header.vue
View file

@ -18,7 +18,7 @@
class="subheader-secondary d-flex align-items-center overflow-hidden" class="subheader-secondary d-flex align-items-center overflow-hidden"
:class="[justifySubheader, subHeaderClasses]"> :class="[justifySubheader, subHeaderClasses]">
<p <p
class="fw-normal mb-0" class="fw-normal"
:class="[alternateFormatting, subTextClasses]"> :class="[alternateFormatting, subTextClasses]">
<span v-html="subText"> </span> <span v-html="subText"> </span>
</p> </p>
@ -33,7 +33,7 @@ import {
splitCopyOnCMSPlaceHolder, splitCopyOnCMSPlaceHolder,
getRouterLinkRouteFromCopy, getRouterLinkRouteFromCopy,
getRouterLinkDisplayTextFromCopy, getRouterLinkDisplayTextFromCopy,
getRouterLinkHtmlStringFromCopy, getRouterLinkHtmlStringFromCopy
} from '@/helpers/cms-content-helper'; } from '@/helpers/cms-content-helper';
import { stripRteStyle } from '@/helpers/text-helper'; import { stripRteStyle } from '@/helpers/text-helper';
@ -51,7 +51,7 @@ export default {
stripRteStyle: Boolean, stripRteStyle: Boolean,
subContentProperty: String, subContentProperty: String,
subHeaderClasses: String, subHeaderClasses: String,
subTextClasses: String, subTextClasses: String
}, },
emits: ['click-event'], emits: ['click-event'],
computed: { computed: {
@ -103,10 +103,10 @@ export default {
alternateFormatting() { alternateFormatting() {
// override for service-packages unique style // override for service-packages unique style
if (this.issContainingPage?.toLowerCase() === 'service-packages') { if (this.issContainingPage?.toLowerCase() === 'service-packages') {
return 'service-packages-subtext mt-4 mb-4 px-5'; return 'service-packages-subtext my-4';
} }
return this.darkGraySubText ? 'dark-gray' : 'light-gray'; return this.darkGraySubText ? 'dark-gray' : 'light-gray';
}, }
}, },
methods: { methods: {
doesCopyContainRouterLink, doesCopyContainRouterLink,
@ -116,8 +116,8 @@ export default {
getRouterLinkHtmlStringFromCopy, getRouterLinkHtmlStringFromCopy,
clickEvent() { clickEvent() {
this.$emit('click-event'); this.$emit('click-event');
}, }
}, }
}; };
</script> </script>

60
src/layouts/order-confirmation/order-confirmation.spec.js
View file

@ -72,7 +72,10 @@ const initialStore = {
}, },
payment: { payment: {
isInsurance: true, isInsurance: true,
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
contactInfo: { contactInfo: {
firstName: 'Test', firstName: 'Test',
@ -108,7 +111,10 @@ const sessionStorage = {
} }
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -315,7 +321,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Mobile' appointmentType: 'Mobile'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -354,7 +363,10 @@ describe('OrderConfirmation.vue', () => {
} }
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -401,7 +413,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Mobile' appointmentType: 'Mobile'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -440,7 +455,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Dropoff' appointmentType: 'Dropoff'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -479,7 +497,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Inshop' appointmentType: 'Inshop'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -515,7 +536,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Mobile' appointmentType: 'Mobile'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -554,7 +578,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Inshop' appointmentType: 'Inshop'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -590,7 +617,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Mobile' appointmentType: 'Mobile'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -629,7 +659,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Dropoff' appointmentType: 'Dropoff'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []
@ -669,7 +702,10 @@ describe('OrderConfirmation.vue', () => {
appointmentType: 'Inshop' appointmentType: 'Inshop'
}, },
payment: { payment: {
isPayInAdvance: false isPayInAdvance: false,
insuranceCoverage: {
isVerified: true
}
}, },
lineItems: { lineItems: {
vaps: [] vaps: []

151
src/layouts/schedule-page/schedule-page.vue
View file

@ -90,16 +90,16 @@ import {
AppointmentTypeStrings, AppointmentTypeStrings,
GET_MOBILE_TIME_SLOTS, GET_MOBILE_TIME_SLOTS,
GET_SHOP_TIME_SLOTS, GET_SHOP_TIME_SLOTS,
PREMIUM_FEE_PART_TYPE, PREMIUM_FEE_PART_TYPE
} from '@/constants/schedule-constants.js'; } from '@/constants/schedule-constants.js';
import { import {
fetchCmsContentForPage, fetchCmsContentForPage,
splitCopyOnCMSPlaceHolder, splitCopyOnCMSPlaceHolder
} from '@/helpers/cms-content-helper'; } from '@/helpers/cms-content-helper';
import { import {
calcDaysBetweenDates, calcDaysBetweenDates,
convertDateStringToDate, convertDateStringToDate,
sumDateString, sumDateString
} from '@/helpers/date-helper'; } from '@/helpers/date-helper';
import settleAllPromises from '@/helpers/layout-helper'; import settleAllPromises from '@/helpers/layout-helper';
import { Form, defineRule } from 'vee-validate'; import { Form, defineRule } from 'vee-validate';
@ -156,16 +156,16 @@ const getAvailableDates = async (
} }
if ( if (
appointmentType === AppointmentTypeStrings.MOBILE || appointmentType === AppointmentTypeStrings.MOBILE
appointmentType === || appointmentType
AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP
) { ) {
storeActionConfig = { storeActionConfig = {
storeAction: GET_MOBILE_TIME_SLOTS, storeAction: GET_MOBILE_TIME_SLOTS,
payload: { payload: {
startDate: apiStartDate, startDate: apiStartDate,
endDate: apiEndDate, endDate: apiEndDate
}, }
}; };
} else { } else {
storeActionConfig = { storeActionConfig = {
@ -174,16 +174,15 @@ const getAvailableDates = async (
startDate: apiStartDate, startDate: apiStartDate,
endDate: apiEndDate, endDate: apiEndDate,
shopAppointmentType: appointmentType, shopAppointmentType: appointmentType,
providerNumber, providerNumber
}, }
}; };
} }
if (apiStartDate < apiEndDate) if (apiStartDate < apiEndDate) storeActionConfigs.push(storeActionConfig);
storeActionConfigs.push(storeActionConfig);
} }
const timeSlotsResponsesData = { const timeSlotsResponsesData = {
days: [], days: []
}; };
function compareDayStrings(a, b) { function compareDayStrings(a, b) {
@ -193,33 +192,31 @@ const getAvailableDates = async (
} }
const makeParallelCalls = async () => { const makeParallelCalls = async () => {
await Promise.all( await Promise.all(storeActionConfigs.map(async (storeAction) => {
storeActionConfigs.map(async (storeAction) => { let timeSlotsResponse = null;
let timeSlotsResponse = null; if (storeAction.storeAction === GET_SHOP_TIME_SLOTS) {
if (storeAction.storeAction === GET_SHOP_TIME_SLOTS) { timeSlotsResponse = await useMainStore().getShopTimeSlots(
timeSlotsResponse = await useMainStore().getShopTimeSlots( storeAction.payload.startDate,
storeAction.payload.startDate, storeAction.payload.endDate,
storeAction.payload.endDate, storeAction.payload.shopAppointmentType,
storeAction.payload.shopAppointmentType, storeAction.payload.providerNumber
storeAction.payload.providerNumber );
); } else {
} else { timeSlotsResponse = await useMainStore().getMobileTimeSlots(
timeSlotsResponse = await useMainStore().getMobileTimeSlots( storeAction.payload.startDate,
storeAction.payload.startDate, storeAction.payload.endDate
storeAction.payload.endDate );
); }
}
timeSlotsResponsesData.estimatedServiceMinutesMinimum = timeSlotsResponsesData.estimatedServiceMinutesMinimum =
timeSlotsResponse.data.estimatedServiceMinutesMinimum; timeSlotsResponse.data.estimatedServiceMinutesMinimum;
timeSlotsResponsesData.estimatedServiceMinutesMaximum = timeSlotsResponsesData.estimatedServiceMinutesMaximum =
timeSlotsResponse.data.estimatedServiceMinutesMaximum; timeSlotsResponse.data.estimatedServiceMinutesMaximum;
timeSlotsResponsesData.days = [ timeSlotsResponsesData.days = [
...timeSlotsResponsesData.days, ...timeSlotsResponsesData.days,
...timeSlotsResponse.data.days, ...timeSlotsResponse.data.days
]; ];
}) }));
);
}; };
return makeParallelCalls().then(() => { return makeParallelCalls().then(() => {
@ -240,7 +237,7 @@ export default {
siteFooter, siteFooter,
textBlock, textBlock,
// eslint-disable-next-line vue/no-reserved-component-names // eslint-disable-next-line vue/no-reserved-component-names
Form, Form
}, },
mixins: [BaseFormMixin], mixins: [BaseFormMixin],
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -257,7 +254,7 @@ export default {
selectableDatesSetting: 'custom', selectableDatesSetting: 'custom',
initialViewRowsToShow: 5, initialViewRowsToShow: 5,
customSelectableDatesCallback: getAvailableDates, customSelectableDatesCallback: getAvailableDates,
preSelectedDate, preSelectedDate
}); });
const premiumFeePromise = useMainStore().getMobilePremiumFee(); const premiumFeePromise = useMainStore().getMobilePremiumFee();
@ -278,29 +275,27 @@ export default {
const promiseResultMap = [ const promiseResultMap = [
{ {
resultKey: 'cmsContent', resultKey: 'cmsContent',
promise: cmsContentPromise, promise: cmsContentPromise
}, },
{ {
resultKey: 'alertReasons', resultKey: 'alertReasons',
promise: alertReasonsPromise, promise: alertReasonsPromise
}, },
{ {
resultKey: 'datePickerInitialData', resultKey: 'datePickerInitialData',
promise: datePickerInitialDataPromise, promise: datePickerInitialDataPromise
}, },
{ {
resultKey: 'premiumFeeWithPrice', resultKey: 'premiumFeeWithPrice',
promise: premiumFeeWithPricePromise, promise: premiumFeeWithPricePromise
}, }
]; ];
// use resultMap to populate layout content. // use resultMap to populate layout content.
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
next((vm) => { next((vm) => {
vm.setCmsContent(resultMap.cmsContent); vm.setCmsContent(resultMap.cmsContent);
vm.$refs.datePicker.initializeComponent( vm.$refs.datePicker.initializeComponent(resultMap.datePickerInitialData);
resultMap.datePickerInitialData
);
vm.$refs.locationAlerts.initializeComponent(resultMap.alertReasons); vm.$refs.locationAlerts.initializeComponent(resultMap.alertReasons);
vm.setData( vm.setData(
resultMap.datePickerInitialData.initialShopTimeSlotsResponse, resultMap.datePickerInitialData.initialShopTimeSlotsResponse,
@ -318,7 +313,7 @@ export default {
selectedDate: this.getSelectedDate(), selectedDate: this.getSelectedDate(),
selectedTimeSlotInfo: this.getSelectedTimeSlotInfo(), selectedTimeSlotInfo: this.getSelectedTimeSlotInfo(),
selectableDatesData: [], selectableDatesData: [],
mobilePremiumAppointmentFee: null, mobilePremiumAppointmentFee: null
}; };
}, },
computed: { computed: {
@ -336,13 +331,11 @@ export default {
return null; return null;
} }
return this.selectableDatesData.days?.find( return this.selectableDatesData.days?.find((selectableDate) => selectableDate.date === this.selectedDate);
(selectableDate) => selectableDate.date === this.selectedDate
);
}, },
supportingItems() { supportingItems() {
return useMainStore().lineItems.supportingItems; return useMainStore().lineItems.supportingItems;
}, }
}, },
watch: { watch: {
selectedDate(newValue, oldValue) { selectedDate(newValue, oldValue) {
@ -355,34 +348,34 @@ export default {
startTime: null, startTime: null,
endTime: null, endTime: null,
jobMaxMinutes: null, jobMaxMinutes: null,
jobMinMinutes: null, jobMinMinutes: null
}, },
isPremiumAppointment: null, isPremiumAppointment: null
}; };
} }
}, },
selectedTimeSlotInfo(newValue) { selectedTimeSlotInfo(newValue) {
this.updateFooterButtonText(newValue); this.updateFooterButtonText(newValue);
}, }
}, },
methods: { methods: {
splitCopyOnCMSPlaceHolder, splitCopyOnCMSPlaceHolder,
arePagePrerequisitesValid() { arePagePrerequisitesValid() {
const { serviceLocation } = useMainStore().order; const { serviceLocation } = useMainStore().order;
const serviceLocationPreReqs = const serviceLocationPreReqs =
serviceLocation.zipCode && serviceLocation.zipCode
serviceLocation.zipCodeCtu && && serviceLocation.zipCodeCtu
serviceLocation.appointmentType && && serviceLocation.appointmentType
(serviceLocation.appointmentType === && (serviceLocation.appointmentType
AppointmentTypeStrings.MOBILE || === AppointmentTypeStrings.MOBILE
serviceLocation.appointmentType === || serviceLocation.appointmentType
AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP || === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP
serviceLocation.provider.providerNumber); || serviceLocation.provider.providerNumber);
const supportingItems = this.supportingItems !== null; const supportingItems = this.supportingItems !== null;
const damageInfo = const damageInfo =
useMainStore().order.damage.isRepair || useMainStore().order.damage.isRepair
(useMainStore().order.lineItems?.glassParts != null && || (useMainStore().order.lineItems?.glassParts != null
useMainStore().order.lineItems.glassParts.length > 0); && useMainStore().order.lineItems.glassParts.length > 0);
return serviceLocationPreReqs && supportingItems && damageInfo; return serviceLocationPreReqs && supportingItems && damageInfo;
}, },
@ -417,15 +410,13 @@ export default {
getSelectedTimeSlotInfo() { getSelectedTimeSlotInfo() {
const isPremiumAppointment = const isPremiumAppointment =
!!( !!(
this.supportingItems?.filter( this.supportingItems?.filter((lineItem) =>
(lineItem) => lineItem.partType === PREMIUM_FEE_PART_TYPE) ?? []
lineItem.partType === PREMIUM_FEE_PART_TYPE
) ?? []
).length > 0; ).length > 0;
const selectedTimeSlotInfo = { const selectedTimeSlotInfo = {
timeSlot: this.mainStore.order.schedule, timeSlot: this.mainStore.order.schedule,
isPremiumAppointment, isPremiumAppointment
}; };
return selectedTimeSlotInfo; return selectedTimeSlotInfo;
@ -441,16 +432,12 @@ export default {
if (!timeSlotInfo || !timeSlotInfo.timeSlot.date) { if (!timeSlotInfo || !timeSlotInfo.timeSlot.date) {
navbarButtonText = 'Continue'; navbarButtonText = 'Continue';
} else { } else {
navbarButtonText = `Select ${this.convertSelectedDateToShortMonthAndDay( navbarButtonText = `Select ${this.convertSelectedDateToShortMonthAndDay(timeSlotInfo.timeSlot.date)}`;
timeSlotInfo.timeSlot.date
)}`;
if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) { if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) {
navbarButtonText += ` at ${this.getDisplayTextForMilitaryTime( navbarButtonText += ` at ${this.getDisplayTextForMilitaryTime(timeSlotInfo.timeSlot.startTime)}`;
timeSlotInfo.timeSlot.startTime
)}`;
} else if ( } else if (
this.appointmentType === AppointmentTypeStrings.MOBILE && this.appointmentType === AppointmentTypeStrings.MOBILE
!timeSlotInfo.isPremiumAppointment && !timeSlotInfo.isPremiumAppointment
) { ) {
navbarButtonText += ` at ${this.getDisplayTextForMilitaryTime( navbarButtonText += ` at ${this.getDisplayTextForMilitaryTime(
timeSlotInfo.timeSlot.startTime, timeSlotInfo.timeSlot.startTime,
@ -468,7 +455,7 @@ export default {
const dateObject = convertDateStringToDate(selectedDate); const dateObject = convertDateStringToDate(selectedDate);
return dateObject.toLocaleDateString('en-us', { return dateObject.toLocaleDateString('en-us', {
month: 'short', month: 'short',
day: 'numeric', day: 'numeric'
}); });
}, },
getDisplayTextForMilitaryTime( getDisplayTextForMilitaryTime(
@ -496,8 +483,8 @@ export default {
this.navigationScenarios.CLICKED_FORWARD, this.navigationScenarios.CLICKED_FORWARD,
this.$route this.$route
); );
}, }
}, }
}; };
</script> </script>

61
src/layouts/service-packages/service-packages.vue
View file

@ -13,6 +13,7 @@
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4">
<siteSubHeader <siteSubHeader
justification="left"
cmsWidgetName="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
issContainingPage="service-packages" /> issContainingPage="service-packages" />
<servicePackageQuestion <servicePackageQuestion
@ -34,7 +35,9 @@
@ForwardClicked="forwardButtonAction" /> @ForwardClicked="forwardButtonAction" />
</div> </div>
</div> </div>
<loadingModal ref="loadingModal" :textSlides="loadingText" /> <loadingModal
ref="loadingModal"
:textSlides="loadingText" />
<contentGroupModal <contentGroupModal
ref="RainDefenseModal" ref="RainDefenseModal"
cmsWidgetName="RainDefenseModal" /> cmsWidgetName="RainDefenseModal" />
@ -44,7 +47,9 @@
<contentGroupModal <contentGroupModal
ref="RearWiperModal" ref="RearWiperModal"
cmsWidgetName="RearWiperModal" /> cmsWidgetName="RearWiperModal" />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" /> <contentGroupModal
ref="RecalModal"
cmsWidgetName="RecalModal" />
</div> </div>
</Form> </Form>
</template> </template>
@ -80,7 +85,7 @@ export default {
Form, Form,
servicePackageQuestion, servicePackageQuestion,
loadingModal, loadingModal,
contentGroupModal, contentGroupModal
}, },
mixins: [baseFormMixin], mixins: [baseFormMixin],
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -93,20 +98,20 @@ export default {
const promiseResultMap = [ const promiseResultMap = [
{ {
resultKey: 'cmsContent', resultKey: 'cmsContent',
promise: cmsContentPromise, promise: cmsContentPromise
}, },
{ {
resultKey: 'wipers', resultKey: 'wipers',
promise: wipersPromise, promise: wipersPromise
}, },
{ {
resultKey: 'rainDefense', resultKey: 'rainDefense',
promise: rainDefensePromise, promise: rainDefensePromise
}, },
{ {
resultKey: 'supportingItems', resultKey: 'supportingItems',
promise: supportingItemsPromise, promise: supportingItemsPromise
}, }
]; ];
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
@ -117,19 +122,17 @@ export default {
resultMap.rainDefense, resultMap.rainDefense,
...resultMap.supportingItems, ...resultMap.supportingItems,
...resultMap.wipers, ...resultMap.wipers,
...clonedGlassParts, ...clonedGlassParts
]; ];
let hasBailedOut = false; let hasBailedOut = false;
const pricingResults = await store const pricingResults = await store
.getPriceOrderItems(availableLineItems) .getPriceOrderItems(availableLineItems)
.catch((err) => { .catch((err) => {
useMainStore().setBailout( useMainStore().setBailout(bailoutMessage.pricingResponseError(
bailoutMessage.pricingResponseError( availableLineItems.map((li) => li.partNumber),
availableLineItems.map((li) => li.partNumber), { code: err.code, message: err.message, data: err.data }
{ code: err.code, message: err.message, data: err.data } ));
)
);
hasBailedOut = true; hasBailedOut = true;
next(`/?issPage=${issPageValues.BAILOUT_PAGE}`); next(`/?issPage=${issPageValues.BAILOUT_PAGE}`);
}); });
@ -155,17 +158,17 @@ export default {
'Looking for dates', 'Looking for dates',
'Searching for times', 'Searching for times',
'Nearly there', 'Nearly there',
'Finishing up', 'Finishing up'
], ],
rules: { rules: {
optionRequired: globalRules.OPTION_REQUIRED, optionRequired: globalRules.OPTION_REQUIRED
}, }
}; };
}, },
computed: { computed: {
PriceDisclaimerText() { PriceDisclaimerText() {
return this.getCmsContent('PriceDisclaimerWidget', 'Text'); return this.getCmsContent('PriceDisclaimerWidget', 'Text');
}, }
}, },
methods: { methods: {
openModalAction(modalName) { openModalAction(modalName) {
@ -173,11 +176,11 @@ export default {
}, },
arePagePrerequisitesValid() { arePagePrerequisitesValid() {
return ( return (
store.order.serviceLocation.zipCode && store.order.serviceLocation.zipCode
store.order.serviceLocation.zipCodeCtu && && store.order.serviceLocation.zipCodeCtu
(store.order.damage.isRepair || && (store.order.damage.isRepair
(store.order.lineItems?.glassParts != null && || (store.order.lineItems?.glassParts != null
store.order.lineItems.glassParts.length > 0)) && store.order.lineItems.glassParts.length > 0))
); );
}, },
vapsItemsSelectedAction(vapsItemsSelected) { vapsItemsSelectedAction(vapsItemsSelected) {
@ -187,12 +190,10 @@ export default {
const parts = { const parts = {
glassParts: this.pricedGlassParts, glassParts: this.pricedGlassParts,
supportingItems: this.supportingItems, supportingItems: this.supportingItems,
vaps: this.selectedVaps, vaps: this.selectedVaps
}; };
if (!allGlassPartsAndItemsHavePrices(parts)) { if (!allGlassPartsAndItemsHavePrices(parts)) {
window.console.error( window.console.error('One or more items have no price assigned!');
'One or more items have no price assigned!'
);
} }
if (this.pricedGlassParts.length > 0) { if (this.pricedGlassParts.length > 0) {
store.updateGlassParts(this.pricedGlassParts); store.updateGlassParts(this.pricedGlassParts);
@ -204,8 +205,8 @@ export default {
this.navigationScenarios.CLICKED_FORWARD, this.navigationScenarios.CLICKED_FORWARD,
this.$route this.$route
); );
}, }
}, }
}; };
</script> </script>

6
src/layouts/vehicle-damage/vehicle-damage.vue
View file

@ -522,12 +522,6 @@ export default {
flex: 0 auto; flex: 0 auto;
} }
} }
.damage-location-question {
span {
font-size: 1.25rem;
font-weight: 400;
}
}
.button-question, .button-question,
.windshield-damage-type-question, .windshield-damage-type-question,
.damage-location-question { .damage-location-question {

73
src/layouts/welcome-page/welcome-page.vue
View file

@ -11,7 +11,7 @@
</div> </div>
</div> </div>
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4 px-5">
<siteSubHeader <siteSubHeader
cmsWidgetName="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
class="mt-4" /> class="mt-4" />
@ -24,7 +24,7 @@
disableAutoFill disableAutoFill
:isDisabled="isPolicyHolderDisabled" :isDisabled="isPolicyHolderDisabled"
:validationRules="rules.policyNumber" :validationRules="rules.policyNumber"
class="mb-3" /> class="mt-5" />
<textboxQuestion <textboxQuestion
ref="policyZip" ref="policyZip"
v-model="welcomePageModel.policyZipCode" v-model="welcomePageModel.policyZipCode"
@ -34,7 +34,7 @@
mask="#####" mask="#####"
:isDisabled="isPolicyZipDisabled" :isDisabled="isPolicyZipDisabled"
:validationRules="rules.policyZip" :validationRules="rules.policyZip"
class="mb-3" /> class="mt-3" />
<textboxQuestion <textboxQuestion
ref="dateOfLoss" ref="dateOfLoss"
v-model="welcomePageModel.dateOfLoss" v-model="welcomePageModel.dateOfLoss"
@ -47,11 +47,11 @@
:max="new Date().toJSON().slice(0, 10)" :max="new Date().toJSON().slice(0, 10)"
:min="'1972-12-01'" :min="'1972-12-01'"
:validationRules="rules.lossDate" :validationRules="rules.lossDate"
class="mb-3" /> class="mt-3" />
<textBlock <textBlock
cmsWidgetName="DamageDateEstimateWidget" cmsWidgetName="DamageDateEstimateWidget"
typeStyle="small" typeStyle="small"
class="mb-3" /> class="mt-2" />
<dropdownQuestion <dropdownQuestion
id="welcomeDropdown" id="welcomeDropdown"
ref="damageCause" ref="damageCause"
@ -62,7 +62,7 @@
disableAutoFill disableAutoFill
:validationRules="rules.damageOption" :validationRules="rules.damageOption"
placeHolderText="Select an option" placeHolderText="Select an option"
class="mb-3" /> class="mt-3" />
<textboxQuestion <textboxQuestion
ref="phoneNumber" ref="phoneNumber"
v-model="welcomePageModel.phoneNumber" v-model="welcomePageModel.phoneNumber"
@ -72,7 +72,7 @@
isRequired isRequired
:mask="phoneMask" :mask="phoneMask"
disableAutoFill disableAutoFill
class="mb-3" /> class="mt-3" />
<textboxQuestion <textboxQuestion
ref="email" ref="email"
v-model="welcomePageModel.email" v-model="welcomePageModel.email"
@ -81,12 +81,12 @@
:validationRules="rules.email" :validationRules="rules.email"
isRequired isRequired
disableAutoFill disableAutoFill
class="mb-3" /> class="mt-3" />
<textboxQuestion <textboxQuestion
v-if="displayDamageCityQuestion" v-if="displayDamageCityQuestion"
ref="damageCity" ref="damageCity"
v-model="welcomePageModel.damageCity" v-model="welcomePageModel.damageCity"
class="mb-3" class="mt-3"
inputId="damageCityField" inputId="damageCityField"
cmsWidgetName="DamageCityQuestion" cmsWidgetName="DamageCityQuestion"
isRequired isRequired
@ -97,7 +97,7 @@
id="welcomeDropdown" id="welcomeDropdown"
ref="state" ref="state"
v-model="welcomePageModel.damageState" v-model="welcomePageModel.damageState"
class="mb-3" class="mt-3"
cmsWidgetName="DamageStateQuestion" cmsWidgetName="DamageStateQuestion"
inputId="8fdf9dc2e13e430eb57529499dceb3eb" inputId="8fdf9dc2e13e430eb57529499dceb3eb"
:options="getStates" :options="getStates"
@ -109,7 +109,7 @@
v-if="displayGlassOnlyQuestion" v-if="displayGlassOnlyQuestion"
ref="glassOnlyDamage" ref="glassOnlyDamage"
v-model="welcomePageModel.isDamageGlassOnly" v-model="welcomePageModel.isDamageGlassOnly"
class="px-0 mt-4" class="px-0 mt-3"
cmsWidgetName="GlassOnlyQuestion" cmsWidgetName="GlassOnlyQuestion"
inputId="isDamageGlassOnly" inputId="isDamageGlassOnly"
:answers="DamageGlassOnlyOptions" :answers="DamageGlassOnlyOptions"
@ -120,7 +120,9 @@
isRequired isRequired
isSmallQuestionLabelText isSmallQuestionLabelText
disableAutoFill /> disableAutoFill />
<div id="welcomeFooter" class="row"> <div
id="welcomeFooter"
class="row">
<alert <alert
v-if="displayInvalidZipAlert" v-if="displayInvalidZipAlert"
ref="alertInvalidZip" ref="alertInvalidZip"
@ -138,7 +140,7 @@
</div> </div>
</div> </div>
<!-- Footer image component must have parent (usually container-fluid) <!-- Footer image component must have parent (usually container-fluid)
set to display: flex and height 100dvh or height 100% --> set to display: flex and height 100dvh or height 100% -->
<footerImage /> <footerImage />
</div> </div>
</Form> </Form>
@ -161,7 +163,7 @@ import footerImage from '@/iss-components/site-footer/footer-image/footer-image.
import { import {
fetchCmsContentForPage, fetchCmsContentForPage,
fetchGlobalCmsContent, fetchGlobalCmsContent,
updateCmsSiteHeader, updateCmsSiteHeader
} from '@/helpers/cms-content-helper'; } from '@/helpers/cms-content-helper';
import settleAllPromises from '@/helpers/layout-helper'; import settleAllPromises from '@/helpers/layout-helper';
import { required } from '@/helpers/validation-rules'; import { required } from '@/helpers/validation-rules';
@ -194,7 +196,7 @@ export default {
siteFooter, siteFooter,
textBlock, textBlock,
// eslint-disable-next-line vue/no-reserved-component-names // eslint-disable-next-line vue/no-reserved-component-names
Form, Form
}, },
mixins: [BaseFormMixin], mixins: [BaseFormMixin],
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -207,12 +209,12 @@ export default {
const promiseResultMap = [ const promiseResultMap = [
{ {
resultKey: 'cmsContent', resultKey: 'cmsContent',
promise: cmsContentPromise, promise: cmsContentPromise
}, },
{ {
resultKey: 'globalSiteHeaderCmsContent', resultKey: 'globalSiteHeaderCmsContent',
promise: cmsGlobalSiteHeaderContentPromise, promise: cmsGlobalSiteHeaderContentPromise
}, }
]; ];
// use resultMap to populate layout content. // use resultMap to populate layout content.
@ -244,8 +246,8 @@ export default {
lossState: `${globalRules.DATE_OF_LOSS_STATE_REQUIRED}`, lossState: `${globalRules.DATE_OF_LOSS_STATE_REQUIRED}`,
policyNumber: `${globalRules.POLICY_NUMBER_REQUIRED}|${globalRules.POLICY_NUMBER_FORMAT}`, policyNumber: `${globalRules.POLICY_NUMBER_REQUIRED}|${globalRules.POLICY_NUMBER_FORMAT}`,
policyZip: `${globalRules.POLICY_ZIP_REQUIRED}|${globalRules.POLICY_ZIP_FORMAT}`, policyZip: `${globalRules.POLICY_ZIP_REQUIRED}|${globalRules.POLICY_ZIP_FORMAT}`,
phoneNumber: `${globalRules.PHONE_NUMBER_REQUIRED}|${globalRules.PHONE_NUMBER_FORMAT}`, phoneNumber: `${globalRules.PHONE_NUMBER_REQUIRED}|${globalRules.PHONE_NUMBER_FORMAT}`
}, }
}; };
}, },
computed: { computed: {
@ -300,7 +302,7 @@ export default {
}, },
phoneMask() { phoneMask() {
return MaskaFormattedMasks.PHONE_NUMBER; return MaskaFormattedMasks.PHONE_NUMBER;
}, }
}, },
methods: { methods: {
async forwardButtonAction() { async forwardButtonAction() {
@ -335,8 +337,8 @@ export default {
) )
.finally(async () => { .finally(async () => {
if ( if (
this.isCoverageEnabled && this.isCoverageEnabled
!this.maxCoverageLookupAttemptsReached && !this.maxCoverageLookupAttemptsReached
) { ) {
await this.mainStore await this.mainStore
.getCoveragePolicyInfo() .getCoveragePolicyInfo()
@ -362,29 +364,24 @@ export default {
providerNumber: providerNumber.toString(), providerNumber: providerNumber.toString(),
billToSelectionCriteria: { billToSelectionCriteria: {
typeOfClaim: 'GLASS ONLY', typeOfClaim: 'GLASS ONLY',
lineOfBusiness: 'PERSONAL', lineOfBusiness: 'PERSONAL'
}, }
}; };
const response = await globalMethods.callHttpClient({ const response = await globalMethods.callHttpClient({
method: endpoints.GetBillToInfo.method, method: endpoints.GetBillToInfo.method,
endpoint: endpoints.GetBillToInfo.url, endpoint: endpoints.GetBillToInfo.url,
payload, payload
}); });
return response.data; return response.data;
} catch (err) { } catch (err) {
console.error( console.error(`Error Status Code: ${err.data?.status}: ${err.data?.title}`);
`Error Status Code: ${err.data?.status}: ${err.data?.title}`
);
return null; return null;
} }
}, },
navigateForward() { navigateForward() {
if ( if (this.mainStore.applicationUser.duplicateOrders?.length > 0 ?? false) {
this.mainStore.applicationUser.duplicateOrders?.length > 0 ??
false
) {
this.$router.navigate( this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_DUPLICATES, this.navigationScenarios.CLICKED_FORWARD_WITH_DUPLICATES,
this.$route, this.$route,
@ -429,15 +426,13 @@ export default {
damageCause: this.mainStore.order.policy.damageCause, damageCause: this.mainStore.order.policy.damageCause,
damageState: this.mainStore.order.policy.damageState, damageState: this.mainStore.order.policy.damageState,
damageCity: this.mainStore.order.policy.damageCity, damageCity: this.mainStore.order.policy.damageCity,
isDamageGlassOnly: isDamageGlassOnly: this.mainStore.order.policy.isDamageGlassOnly,
this.mainStore.order.policy.isDamageGlassOnly,
phoneNumber: this.mainStore.order.contactInfo.homePhone, phoneNumber: this.mainStore.order.contactInfo.homePhone,
email: this.mainStore.order.customer.emailAddress, email: this.mainStore.order.customer.emailAddress,
isPolicyNumberDisabled: isPolicyNumberDisabled: this.mainStore.order.policy.isPolicyNumberDisabled
this.mainStore.order.policy.isPolicyNumberDisabled,
}; };
}, }
}, }
}; };
</script> </script>

9
src/ux-components/loader/loader.vue
View file

@ -45,7 +45,7 @@ export default {
display: flex; display: flex;
//Open an overlay to prevent page interaction //Open an overlay to prevent page interaction
&:before:not(.date-picker-hidden) { &:before {
content: ""; content: "";
position: fixed; position: fixed;
top: 0; top: 0;
@ -56,6 +56,13 @@ export default {
z-index: 9999; z-index: 9999;
cursor: default; cursor: default;
} }
&.date-picker-hidden {
&:before {
content: none;
}
}
//Spinner basics //Spinner basics
&:after { &:after {
content: ""; content: "";