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

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

Browse source
This commit is contained in:
Kroell 2023-03-08 15:44:33 -05:00
commit 44330315b2
12 changed files with 190 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/constants/endpoints.js
View file

@ -95,7 +95,7 @@ const endpoints = {
url: "https://maps.googleapis.com/maps/api/js?key={apiKey}&libraries=places"
},
ValidateClientTag: {
url: "/clientauth/api/v1/clientauth/validateClientTag",
url: "/clientauth/api/v1/clientauth/validate-client-tag",
method: "GET",
},
IsVinbyAddressPermissible:{

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

@ -1,5 +1,5 @@
<template>
<div class="row" :style="`padding-bottom: ${paddingHeight}px`">
<div class="row" >
</div>
<div class="footerImage" id="imgCity" v-if="footerImageURL" >
<img id="siteFooterImage" :src="footerImageURL" />
@ -160,8 +160,7 @@ export default {
{
text-align: center;
position: sticky;
bottom: 65px;
}
}
@media only screen and (max-width: 340px) {
.footerImage

21
src/iss-components/site-header/menu-modal/menu-modal.vue
View file

@ -24,21 +24,21 @@
<div class="modal-dialog modal-fullscreen">
<div class="modal-content">
<div class="modal-header visually-hidden">
<h5 class="modal-title" id="footerModalLabel">Footer Navigation</h5>
<h5 class="modal-title" id="footerModalLabel">Footer Navigation</h5>
</div>
<div class="modal-body d-flex flex-column">
<textLink linkType="navigation" text="Terms of use" href="https://www.safelite.com/terms-of-use" target="_blank" />
<textLink
linkType="navigation"
text="Your privacy choices"
href="//www.safelite.com/privacy-center"
target="_blank"
<textLink
linkType="navigation"
text="Your privacy choices"
href="//www.safelite.com/privacy-center"
target="_blank"
>
<template v-slot:after-text>
<img
class="ccpa-icon"
src="~@/assets/img/icons/ccpa-icon.svg"
alt="Your privacy choices"
alt="Your privacy choices"
data-id="ccpa-icon"
/>
</template>
@ -52,7 +52,7 @@
</div>
</div>
</template>
<script>
import textLink from "@/ux-components/text-link/text-link";
export default {
@ -81,7 +81,7 @@
}
}
</script>
<style lang="scss" scoped>
.menu-modal-container {
position: absolute;
@ -102,7 +102,7 @@
align-items: center;
padding: 0;//Required to prevent 'squish' on iPhone
z-index: 1050;
.bar1,
.bar1,
.bar2,
.bar3 {
width: 14px;
@ -163,6 +163,7 @@
box-shadow: none;
background-color: $white;
position: relative;
right: -.5rem;
display: flex;
flex-direction: column;
justify-content: center;

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

@ -13,7 +13,7 @@
ref="vehicleBanner"
:displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" ref="siteSubHeader" />
<div class="fade-on-route-transition sub-container make-tall overflow-auto px-5">
<div class="fade-on-route-transition sub-container overflow-scroll px-5">
<alert
ref="alertVinNotFound"
v-if="displayVinNotFoundAlert"
@ -310,3 +310,11 @@ export default {
},
};
</script>
<style lang="scss">
.overflow-scroll {
height: calc(100% - 353px);
overflow-X: hidden !important;
}
</style>

110
src/layouts/entry-page/entry-page.vue
View file

@ -34,7 +34,14 @@
},
async validateClientTagOnEntry() {
const clientTag = this.$route.query.ClientTag;
// Dump the query string parameters into an array. Remove casing on the key for easy compare.
let queryStringParams = [];
for ( let param in this.$route.query)
{
queryStringParams[param.toLowerCase()] = this.$route.query[param];
}
const clientTag = queryStringParams["clienttag"];
const clientTagPresent = !!clientTag;
let authorized = false;
@ -44,10 +51,15 @@
if ( resp?.data.active && resp?.data.accountName.length > 0 )
{
this.mainStore.issConfig.clientName = resp.data.accountName;
this.mainStore.issConfig.accountNumber = resp.data.accountNumber;
this.mainStore.issConfig.styleSheet = resp.data.styleSheet;
this.populateISSConfigValues(resp.data);
authorized = true;
if ( resp.data.parameters?.length > 0 )
{
const finalParams = this.combineClientParameters(resp.data.parameters, queryStringParams);
this.populateStoreItemsFromParams(finalParams);
}
}
}
@ -59,6 +71,96 @@
window.location = "/?issPage=" + issPageValues.WELCOME_PAGE;
}
},
populateISSConfigValues(data)
{
this.mainStore.issConfig.clientName = data.accountName;
this.mainStore.issConfig.accountNumber = data.accountNumber;
this.mainStore.issConfig.styleSheet = data.styleSheet;
try
{
const clientFlags = JSON.parse(data.clientFlags);
if ( clientFlags.TPAEnabled )
{
this.mainStore.issConfig.enableTPAFlow = true;
}
if ( clientFlags.clientDisplayName != null )
{
this.mainStore.issConfig.clientDisplayName = clientFlags.clientDisplayName;
}
}
catch ( e )
{
console.error("Error parsing client flags: " + e);
}
},
combineClientParameters(configParams, queryStringParams)
{
let finalParams = [];
try
{
const clientParams = JSON.parse(configParams);
for ( let cparam in clientParams)
{
let cname = clientParams[cparam].toLowerCase();
for ( let qsparam in queryStringParams)
{
let qsname = qsparam.toLowerCase();
if ( cname === qsname )
{
finalParams[cname] = queryStringParams[cname];
}
}
}
}
catch ( e )
{
console.error("Error combining client parameters: " + e);
}
return finalParams;
},
populateStoreItemsFromParams(params) {
// Populate store items from parameters.
for ( let param in params)
{
let name = param.toLowerCase();
let value = params[param];
switch (name)
{
case "policynumber":
this.mainStore.order.policy.policyNumber = value;
break;
case "lossdate":
// NOTE: May need some date parsing logic in here depending on client.
this.mainStore.order.policy.dateOfLoss = value;
break;
case "returnurl":
this.mainStore.iisConfig.returnURL = value;
break;
case "returnurl2":
this.mainStore.iisConfig.returnURL2 = value;
break;
// Not stored
case "timestamp":
case "token":
case "signature":
break;
}
}
},
},
computed:{
},

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

