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

Merge branch 'develop' into feature/digital/SSR-179

Browse source
This commit is contained in:
Kroell 2023-01-20 14:30:45 -05:00
commit d6ea4e8418
10 changed files with 163 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/common-components/site-footer/site-footer.vue
View file

@ -6,8 +6,9 @@
</div>
<footer class="footer container-fluid fixed-bottom g-5 bg-light py-4" id="infoBox">
<div class="row d-flex flex-row-reverse align-items-center vw-100">
<div class="col button-col d-flex" id="stacked">
<div class="col button-col d-flex" id="stacked" >
<buttonMain
v-if="!isForwardButtonHidden"
ref="buttonMain"
isPrimary
:buttonText="buttonText"
@ -45,6 +46,7 @@ export default {
props: {
isForwardActionDisabled: Boolean,
isBackButtonHidden: { type: Boolean, default: false },
isForwardButtonHidden: { type: Boolean, default: false },
cmsWidgetName: String,
},
components: {

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,
);
});
});

65
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>
@ -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() {

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

@ -17,6 +17,8 @@
cmsWidgetName="VehicleMakeQuestion"
/>
</div>
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
@back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>
</div>
@ -28,6 +30,7 @@
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";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
@ -38,6 +41,7 @@
data() {
return {
selectedMake: null,
shouldHideForwardButton: true
};
},
@ -87,6 +91,7 @@
siteHeader,
siteSubHeader,
vehicleBanner,
siteFooter
},
watch: {
selectedMake(make) {

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

@ -13,6 +13,8 @@
<div class="fade-on-route-transition">
<modelQuestion v-model="selectedModel" ref="modelQuestion" cmsWidgetName="VehicleModelQuestion" />
</div>
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
@back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>
</div>
@ -24,6 +26,7 @@
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";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
@ -34,6 +37,7 @@
data() {
return {
selectedModel: null,
shouldHideForwardButton: true
};
},
async beforeRouteEnter(to, from, next) {
@ -81,7 +85,12 @@
return false;
},
},
computed: {
backButtonAccessibleText()
{
return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText")
}
},
watch: {
selectedModel(model) {
this.mainStore.updateVehicleModel( model );
@ -91,19 +100,12 @@
);
},
},
components: {
modelQuestion,
siteHeader,
siteSubHeader,
vehicleBanner,
},
computed: {
backButtonAccessibleText()
{
return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText")
}
siteFooter
},
};
</script>

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

@ -15,6 +15,8 @@
ref="styleQuestion"
cmsWidgetName="VehicleStyleQuestion" />
</div>
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
@back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>
</div>
@ -26,6 +28,7 @@ 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";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
@ -40,6 +43,7 @@ export default {
data() {
return {
selectedStyle: null,
shouldHideForwardButton: true
};
},
@ -109,6 +113,7 @@ export default {
siteHeader,
siteSubHeader,
vehicleBanner,
siteFooter
},
computed: {

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

@ -13,6 +13,8 @@
cmsWidgetName="VehicleYearQuestion"
/>
</div>
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
@back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>
</div>
@ -22,6 +24,7 @@
// 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";
@ -34,6 +37,7 @@
data() {
return {
selectedYear: null,
shouldHideForwardButton: true
};
},
computed: {},
@ -81,6 +85,9 @@
arePagePrerequisitesValid() {
return true;
},
backButtonAction() {
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
},
},
components: {
@ -88,6 +95,7 @@
siteHeader,
siteSubHeader,
vehicleBanner,
siteFooter
},
};
</script>

2
src/router/index.js
View file

@ -22,7 +22,7 @@ const routes = [
name: 'root',
async beforeEnter(to, from, next) {
try {
to.query.issPage = !to.query.issPage ? issPageValues.VEHICLE_YEAR : to.query.issPage;
to.query.issPage = !to.query.issPage ? issPageValues.WELCOME_PAGE : to.query.issPage;
if (analyticsMixin.methods.noSession()) {
await analyticsMixin.methods.initSession();

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",

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

@ -9,7 +9,7 @@ const routingTable = function(store) {
maps: [
{
scenario: navigationScenarios.CLICKED_BACK,
destinationIssPageValue: issPageValues.WELCOME_PAGE
destinationIssPageValue: issPageValues.POLICY_HOLDER_DETAILS
},
{
scenario: navigationScenarios.SELECTED_YEAR,
@ -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,