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

Merge branch 'develop' into feature/humphries/INSR-7760

Browse source
This commit is contained in:
Alex Humphries 2026-02-26 15:26:21 -05:00
commit 3a5e1b5021
11 changed files with 209 additions and 80 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/iss-components/google-map/google-map.vue
View file

@ -29,7 +29,10 @@ export default {
}
},
async beforeMount() {
await this.createMapWithMarkersForAddresses(this.markers);
await this.createMapWithMarkersForAddresses(this.markers)
.catch(() => {
console.error('Error creating map with markers: if handled jest fails to run tests');
});
},
methods: {
async getMap(center) {

27
src/layouts/contact-details/contact-details.spec.js
View file

@ -330,6 +330,30 @@ describe('contactDetails.vue', () => {
navigate: jest.fn()
}
});
const provider = {
address: {
city: getRandomString(4, 20),
state: getRandomString(2, 2),
streetAddress: getRandomString(10, 50),
zipCode: getRandomInt(10000, 99999).toString(),
zipCodeCtu: getRandomInt(10000, 99999).toString()
},
companyName: getRandomString(5, 15),
phoneNumber: getRandomInt(1000000000, 9999999999).toString(),
providerNumber: getRandomInt(100000, 999999).toString()
}
const mainInitialState = {
order: {
serviceLocation: {
provider
}
}
};
mountOptions.global.plugins = [createTestingPinia({
initialState: {
main: mainInitialState
}
})];
const wrapper = shallowMount(contactDetails, mountOptions);
const address = getRandomString(10, 50);
const address2 = getRandomString(0, 50);
@ -354,7 +378,8 @@ describe('contactDetails.vue', () => {
address,
address2,
city,
isVehicleProtected
isVehicleProtected,
provider
});
});

5
src/layouts/contact-details/contact-details.vue
View file

@ -245,11 +245,14 @@ export default {
};
useMainStore().updateContactInfo(contactInfo);
const provider = useMainStore().serviceLocation.provider;
useMainStore().updateServiceLocation({
address: this.address,
address2: this.address2,
city: this.city,
isVehicleProtected: this.isVehicleProtected || 'false'
isVehicleProtected: this.isVehicleProtected || 'false',
provider
});
this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD, this.$route);

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