@ -1,11 +1,11 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }" >
<div class="page-container-grouped-styles overflow-auto">
<div class="page-container-grouped-styles ">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<div class="fade-on-route-transition px-5">
<div class="fade-on-route-transition px-5 overflow-scroll">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
<addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>
<div class="row mt-4">
<div class="row mt-4 ">
<div class="col">
<textboxQuestion
inputId="firstNameField"
@ -17,7 +17,7 @@
validationRules="first-name-required" />
</div>
</div>
<div class="row mt-4">
<div class="row mt-4 mb-2">
<div class="col">
<textboxQuestion
inputId="lastNameField"
@ -137,6 +137,10 @@ export default {
}
</script>
<style lang="scss">
.overflow-scroll {
height: calc(100% - 152px);
overflow-X: hidden !important;
}
.alert.alert-warning
{
margin-top: 20px;

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

@ -1,13 +1,13 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="page-container-grouped-styles overflow-auto vehicle-damage">
<div class="page-container-grouped-styles vehicle-damage">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<vehicleBanner
class="mb-3"
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
<div class="fade-on-route-transition sub-container make-tall">
<div class="fade-on-route-transition sub-container overflow-scroll">
<alert
ref="vehicleChangeAlert"
v-if="shouldDisplayVehicleChangeAlert"
@ -472,3 +472,10 @@ export default {
},
};
</script>
<style lang="scss">
.overflow-scroll {
height: calc(100% - 353px);
overflow-X: hidden !important;
}
</style>

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

