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

Merge branch 'develop' into feature/SSR-233

Browse source
This commit is contained in:
Kulbhushan Kaushik 2023-01-23 07:53:24 -05:00
commit 871fc4702a
79 changed files with 687 additions and 497 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/common-components/base-input-button/base-input-button.vue → src/digital-components/base-input-button/base-input-button.vue
View file

@ -30,7 +30,7 @@ import {
handleButtonComponentFocus,
handleInputComponentBlur,
} from "@/helpers/button-question-focus-helper";
import { inputButtonProps } from "@/common-components/base-input-button/button-functionality-props";
import { inputButtonProps } from "@/digital-components/base-input-button/button-functionality-props";
export default {
name: "base-input-button",

0
src/common-components/base-input-button/button-functionality-props.js → src/digital-components/base-input-button/button-functionality-props.js
View file

2
src/common-components/button-question/button-question.spec.js → src/digital-components/button-question/button-question.spec.js
View file

@ -1,5 +1,5 @@
import { shallowMount } from "@vue/test-utils";
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
describe("buttonQuestion.vue", () => {

0
src/common-components/button-question/button-question.vue → src/digital-components/button-question/button-question.vue
View file

0
src/common-components/dropdown-question/dropdown-question.spec.js → src/digital-components/dropdown-question/dropdown-question.spec.js
View file

0
src/common-components/dropdown-question/dropdown-question.vue → src/digital-components/dropdown-question/dropdown-question.vue
View file

0
src/common-components/modal/modal.spec.js → src/digital-components/modal/modal.spec.js
View file

0
src/common-components/modal/modal.vue → src/digital-components/modal/modal.vue
View file

2
src/common-components/question-chain/question-chain.spec.js → src/digital-components/question-chain/question-chain.spec.js
View file

@ -1,5 +1,5 @@
import { shallowMount } from "@vue/test-utils";
import questionChain from "@/common-components/question-chain/question-chain.vue";
import questionChain from "@/digital-components/question-chain/question-chain.vue";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import { nextTick } from "vue";

2
src/common-components/question-chain/question-chain.vue → src/digital-components/question-chain/question-chain.vue
View file

@ -17,7 +17,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { useValidateForm } from "vee-validate";
export default {

0
src/common-components/text-block/text-block.spec.js → src/digital-components/text-block/text-block.spec.js
View file

0
src/common-components/text-block/text-block.vue → src/digital-components/text-block/text-block.vue
View file

0
src/common-components/textbox-question/textbox-question.spec.js → src/digital-components/textbox-question/textbox-question.spec.js
View file

2
src/common-components/textbox-question/textbox-question.vue → src/digital-components/textbox-question/textbox-question.vue
View file

@ -44,7 +44,7 @@
<button v-if="includeSelectIcon" type="submit" data-bs-toggle="modal"
:data-bs-target="'#' + this.cmsWidgetName" aria-label="Select button" />
</div>
<div v-show="errorMessage" class="row my-2 form-test-error">
<div v-show="errorMessage" class="row my-2 form-test-error mb-0">
<span class="d-inline-flex mt-0" role="alert">{{ errorMessage }}</span>
</div>
</div>

2
src/common-components/address-questions/address-questions.spec.js → src/iss-components/address-questions/address-questions.spec.js
View file

@ -1,5 +1,5 @@
// Components
import addressQuestions from "@/common-components/address-questions/address-questions";
import addressQuestions from "@/iss-components/address-questions/address-questions";
// Supporting Files
import { mount, shallowMount } from "@vue/test-utils";

4
src/common-components/address-questions/address-questions.vue → src/iss-components/address-questions/address-questions.vue
View file

@ -73,8 +73,8 @@
</template>
<script>
import textboxQuestion from "@/common-components/textbox-question/textbox-question";
import dropdownQuestion from "@/common-components/dropdown-question/dropdown-question";
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
import dropdownQuestion from "@/digital-components/dropdown-question/dropdown-question";
import alert from "@/ux-components/alert/alert";
import { applicationConfig } from "@/constants/application-config.js";
import { defineRule } from "vee-validate";

0
src/common-components/button-question-modal/button-question-modal.spec.js → src/iss-components/button-question-modal/button-question-modal.spec.js
View file

2
src/common-components/button-question-modal/button-question-modal.vue → src/iss-components/button-question-modal/button-question-modal.vue
View file

@ -47,7 +47,7 @@
<script>
import buttonMain from "@/ux-components/button-main/button-main";
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
export default {
name: "buttonQuestionModal",

0
src/common-components/loading-modal/loading-modal.spec.js → src/iss-components/loading-modal/loading-modal.spec.js
View file

0
src/common-components/loading-modal/loading-modal.vue → src/iss-components/loading-modal/loading-modal.vue
View file

0
src/common-components/nav-button/nav-button.spec.js → src/iss-components/nav-button/nav-button.spec.js
View file

0
src/common-components/nav-button/nav-button.vue → src/iss-components/nav-button/nav-button.vue
View file

2
src/common-components/questions-page-layout/questions-page-layout.spec.js → src/iss-components/questions-page-layout/questions-page-layout.spec.js
View file

@ -1,5 +1,5 @@
// Components
import questionsPageLayout from "@/common-components/questions-page-layout/questions-page-layout";
import questionsPageLayout from "@/iss-components/questions-page-layout/questions-page-layout";
// Supporting Files
import { shallowMount } from "@vue/test-utils";

12
src/common-components/questions-page-layout/questions-page-layout.vue → src/iss-components/questions-page-layout/questions-page-layout.vue
View file

@ -35,13 +35,13 @@
<script>
// Components
import siteHeader from "@/common-components/site-header/site-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteHeader from "@/iss-components/site-header/site-header";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import alert from "@/ux-components/alert/alert";
import questionChain from "@/common-components/question-chain/question-chain";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import siteFooter from "@/common-components/site-footer/site-footer";
import loadingModal from "@/common-components/loading-modal/loading-modal.vue";
import questionChain from "@/digital-components/question-chain/question-chain";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import siteFooter from "@/iss-components/site-footer/site-footer";
import loadingModal from "@/iss-components/loading-modal/loading-modal.vue";
export default {
name: "questions-page",

0
src/common-components/site-footer/site-footer.spec.js → src/iss-components/site-footer/site-footer.spec.js
View file

0
src/common-components/site-footer/site-footer.vue → src/iss-components/site-footer/site-footer.vue
View file

0
src/common-components/site-header/menu-modal/menu-modal.spec.js → src/iss-components/site-header/menu-modal/menu-modal.spec.js
View file

0
src/common-components/site-header/menu-modal/menu-modal.vue → src/iss-components/site-header/menu-modal/menu-modal.vue
View file

2
src/common-components/site-header/site-header.spec.js → src/iss-components/site-header/site-header.spec.js
View file

@ -1,4 +1,4 @@
import siteHeader from "@/common-components/site-header/site-header";
import siteHeader from "@/iss-components/site-header/site-header";
import { shallowMount } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";

2
src/common-components/site-header/site-header.vue → src/iss-components/site-header/site-header.vue
View file

@ -16,7 +16,7 @@
</template>
<script>
import menuModal from "@/common-components/site-header/menu-modal/menu-modal";
import menuModal from "@/iss-components/site-header/menu-modal/menu-modal";
import alert from "@/ux-components/alert/alert";
import eventBus from "@/helpers/event-bus/event-bus";
import { globalEvents } from "@/constants/events";

0
src/common-components/site-sub-header/button-back/button-back.spec.js → src/iss-components/site-sub-header/button-back/button-back.spec.js
View file

0
src/common-components/site-sub-header/button-back/button-back.vue → src/iss-components/site-sub-header/button-back/button-back.vue
View file

2
src/common-components/site-sub-header/site-sub-header.spec.js → src/iss-components/site-sub-header/site-sub-header.spec.js
View file

@ -1,4 +1,4 @@
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header';
import { shallowMount } from "@vue/test-utils";
describe("site sub header", () => {

2
src/common-components/site-sub-header/site-sub-header.vue → src/iss-components/site-sub-header/site-sub-header.vue
View file

@ -23,7 +23,7 @@
</template>
<script>
import buttonBack from "@/common-components/site-sub-header/button-back/button-back";
import buttonBack from "@/iss-components/site-sub-header/button-back/button-back";
export default ({

0
src/common-components/vehicle-banner/vehicle-banner.spec.js → src/iss-components/vehicle-banner/vehicle-banner.spec.js
View file

0
src/common-components/vehicle-banner/vehicle-banner.vue → src/iss-components/vehicle-banner/vehicle-banner.vue
View file

10
src/layouts/address-lookup/address-lookup.vue
View file

@ -53,13 +53,13 @@
<script>
// Components
import baseFormMixin from '@/mixins/base-form-mixin';
import siteHeader from "@/common-components/site-header/site-header.vue";
import siteFooter from "@/common-components/site-footer/site-footer";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import siteHeader from "@/iss-components/site-header/site-header.vue";
import siteFooter from "@/iss-components/site-footer/site-footer";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import customerQuestions from "@/layouts/address-lookup/customer-questions/customer-questions";
import alert from "@/ux-components/alert/alert";
import textboxQuestion from "@/common-components/textbox-question/textbox-question";
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
import { Form } from "vee-validate";

4
src/layouts/address-lookup/customer-questions/customer-questions.vue
View file

@ -25,8 +25,8 @@
</template>
<script>
import addressQuestions from "@/common-components/address-questions/address-questions";
import textboxQuestion from "@/common-components/textbox-question/textbox-question";
import addressQuestions from "@/iss-components/address-questions/address-questions";
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules";
import { errorMessages } from "@/constants/error-messages";

8
src/layouts/address-vehicles/address-vehicles.vue
View file

@ -37,10 +37,10 @@ import { settleAllPromises } from '@/helpers/layout-helper';
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
import { Form } from 'vee-validate';
import siteFooter from '@/common-components/site-footer/site-footer.vue';
import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
export default {
name: 'capability-questions',

8
src/layouts/capability-questions/capability-questions.vue
View file

@ -37,10 +37,10 @@ import { settleAllPromises } from '@/helpers/layout-helper';
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
import { Form } from 'vee-validate';
import siteFooter from '@/common-components/site-footer/site-footer.vue';
import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
export default {
name: 'capability-questions',

8
src/layouts/coverage-statement/coverage-statement.vue
View file

@ -37,10 +37,10 @@ import { settleAllPromises } from '@/helpers/layout-helper';
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
import { Form } from 'vee-validate';
import siteFooter from '@/common-components/site-footer/site-footer.vue';
import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
export default {
name: 'coverage-statement',

61
src/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.spec.js
View file

@ -1,61 +0,0 @@
/* eslint-env jest */
import { getDamageString } from '@/helpers/damage-helper';
import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
import { RouterLinkStub } from '@vue/test-utils';
import { render } from '@testing-library/vue';
import '@testing-library/jest-dom';
import LicensePlateLookupAlertsComponent from '@/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.vue';
jest.mock('@/helpers/damage-helper');
const mountOptions = {
global: {
stubs: {
RouterLink: RouterLinkStub,
},
mixins: [
{
methods: {
getCmsContent: jest.fn(() => ''),
getFooterInfoBoxHeight: jest.fn(() => 80),
cssClassNameForCmsWidget: jest.fn(() => 'widget-name-mock-class'),
},
},
],
},
};
describe('license-plate-lookup-alerts.vue', () => {
test('VehicleNotFoundAlert is displayed on the screen', () => {
// Arrange
mountOptions.props = {
activeAlertType: vehicleLookupAlertTypes.NOT_FOUND,
};
// Act
const { queryByRole } = render(LicensePlateLookupAlertsComponent, mountOptions);
const vehicleNotFoundAlert = queryByRole('alert', { name: 'vehicle-not-found-alert' });
const vehicleNotMatchedAlert = queryByRole('alert', { name: 'vehicle-not-matched-alert'});
// Assert
expect(vehicleNotFoundAlert).toBeVisible();
expect(vehicleNotMatchedAlert).toEqual(null);
});
test('VehicleNotMatchedAlert is displayed on the screen', () => {
// Arrange
getDamageString.mockImplementation(() => 'Mock Damage String');
mountOptions.props = {
activeAlertType: vehicleLookupAlertTypes.NOT_MATCHED,
};
// Act
const { queryByRole } = render(LicensePlateLookupAlertsComponent, mountOptions);
const vehicleNotFoundAlert = queryByRole('alert', { name: 'vehicle-not-found-alert' });
const vehicleNotMatchedAlert = queryByRole('alert', { name: 'vehicle-not-matched-alert'});
// Assert
expect(vehicleNotMatchedAlert).toBeVisible();
expect(vehicleNotFoundAlert).toEqual(null);
});
})

50
src/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.vue
View file

@ -1,50 +0,0 @@
<template>
<div
id="vin-lookup-alerts-wrapper"
:class="wrapperCssClass"
>
<vehicleNotFoundAlert
v-if="isVehicleNotFoundVisible"
/>
<vehicleNotMatchedAlert
v-else-if="isVehicleNotMatchedVisible"
/>
</div>
</template>
<script>
import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
import vehicleNotFoundAlert from './vehicle-not-found-alert/vehicle-not-found-alert.vue';
import vehicleNotMatchedAlert from './vehicle-not-matched-alert/vehicle-not-matched-alert.vue';
export default {
name: 'license-plate-lookup-alerts',
components: {
vehicleNotFoundAlert,
vehicleNotMatchedAlert,
},
props: {
activeAlertType: {
type: String,
validator(value) {
const acceptedValues = [null];
acceptedValues.push(...Object.values(vehicleLookupAlertTypes));
return acceptedValues.includes(value);
},
},
},
computed: {
isVehicleNotFoundVisible() {
return this.activeAlertType === vehicleLookupAlertTypes.NOT_FOUND;
},
isVehicleNotMatchedVisible() {
return this.activeAlertType === vehicleLookupAlertTypes.NOT_MATCHED;
},
wrapperCssClass() {
return {
'mb-5': this.activeAlertType !== null,
};
},
},
};
</script>

27
src/layouts/license-plate-lookup/license-plate-lookup-alerts/vehicle-not-found-alert/vehicle-not-found-alert.vue
View file

@ -1,27 +0,0 @@
<template>
<alert
alertClass="alert-danger"
cmsWidgetName="AlertVinNotFoundWidget"
id="vehicle-not-found-alert"
aria-label="vehicle-not-found-alert"
/>
</template>
<script>
import alert from '@/ux-components/alert/alert.vue';
export default {
name: 'vehicle-not-found-alert',
components: {
alert,
},
};
</script>
<style>
/**
Override wrong margin-bottom rule in the Alert component.
*/
#vehicle-not-found-alert p:last-of-type {
margin-bottom: 0 !important;
}
</style>

50
src/layouts/license-plate-lookup/license-plate-lookup-alerts/vehicle-not-matched-alert/vehicle-not-matched-alert.vue
View file

@ -1,50 +0,0 @@
<template>
<alert
alertClass="alert-warning"
cmsWidgetName="AlertMatchedDifferentVehicleWidget"
:manualCopy="body"
:manualHeadline="header"
aria-label="vehicle-not-matched-alert"
/>
</template>
<script>
import { getDamageString } from '@/helpers/damage-helper';
import alert from '@/ux-components/alert/alert.vue';
export default {
name: 'vehicle-not-matched-alert',
components: {
alert,
},
inject: ['vehicleFromLookup'],
computed: {
header() {
return (
this.getCmsContent('AlertMatchedDifferentVehicleWidget', 'HeadlineText')
.replaceAll('{custom:damage}', getDamageString())
);
},
body() {
let year = '';
let make = '';
let model = '';
if (this.vehicleFromLookup) {
year = this.vehicleFromLookup.year;
make = this.vehicleFromLookup.make;
model = this.vehicleFromLookup.model;
}
return (
this.getCmsContent('AlertMatchedDifferentVehicleWidget', 'BodyText')
.replaceAll('{custom:damage}', getDamageString())
.replaceAll('{custom:vinlookupYear}', year)
.replaceAll('{custom:vinlookupMake}', make)
.replaceAll('{custom:vinlookupModel}', model)
);
},
},
};
</script>

304
src/layouts/license-plate-lookup/license-plate-lookup.spec.js
View file

@ -1,49 +1,81 @@
// Components
import licensePlateLookup from "@/layouts/license-plate-lookup/license-plate-lookup.vue";
// Supporting files
import { shallowMount } from '@vue/test-utils';
// Supporting Files
import { settleAllPromises } from "@/helpers/layout-helper.js";
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import baseMixin from "@/mixins/base-mixin.js";
import { shallowMount } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import { nextTick } from "vue";
import { useMainStore } from "@/store";
import { applicationConfig } from "@/constants/application-config";
import { navigationScenarios } from "@/router/router-constants/navigation-scenarios";
jest.mock("@/helpers/damage-helper", () => ({
isGlassAvailableForCarId: jest.fn().mockImplementation(() => true),
getDamageString: jest.fn(),
}));
// Mock our module for promises.
jest.mock("@/helpers/layout-helper.js", () => ({
settleAllPromises: jest.fn(),
settleAllPromises: jest.fn(),
}));
// Mock fetchCmsContentForPage
jest.mock("@/helpers/cms-content-helper", () => ({
fetchCmsContentForPage: jest.fn(),
fetchCmsContentForPage: jest.fn(),
}));
describe("license-plate-lookup.vue", () => {
test("Vehicle make set, arePagePrerequisitesValid should be true", () => {
//Arrange
const { wrapper } = setupMocks({});
useMainStore().order.vehicle.carId = "CR00000395";
describe("page level alerts", () => {
test("If license plate matches a different vehicle, display MatchedDifferentVehicleAlert", async () => {
// Arrange
const mockRegistrationLicensePlate = {
licensePlate: "UTN990",
};
//Act
licensePlateLookup.beforeRouteEnter.call(
wrapper.vm,
{ query: { issPage: "license-plate-lookup" } },
undefined,
(c) => c(wrapper.vm)
);
const { wrapper } = setupMocks({});
let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
useMainStore().order.vehicle.carId = "TESTCARID";
//Assert
expect(arePagePrerequisitesValid).toBe(true);
await wrapper.setData({
licensePlate: mockRegistrationLicensePlate
});
// Act
await wrapper.vm.forwardButtonAction();
// Assert
expect(wrapper.findComponent({ ref: "alertMatchedDifferentVehicle" }).isVisible()).toBe(
true
);
});
});
describe("navigation", () => {
test("BackButtonAction triggers a router.navigate change", async () => {
test("If no vehicles found, display VinNotFound alert", async () => {
// Arrange
const mockRegistrationLicensePlate = {
licensePlate: "TEST1234",
};
const { wrapper } = setupMocks({
vinLookupResponseError: "vin not found error"
});
useMainStore().order.vehicle.carId = "TESTCARID";
await wrapper.setData({
licensePlate: mockRegistrationLicensePlate
});
wrapper.vm.navigateForward = jest.fn();
// Act
await wrapper.vm.forwardButtonAction();
// Assert
expect(wrapper.findComponent({ ref: "alertVinNotFound" }).isVisible()).toBe(true);
});
});
describe("navigation", () => {
test("Clicking back button navigates back", async () => {
//Arrange
const { wrapper, apiPromise } = setupMocks({
mountOptionsMockData: {
@ -59,86 +91,172 @@ describe("navigation", () => {
undefined,
(c) => c(wrapper.vm)
);
wrapper.vm.backButtonAction();
await nextTick();
await wrapper.vm.backButtonAction();
//Assert
return apiPromise.finally(() => {
try {
expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
}
catch (e) {
throw e
}
});
expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
});
// TODO: Create test for navigating forward when user clicks Continue
// and information entered is correct (no alerts)
// TODO: Create test for license-plate-question component emitting value when user clicks Continue
// and information entered is correct (no alerts)
test("License plate found and matches entered vehicle => navigateForwardWithSingleCarMatch", async () => {
// Arrange
const vehicleFound = {
carId: "C0000",
};
// TODO: Create test for zip-question component emitting value when user clicks Continue
// and information entered is correct (no alerts)
// *The above will be completed when navigation from page is complete (SSR-179)
const { wrapper } = setupMocks({});
wrapper.vm.navigateForwardWithSingleCarMatch = jest.fn();
useMainStore().order.vehicle.carId = "C0000";
// Act
wrapper.vm.navigateForward(vehicleFound);
// Assert
expect(wrapper.vm.navigateForwardWithSingleCarMatch).toHaveBeenCalledTimes(1);
});
test("if a different vehicle is found than the one entered and the selected glass is not available for that vehicle, navigate back to vehicle-damage page", async () => {
// Arrange
const mockRegistrationLicensePlate = {
licensePlate: "TEST1234",
};
const { wrapper } = setupMocks({});
await wrapper.setData({
licensePlate: mockRegistrationLicensePlate,
isCarIdDifferent: true,
isSelectedGlassAvailableForVehicle: false,
});
useMainStore().order.vehicle.carId = "CARID";
let carsFound = [
{
vin: "TEST_VIN2",
vehicle: {
carId: "C0000",
},
},
];
// Act
await wrapper.vm.navigateForward(carsFound);
// Assert
expect(wrapper.vm.$router.navigate).toHaveBeenCalledWith(
navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS,
undefined,
{},
{ displayVehicleChangeAlert: true }
);
});
});
describe("miscellaneous", () => {
test("Vehicle make set, arePagePrerequisitesValid should be true", () => {
// Arrange
const { wrapper } = setupMocks({});
useMainStore().order.vehicle.carId = "CR00000395";
// Act
licensePlateLookup.beforeRouteEnter.call(
wrapper.vm,
{ query: { issPage: "license-plate-lookup" } },
undefined,
(c) => c(wrapper.vm)
);
let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
// Assert
expect(arePagePrerequisitesValid).toBe(true);
});
});
});
function setupMocks({
pageHeaderWidgetHeaderText = {},
pageFooterWidgetCmsContent = {},
mountOptionsMockData = {},
//Values to set in the state store
carId = null,
registrationZipCode = null, //"55555",
licensePlate = null, //"TESTPLATE",
isZipValid = true,
isZipServiceable = true,
lookupVinByPlateResponse,
partsOrQuestions = [],
vehicle = {},
vin = null,
carId = "C0000",
vinLookupResponseError = null,
route = null,
}) {
//Mock api responses
const apiResponses = {
cmsContent: {
SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
VehicleBannerWidget: {
GenericVehicleImage:
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
},
SiteHeaderWidget: {
LogoImage:
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
},
SiteFooterWidget: pageFooterWidgetCmsContent,
useMainStore().validateZip = jest.fn().mockImplementation(() => {
return Promise.resolve({
data: {
isValid: isZipValid,
isServiceable: isZipServiceable,
},
};
mountOptionsMockData = {
...mountOptionsMockData,
router: {
navigate: jest.fn(),
})
});
useMainStore().lookupVinByPlate = jest.fn().mockImplementation(() => {
return Promise.resolve({
data: lookupVinByPlateResponse
? lookupVinByPlateResponse : {
vin: "TEST_VIN",
vehicle: {
carId: "CARID"
},
},
store: {
getters: {
vehicle: {
registration: {
licensePlate: licensePlate,
zipCode: registrationZipCode,
},
carId: carId,
},
})
});
useMainStore().getPartsOrQuestions = jest.fn().mockImplementation(() => {
return Promise.resolve({
data: {
partsOrQuestions: partsOrQuestions,
},
})
});
const wrapper = shallowMount(
licensePlateLookup,
getMountOptions({
route: route ? route : undefined,
router: {
navigate: jest.fn(),
},
mainStore: {
order: {
vehicle: {
carId: carId,
registration: {
licensePlate: "TESTPLATE",
zipCode: "12345",
},
},
},
};
},
const apiPromise = Promise.resolve(apiResponses);
settleAllPromises.mockImplementation(() => apiPromise);
fetchCmsContentForPage.mockImplementation(() => Promise.resolve());
const mountOptions = getMountOptions(mountOptionsMockData);
})
);
const wrapper = shallowMount(licensePlateLookup, mountOptions);
const apiResponses = {
serviceZipValidationResponse: {
isValid: isZipValid,
isServiceable: isZipServiceable,
},
vinLookupResponse: {
vin: vin,
vehicle: vehicle,
error: vinLookupResponseError,
},
};
wrapper.vm.setCmsContent = baseMixin.methods.setCmsContent;
return { wrapper, apiPromise };
settleAllPromises.mockImplementation(() => apiResponses);
wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => "");
wrapper.vm.setCmsContent = jest.fn();
wrapper.vm.$refs.siteFooter.updateButtonText = jest.fn();
wrapper.vm.$refs.siteFooter.removeLoader = jest.fn();
wrapper.vm.$refs.siteFooter.disableForwardButton = jest.fn();
wrapper.vm.$refs.siteFooter.enableForwardButton = jest.fn();
return { wrapper };
}

278
src/layouts/license-plate-lookup/license-plate-lookup.vue
View file

@ -10,26 +10,38 @@
:display-generic-vehicle-image="false" />
<siteSubHeader cms-widget-name="SiteSubHeaderWidget" />
<div class="fade-on-route-transition sub-container make-tall mt-5">
<licensePlateLookupAlerts
:activeAlertType="activeVehicleLookupAlertType"
/>
<alert
ref="alertVinNotFound"
v-if="displayVinNotFoundAlert"
class="mb-4"
cmsWidgetName="AlertVinNotFoundWidget"
alertClass="alert-danger"
v-bind:isDismissible="false" />
<alert
ref="alertMatchedDifferentVehicle"
v-if="displayMatchedDifferentVehicleAlert"
class="mb-4"
cmsWidgetName="AlertMatchedDifferentVehicleWidget"
:manualHeadline="AlertMatchedDifferentVehicleHeader"
:manualCopy="AlertMatchedDifferentVehicleBody"
alertClass="alert-warning"
v-bind:isDismissible="false" />
<textboxQuestion
cmsWidgetName="LicensePlateNumberQuestionWidget"
v-model="licensePlate"
isRequired
disableAutoFill
inputId="license-plate-question"
validationRules="license-plate-required"
/>
<textboxQuestion
cmsWidgetName="RegistrationZipQuestionWidget"
v-model="registrationZipCode"
isRequired
validationRules="license-plate-required" />
<dropdownQuestion
cmsWidgetName="StateQuestionWidget"
v-model="licenseState"
ref="state"
inputId="8fdf9dc2e13e430eb57529499dceb3eb"
:options="stateOptions"
disableAutoFill
inputId="zip"
validationRules="zip-required|zip-format"
class="mt-4"
/>
validationRules="state-required"
class="mt-4" />
<siteFooter
:isForwardActionDisabled="!meta.valid"
cms-widget-name="SiteFooterWidget"
@ -42,61 +54,37 @@
</template>
<script>
// Import Supporting Files
import { computed } from 'vue';
import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import { settleAllPromises } from '@/helpers/layout-helper';
import { useMainStore } from '@/store';
import { errorMessages } from "@/constants/error-messages";
import { required, regex } from "@/helpers/validation-rules";
import { required } from "@/helpers/validation-rules";
import { defineRule } from "vee-validate";
import { getDamageString, isGlassAvailableForCarId } from '@/helpers/damage-helper.js';
import { routerParams } from '@/router/router-params.js'
import { states } from "@/constants/states";
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
import vinPagesMixin from '@/mixins/vin-pages-mixin';
import { Form } from 'vee-validate';
import siteFooter from '@/common-components/site-footer/site-footer.vue';
import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
import licensePlateLookupAlerts from '@/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
import textboxQuestion from '@/digital-components/textbox-question/textbox-question.vue';
import dropdownQuestion from '@/digital-components/dropdown-question/dropdown-question.vue';
import alert from "@/ux-components/alert/alert";
// Define Validation Rules
defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
defineRule("zip-required", required(errorMessages.REGISTRATION_ZIP_REQUIRED));
defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
defineRule("state-required", required(errorMessages.STATE_REQUIRED));
export default {
name: 'license-plate-lookup',
mixins: [baseFormMixin],
components: {
Form,
siteFooter,
siteHeader,
siteSubHeader,
vehicleBanner,
textboxQuestion,
licensePlateLookupAlerts,
},
setup() {
const mainStore = useMainStore();
return { mainStore };
},
data() {
return {
activeVehicleLookupAlertType: null,
vehicleFromLookup: null,
licensePlate: null,
registrationZipCode: null,
};
},
provide() {
return {
vehicleFromLookup: computed(() => this.vehicleFromLookup),
};
},
mixins: [baseFormMixin, vinPagesMixin],
async beforeRouteEnter(to, from, next) {
// Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
// Settle promises and get results
@ -108,57 +96,179 @@ export default {
];
const resultMap = await settleAllPromises(promiseResultMap);
// Call the "next" function to complete the transition to this page.
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
});
},
data() {
return {
activeVehicleLookupAlertType: null,
vehicleFromLookup: null,
licensePlate: null,
licenseState: null,
displayVinNotFoundAlert: false,
displayMatchedDifferentVehicleAlert: false,
previouslyEnteredCarId: "",
isCarIdDifferent: false,
customAlertData: {},
isSelectedGlassAvailableForVehicle: true,
};
},
methods: {
arePagePrerequisitesValid() {
if (this.mainStore.order.vehicle.carId) {
return true;
}
return false;
return this.mainStore.order.vehicle.carId !== null;
},
loadDefaultsFromStore() {
this.customerQuestions = this.mainStore.customerData.addressQuestions.state;
},
backButtonAction() {
/**
* this.navigationScenarios comes from base-mixin
*/
// route to move backwards
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
},
attachCustomEvents() {
this.prependActionToMethod(this, this.forwardButtonAction, () => {
this.pushEventToGA(
this.$route.query[this.queryStrings.ISS_PAGE],
this.GaActions.SUBMITTED,
this.GaLabels.LICENSE_PLATE_LOOKUP,
true
);
});
},
// NOTE: If form is not valid, this method is not called when 'Continue' button is clicked
async forwardButtonAction() {
this.resetActiveAlert();
this.resetWarningsAndErrors();
// NOTE: If form is not valid, this method is not called when 'Continue' button is clicked
const vehicleLookupResponse = await this.mainStore.lookupVinByPlate(this.licensePlate);
// Lookup VIN
const vinLookupResponse = await useMainStore().lookupVinByPlate(
this.licensePlate, this.licenseState);
if (vehicleLookupResponse.error) {
this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_FOUND;
this.resetVehicleFromLookup();
this.$refs.siteFooter.removeLoader();
return;
// Settle promises and get results
const promiseResultMap = [
{
resultKey: "vinLookupResponse",
promise: vinLookupResponse,
},
];
const resultMap = await settleAllPromises(promiseResultMap);
// No VIN found
if (resultMap.vinLookupResponse.error) {
this.displayVinNotFoundAlert = true;
this.$refs.siteFooter.disableForwardButton();
return this.$refs.siteFooter.removeLoader();
};
// Vehicle found from VIN lookup
const vehicleFromLookup = resultMap.vinLookupResponse.vehicle;
// Check if the CarId has changed
this.isCarIdDifferent =
vehicleFromLookup.carId !== useMainStore().order.vehicle.carId;
// Handle changing car
if (
this.isCarIdDifferent &&
vehicleFromLookup.carId !== this.previouslyEnteredCarId
) {
// Display Alert
this.previouslyEnteredCarId = vehicleFromLookup.carId;
this.customAlertData.vehicleInfo = vehicleFromLookup;
this.displayMatchedDifferentVehicleAlert = true;
this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId(
vehicleFromLookup.carId
);
// Update button "Continue with..."
this.$refs.siteFooter.updateButtonText(
`Continue with ${vehicleFromLookup.year} ${vehicleFromLookup.make} ${vehicleFromLookup.model}`
);
return this.$refs.siteFooter.removeLoader();
}
this.vehicleFromLookup = vehicleLookupResponse.data.vehicle;
if (this.vehicleFromLookup.carId !== this.mainStore.vehicle.carId) {
this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_MATCHED;
const vehicleYearMakeModel = `${this.vehicleFromLookup.year} ${this.vehicleFromLookup.make} ${this.vehicleFromLookup.model}`;
// Save vehicle, license plate, and registration information
await useMainStore().saveRegistrationLicensePlateLookup(
{
isSelectedGlassAvailableForVehicle: this.isSelectedGlassAvailableForVehicle,
vehicleInfo: Object.assign(vehicleFromLookup, {vin: vehicleFromLookup.vin }),
registrationInfo: {
licensePlate: this.licensePlate,
state: this.licenseState,
},
},
false
);
this.$refs.siteFooter.updateButtonText(`Continue with ${vehicleYearMakeModel}`);
this.$refs.siteFooter.removeLoader();
return await this.navigateForward();
},
async navigateForward() {
// If a different vehicle is found than the one entered and the selected glass is not available for that vehicle then navigate back to "vehicle-damage"
// display vehicle changed alert on that page.
if (this.isCarIdDifferent && !this.isSelectedGlassAvailableForVehicle) {
this.$router.navigate(
this.navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS,
this.$route,
{},
{ [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: true }
);
} else {
await this.navigateForwardWithSingleCarMatch();
}
},
resetWarningsAndErrors() {
this.displayVinNotFoundAlert = false;
this.displayMatchedDifferentVehicleAlert = false;
},
},
mounted() {
this.attachCustomEvents();
this.loadDefaultsFromStore();
},
computed: {
AlertMatchedDifferentVehicleHeader() {
return this.getCmsContent(
"AlertMatchedDifferentVehicleWidget",
"HeadlineText"
).replaceAll("{custom:damage}", getDamageString());
},
AlertMatchedDifferentVehicleBody() {
const vinYmmFound = `${this.customAlertData?.vehicleInfo?.year} ${this.customAlertData?.vehicleInfo?.make} ${this.customAlertData?.vehicleInfo?.model}`;
const vinYmmExpected = `${this.mainStore.order.vehicle.year} ${this.mainStore.order.vehicle.make} ${this.mainStore.order.vehicle.model}`;
// Continue
return this.getCmsContent("AlertMatchedDifferentVehicleWidget", "BodyText")
.replaceAll("{custom:damage}", getDamageString())
.replaceAll("{custom:vinYmmFound}", vinYmmFound)
.replaceAll("{custom:vinYmmExpected}", vinYmmExpected);
},
stateOptions: {
get: function () {
return states;
},
},
resetActiveAlert() {
this.activeVehicleLookupAlertType = null;
},
resetVehicleFromLookup() {
this.vehicleFromLookup = null;
},
resetDependentState() {},
},
watch: {
licensePlate() {
this.$refs.siteFooter.updateButtonText(
this.getCmsContent("SiteFooterWidget", "ForwardButtonText")
);
},
registrationZipCode() {
this.$refs.siteFooter.updateButtonText(
this.getCmsContent("SiteFooterWidget", "ForwardButtonText")
);
},
},
components: {
Form,
siteFooter,
siteHeader,
siteSubHeader,
vehicleBanner,
textboxQuestion,
dropdownQuestion,
alert
},
};
</script>

8
src/layouts/molding-questions/molding-questions.vue
View file

@ -37,10 +37,10 @@ import { settleAllPromises } from '@/helpers/layout-helper';
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
import { Form } from 'vee-validate';
import siteFooter from '@/common-components/site-footer/site-footer.vue';
import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
export default {
name: 'molding-questions',

2
src/layouts/part-questions/part-questions.vue
View file

@ -16,7 +16,7 @@
<script>
// Components
import questionsPageLayout from "@/common-components/questions-page-layout/questions-page-layout";
import questionsPageLayout from "@/iss-components/questions-page-layout/questions-page-layout";
// Supporting Files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

10
src/layouts/policy-holder-details/policy-holder-details.vue
View file

@ -42,11 +42,11 @@
</template>
<script>
// Components
import siteHeader from '@/common-components/site-header/site-header';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header';
import textboxQuestion from "@/common-components/textbox-question/textbox-question";
import addressQuestions from "@/common-components/address-questions/address-questions";
import siteFooter from "@/common-components/site-footer/site-footer";
import siteHeader from '@/iss-components/site-header/site-header';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header';
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
import addressQuestions from "@/iss-components/address-questions/address-questions";
import siteFooter from "@/iss-components/site-footer/site-footer";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

2
src/layouts/vehicle-damage/damage-location-question/damage-location-question.vue
View file

@ -13,7 +13,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules";
import { errorMessages } from "@/constants/error-messages";

2
src/layouts/vehicle-damage/replace-options-question/replace-options-question.vue
View file

@ -21,7 +21,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
export default {
name: "replaceOptionsQuestion",

2
src/layouts/vehicle-damage/side-door-options/side-door-options.vue
View file

@ -40,7 +40,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question";
import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules";

82
src/layouts/vehicle-damage/vehicle-damage.spec.js Normal file
View file

@ -0,0 +1,82 @@
/* eslint-env jest */
import { mount, flushPromises } from '@vue/test-utils';
import { createTestingPinia } from '@pinia/testing';
import { navigationScenarios } from '@/router/router-constants/navigation-scenarios';
import { routerParams } from '@/router/router-params';
import { vehicleCategories } from '@/constants/vehicle-categories';
import VehicleDamageComponent from './vehicle-damage.vue';
const mockRoute = {
params: {},
};
const mockRouter = {
navigate: jest.fn(),
};
const mountOptions = {
global: {
mixins: [
{
computed: {
navigationScenarios() {
return navigationScenarios;
},
routerParams() {
return routerParams;
},
vehicleCategories() {
return vehicleCategories;
},
},
methods: {
getCmsContent: jest.fn(),
getFooterInfoBoxHeight: jest.fn(() => 80),
getPageNameByQueryString: jest.fn(() => ''),
},
},
],
mocks: {
$route: mockRoute,
$router: mockRouter,
},
stubs: {
siteHeader: true,
vehicleBanner: true,
siteSubHeader: true,
siteDoorOptions: true,
damageLocationQuestion: true,
windshieldOptions: true,
replaceOptionsQuestion: true,
alert: true,
},
},
};
beforeEach(() => {
jest.clearAllMocks();
});
describe('vehicle-damage.vue', () => {
test('When damage selected is a repair, navigate to coverage-statement page', async () => {
mountOptions.global.plugins = [createTestingPinia({
initialState: {
main: {
order: {
damage: {
isRepair: true,
},
},
},
},
})];
const wrapper = mount(VehicleDamageComponent, mountOptions);
const siteFooterWrapper = wrapper.getComponent({ ref: 'siteFooter' });
siteFooterWrapper.vm.$emit('forwardClicked');
await flushPromises();
expect(mockRouter.navigate).toHaveBeenCalledTimes(1);
expect(mockRouter.navigate)
.toHaveBeenCalledWith(
navigationScenarios.CLICKED_FORWARD_WITH_REPAIR,
mockRoute,
);
});
});

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

@ -48,8 +48,10 @@
<site-footer
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@back-clicked="backButtonAction"
@ForwardClicked="forwardButtonAction" />
@backClicked="backButtonAction"
@forwardClicked="forwardButtonAction"
ref="siteFooter"
/>
</div>
</div>
</Form>
@ -57,10 +59,10 @@
<script>
// Components
import siteHeader from "@/common-components/site-header/site-header";
import siteFooter from "@/common-components/site-footer/site-footer";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import siteHeader from "@/iss-components/site-header/site-header";
import siteFooter from "@/iss-components/site-footer/site-footer";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import sideDoorOptions from "@/layouts/vehicle-damage/side-door-options/side-door-options";
import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question";
import windshieldOptions from "@/layouts/vehicle-damage/windshield-options/windshield-options";
@ -119,6 +121,11 @@ export default {
);
});
},
setup() {
const mainStore = useMainStore();
return { mainStore };
},
data() {
return {
selectedDamageLocations: this.getDamageLocationsFromStore(),
@ -148,15 +155,15 @@ export default {
var glassSelections = [];
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return glass.glassLocation === damageLocationsSelected.WINDSHIELD;
}) ||
useMainStore().order.damage.isRepair
this.mainStore.order.damage.isRepair
) {
glassSelections.push(damageLocationsSelected.WINDSHIELD);
}
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return (
glass.glassLocation === damageLocationsSelected.DRIVER ||
glass.glassLocation === damageLocationsSelected.PASSENGER
@ -167,7 +174,7 @@ export default {
}
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return glass.glassLocation === damageLocationsSelected.REAR;
})
) {
@ -184,14 +191,14 @@ export default {
selectedWindshieldReplaceOptions: [],
};
if (useMainStore().order.damage.isRepair === undefined) return windshieldOptions;
if (this.mainStore.order.damage.isRepair === undefined) return windshieldOptions;
if (useMainStore().order.damage.isRepair) {
if (this.mainStore.order.damage.isRepair) {
windShieldOptions.selectedWindshieldDamageType = damageLocationsSelected.REPAIR;
windShieldOptions.selectedWindshieldChipCount = useMainStore().order.damage.numberOfChips;
windShieldOptions.selectedWindshieldChipCount = this.mainStore.order.damage.numberOfChips;
} else {
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return (
glass.glassLocation === damageLocationsSelected.WINDSHIELD &&
glass.glassName === damageLocationsSelected.SINGLE
@ -206,7 +213,7 @@ export default {
}
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return (
glass.glassLocation === damageLocationsSelected.WINDSHIELD &&
glass.glassName === damageLocationsSelected.DRIVER
@ -221,7 +228,7 @@ export default {
}
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return (
glass.glassLocation === damageLocationsSelected.WINDSHIELD &&
glass.glassName === damageLocationsSelected.PASSENGER
@ -242,7 +249,7 @@ export default {
getDoorSidesFromStore() {
var doorSides = [];
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return glass.glassLocation === damageLocationsSelected.DRIVER;
})
) {
@ -250,7 +257,7 @@ export default {
}
if (
useMainStore().order.damage.glassToReplace?.some((glass) => {
this.mainStore.order.damage.glassToReplace?.some((glass) => {
return glass.glassLocation === damageLocationsSelected.PASSENGER;
})
) {
@ -263,7 +270,7 @@ export default {
getDriverSideReplaceOptionsFromStore() {
var driverSideReplaceOptions = [];
useMainStore().order.damage.glassToReplace?.forEach((glass) => {
this.mainStore.order.damage.glassToReplace?.forEach((glass) => {
if (glass.glassLocation === damageLocationsSelected.DRIVER) {
driverSideReplaceOptions.push(glass.glassName);
}
@ -275,7 +282,7 @@ export default {
getPassengerSideReplaceOptionsFromStore() {
var passengerSideReplaceOptions = [];
useMainStore().order.damage.glassToReplace?.forEach((glass) => {
this.mainStore.order.damage.glassToReplace?.forEach((glass) => {
if (glass.glassLocation === damageLocationsSelected.PASSENGER) {
passengerSideReplaceOptions.push(glass.glassName);
}
@ -285,7 +292,7 @@ export default {
},
getRearReplaceOptionsFromStore() {
var rearReplaceOptions = useMainStore().order.damage.glassToReplace?.filter(
var rearReplaceOptions = this.mainStore.order.damage.glassToReplace?.filter(
(glass) => glass.glassLocation === damageLocationsSelected.REAR
)[0]?.glassName;
@ -300,18 +307,26 @@ export default {
},
navigateForward() {
// If vin already exists, navigate directly to vin-lookup
if (useMainStore().order.vehicle.vin) {
if (this.mainStore.damage.isRepair) {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_VIN,
this.$route
);
} else {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITHOUT_VIN,
this.navigationScenarios.CLICKED_FORWARD_WITH_REPAIR,
this.$route
);
}
else {
// If vin already exists, navigate directly to vin-lookup
if (this.mainStore.order.vehicle.vin) {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_VIN,
this.$route
);
} else {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITHOUT_VIN,
this.$route
);
}
}
},
selectedGlassToReplace() {

2
src/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question.vue
View file

@ -15,7 +15,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
export default {
name: "windshieldOptions",

2
src/layouts/vehicle-damage/windshield-options/windshield-damage-type-question/windshield-damage-type-question.vue
View file

@ -15,7 +15,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
export default {
name: "windshieldDamageTypeQuestion",

8
src/layouts/vehicle-lookup/vehicle-lookup.vue
View file

@ -40,10 +40,10 @@ import BaseFormMixin from '@/mixins/base-form-mixin';
import VIN_LOOKUP_METHODS from '@/constants/vin-lookup-methods';
// Import Component
import SiteFooter from '@/common-components/site-footer/site-footer.vue';
import SiteHeader from '@/common-components/site-header/site-header.vue';
import SiteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import VehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import SiteFooter from '@/iss-components/site-footer/site-footer.vue';
import SiteHeader from '@/iss-components/site-header/site-header.vue';
import SiteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import VehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
import VinLookupMethods from './vin-lookup-methods/vin-lookup-methods.vue';
export default {

2
src/layouts/vehicle-lookup/vin-lookup-methods/vin-lookup-methods.vue
View file

@ -18,7 +18,7 @@ import { required } from '@/helpers/validation-rules';
import { errorMessages } from '@/constants/error-messages';
// Import Component
import ButtonQuestion from '@/common-components/button-question/button-question.vue';
import ButtonQuestion from '@/digital-components/button-question/button-question.vue';
// Define Validation Rules
defineRule('option-required', required(errorMessages.OPTION_REQUIRED));

2
src/layouts/vehicle-make/make-question/make-question.vue
View file

@ -13,7 +13,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { useMainStore } from '@/store';
export default {

8
src/layouts/vehicle-make/vehicle-make.vue
View file

@ -27,10 +27,10 @@
<script>
// Components
import makeQuestion from "@/layouts/vehicle-make/make-question/make-question";
import siteHeader from "@/common-components/site-header/site-header";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteFooter from "@/common-components/site-footer/site-footer";
import siteHeader from "@/iss-components/site-header/site-header";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import siteFooter from "@/iss-components/site-footer/site-footer";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

2
src/layouts/vehicle-model/model-question/model-question.vue
View file

@ -13,7 +13,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { useMainStore } from '@/store';
export default {

8
src/layouts/vehicle-model/vehicle-model.vue
View file

@ -23,10 +23,10 @@
<script>
// Components
import modelQuestion from "@/layouts/vehicle-model/model-question/model-question";
import siteHeader from "@/common-components/site-header/site-header";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteFooter from "@/common-components/site-footer/site-footer";
import siteHeader from "@/iss-components/site-header/site-header";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import siteFooter from "@/iss-components/site-footer/site-footer";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

2
src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue
View file

@ -37,7 +37,7 @@
<script>
// Components
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
// Supporting files
import { getTintImage } from "@/constants/tint-mapper";

8
src/layouts/vehicle-parts/vehicle-parts.vue
View file

@ -45,10 +45,10 @@
<script>
// Components
import glassPartQuestion from "@/layouts/vehicle-parts/glass-part-question/glass-part-question";
import siteHeader from "@/common-components/site-header/site-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import siteFooter from "@/common-components/site-footer/site-footer";
import siteHeader from "@/iss-components/site-header/site-header";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import siteFooter from "@/iss-components/site-footer/site-footer";
import alert from "@/ux-components/alert/alert";
// Supporting Files

2
src/layouts/vehicle-style/style-question/style-question.vue
View file

@ -12,7 +12,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { useMainStore } from '@/store';
export default {

8
src/layouts/vehicle-style/vehicle-style.vue
View file

@ -25,10 +25,10 @@
<script>
// Components
import styleQuestion from "@/layouts/vehicle-style/style-question/style-question";
import siteHeader from "@/common-components/site-header/site-header";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteFooter from "@/common-components/site-footer/site-footer";
import siteHeader from "@/iss-components/site-header/site-header";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
import siteFooter from "@/iss-components/site-footer/site-footer";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

8
src/layouts/vehicle-year/vehicle-year.vue
View file

@ -23,10 +23,10 @@
<script>
// Components
import yearQuestion from "@/layouts/vehicle-year/year-question/year-question";
import siteHeader from "@/common-components/site-header/site-header";
import siteFooter from "@/common-components/site-footer/site-footer";
import siteSubHeader from "@/common-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
import siteHeader from "@/iss-components/site-header/site-header";
import siteFooter from "@/iss-components/site-footer/site-footer";
import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

2
src/layouts/vehicle-year/year-question/year-question.vue
View file

@ -13,7 +13,7 @@
</template>
<script>
import buttonQuestion from "@/common-components/button-question/button-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import { useMainStore } from '@/store';
export default {

8
src/layouts/vin-lookup/vin-lookup.vue
View file

@ -51,10 +51,10 @@ import { useMainStore } from '@/store';
import baseFormMixin from '@/mixins/base-form-mixin';
import vehicleQuestionsMixin from '@/mixins/vehicle-questions-mixin';
import { Form } from 'vee-validate';
import siteFooter from '@/common-components/site-footer/site-footer.vue';
import siteHeader from '@/common-components/site-header/site-header.vue';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
import vinLocationInformation from './vin-location-information/vin-location-information.vue';
import vinLookupAlerts from './vin-lookup-alerts/vin-lookup-alerts.vue';
import vinQuestion from './vin-question/vin-question.vue';

2
src/layouts/vin-lookup/vin-question/vin-question.vue
View file

@ -17,7 +17,7 @@ import { regex, required } from '@/helpers/validation-rules';
import { errorMessages } from '@/constants/error-messages';
// Import Component(s)
import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
import textboxQuestion from '@/digital-components/textbox-question/textbox-question.vue';
defineRule('vin-required', required(errorMessages.VIN_REQUIRED));
defineRule('vin-format', regex(/^[a-hA-Hj-nJ-NpPr-zR-Z0-9]{17}$/, errorMessages.VIN_FORMAT));

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

@ -132,13 +132,13 @@
<script>
// Components
import siteHeader from '@/common-components/site-header/site-header';
import siteSubHeader from '@/common-components/site-sub-header/site-sub-header';
import siteFooter from "@/common-components/site-footer/site-footer";
import textboxQuestion from "@/common-components/textbox-question/textbox-question";
import buttonQuestion from "@/common-components/button-question/button-question";
import dropdownQuestion from "@/common-components/dropdown-question/dropdown-question";
import textBlock from "@/common-components/text-block/text-block";
import siteHeader from '@/iss-components/site-header/site-header';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header';
import siteFooter from "@/iss-components/site-footer/site-footer";
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
import buttonQuestion from "@/digital-components/button-question/button-question";
import dropdownQuestion from "@/digital-components/dropdown-question/dropdown-question";
import textBlock from "@/digital-components/text-block/text-block";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

2
src/mixins/input-button-wrapper-mixin.js
View file

@ -1,4 +1,4 @@
import { inputButtonProps } from "@/common-components/base-input-button/button-functionality-props";
import { inputButtonProps } from "@/digital-components/base-input-button/button-functionality-props";
export default {
model: {

3
src/router/router-constants/navigation-scenarios.js
View file

@ -11,6 +11,9 @@ const navigationScenarios = {
CLICKED_FORWARD_WELCOME_PAGE: "CLICKED_FORWARD_WELCOME_PAGE",
CLICKED_FORWARD_POLICY_HOLDER_DETAILS: "CLICKED_FORWARD_POLICY_HOLDER_DETAILS",
// Vehicle Damage
CLICKED_FORWARD_WITH_REPAIR: 'CLICKED_FORWARD_WITH_REPAIR',
// Vin selection
CLICKED_BACK_WITH_VIN: "CLICKED_BACK_WITH_VIN",
CLICKED_FORWARD_WITH_VIN: "CLICKED_FORWARD_WITH_VIN",

30
src/router/router-constants/routing-table.js
View file

@ -63,6 +63,10 @@ const routingTable = function(store) {
scenario: navigationScenarios.CLICKED_BACK,
destinationIssPageValue: issPageValues.VEHICLE_STYLE,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_REPAIR,
destinationIssPageValue: issPageValues.COVERAGE_STATEMENT,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_VIN,
destinationIssPageValue: issPageValues.VEHICLE_LOOKUP,
@ -133,7 +137,31 @@ const routingTable = function(store) {
{
scenario: navigationScenarios.CLICKED_BACK,
destinationIssPageValue: issPageValues.VEHICLE_LOOKUP,
},
},
{
scenario: navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS,
destinationIssPageValue: issPageValues.VEHICLE_DAMAGE,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_NO_MORE_QUESTIONS,
destinationIssPageValue: issPageValues.COVERAGE_STATEMENT,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_PART_QUESTIONS,
destinationIssPageValue: issPageValues.PART_QUESTIONS,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_MULTIPLE_PARTS_TO_CHOOSE,
destinationIssPageValue: issPageValues.VEHICLE_PARTS,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_MOLDING_QUESTIONS,
destinationIssPageValue: issPageValues.MOLDING_QUESTIONS,
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_CAPABILITY_QUESTIONS,
destinationIssPageValue: issPageValues.CAPABILITY_QUESTIONS,
},
],
},
{

26
src/store/index.js
View file

@ -299,14 +299,14 @@ export const useMainStore = defineStore({
});
},
async lookupVinByPlate(licensePlate) {
async lookupVinByPlate(licensePlate, licenseState) {
try {
const response = await globalMethods.callHttpClient({
method: endpoints.LookupVinByPlate.method,
endpoint: endpoints.LookupVinByPlate.url,
payload: {
licensePlate: licensePlate,
licenseState: "IL", // hard coded until Welcome Page is complete and license state can be pulled from store
licenseState: licenseState,
},
});
@ -895,6 +895,28 @@ export const useMainStore = defineStore({
}
},
saveRegistrationLicensePlateLookup({ isSelectedGlassAvailableForVehicle, vehicleInfo, registrationInfo }) {
//Reset dependent state when changing
if
(
registrationInfo?.licensePlate !== this.order.vehicle.registration?.licensePlate ||
registrationInfo?.state !== this.order.vehicle.registration?.state ||
registrationInfo?.zipCode !== this.order.vehicle.registration?.zipCode
)
{
this.resetRegistrationAndDependencies();
if (!isSelectedGlassAvailableForVehicle) {
this.resetDamageAndDependencies();
this.resetPartsAndDependencies();
}
//Save new values
this.updateVehicle(vehicleInfo);
this.updateRegistration(registrationInfo);
}
},
resetRegistrationAndDependencies() {
this.resetRegistrationState();
this.resetGlassPartsState();

2
src/ux-components/list-button-horizontal/list-button-horizontal.vue
View file

@ -22,7 +22,7 @@
</template>
<script>
import baseInputButton from "@/common-components/base-input-button/base-input-button";
import baseInputButton from "@/digital-components/base-input-button/base-input-button";
import inputButtonWrapperMixin from "@/mixins/input-button-wrapper-mixin";
export default {

2
src/ux-components/list-button/list-button.vue
View file

@ -24,7 +24,7 @@
<script>
import loader from "@/ux-components/loader/loader";
import baseInputButton from "@/common-components/base-input-button/base-input-button";
import baseInputButton from "@/digital-components/base-input-button/base-input-button";
import inputButtonWrapperMixin from "@/mixins/input-button-wrapper-mixin";
export default {

2
src/ux-components/list-card/list-card.vue
View file

@ -31,7 +31,7 @@
</template>
<script>
import baseInputButton from "@/common-components/base-input-button/base-input-button";
import baseInputButton from "@/digital-components/base-input-button/base-input-button";
import inputButtonWrapperMixin from "@/mixins/input-button-wrapper-mixin";
export default {