@ -20,6 +20,7 @@
:schedulingInshopAvailabilityRating="inShopAvailabilityRating"
@appointmentTypeChanged="appointmentTypeChangedFromServiceLocation"
@cityUpdated="cityUpdatedFromServiceLocation"
@clearMobileData="clearMobileDataFromServiceLocation"
@inShopZipUpdated="inShopZipUpdatedFromServiceLocation"
@mobileZipUpdated="mobileZipUpdatedFromServiceLocation"
@providerChanged="providerChangedFromServiceLocation" />
@ -89,9 +90,8 @@ import {
import settleAllPromises from '@/helpers/layout-helper';
import showIssLoadingModal from '@/helpers/loading-modal-helper.js';
import {
getProviderData,
getZipCodeData,
onProviderChanged
getPricedMobileFeePart,
getZipCodeData
} from '@/helpers/service-location-helper';
import { Form } from 'vee-validate';
import BaseFormMixin from '@/mixins/base-form-mixin.js';
@ -225,9 +225,16 @@ export default {
async beforeRouteEnter(to, from, next) {
// Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
const { isMobileAppointment, storeServiceLocation, storeSelectedProvider, serviceZipCode } = getProviderData();
const storeServiceLocation = useMainStore().order.serviceLocation;
const storeSelectedAppointmentType = storeServiceLocation?.appointmentType;
const isMobileAppointment = storeSelectedAppointmentType === AppointmentTypeStrings.MOBILE
|| storeSelectedAppointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP;
const storeSelectedProvider = storeServiceLocation?.provider;
const serviceZipCode = storeServiceLocation?.zipCode || useMainStore().order.customer.address.zipCode;
const zipCodeData = getZipCodeData(serviceZipCode);
const mobileFeePartPromise = getPricedMobileFeePart(serviceZipCode);
const serviceabilityDetailsPromise = useMainStore().getServiceabilityDetails(serviceZipCode);
const getGlassFeesPromise = useMainStore().getGlassFees();
const providersPromise = useMainStore().getSafeliteProviders(serviceZipCode, 150);
const premiumFeePromise = useMainStore().getMobilePremiumFee();
@ -244,6 +251,14 @@ export default {
resultKey: 'cmsContent',
promise: cmsContentPromise
},
{
resultKey: 'mobileFeePart',
promise: mobileFeePartPromise
},
{
resultKey: 'glassFees',
promise: getGlassFeesPromise
},
{
resultKey: 'serviceabilityDetails',
promise: serviceabilityDetailsPromise
@ -256,10 +271,6 @@ export default {
resultKey: 'providers',
promise: providersPromise
},
{
resultKey: 'providerChanged',
promise: onProviderChanged()
},
{
resultKey: 'premiumFeeWithPrice',
promise: premiumFeeWithPricePromise
@ -319,8 +330,10 @@ export default {
return {
inShopAvailabilityRating: 'high',
inShopDatesData: [],
isDatePickerRefreshing: false,
isMobileView: false,
mobileDatesData: [],
mobileFeePart: null,
mobilePremiumAppointmentFee: null,
mobileProviderNumber: null,
selectableDatesData: [],
@ -341,14 +354,18 @@ export default {
return false;
}
const validMobileAppointmentType = ((this.selectedAppointmentType === AppointmentTypeStrings.MOBILE
|| this.selectedAppointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP)
&& serviceLocationToUse.mobileProviderNumber);
const validInShopAppointmentType = ((this.selectedAppointmentType === AppointmentTypeStrings.IN_SHOP
|| this.selectedAppointmentType === AppointmentTypeStrings.DROP_OFF)
&& (this.selectedProvider?.providerNumber || serviceLocationToUse.provider?.providerNumber));
const serviceLocationPreReqs = serviceLocationToUse.zipCode !== null
&& serviceLocationToUse.zipCodeCtu !== null
&& serviceLocationToUse.appointmentType !== null
&& (((this.selectedAppointmentType === AppointmentTypeStrings.MOBILE
|| this.selectedAppointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP)
&& serviceLocationToUse.mobileProviderNumber)
|| ((this.selectedAppointmentType === AppointmentTypeStrings.IN_SHOP || this.selectedAppointmentType === AppointmentTypeStrings.DROP_OFF)
&& (this.selectedProvider?.providerNumber || serviceLocationToUse.provider?.providerNumber)));
&& (validMobileAppointmentType || validInShopAppointmentType)
&& !this.isDatePickerRefreshing;
const damageInfo = useMainStore().order.damage.isRepair
|| (useMainStore().order.lineItems?.glassParts != null && useMainStore().order.lineItems.glassParts.length > 0);
@ -453,6 +470,14 @@ export default {
cityUpdatedFromServiceLocation(newCity) {
this.selectedServiceLocationCity = newCity;
},
clearMobileDataFromServiceLocation() {
if (this.selectedServiceLocation) {
this.selectedServiceLocation.mobileProviderNumber = null;
}
this.mobileDatesData = [];
this.mobileProviderNumber = null;
this.selectedMobileZipCode = null;
},
dateSelectedFromPicker(date) {
this.selectedDate = date;
this.showDatePickerError = false;
@ -647,9 +672,7 @@ export default {
}
},
mobileZipUpdatedFromServiceLocation(mobileZipServiceLocation) {
if (mobileZipServiceLocation
&& (this.mobileProviderNumber !== mobileZipServiceLocation.mobileProviderNumber
|| !this.hasNeededServiceLocationData)) {
if (mobileZipServiceLocation) {
this.mobileProviderNumber = mobileZipServiceLocation.mobileProviderNumber;
this.selectedMobileZipCode = mobileZipServiceLocation.zipCode;
this.selectedServiceLocation = mobileZipServiceLocation;
@ -661,22 +684,27 @@ export default {
},
async providerChangedFromServiceLocation(newProvider) {
this.selectedProvider = newProvider?.provider;
if (newProvider?.provider) {
this.mainStore.updateServiceLocation(newProvider);
if (newProvider?.refreshDatePicker && newProvider.provider) {
this.mainStore.updateServiceLocationProvider(newProvider.provider);
showIssLoadingModal(true);
await onProviderChanged();
if (newProvider.refreshDatePicker) {
await this.refreshDatePicker();
} else {
showIssLoadingModal(false);
}
await this.mainStore.getBillToInfo(newProvider.provider?.providerNumber)
.then(() => {
this.refreshDatePicker();
})
.catch(() => {
console.warn('Error fetching bill to info...');
showIssLoadingModal(false);
});
}
},
async refreshDatePicker() {
this.resetLocalFlags();
this.isDatePickerRefreshing = true;
await this.getDatePickerInitialData().then((data) => {
this.selectableDatesData = data.initialShopTimeSlotsResponse;
this.$refs.datePicker.initializeComponent(data);
this.isDatePickerRefreshing = false;
showIssLoadingModal(false);
});
},
@ -700,7 +728,7 @@ export default {
appointmentTypeToUse = AppointmentTypeStrings.DROP_OFF;
}
this.mainStore.updateAppointmentType(appointmentTypeToUse);
await this.$refs.serviceLocation.forwardButtonAction(appointmentTypeToUse);
this.mainStore.saveSchedule(this.selectedTimeSlotInfo.timeSlot);
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD,

2
src/layouts/schedule-page/service-location/service-location.spec.js
View file

@ -203,7 +203,7 @@ describe('service-location.vue', () => {
const newMobileServiceZipCode = '45433';
// Act
mobileServiceZipCodeQuestion.vm.$emit('update:modelValue', newMobileServiceZipCode);
mobileServiceZipCodeQuestion.vm.$emit('service-zip-code-updated', newMobileServiceZipCode);
await wrapper.vm.$nextTick();
// Assert

129
src/layouts/schedule-page/service-location/service-location.vue
View file

@ -96,13 +96,14 @@
</div>
<serviceZipQuestion
ref="mobileServiceZipCodeQuestion"
v-model="mobileZipCode"
customInputId="mobileServiceZipCode"
class="mobile-service-zip-question"
:parentZipCode="mobileZipCode"
:placeholderText="mobileZipPlaceholder"
:serviceZipFormatErrorMessage="errorMessages.MOBILE_SERVICE_ZIP_FORMAT"
:hasError="mobileZipError !== ''"
cmsWidgetName="MobileZipWidget" />
cmsWidgetName="MobileZipWidget"
@serviceZipCodeUpdated="handleServiceZipCodeChanged" />
<div
v-if="mobileZipError"
ref="errorMessageDiv"
@ -157,7 +158,7 @@ export default {
serviceZipQuestion
},
mixins: [baseFormMixin],
emits: ['appointment-type-changed', 'city-updated', 'in-shop-zip-updated', 'mobile-zip-updated', 'provider-changed'],
emits: ['appointment-type-changed', 'city-updated', 'clear-mobile-data', 'in-shop-zip-updated', 'mobile-zip-updated', 'provider-changed'],
props: {
schedulingInshopAvailabilityRating: {
type: String,
@ -182,6 +183,7 @@ export default {
isRecalibrationServiceableMobile: null,
selectedAppointmentType: this.getSelectedAppointmentType(),
selectedProvider: this.getSelectedProvider(),
mobileFeePart: null,
mobileProviderNumber: null,
zipContainsMilitaryBase: false,
zipCodeCtu: null,
@ -236,7 +238,8 @@ export default {
);
},
isMobile() {
return this.selectedAppointmentType === AppointmentTypeStrings.MOBILE;
return this.selectedAppointmentType === AppointmentTypeStrings.MOBILE
|| this.selectedAppointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP;
},
isServiceableInshop() {
if (this.isRecalibrationServiceableInshop !== null) {
@ -298,16 +301,7 @@ export default {
},
async mobileZipCode(newZip, oldZip) {
if (newZip !== '' && newZip !== oldZip && !this.initializingData) {
showIssLoadingModal(true);
await this.updateMobileZip();
const updateMobileZipServiceLocationObj = {
mobileProviderNumber: this.mobileProviderNumber,
provider: null,
refreshDatePicker: true,
zipCode: this.zipCode,
zipCodeCtu: this.zipCodeCtu
};
this.$emit('mobile-zip-updated', updateMobileZipServiceLocationObj);
await this.processMobileZipCodeChange();
}
},
schedulingInshopAvailabilityRating(newRating) {
@ -339,27 +333,16 @@ export default {
}
},
selectedProvider(newProvider, oldProvider) {
if (newProvider?.providerNumber !== oldProvider?.providerNumber) {
if (newProvider?.providerNumber !== oldProvider?.providerNumber || this.availabilityRating === null) {
const appointmentIsInshop = this.isInshop;
const returnedProvider = {
refreshDatePicker: appointmentIsInshop && oldProvider?.providerNumber !== null,
state: this.state,
zipCode: this.zipCode,
zipCodeCtu: this.zipCodeCtu,
appointmentType: this.selectedAppointmentType,
provider: !this.isMobile ? newProvider : {
providerNumber: this.mobileProviderNumber,
address: {
streetAddress: null,
city: null,
state: null,
zipCode: null,
zipCodeCtu: null
}
}
provider: newProvider,
refreshDatePicker: appointmentIsInshop && oldProvider?.providerNumber !== null
};
this.$emit('provider-changed', returnedProvider);
if (newProvider?.providerNumber !== oldProvider?.providerNumber) {
this.$emit('provider-changed', returnedProvider);
}
}
}
},
@ -369,6 +352,34 @@ export default {
await this.setData(initialData);
this.initializingData = false;
},
async forwardButtonAction(appointmentType) {
let provider = this.selectedProvider;
this.mainStore.updateMobileFee(null);
if (this.isMobile) {
if (this.mainStore.isNoComp || this.mainStore.isITAC) {
this.mainStore.updateMobileFee(this.mobileFeePart);
}
provider = {
providerNumber: this.mobileProviderNumber,
address: {
streetAddress: null,
city: null,
state: null,
zipCode: null,
zipCodeCtu: null
}
};
}
this.mainStore.updateServiceLocation({
state: this.state,
zipCode: this.zipCode,
zipCodeCtu: this.zipCodeCtu,
appointmentType: appointmentType || this.selectedAppointmentType,
provider
});
},
openModalAction(modalName) {
this.$refs[modalName].openModal();
},
@ -427,6 +438,32 @@ export default {
this.$emit('in-shop-zip-updated', inShopZipServiceLocationObj);
});
},
async handleServiceZipCodeChanged(serviceZipCodeFromQuestion) {
if (serviceZipCodeFromQuestion !== this.mobileZipCode) {
// Can probs just make this one call but have to think about initialization flow and not wanting to trigger extra calls on load
this.mobileZipCode = serviceZipCodeFromQuestion;
} else {
await this.processMobileZipCodeChange();
}
},
async processMobileZipCodeChange() {
showIssLoadingModal(true);
await this.updateMobileZip();
if (!this.mobileZipError) {
const updateMobileZipServiceLocationObj = {
mobileProviderNumber: this.mobileProviderNumber,
provider: null,
refreshDatePicker: true,
zipCode: this.zipCode,
zipCodeCtu: this.zipCodeCtu
};
this.$emit('mobile-zip-updated', updateMobileZipServiceLocationObj);
} else {
this.$emit('clear-mobile-data');
showIssLoadingModal(false);
}
},
setCtuForMobile(val) {
this.zipCodeCtu = val;
},
@ -446,6 +483,10 @@ export default {
this.setServiceabilityDetails(initialData.serviceabilityDetails);
}
if (initialData.mobileFeePart) {
this.mobileFeePart = initialData.mobileFeePart;
}
if (initialData.providers) {
this.setMobileProviderNumber(initialData.providers.mobileProviderNumber);
let foundMatch = false;
@ -462,12 +503,22 @@ export default {
this.selectedProvider = null;
}
}
if (initialData.glassFees) {
useMainStore().getCombinedQuote(initialData.glassFees)
.then((combinedQuote) => {
this.setGlassFeeItems(combinedQuote);
});
}
},
setContainsMilitaryBase(val) {
if (this.zipContainsMilitaryBase !== val) {
this.zipContainsMilitaryBase = val;
}
},
setGlassFeeItems(newGlassFeeItems) {
this.mainStore.updateGlassFees(newGlassFeeItems);
},
setMobileProviderNumber(providerNumber) {
this.mobileProviderNumber = providerNumber;
},
@ -571,6 +622,22 @@ $page-side-padding: 1.5rem;
div.alert {
margin-top: 0.625rem;
&.widget-name-AlertLowAvailabilityInshopWidget {
@include media-breakpoint-up(xs) {
:deep(.alert-headline-text-container) {
padding-left: 0.5rem;
padding-right: 0.375rem;
letter-spacing: 0.45px;
}
}
@include media-breakpoint-up(xl) {
:deep(.alert-headline-text-container) {
padding: 0rem 0.625rem;
}
}
}
button.looka-likea-link {
background: none;
border: none;

6
src/layouts/schedule-page/service-location/service-zip-question/service-zip-question.spec.js
View file

@ -7,7 +7,7 @@ describe('service-zip-question.vue', () => {
const text = '12345';
const wrapper = shallowMount(serviceZipQuestion, {
props: {
modelValue: text
parentZipCode: text
},
attachTo: document.body
});
@ -32,9 +32,9 @@ describe('service-zip-question.vue', () => {
// Act
wrapper.vm.internalZipcode = '55555';
wrapper.vm.updateModelValue();
wrapper.vm.emitZipCodeUpdate();
// Assert
expect(wrapper.emitted('update:modelValue')).toEqual([['55555']]);
expect(wrapper.emitted('service-zip-code-updated')).toEqual([['55555']]);
});
});

14
src/layouts/schedule-page/service-location/service-zip-question/service-zip-question.vue
View file

@ -10,7 +10,7 @@
isRequired
:hasError="hasError"
:validationRules="`zip-required|${cmsWidgetName}-zip-format`"
@clickEvent="updateModelValue"
@clickEvent="emitZipCodeUpdate"
@fieldHasError="handleFieldError" />
</template>
@ -32,7 +32,7 @@ export default {
},
// TODO: Correct prop def.
props: {
modelValue: String,
parentZipCode: String,
cmsWidgetName: String,
serviceZipFormatErrorMessage: {
type: String,
@ -43,14 +43,14 @@ export default {
default: false
}
},
emits: ['update:modelValue', 'field-has-error'],
emits: ['service-zip-code-updated', 'field-has-error'],
data() {
return {
internalZipcode: this.modelValue
internalZipcode: this.parentZipCode
};
},
watch: {
modelValue(newValue) {
parentZipCode(newValue) {
if (newValue !== this.internalZipcode) {
this.internalZipcode = newValue;
}
@ -63,8 +63,8 @@ export default {
handleFieldError(hasError) {
this.$emit('field-has-error', hasError);
},
updateModelValue() {
this.$emit('update:modelValue', this.internalZipcode);
emitZipCodeUpdate() {
this.$emit('service-zip-code-updated', this.internalZipcode);
}
}
};

16
src/layouts/schedule-page/service-location/shop-address/shop-address.vue
View file

@ -68,17 +68,18 @@
groupName="chooseShop"
textPosition="text-start"
isRequired
validationRules="option-required" />
validationRules="provider-required" />
<span class="service-zip-prompt">
{{ serviceZipPrompt }}
</span>
<serviceZipQuestion
v-if="renderServiceZip"
:ref="SERVICE_ZIP_QUESTION_REF_NAME"
v-model="internalZipcode"
:parentZipCode="internalZipcode"
customInputId="serviceZipCode"
:cmsWidgetName="textboxQuestionWidgetName"
@fieldHasError="handleFieldError" />
@fieldHasError="handleFieldError"
@serviceZipCodeUpdated="handleServiceZipCodeChanged" />
<div
v-if="errorMessage"
ref="errorMessageDiv"
@ -115,7 +116,7 @@ import errorMessages from '@/constants/error-messages';
import { defineRule } from 'vee-validate';
import { required } from '@/helpers/validation-rules';
defineRule('option-required', required(errorMessages.PROVIDER_REQUIRED));
defineRule('provider-required', required(errorMessages.PROVIDER_REQUIRED));
const SERVICE_ZIP_QUESTION_REF_NAME = 'serviceZipCodeQuestion';
@ -243,7 +244,7 @@ export default {
showIssLoadingModal(false);
}
},
methods: {
methods: {
async updateShops(autoExpand = false) {
this.errorMessage = '';
let result = await this.getNearbyShops(this.searchRadiusInMiles);
@ -333,6 +334,11 @@ export default {
this.errorMessage = '';
}
},
async handleServiceZipCodeChanged(serviceZipCodeFromQuestion) {
if (serviceZipCodeFromQuestion !== this.internalZipcode) {
this.internalZipcode = serviceZipCodeFromQuestion;
}
},
forceServiceZipRerender() {
this.renderServiceZip = false;
this.$nextTick(() => {

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

@ -426,7 +426,7 @@ export default {
`+${formatAmountInDollars(getPriceOfLineItem(this.premiumAppointmentFee))}`;
return {
// Unique value is required for each <input> and the premium appoinment shares an id
// Unique value is required for each <input> and the premium appointment shares an id
value: this.addPremiumFlagToInput(timeSlotData.id),
buttonLabel: this.premiumAppointmentButtonText,
buttonLabelSubCopy: formattedPrice,

5
src/store/index.js
View file

@ -1842,7 +1842,7 @@ export const useMainStore = defineStore({
this.order.serviceLocation.zipCodeCtu = serviceLocationInfo.zipCodeCtu ?? this.order.serviceLocation.zipCodeCtu;
this.order.serviceLocation.appointmentType = serviceLocationInfo.appointmentType ?? this.order.serviceLocation.appointmentType;
this.order.serviceLocation.isVehicleProtected = serviceLocationInfo.isVehicleProtected ?? this.order.serviceLocation.isVehicleProtected;
this.updateServiceLocationProvider(serviceLocationInfo.provider)
this.updateServiceLocationProvider(serviceLocationInfo.provider);
this.order.serviceLocation.tpaSearchRadius = serviceLocationInfo.tpaSearchRadius;
},
updateAppointmentType(appointmentType) {
@ -1865,7 +1865,6 @@ export const useMainStore = defineStore({
resetState() {
Object.assign(this, getDefaultState());
},
resetRegistrationState() {
this.order.vehicle.registration.licensePlate = null;
this.order.vehicle.registration.address = null;
@ -1904,14 +1903,12 @@ export const useMainStore = defineStore({
this.order.serviceLocation.state = null;
this.order.serviceLocation.isVehicleProtected = null;
},
resetBailout() {
this.updatePageData({
page: issPageValues.BAILOUT_PAGE,
data: null
});
},
resetInsurance() {
this.order.insuranceCoverage.coverageStatus = coverageStatuses.PENDING;
this.order.insuranceCoverage.coverageType = coverageType.NONE;