@ -3,7 +3,7 @@
@submit="onSubmit"
@invalid-submit="onInvalidSubmit"
>
<div class="page-container-grouped-styles overflow-auto vehicle-lookup">
<div class="page-container-grouped-styles vehicle-lookup">
<SiteHeader
cms-widget-name="SiteHeaderWidget"
/>
@ -15,7 +15,7 @@
<SiteSubHeader
cms-widget-name="SiteSubHeaderWidget"
/>
<div class="fade-on-route-transition sub-container make-tall container gx-0">
<div class="fade-on-route-transition sub-container overflow-scroll container gx-0">
<VinLookupMethods
v-model="selectedVinLookupMethod"
cms-widget-name="VINLookupMethod"
@ -115,3 +115,10 @@ export default {
},
};
</script>
<style lang="scss">
.overflow-scroll {
height: calc(100% - 353px);
overflow-X: hidden !important;
}
</style>

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

@ -3,7 +3,7 @@
<div class="page-container-grouped-styles welcome">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<div class="fade-on-route-transition h-100 overflow-auto container">
<div class="fade-on-route-transition overflow-scroll container">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
<div class="row mt-4 px-3">
@ -333,6 +333,11 @@
</script>
<style lang="scss">
.overflow-scroll {
height: calc(100% - 152px);
overflow-X: hidden !important;
}
.my-2
{
margin-bottom: 0rem !important;

31
src/router/index.js
View file

@ -23,15 +23,19 @@ const routes = [
async beforeEnter(to, from, next) {
try {
to.query.issPage = !to.query.issPage ? issPageValues.WELCOME_PAGE : to.query.issPage;
if (analyticsMixin.methods.noSession()) {
await analyticsMixin.methods.initSession();
} else {
updateSessionIdCookie();
// Do not run these for the main entry page - as it is not part of the user flow.
if ( to.query.issPage != issPageValues.ENTRY_PAGE )
{
if (analyticsMixin.methods.noSession()) {
await analyticsMixin.methods.initSession();
} else {
updateSessionIdCookie();
}
await runExperiments(to.query.issPage);
}
await runExperiments(to.query.issPage);
// Process ISS cookie.
updateOrCreateISSCookie();
@ -78,11 +82,14 @@ router.afterEach((to, from) => {
// Update lastPageVisited in the store
store.updateLastPageVisited(to.name);
// Push page view to GA
analyticsMixin.methods.pushPageViewToGA();
if ( to.query.issPage != issPageValues.ENTRY_PAGE )
{
// Push page view to GA
analyticsMixin.methods.pushPageViewToGA();
// Push experiments to Data Layer
analyticsMixin.methods.pushExperimentsToDataLayer();
// Push experiments to Data Layer
analyticsMixin.methods.pushExperimentsToDataLayer();
}
});
// Get route information by page name.

10
src/store/index.js
View file

@ -99,8 +99,12 @@ const getDefaultState = () => {
},
issConfig: {
clientName: "Generic Insurance", // this is the default and will be overriden by the client's name
clientDisplayName: "Generic Insurance",
styleSheet: "",
accountNumber: 0,
enableTPAFlow: false,
returnURL: null,
returnURL2: null,
}
};
};
@ -601,9 +605,13 @@ export const useMainStore = defineStore({
resetISSConfigState()
{
this.issConfig.clientName = "";
this.issConfig.clientName = "Generic Insurance";
this.issConfig.clientDisplayName = "Generic Insurance";
this.issConfig.accountNumber = 0;
this.issConfig.styleSheet = "";
this.issConfig.enableTPAFlow = false;
this.issConfig.returnURL = null;
this.issConfig.returnURL2 = null;
},
updateVehicleYear(year) {

2
vue.config.js
View file

@ -1,7 +1,7 @@
process.env.VUE_APP_CONSUMER_CF_DISTRO ="https://digitalapi.dev.safelite.io";
process.env.VUE_APP_CURRENT_ENVIRONMENT = "Localhost";
process.env.VUE_APP_GOOGLE_PLACES_API_KEY =
"AIzaSyDptGCkOPgN2uWJOy4ou4M33phRD4MAoJo";
"AIzaSyCuLhQcDdZTTb4JzpUFms1OCch2dk5lHF0";
// GA & GTM