Merge pull request #1270 from Safelite/feature/humphries/INSR-8493
INSR-8493: Add MSR copy to schedule page
This commit is contained in:
commit
65bdaeea3c
3 changed files with 169 additions and 7 deletions
|
|
@ -120,5 +120,9 @@ export function anyPartWithRequiresRecalFlag(lineItems) {
|
||||||
}
|
}
|
||||||
|
|
||||||
export function hasMSRPart(lineItems) {
|
export function hasMSRPart(lineItems) {
|
||||||
return lineItems?.feeItems?.some((item) => item.partNumber === partNumberStrings.RECAL_MOBILEDUAL || item.partNumber === partNumberStrings.RECAL_MOBILE) ?? false
|
return lineItems?.feeItems?.some((item) => isMSRPart(item)) ?? false;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function isMSRPart(part) {
|
||||||
|
return part.partNumber === partNumberStrings.RECAL_MOBILEDUAL || part.partNumber === partNumberStrings.RECAL_MOBILE;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,9 +4,11 @@ import { createTestingPinia } from '@pinia/testing';
|
||||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
||||||
import navigationScenarios from '@/router/router-constants/navigation-scenarios';
|
import navigationScenarios from '@/router/router-constants/navigation-scenarios';
|
||||||
import routerParams from '@/router/router-constants/router-params';
|
import routerParams from '@/router/router-constants/router-params';
|
||||||
import { getPricedMobileFeePart } from '@/helpers/service-location-helper';
|
|
||||||
import { useMainStore } from '@/store';
|
import { useMainStore } from '@/store';
|
||||||
import serviceLocation from '@/layouts/schedule-page/service-location/service-location.vue';
|
import serviceLocation from '@/layouts/schedule-page/service-location/service-location.vue';
|
||||||
|
import coverageTypes from '@/constants/coverage-type';
|
||||||
|
import coverageStatuses from '@/constants/coverage-statuses';
|
||||||
|
import { experimentSettings } from '@/constants/experiments';
|
||||||
|
|
||||||
const mockGetServiceabilityDetails = () => {
|
const mockGetServiceabilityDetails = () => {
|
||||||
const serviceabilityDetails = {
|
const serviceabilityDetails = {
|
||||||
|
|
@ -84,12 +86,23 @@ const mockProviders = () => Promise.resolve([
|
||||||
isSafeliteShop: true
|
isSafeliteShop: true
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
const defaultMobileFeePart = {
|
||||||
|
"partNumber": "RECAL MOBILEDUAL",
|
||||||
|
"description": null,
|
||||||
|
"partType": "MOBILE FEE",
|
||||||
|
"isInsurable": false,
|
||||||
|
"displayName": "Advanced mobile",
|
||||||
|
"type": null,
|
||||||
|
"laborAmount": 0,
|
||||||
|
"sellingPrice": 50,
|
||||||
|
"kitPrice": 0
|
||||||
|
}
|
||||||
jest.mock(
|
jest.mock(
|
||||||
'@/helpers/service-location-helper',
|
'@/helpers/service-location-helper',
|
||||||
() => ({
|
() => ({
|
||||||
getZipCodeData: jest.fn((mockServiceZipCode) => mockZipcodeData(mockServiceZipCode)),
|
getZipCodeData: jest.fn((mockServiceZipCode) => mockZipcodeData(mockServiceZipCode)),
|
||||||
getMobileZipCodeData: jest.fn((mockServiceZipCode) => mockZipcodeData(mockServiceZipCode)),
|
getMobileZipCodeData: jest.fn((mockServiceZipCode) => mockZipcodeData(mockServiceZipCode)),
|
||||||
getPricedMobileFeePart: jest.fn(() => Promise.resolve(null))
|
getPricedMobileFeePart: jest.fn(() => Promise.resolve(defaultMobileFeePart))
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
@ -135,13 +148,17 @@ const mountOptions = {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
function setupMocks({ appointmentType = AppointmentTypeStrings.IN_SHOP }) {
|
function setupMocks({ appointmentType = AppointmentTypeStrings.IN_SHOP, coverageStatus = coverageStatuses.PENDING, coverageType = coverageTypes.NONE }, splitPaySettingValue = 'false') {
|
||||||
mountOptions.global.plugins = [createTestingPinia({
|
mountOptions.global.plugins = [createTestingPinia({
|
||||||
initialState: {
|
initialState: {
|
||||||
main: {
|
main: {
|
||||||
order: {
|
order: {
|
||||||
serviceLocation: {
|
serviceLocation: {
|
||||||
appointmentType
|
appointmentType
|
||||||
|
},
|
||||||
|
insuranceCoverage: {
|
||||||
|
coverageStatus,
|
||||||
|
coverageType
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -149,6 +166,23 @@ function setupMocks({ appointmentType = AppointmentTypeStrings.IN_SHOP }) {
|
||||||
})];
|
})];
|
||||||
useMainStore().getSafeliteProviders = jest.fn().mockImplementation(() => mockProviders());
|
useMainStore().getSafeliteProviders = jest.fn().mockImplementation(() => mockProviders());
|
||||||
useMainStore().getServiceabilityDetails = jest.fn((mockServiceZipCode) => mockGetServiceabilityDetails(mockServiceZipCode));
|
useMainStore().getServiceabilityDetails = jest.fn((mockServiceZipCode) => mockGetServiceabilityDetails(mockServiceZipCode));
|
||||||
|
const mockMixin = {
|
||||||
|
methods: {
|
||||||
|
getSettingValue: jest.fn((settingName) => {
|
||||||
|
if (settingName === experimentSettings.MSR_SPLIT_PAY_ENABLED) {
|
||||||
|
return splitPaySettingValue;
|
||||||
|
}
|
||||||
|
|
||||||
|
return 'false';
|
||||||
|
})
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const cmsMixin = {
|
||||||
|
methods: {
|
||||||
|
getCmsContent: jest.fn(() => "")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
mountOptions.mixins = [mockMixin, cmsMixin];
|
||||||
const wrapper = mount(serviceLocation, mountOptions);
|
const wrapper = mount(serviceLocation, mountOptions);
|
||||||
|
|
||||||
wrapper.vm.$router.navigateWithSpinner = jest.fn();
|
wrapper.vm.$router.navigateWithSpinner = jest.fn();
|
||||||
|
|
@ -212,4 +246,91 @@ describe('service-location.vue', () => {
|
||||||
expect(wrapper.vm.zipContainsMilitaryBase).toBe(true);
|
expect(wrapper.vm.zipContainsMilitaryBase).toBe(true);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
describe('computed', () => {
|
||||||
|
describe('displayMSRFeeAlert', () => {
|
||||||
|
test('returns false with no mobile fee', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({});
|
||||||
|
wrapper.vm.mobileFeePart = null;
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('returns false with a mobile fee with no price', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({});
|
||||||
|
wrapper.vm.mobileFeePart = { ...defaultMobileFeePart, sellingPrice: 0 };
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('returns true for priced mobile fee for No Comp', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({ coverageStatus: coverageStatuses.VERIFIED, coverageType: coverageTypes.NO_COMP });
|
||||||
|
wrapper.vm.mobileFeePart = defaultMobileFeePart;
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('returns true for priced mobile fee for ITAC', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({ coverageStatus: coverageStatuses.VERIFIED, coverageType: coverageTypes.ITAC });
|
||||||
|
wrapper.vm.mobileFeePart = defaultMobileFeePart;
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('returns false for priced mobile fee for Deductible without Split Pay', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({ coverageStatus: coverageStatuses.VERIFIED, coverageType: coverageTypes.Deductible }, 'false');
|
||||||
|
wrapper.vm.mobileFeePart = defaultMobileFeePart;
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('returns false for priced mobile fee for Deductible with Split Pay and isInsurable=true', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({ coverageStatus: coverageStatuses.VERIFIED, coverageType: coverageTypes.Deductible }, 'true');
|
||||||
|
wrapper.vm.mobileFeePart = { ...defaultMobileFeePart, isInsurable: true };
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('returns true for priced mobile fee for Deductible with Split Pay and isInsurable=false', () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper } = setupMocks({ coverageStatus: coverageStatuses.VERIFIED, coverageType: coverageTypes.Deductible }, 'true');
|
||||||
|
wrapper.vm.mobileFeePart = { ...defaultMobileFeePart, isInsurable: false };
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const result = wrapper.vm.displayMSRFeeAlert;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(result).toBe(true);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -94,6 +94,12 @@
|
||||||
{{ militaryBaseWarningText }}
|
{{ militaryBaseWarningText }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<alert
|
||||||
|
v-if="displayMSRFeeAlert"
|
||||||
|
:manualCopy="msrFeeAlertCopy"
|
||||||
|
cmsWidgetName="AlertMSRFeeWidget"
|
||||||
|
:isCollapsible="true"
|
||||||
|
alertClass="alert-warning" />
|
||||||
<serviceZipQuestion
|
<serviceZipQuestion
|
||||||
ref="mobileServiceZipCodeQuestion"
|
ref="mobileServiceZipCodeQuestion"
|
||||||
customInputId="mobileServiceZipCode"
|
customInputId="mobileServiceZipCode"
|
||||||
|
|
@ -133,11 +139,10 @@ import {
|
||||||
getMobileZipCodeData
|
getMobileZipCodeData
|
||||||
} from '@/helpers/service-location-helper';
|
} from '@/helpers/service-location-helper';
|
||||||
import { toTitleCase } from '@/helpers/text-helper.js';
|
import { toTitleCase } from '@/helpers/text-helper.js';
|
||||||
import { isRecalOrder } from '@/helpers/recal-helper';
|
import { isMSRPart, isRecalOrder } from '@/helpers/recal-helper';
|
||||||
|
|
||||||
// Import Component
|
// Import Component
|
||||||
import alert from '@/ux-components/alert/alert.vue';
|
import alert from '@/ux-components/alert/alert.vue';
|
||||||
import textBlock from '@/digital-components/text-block/text-block.vue';
|
|
||||||
import appointmentTypeQuestion from '@/layouts/schedule-page/service-location/appointment-type-question/appointment-type-question.vue';
|
import appointmentTypeQuestion from '@/layouts/schedule-page/service-location/appointment-type-question/appointment-type-question.vue';
|
||||||
import baseFormMixin from '@/mixins/base-form-mixin';
|
import baseFormMixin from '@/mixins/base-form-mixin';
|
||||||
import shopAddress from '@/layouts/schedule-page/service-location/shop-address/shop-address.vue';
|
import shopAddress from '@/layouts/schedule-page/service-location/shop-address/shop-address.vue';
|
||||||
|
|
@ -146,6 +151,7 @@ import widgetFields from '@/constants/cms-widget-fields';
|
||||||
import recalModal from '@/iss-components/recal-modal/recal-modal.vue';
|
import recalModal from '@/iss-components/recal-modal/recal-modal.vue';
|
||||||
import { getPricedMobileFeePart } from '@/helpers/service-location-helper';
|
import { getPricedMobileFeePart } from '@/helpers/service-location-helper';
|
||||||
import { processIfStatements } from '@/helpers/cms-content-helper';
|
import { processIfStatements } from '@/helpers/cms-content-helper';
|
||||||
|
import { experimentSettings } from '@/constants/experiments';
|
||||||
|
|
||||||
const RECAL_MODAL_REF_NAME = 'RecalModal';
|
const RECAL_MODAL_REF_NAME = 'RecalModal';
|
||||||
|
|
||||||
|
|
@ -153,7 +159,6 @@ export default {
|
||||||
name: 'service-location',
|
name: 'service-location',
|
||||||
components: {
|
components: {
|
||||||
alert,
|
alert,
|
||||||
textBlock,
|
|
||||||
appointmentTypeQuestion,
|
appointmentTypeQuestion,
|
||||||
shopAddress,
|
shopAddress,
|
||||||
serviceZipQuestion,
|
serviceZipQuestion,
|
||||||
|
|
@ -294,6 +299,38 @@ export default {
|
||||||
}
|
}
|
||||||
const bodyText = this.getCmsContent('WhereWouldYouLikeServiceWidget', widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT);
|
const bodyText = this.getCmsContent('WhereWouldYouLikeServiceWidget', widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT);
|
||||||
return this.processIfStatements(bodyText, 'custom', this.getCustomValueFromString);
|
return this.processIfStatements(bodyText, 'custom', this.getCustomValueFromString);
|
||||||
|
},
|
||||||
|
displayMSRFeeAlert() {
|
||||||
|
if (!this.mobileFeePart || !isMSRPart(this.mobileFeePart)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const mobileFeeAmount = (this.mobileFeePart.kitPrice ?? 0)
|
||||||
|
+ (this.mobileFeePart.laborAmount ?? 0)
|
||||||
|
+ (this.mobileFeePart.sellingPrice ?? 0);
|
||||||
|
if (mobileFeeAmount <= 0) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.mainStore.isITAC || this.mainStore.isNoComp) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
const isSplitPayEnabled = this.getSettingValue(experimentSettings.MSR_SPLIT_PAY_ENABLED) === 'true';
|
||||||
|
if (!isSplitPayEnabled) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
return !this.mobileFeePart.isInsurable;
|
||||||
|
},
|
||||||
|
msrFeeAlertCopy() {
|
||||||
|
const mobileFeeAmount = (this.mobileFeePart?.kitPrice ?? 0)
|
||||||
|
+ (this.mobileFeePart?.laborAmount ?? 0)
|
||||||
|
+ (this.mobileFeePart?.sellingPrice ?? 0);
|
||||||
|
|
||||||
|
let content = this.getCmsContent('AlertMSRFeeWidget', widgetFields.ALERT_WIDGET.BODY_TEXT);
|
||||||
|
content = content.replace('{custom:mobileFee}', `${mobileFeeAmount.toFixed(2)}`);
|
||||||
|
return content;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue