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

INSR-7774: Added no vin option to vehicle lookup, and some style changes

Browse source
This commit is contained in:
Alex Humphries 2026-02-05 10:05:59 -05:00
parent 1873a955be
commit 345f338f1a
4 changed files with 86 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/constants/vin-lookup-methods.js
View file

@ -1,7 +1,8 @@
const vinLookupMethodSelections = Object.freeze({
MANUALVIN: 'ManualVin',
LICENSEPLATE: 'LicensePlate',
HOMEADDRESS: 'HomeAddress'
HOMEADDRESS: 'HomeAddress',
NOVIN: 'NoVin'
});
export default vinLookupMethodSelections;

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

@ -10,8 +10,8 @@
<div class="vehicle-lookup-container iss-heritage-content-container-width">
<SiteSubHeader
cmsWidgetName="SiteSubHeaderWidget"
class="mt-4"
subHeaderMarginClasses="mt-1" />
class="subheader mt-4"
subHeaderMarginClasses="mt-4" />
<VinLookupMethods
ref="VinLookupMethods"
v-model="selectedVinLookupMethod"
@ -23,6 +23,9 @@
class="mt-5"
@backClicked="navigateBack"
@forwardClicked="forwardButtonAction" />
<TextBlock
cmsWidgetName="SecurityTextWidget"
class="security-text" />
</div>
</div>
</div>
@ -35,6 +38,7 @@ import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import settleAllPromises from '@/helpers/layout-helper';
import { Form } from 'vee-validate';
import BaseFormMixin from '@/mixins/base-form-mixin';
import vehicleQuestionsMixin from '@/mixins/vehicle-questions-mixin';
import vinLookupMethodSelections from '@/constants/vin-lookup-methods';
// Import Component
@ -42,6 +46,7 @@ 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 VinLookupMethods from '@/layouts/vehicle-lookup/vin-lookup-methods/vin-lookup-methods.vue';
import TextBlock from '@/digital-components/text-block/text-block.vue';
export default {
name: 'vehicle-lookup',
@ -51,9 +56,10 @@ export default {
SiteFooter,
siteHeader,
SiteSubHeader,
VinLookupMethods
VinLookupMethods,
TextBlock
},
mixins: [BaseFormMixin],
mixins: [BaseFormMixin, vehicleQuestionsMixin],
async beforeRouteEnter(to, from, next) {
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
@ -86,7 +92,7 @@ export default {
arePagePrerequisiteValid() {
return true;
},
forwardButtonAction() {
async forwardButtonAction() {
switch (this.selectedVinLookupMethod) {
case vinLookupMethodSelections.MANUALVIN:
this.$router.navigate(
@ -106,6 +112,24 @@ export default {
this.$route
);
break;
case vinLookupMethodSelections.NOVIN:
const partsOrQuestionsResponse = await this.getPartsOrQuestions();
if (partsOrQuestionsResponse.error) {
this.mainStore.setBailout(bailoutMessage.PartsServiceError(partsOrQuestionsResponse.error.data));
window.console.error('Error on retrieving PartsOrQuestions');
this.hasBailedOut = true;
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
this.$route
);
}
else {
await this.navigateForward(
partsOrQuestionsResponse.data.partsOrQuestions,
this
);
}
break;
default:
break;
}
@ -124,5 +148,23 @@ export default {
padding-right: .9375rem;
}
}
.subheader {
:deep(.all-caps) {
text-transform: uppercase;
}
:deep(.subheader-secondary>p) {
margin-bottom: 0;
}
}
.security-text {
text-align: center;
margin-bottom: 1.5rem;
:deep(a) {
font-weight: $font-weight-normal;
color: $heritage-blue-primary;
&:hover {
color: #125b7e;
}
}
}
</style>

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

@ -1,11 +1,11 @@
<template>
<ButtonQuestion
class="vin-lookup-methods-question"
v-model="selectedValue"
:answers="answersFromCms"
groupName="VinLookupMethodsOption"
buttonTypeString="listButton"
:questionText="questionTextFromCms"
:questionTextClasses="['text-center']"
isRequired
:validationRules="rules.optionRequired"
data-test-id="vin-lookup-methods-button-question" />
@ -83,3 +83,18 @@ export default {
}
};
</script>
<style lang="scss" scoped>
.vin-lookup-methods-question {
:deep(.question-text) {
font-weight: 600;
margin-bottom: 0.5rem;
}
:deep(.list-button) {
.list-button-content,
input[type="radio"]:checked + .list-button-content {
color: $black;
font-weight: $font-weight-semibold;
}
}
}
</style>

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

@ -80,6 +80,26 @@ const routingTable = () => [
{
scenario: navigationScenarios.SELECTED_HOME_ADDRESS,
destinationIssPageValue: issPageValues.ADDRESS_LOOKUP
},
{
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
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_NO_MORE_QUESTIONS,
destinationIssPageValue: issPageValues.COVERAGE_STATEMENT
}
]
},