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

SSR-313

Browse source
This commit is contained in:
David Back 2023-04-06 14:04:44 -04:00
parent af78d9b4e1
commit 3e9aa4d7fd
10 changed files with 243 additions and 147 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/constants/endpoints.js
View file

@ -39,6 +39,10 @@ const endpoints = {
url: "/parts/api/v1/parts/parts", url: "/parts/api/v1/parts/parts",
method: "POST", method: "POST",
}, },
GetPriceOrderItems: {
url: '/price/api/v1/price/order-items',
method: 'GET'
},
GetCapabilityQuestions: { GetCapabilityQuestions: {
url: "/parts/api/v1/parts/capability-questions", url: "/parts/api/v1/parts/capability-questions",
method: "GET", method: "GET",

23
src/helpers/cms-content-helper.js
View file

@ -26,7 +26,8 @@ export function fetchCmsContentForPage(issPage) {
// Process the client override if it exists. // Process the client override if it exists.
return processPageData(baseResponse, clientResponse); return processPageData(baseResponse, clientResponse);
}, },
(error) => { (error) => {
console.error(error);
// Process the just the base if no client override exists. // Process the just the base if no client override exists.
return processPageData(baseResponse, null); return processPageData(baseResponse, null);
} }
@ -42,10 +43,13 @@ export function fetchCmsContentForPage(issPage) {
// clientResponse = contains the widgets from the client override page. (null if none) // clientResponse = contains the widgets from the client override page. (null if none)
function processPageData(baseResponse, clientResponse) { function processPageData(baseResponse, clientResponse) {
const pageDataFromCms = {}; const pageDataFromCms = {};
let widgets = []; let widgets = [];
if ( clientResponse === null ) if (!baseResponse?.data?.Result) {
{ console.error('No result data found'); // Something has gone terribly wrong.
return {}
}
if (!clientResponse?.data?.Result) {
widgets = baseResponse.data.Result; widgets = baseResponse.data.Result;
} }
else else
@ -243,7 +247,10 @@ export function processIfStatements(str, ifConditionKeyword, replacePlaceholderC
const containsRelevantIfStatement = new RegExp('{if:' + ifConditionKeyword + ':.+?}', 'g').test( const containsRelevantIfStatement = new RegExp('{if:' + ifConditionKeyword + ':.+?}', 'g').test(
str str
); );
if (!containsRelevantIfStatement) { //str = str.replace(/\r?\n|\r/g, '');
const hasEmbeddedCrLf = /\r?\n|\r/g.test(str);
if (!containsRelevantIfStatement || hasEmbeddedCrLf) {
return str; return str;
} else { } else {
const ifStatementRegexExpression = getIfStatementRegexExpression(); const ifStatementRegexExpression = getIfStatementRegexExpression();
@ -297,6 +304,8 @@ function getAndFlagFirstNonNestedIfStatementWithKeyword(matches, ifConditionKeyw
} }
index++; index++;
} }
console.error('Did not find end in conditional logic');
return matches;
} }
function flagMatchesForProcessing(matches, elseStatementIndex) { function flagMatchesForProcessing(matches, elseStatementIndex) {
@ -395,6 +404,10 @@ function getIfStatementRegexExpression() {
// End of If Statement Processing Logic // // End of If Statement Processing Logic //
////////////////////////////////////////// //////////////////////////////////////////
export function doesCopyContainTextLink(copy) {
return copy.includes(dynamicStrings.TEXT_LINK);
}
export function doesCopyContainRouterLink(copy) { export function doesCopyContainRouterLink(copy) {
return copy.includes(this.dynamicStrings.ROUTER_LINK); return copy.includes(this.dynamicStrings.ROUTER_LINK);
} }

2
src/iss-components/site-footer/site-footer.vue
View file

@ -3,7 +3,7 @@
<img id="siteFooterImage" :src="footerImageURL" /> <img id="siteFooterImage" :src="footerImageURL" />
</div> </div>
<footer class="footer container-fluid fixed-bottom g-5 bg-light py-4" id="infoBox"> <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="row d-flex flex-row-reverse align-items-center vw-100 mx-0">
<div class="col button-col d-flex" id="stacked" > <div class="col button-col d-flex" id="stacked" >
<buttonMain <buttonMain
v-if="!isForwardButtonHidden" v-if="!isForwardButtonHidden"

63
src/iss-components/site-sub-header/site-sub-header.vue
View file

@ -12,8 +12,8 @@
/> />
</h5> </h5>
</div> </div>
<div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden"> <div class="d-flex align-items-center container-fluid overflow-hidden" :class="justifySubheader">
<p class="text-center small fw-normal mb-0 subheader-secondary"> <p class="text-center fw-normal mb-0 subheader-secondary" :class="alternateFormatting">
<span> <span>
{{ subText }} {{ subText }}
</span> </span>
@ -31,23 +31,33 @@ import buttonBack from "@/iss-components/site-sub-header/button-back/button-back
props: { props: {
cmsWidgetName: String, cmsWidgetName: String,
hasBackButton: Boolean, hasBackButton: Boolean,
justification: String,
issContainingPage: String
}, },
computed: { computed: {
content() content() {
{
return this.getCmsContent(this.cmsWidgetName, "SubHeaderText") return this.getCmsContent(this.cmsWidgetName, "SubHeaderText")
}, },
subText() subText() {
{
return this.getCmsContent(this.cmsWidgetName, "SecondaryText") return this.getCmsContent(this.cmsWidgetName, "SecondaryText")
}, },
backButtonAccessibleText() backButtonAccessibleText() {
{ return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText")
return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText")
}, },
headerColor() { headerColor() {
return this.subText ? "dark-header" : "light-header"; return this.subText ? "dark-header" : "light-header";
}, },
justifySubheader() {
console.log('-->' + (this.justification.toLowerCase() === 'left'));
return (this.justification?.toLowerCase() === 'left') ?
'justify-content-left' :
'justify-content-center';
},
alternateFormatting() {
return (this.issContainingPage === 'service-packages') ?
'service-packages-subtext mt-4 mb-2 px-5' :
'small';
}
}, },
methods: { methods: {
clickEvent() { clickEvent() {
@ -60,22 +70,27 @@ import buttonBack from "@/iss-components/site-sub-header/button-back/button-back
<style lang="scss" scoped> <style lang="scss" scoped>
.dark-header { .dark-header {
color: $black; color: $black;
} }
.light-header { .light-header {
color: $gray-550; color: $gray-550;
} }
h5 { h5 {
line-height: 32px; line-height: 32px;
button {
color: inherit;
}
}
p.small {
color: $gray-550;
}
p.service-packages-subtext {
font-weight: 500 !important;
line-height: 24px;
}
button {
color: inherit;
}
}
p.small {
color: $gray-550;
}
</style> </style>

61
src/layouts/service-packages/service-package-question/service-package-question.vue
View file

@ -10,22 +10,22 @@
</template> </template>
<script> <script>
import buttonQuestion from '@/digital-components/button-question/button-question'; import buttonQuestion from '@/digital-components/button-question/button-question';
import baseMixin from '@/mixins/base-mixin.js'; import baseMixin from '@/mixins/base-mixin.js';
import { processIfStatements } from '@/helpers/cms-content-helper'; import { processIfStatements } from '@/helpers/cms-content-helper';
import { damageLocationsSelected as glassLocations } from '@/constants/damage-locations-selected'; import { damageLocationsSelected as glassLocations } from '@/constants/damage-locations-selected';
import servicePackageRadio from './service-package-radio/service-package-radio'; import servicePackageRadio from './service-package-radio/service-package-radio';
import { partTypeStrings } from '@/constants/part-type-strings'; import { partTypeStrings } from '@/constants/part-type-strings';
import { useMainStore } from '@/store'; import { useMainStore } from '@/store';
const packageNames = { const packageNames = {
TIER_ONE: 'TierOne', TIER_ONE: 'TierOne',
TIER_TWO: 'TierTwo', TIER_TWO: 'TierTwo',
TIER_THREE: 'TierThree' TIER_THREE: 'TierThree',
}; };
export default { export default {
name: 'servicePackageQuestion', name: 'servicePackageQuestion',
props: { props: {
cmsWidgetName: String, cmsWidgetName: String,
groupName: String, groupName: String,
validationRules: String, validationRules: String,
@ -71,29 +71,26 @@
} }
]; ];
//This isn't mainly about header text, header text is just the canary in the coal mine
//Vue will often hit this code twice during a pageload. The first time without
//having yet loaded cms content- and so this just skips that first time
if (this.getCmsContent(cmsAnswersContent[0].cmsWidgetName, 'HeaderText') == '') { if (this.getCmsContent(cmsAnswersContent[0].cmsWidgetName, 'HeaderText') == '') {
return {}; return {};
} }
console.log(this.getCmsContent(this.cmsWidgetName, 'HeaderText'));
const modifiedAnswers = cmsAnswersContent.map((answer) => ({ const modifiedAnswers = cmsAnswersContent.map((answer) => ({
value: answer.Name, value: answer.Name,
buttonLabel: this.getHeaderTextFromCms(this.cmsWidgetName), buttonLabel: this.getHeaderTextFromCms(answer.cmsWidgetName),
buttonLabelSubCopy: this.getSubheaderTextFromCms(this.cmsWidgetName), buttonLabelSubCopy: this.getSubheaderTextFromCms(answer.cmsWidgetName),
buttonBodyCopy: this.getBodyTextFromCms(this.cmsWidgetName), buttonBodyCopy: this.getBodyTextFromCms(answer.cmsWidgetName),
buttonAuxiliaryCopy: 'Aux Copy', //his.getPackagePriceString(answer.Name), buttonAuxiliaryCopy: 'TODO', //this.getPackagePriceString(answer.Name),
buttonFooterCopy: this.getFooterTextFromCms(this.cmsWidgetName) buttonFooterCopy: this.getFooterTextFromCms(answer.cmsWidgetName)
})); }
));
return modifiedAnswers; return modifiedAnswers;
}, },
frontWipersApplicableForTierTwo() { frontWipersApplicableForTierTwo() {
const store = useMainStore();
const frontWipersAreAvailable = this.lineItemsContainsPartType( const frontWipersAreAvailable = this.lineItemsContainsPartType(
partTypeStrings.FRONT_WIPER partTypeStrings.FRONT_WIPER
); );
const isRepair = this.$store.order.damage.isRepair; const isRepair = store.order.damage.isRepair;
const glassToReplaceContainsWindshield = this.glassToReplaceContainsGlassLocation( const glassToReplaceContainsWindshield = this.glassToReplaceContainsGlassLocation(
glassLocations.WINDSHIELD glassLocations.WINDSHIELD
); );
@ -119,16 +116,12 @@
); );
}, },
frontWipersApplicableForTierThree() { frontWipersApplicableForTierThree() {
const frontWipersAreAvailable = this.lineItemsContainsPartType( const frontWipersAreAvailable = this.lineItemsContainsPartType(partTypeStrings.FRONT_WIPER);
partTypeStrings.FRONT_WIPER
);
return frontWipersAreAvailable; return frontWipersAreAvailable;
}, },
rearWiperApplicableForTierThree() { rearWiperApplicableForTierThree() {
const rearWiperIsAvailable = this.lineItemsContainsPartType(partTypeStrings.REAR_WIPER); const rearWiperIsAvailable = this.lineItemsContainsPartType(partTypeStrings.REAR_WIPER);
const frontWipersAreAvailable = this.lineItemsContainsPartType( const frontWipersAreAvailable = this.lineItemsContainsPartType(partTypeStrings.FRONT_WIPER);
partTypeStrings.FRONT_WIPER
);
return ( return (
rearWiperIsAvailable && rearWiperIsAvailable &&
(this.glassToReplaceContainsGlassLocation(glassLocations.REAR) || (this.glassToReplaceContainsGlassLocation(glassLocations.REAR) ||
@ -186,7 +179,7 @@
getTierTwoPackageVapsPrice() { getTierTwoPackageVapsPrice() {
let vapsPrice = 0; let vapsPrice = 0;
const priceFrontWipers = this.frontWipersApplicableForTierTwo; const priceFrontWipers = this.frontWipersApplicableForTierTwo;
const priceRearWipers = this.rearWiperApplicableForTierTwo; const priceRearWipers = this.rearWiperApplicableForTierTwo;
this.nullSafeAvailableLineItems.forEach((item) => { this.nullSafeAvailableLineItems.forEach((item) => {
if ( if (
(priceFrontWipers && (priceFrontWipers &&
@ -201,7 +194,7 @@
getTierThreePackageVapsPrice() { getTierThreePackageVapsPrice() {
let vapsPrice = 0; let vapsPrice = 0;
const priceFrontWipers = this.frontWipersApplicableForTierThree; const priceFrontWipers = this.frontWipersApplicableForTierThree;
const priceRearWipers = this.rearWiperApplicableForTierThree; const priceRearWipers = this.rearWiperApplicableForTierThree;
const priceRainDefense = this.rainDefenseApplicableForTierThree; const priceRainDefense = this.rainDefenseApplicableForTierThree;
this.nullSafeAvailableLineItems.forEach((item) => { this.nullSafeAvailableLineItems.forEach((item) => {
if ( if (
@ -218,8 +211,9 @@
return vapsPrice; return vapsPrice;
}, },
selectDefaultPackage() { selectDefaultPackage() {
const vapsFromStore = this.$store.lineItems.vaps; const store = useMainStore();
let lowestTierForPackage = packageNames.TIER_ONE; const vapsFromStore = store.lineItems.vaps;
let lowestTierForPackage = packageNames.TIER_ONE;
if (vapsFromStore?.length > 0) { if (vapsFromStore?.length > 0) {
vapsFromStore.every((vapsItem) => { vapsFromStore.every((vapsItem) => {
let lowestTierForThisItem = this.getLowestTierForThisItem(vapsItem); let lowestTierForThisItem = this.getLowestTierForThisItem(vapsItem);
@ -348,8 +342,9 @@
return !!partTypeMatches.length; return !!partTypeMatches.length;
}, },
glassToReplaceContainsGlassLocation(glassLocation) { glassToReplaceContainsGlassLocation(glassLocation) {
const store = useMainStore();
const glassLocationMatches = const glassLocationMatches =
this.$store.order.damage.glassToReplace?.filter( store.order.damage.glassToReplace?.filter(
(glassToReplace) => glassToReplace.glassLocation === glassLocation (glassToReplace) => glassToReplace.glassLocation === glassLocation
) ?? []; ) ?? [];
return !!glassLocationMatches.length; return !!glassLocationMatches.length;

50
src/layouts/service-packages/service-package-question/service-package-radio/service-package-radio.vue
View file

@ -1,9 +1,9 @@
<template> <template>
<baseInputButton v-bind="$props" @buttonClicked="handleAnswerChange" v-model="selectedValue"> <baseInputButton v-bind="$props" @buttonClicked="handleAnswerChange" v-model="selectedValue">
<div class="package-label" <div class="package-label mb-4"
:class="[this.buttonLabelSubCopy ? 'has-subheader' : '']" :class="[this.buttonLabelSubCopy ? 'has-subheader' : '']"
for="testradio"> for="testradio">
<div class="package-specs" style="max-height:1000px;"> <div class="package-specs">
<p class="m-0"> <p class="m-0">
<span v-html="this.buttonLabel"></span> <span v-html="this.buttonLabel"></span>
<span class="pricing-info" v-html="this.buttonAuxiliaryCopy"></span> <span class="pricing-info" v-html="this.buttonAuxiliaryCopy"></span>
@ -11,10 +11,9 @@
<p class="sub-label m-0" <p class="sub-label m-0"
v-if="this.buttonLabelSubCopy" v-if="this.buttonLabelSubCopy"
v-html="this.buttonLabelSubCopy"></p> v-html="this.buttonLabelSubCopy"></p>
<div class="hide-when-closed" style="display: block;"> <div>
<!-- Parse the body text containing <ul> with logic --> <ul >
<ul> <li v-for="listItem in this.arrayOfListItemsFromBodyText" :key="listItem" class="mb-0">
<li v-for="listItem in this.arrayOfListItemsFromBodyText" :key="listItem">
<!-- no textLink --> <!-- no textLink -->
<span v-if="!doesCopyContainTextLink(listItem)" <span v-if="!doesCopyContainTextLink(listItem)"
v-html="listItem"></span> v-html="listItem"></span>
@ -40,7 +39,8 @@
</li> </li>
</ul> </ul>
<!-- End of body text parsing --> <!-- End of body text parsing -->
<div class="package-footer fw-bold caption ms-n6" <!--ms-n6-->
<div class="package-footer fw-bold caption mt-4 ml-n4 mr-3"
v-if="this.buttonFooterCopy" v-if="this.buttonFooterCopy"
v-html="this.buttonFooterCopy"></div> v-html="this.buttonFooterCopy"></div>
</div> </div>
@ -50,8 +50,8 @@
</template> </template>
<script> <script>
import baseInputButton from '@/digital-components/base-input-button/base-input-button'; import baseInputButton from '@/digital-components/base-input-button/base-input-button';
import textLink from '@/ux-components/text-link/text-link'; import textLink from '@/ux-components/text-link/text-link';
import inputButtonWrapperMixin from '@/mixins/input-button-wrapper-mixin'; import inputButtonWrapperMixin from '@/mixins/input-button-wrapper-mixin';
import { import {
getRouterLinkDisplayTextFromCopy, getRouterLinkDisplayTextFromCopy,
@ -64,12 +64,12 @@ export default {
mixins: [inputButtonWrapperMixin], mixins: [inputButtonWrapperMixin],
components: { components: {
baseInputButton, baseInputButton,
textLink textLink,
}, },
computed: { computed: {
arrayOfListItemsFromBodyText() { arrayOfListItemsFromBodyText() {
return this.getArrayOfListItemsFromRawCmsCopy(this.buttonBodyCopy); return this.getArrayOfListItemsFromRawCmsCopy(this.buttonBodyCopy);
} },
}, },
methods: { methods: {
getRouterLinkDisplayTextFromCopy, getRouterLinkDisplayTextFromCopy,
@ -77,24 +77,26 @@ export default {
splitCopyOnCMSPlaceHolder, splitCopyOnCMSPlaceHolder,
doesCopyContainTextLink, doesCopyContainTextLink,
stripUlTagFromCopy(copy) { stripUlTagFromCopy(copy) {
if (copy) { return copy;
const regex = /(?:<ul(?:.*?)>)|(?:<\/ul>)/g;
return copy.replace(regex, '');
}
}, },
getArrayOfListItemsFromRawCmsCopy(copy) { getArrayOfListItemsFromRawCmsCopy(copy) {
if (copy) { if (copy) {
const withoutUlTags = this.stripUlTagFromCopy(copy); return copy
return withoutUlTags .split('- ') //At some point we'll want a better delimiter
.split(/(?:<li(?:.*?)>)|(?:<\/li>)/g) .filter((lineItem) => lineItem);
.filter((lineItem) => lineItem);
} }
} }
} },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.ml-n4 {
margin-left: -$spacer * 2;
}
.mr-3 {
margin-right: $spacer * 1.5;
}
.package-main { .package-main {
.package-wrapper { .package-wrapper {
margin: 0.5rem 0; margin: 0.5rem 0;
@ -209,7 +211,7 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
max-height: 0; max-height: 1000px;
transition: all 0.5s ease; transition: all 0.5s ease;
p { p {
@ -232,7 +234,7 @@ export default {
} }
ul { ul {
margin: 1rem 0 0 -15px; margin: 1rem 0 0 -.6rem;
padding: 0; padding: 0;
li { li {
@ -257,10 +259,6 @@ export default {
opacity: 0; opacity: 0;
} }
} }
.hide-when-closed {
display: none;
}
} }
} }
} }

83
src/layouts/service-packages/service-packages.vue
View file

@ -3,7 +3,9 @@
<div class="page-container-grouped-styles"> <div class="page-container-grouped-styles">
<loadingModal ref="loadingModal" /> <loadingModal ref="loadingModal" />
<siteHeader cmsWidgetName="SiteHeaderWidget" /> <siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" /> <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"
justification="left"
issContainingPage="service-packages"/>
<div class="fade-on-route-transition sub-container make-tall"> <div class="fade-on-route-transition sub-container make-tall">
<servicePackageQuestion ref="servicePackage" <servicePackageQuestion ref="servicePackage"
cmsWidgetName="ServicePackage" cmsWidgetName="ServicePackage"
@ -16,14 +18,14 @@
<textBlock cmsWidgetName="PriceDisclaimerWidget" <textBlock cmsWidgetName="PriceDisclaimerWidget"
justifyText="left" justifyText="left"
typeStyle="caption" typeStyle="caption"
class="mt-4" /> style="margin-bottom: 6rem;"
class="mt-2 mx-6" />
<!--<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" /> <!--<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
<contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" /> <contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" />
<contentGroupModal ref="RearWiperModal" cmsWidgetName="RearWiperModal" /> <contentGroupModal ref="RearWiperModal" cmsWidgetName="RearWiperModal" />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />--> <contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />-->
<siteFooter cmsWidgetName="SiteFooterWidget" <siteFooter cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid" :isForwardActionDisabled="!meta.valid"
:isBackButtonHidden="shouldHideBackButton"
@back-clicked="backButtonAction" @back-clicked="backButtonAction"
@ForwardClicked="forwardButtonAction" /> @ForwardClicked="forwardButtonAction" />
</div> </div>
@ -33,23 +35,21 @@
<script> <script>
// Components // Components
import siteHeader from '@/iss-components/site-header/site-header'; import siteHeader from '@/iss-components/site-header/site-header';
import siteFooter from '@/iss-components/site-footer/site-footer'; import siteFooter from '@/iss-components/site-footer/site-footer';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header'; import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header';
import servicePackageQuestion from './service-package-question/service-package-question'; import servicePackageQuestion from './service-package-question/service-package-question';
import textBlock from '@/digital-components/text-block/text-block'; import textBlock from '@/digital-components/text-block/text-block';
//import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal'; import loadingModal from '@/iss-components/loading-modal/loading-modal.vue';
import loadingModal from '@/iss-components/loading-modal/loading-modal.vue';
//import vehicleQuestionsMixin from '../../mixins/vehicle-questions-mixin';
import { settleAllPromises } from '@/helpers/layout-helper'; import { settleAllPromises } from '@/helpers/layout-helper';
import { useMainStore } from "@/store"; import { useMainStore } from "@/store";
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper'; import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import { required } from '@/helpers/validation-rules'; import { required } from '@/helpers/validation-rules';
import { errorMessages } from '@/constants/error-messages'; import { errorMessages } from '@/constants/error-messages';
import { Form, defineRule } from 'vee-validate'; import { Form, defineRule } from 'vee-validate';
//import { navigateToHeritageFunnel } from '@/helpers/heritage-integration/navigation-helper';
//import { applicationConfig } from '@/constants/application-config';
defineRule('option-required', required(errorMessages.OPTION_REQUIRED)); defineRule('option-required', required(errorMessages.OPTION_REQUIRED));
export default { export default {
name: 'service-packages', name: 'service-packages',
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -58,30 +58,29 @@
// Call APIs // Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage); const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
const carId = store.order.vehicle.carId; const wipersPromise = store.getWipers();
const serviceZipCode = store.order.serviceLocation.zipCode;
const wipersPromise = store.getWipers(carId, serviceZipCode);
const rainDefensePromise = store.getRainDefense(); const rainDefensePromise = store.getRainDefense();
const supportingItemsPromise = store.getSupportingItems(); const supportingItemsPromise = store.getSupportingItems();
const promiseResultMap = [ const promiseResultMap = [
{ {
resultKey: 'cmsContent', resultKey: 'cmsContent',
promise: cmsContentPromise promise: cmsContentPromise,
}, },
{ {
resultKey: 'wipers', resultKey: 'wipers',
promise: wipersPromise promise: wipersPromise,
}, },
{ {
resultKey: 'rainDefense', resultKey: 'rainDefense',
promise: rainDefensePromise promise: rainDefensePromise,
}, },
{ {
resultKey: 'supportingItems', resultKey: 'supportingItems',
promise: supportingItemsPromise promise: supportingItemsPromise,
} },
]; ];
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
const clonedGlassParts = store.order.lineItems.glassParts const clonedGlassParts = store.order.lineItems.glassParts
? JSON.parse(JSON.stringify(store.order.lineItems.glassParts)) ? JSON.parse(JSON.stringify(store.order.lineItems.glassParts))
: []; : [];
@ -89,15 +88,11 @@
resultMap.rainDefense, resultMap.rainDefense,
...resultMap.supportingItems, ...resultMap.supportingItems,
...resultMap.wipers, ...resultMap.wipers,
...clonedGlassParts ...clonedGlassParts,
]; ];
//const pricingResults = await baseMixin.methods.dispatchStoreAction(
// storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA, //const pricingResults = await store.getPriceOrderItems(availableLineItems);
// {
// availableLineItems: availableLineItems
// },
// false
//);
// Call the "next" function to complete the transition to this page. // Call the "next" function to complete the transition to this page.
next((vm) => { next((vm) => {
vm.setCmsContent(resultMap.cmsContent); vm.setCmsContent(resultMap.cmsContent);
@ -119,13 +114,14 @@
this.$refs[modalName].openModal(); this.$refs[modalName].openModal();
}, },
arePagePrerequisitesValid() { arePagePrerequisitesValid() {
const store = useMainStore();
return ( return (
store.getters.order.serviceLocation.zipCode && store.order.serviceLocation.zipCode &&
store.getters.order.serviceLocation.zipCodeCtu && store.order.serviceLocation.zipCodeCtu &&
(store.getters.order.damage.isRepair || (store.order.damage.isRepair ||
(store.getters.order.lineItems?.glassParts != null && (store.order.lineItems?.glassParts != null &&
store.getters.order.lineItems.glassParts.length > 0)) && store.order.lineItems.glassParts.length > 0)) &&
store.getters.order.referralNumber?.length !== 6 store.order.referralNumber?.length !== 6
); );
}, },
vapsItemsSelectedAction(vapsItemsSelected) { vapsItemsSelectedAction(vapsItemsSelected) {
@ -136,6 +132,21 @@
this.navigationScenarios.CLICKED_BACK, this.navigationScenarios.CLICKED_BACK,
this.$route this.$route
); );
},
forwardButtonAction() {
//SAVE_PARENT_ACCOUNT_NUMBER,
//if (this.$store.order.payment.parentAccountNumber !=
// applicationConfig.CASH_PARENT_ACCOUNT_NUMBER) {
// this.supportingItems = this.filterOutFees(this.supportingItems);
//}
//if (this.pricedGlassParts.length > 0) {
// this.storeActions.SAVE_GLASS_PARTS,
// this.pricedGlassParts,
//}
//this.storeActions.SAVE_SUPPORTING_ITEMS,
//this.supportingItems,
//this.storeActions.SAVE_VAPS, this.selectedVaps
//navigateToHeritageFunnel({ loadingModal: this.$refs.loadingModal });
} }
}, },
components: { components: {

35
src/router/router-constants/issPage-values.js
View file

@ -1,27 +1,28 @@
export const issPageValues = { export const issPageValues = {
ENTRY_PAGE: 'entry-page', ENTRY_PAGE: 'entry-page',
WELCOME_PAGE: 'welcome-page', WELCOME_PAGE: 'welcome-page',
POLICY_HOLDER_DETAILS: 'policy-holder-details',
VEHICLE_MAKE: 'vehicle-make',
VEHICLE_YEAR: 'vehicle-year',
VEHICLE_MODEL: 'vehicle-model',
VEHICLE_STYLE: 'vehicle-style',
VEHICLE_DAMAGE: 'vehicle-damage',
VEHICLE_LOOKUP: 'vehicle-lookup',
ADDRESS_LOOKUP: 'address-lookup', ADDRESS_LOOKUP: 'address-lookup',
ADDRESS_VEHICLES: 'address-vehicles', ADDRESS_VEHICLES: 'address-vehicles',
LICENSE_PLATE_LOOKUP: 'license-plate-lookup',
VIN_LOOKUP: 'vin-lookup',
VEHICLE_PARTS: 'vehicle-parts',
PART_QUESTIONS: 'part-questions',
MOLDING_QUESTIONS: 'molding-questions',
CAPABILITY_QUESTIONS: 'capability-questions', CAPABILITY_QUESTIONS: 'capability-questions',
COVERAGE_STATEMENT: 'coverage-statement',
PROVIDER_PREFERENCE: 'provider-preference',
SERVICE_LOCATION: 'service-location',
REVEAL: 'reveal',
ESTIMATE: 'estimate', ESTIMATE: 'estimate',
ADDRESS_VEHICLES: 'address-vehicles', COVERAGE_STATEMENT: 'coverage-statement',
LICENSE_PLATE_LOOKUP: 'license-plate-lookup',
MOLDING_QUESTIONS: 'molding-questions',
PART_QUESTIONS: 'part-questions',
POLICY_HOLDER_DETAILS: 'policy-holder-details',
PROVIDER_PREFERENCE: 'provider-preference',
REVEAL: 'reveal',
REVIEW_ORDER: 'review-order',
SERVICE_LOCATION: 'service-location',
SERVICE_PACKAGE: 'service-package', SERVICE_PACKAGE: 'service-package',
VEHICLE_DAMAGE: 'vehicle-damage',
VEHICLE_LOOKUP: 'vehicle-lookup',
VEHICLE_MAKE: 'vehicle-make',
VEHICLE_MODEL: 'vehicle-model',
VEHICLE_PARTS: 'vehicle-parts',
VEHICLE_STYLE: 'vehicle-style',
VEHICLE_YEAR: 'vehicle-year',
VIN_LOOKUP: 'vin-lookup'
}; };

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

@ -425,7 +425,6 @@ const routingTable = function(store) {
destinationIssPageValue: issPageValues.PROVIDER_PREFERENCE, destinationIssPageValue: issPageValues.PROVIDER_PREFERENCE,
}, },
], ],
}, },
{ {
issPageValue: issPageValues.PROVIDER_PREFERENCE, issPageValue: issPageValues.PROVIDER_PREFERENCE,
@ -440,7 +439,19 @@ const routingTable = function(store) {
}, },
], ],
}, },
{
issPageValue: issPageValues.SERVICE_PACKAGE,
maps: [
{
scenario: navigationScenarios.CLICKED_BACK,
destinationIssPageValue: issPageValues.SERVICE_LOCATION
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_SAFELITE,
destinationIssPageValue: issPageValues.REVIEW_ORDER
}
]
}
]; ];
}; };

54
src/store/index.js
View file

@ -85,9 +85,7 @@ const getDefaultState = () => {
referralDate: null, referralDate: null,
}, },
applicationUser: { applicationUser: {
lastPageVisited: null,
experiments: [], experiments: [],
triggeredSiteEntry: false,
eventBus: [], eventBus: [],
pageData: {}, pageData: {},
savedSessionTimeout: getDateForSavedSessionTimeout(), savedSessionTimeout: getDateForSavedSessionTimeout(),
@ -435,7 +433,7 @@ export const useMainStore = defineStore({
}, },
}); });
}, },
getWipers() { getWipers() {
const carId = this.order.vehicle.carId; const carId = this.order.vehicle.carId;
///WARNING WARNING DANGER WILL ROBINSON ///WARNING WARNING DANGER WILL ROBINSON
///TODO: this is temp test code until serviceLocation is complete. ///TODO: this is temp test code until serviceLocation is complete.
@ -486,6 +484,44 @@ export const useMainStore = defineStore({
}); });
}, },
async getPriceOrderItems(availableLineItems) {
let zipCodeToUse = this.order.serviceLocation.zipCode;
let ctuToUse = this.order.serviceLocation.zipCodeCtu;
const availableLineItemsFormattedForRequest =
getLineItemQueryStringForPricing(availableLineItems);
const vehicle = this.order.vehicle;
//TEMP
zipCodeToUse = "44902";
let accountNumber = 0;
ctuToUse = 0;
//eon
let queryString =
`ParentAccountNumber=${accountNumber}` +
`&CTU=${ctuToUse}` +
`&CarId=${vehicle.carId}` +
`&Make=${vehicle.make}` +
`&Model=${vehicle.model}` +
`&Year=${vehicle.year}` +
`&ZipCode=${zipCodeToUse}` +
`${availableLineItemsFormattedForRequest}`;
//const lineItemServerData = order.lineItems.serverData;
//if (lineItemServerData) {
// queryString += `&ServerData=$(encodeURIComponent(lineItemServerData)}`;
//}
//return globalMethods
// .callHttpClient({
// method: endpoints.GetPriceOrderItems.method,
// endpoint: `${endpoints.GetPriceOrderItems.url}?${queryString}`
// }).catch((error) => {
// console.error(error);
// return [];
// });
},
lookupVehicleByVin(vin) { lookupVehicleByVin(vin) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.LookupVehicleByVin.method, method: endpoints.LookupVehicleByVin.method,
@ -1212,3 +1248,15 @@ function getAllPartNumbers(partsOrQuestions) {
.join(",") .join(",")
: []; : [];
} }
function getLineItemQueryStringForPricing(lineItems) {
return lineItems
.map((lineItem) => {
let queryStringSnippet = `&LineItems=${lineItem.partNumber}`;
if (lineItem.childParts) {
queryStringSnippet += getLineItemQueryStringForPricing(lineItem.childParts);
}
return queryStringSnippet;
})
.join('');
}