Troubleshooting

This commit is contained in:
Michaela Brydon 2023-10-27 15:01:23 -04:00
parent 4708c84d4a
commit fc753e4253
4 changed files with 195 additions and 128 deletions

View file

@ -67,13 +67,11 @@ export default {
mixins: [inputButtonWrapperMixin], mixins: [inputButtonWrapperMixin],
data() { data() {
return { return {
availabilityRating: null availabilityRating: null,
displayAvailabilityIndicator: this.additionalButtonData?.displayAvailabilityIndicators ?? false
}; };
}, },
computed: { computed: {
displayAvailabilityIndicators() {
return true;
},
isLoaderDisplayed() { isLoaderDisplayed() {
return this.availabilityRating == null; return this.availabilityRating == null;
}, },

View file

@ -124,6 +124,7 @@ export default {
const formattedEndDate = endDate.toISOString().split('T')[0]; const formattedEndDate = endDate.toISOString().split('T')[0];
return { return {
displayAvailabilityIndicators: true,
availabilityRatingCallback: getAvailabilityRating, availabilityRatingCallback: getAvailabilityRating,
startDate: formattedStartDate, startDate: formattedStartDate,
endDate: formattedEndDate, endDate: formattedEndDate,

View file

@ -1,98 +1,103 @@
<template> <template>
<siteHeader <div>
ref="siteHeader" <siteHeader
:cmsWidgetName="widget.siteHeader" /> ref="siteHeader"
<Form :cmsWidgetName="widget.siteHeader" />
ref="searchProvidersForm" <Form
@submit="onSubmit" ref="searchProvidersForm"
@invalidSubmit="onInvalidSubmit"> @submit="onSubmit"
<div class="container-fluid pb-2"> @invalidSubmit="onInvalidSubmit">
<div class="mx-5"> <div class="container-fluid pb-2">
<p <div class="mx-5">
ref="tpaSearchQuestionLabel" <label
class="text-center mt-5 mb-0 text-black w-100 search-question"> ref="tpaSearchQuestionLabel"
{{ tpaSearchQuestionLabel }} for="tpaSearchQuestionField"
</p> class="text-center mt-5 mb-0 text-black w-100 search-question">
<!-- TODO make this label for appropriate text box --> {{ tpaSearchQuestionLabel }}
<p </label>
ref="searchInstructions" <!-- TODO make this label for appropriate text box -->
class="text-center small darker-gray w-100 mb-4"> <label
{{ searchInstructionsText }} ref="searchInstructions"
</p> for="tpaSearchQuestionField"
<div class="mb-5"> class="text-center small darker-gray w-100 mb-4">
<textboxQuestion {{ searchInstructionsText }}
ref="tpaSearchQuestionField" </label>
v-model="zipCode" <div class="mb-5">
inputId="tpaSearchQuestionField" <textboxQuestion
:cmsWidgetName="widget.tpaSearchQuestion" ref="tpaSearchQuestionField"
:displayQuestionText="false" v-model="zipCode"
:includeSearchIcon="true" inputId="tpaSearchQuestionField"
isRequired :cmsWidgetName="widget.tpaSearchQuestion"
:validationRules="rules.zipCode" :includeSearchIcon="true"
@clickEvent="searchClick" /> :displayQuestionText="false"
isRequired
:validationRules="rules.zipCode"
@clickEvent="searchClick" />
</div>
</div> </div>
</div> </div>
</div> </Form>
</Form> <Form
<Form ref="providerSelectionForm"
ref="providerSelectionForm" v-slot="{ meta }"
v-slot="{ meta }" @submit="onSubmit"
@submit="onSubmit" @invalidSubmit="onInvalidSubmit">
@invalidSubmit="onInvalidSubmit"> <div class="container-fluid pb-2">
<div class="container-fluid pb-2"> <p class="mb-4">
<p class="mb-4"> Placeholder for Map
Placeholder for Map </p>
</p>
<div class="mx-5"> <div class="mx-5">
<dropdownQuestion <dropdownQuestion
id="filter" id="filter"
ref="filter" ref="filter"
v-model="filter" v-model="filter"
:cmsWidgetName="widget.filterByQuestion" :cmsWidgetName="widget.filterByQuestion"
inputId="filterByQuestionField" inputId="filterByQuestionField"
:options="filterOptions" :options="filterOptions"
disableAutoFill disableAutoFill
:validationRules="rules.filter" /> :validationRules="rules.filter" />
<div class="my-4"> <div class="my-4">
<buttonQuestion <buttonQuestion
ref="providerQuestion" ref="providerQuestion"
v-model="selectedProviderNumber" v-model="selectedProviderNumber"
buttonTypeString="shopListButton" buttonTypeString="shopListButton"
:buttonTypeObject="shopListButton" :buttonTypeObject="shopListButton"
class="radioQuestion" class="radioQuestion"
:answers="providers" :answers="providers"
groupName="chooseShop" groupName="chooseShop"
textPosition="text-start" textPosition="text-start"
isRequired isRequired
:validationRules="rules.provider" :validationRules="rules.provider"
:additionalButtonData="additionalButtonData" /> :additionalButtonData="additionalButtonData" />
<alert <alert
v-if="providers.length === 0" v-if="providers.length === 0"
ref="alertNoNetworkProviders" ref="alertNoNetworkProviders"
:cmsWidgetName="widget.noNetworkShopsAlert" :cmsWidgetName="widget.noNetworkShopsAlert"
alertClass="alert-warning" alertClass="alert-warning"
:isDismissible="false" :isDismissible="false"
:manualHeadline="noNetworkShopsAlertHeaderText" /> :manualHeadline="noNetworkShopsAlertHeaderText" />
</div> </div>
<div <div
class="text-center"> class="text-center">
<textLink <textLink
linkType="navigation" linkType="navigation"
:text="shopNotListedModalLink" href="#!"
@clickEvent="doNotSeeMyShopLinkClick" /> :text="shopNotListedModalLink"
@clickEvent="doNotSeeMyShopLinkClick" />
</div>
</div> </div>
<siteFooter
ref="siteFooter"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@ForwardClicked="forwardButtonAction"
@backClicked="backButtonAction" />
</div> </div>
<siteFooter </Form>
ref="siteFooter" </div>
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@ForwardClicked="forwardButtonAction"
@backClicked="backButtonAction" />
</div>
</Form>
</template> </template>
<script> <script>
// Components // Components
@ -134,31 +139,80 @@ export default {
{ {
resultKey: 'cmsContent', resultKey: 'cmsContent',
promise: cmsContentPromise promise: cmsContentPromise
}]; }
];
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
console.log(JSON.stringify(resultMap.cmsContent));
// const tpaProviders = await useMainStore().getTpaProviders(zipCode, radiusOptions[0]).then(async providers => {
// if (providers?.length === 0 ?? true) {
// return useMainStore().getTpaProviders(zipCode, radiusOptions[1]).then(result => {
// if (providers?.length === 0 ?? true) {
// return useMainStore().getTpaProviders(zipCode, radiusOptions[2]);
// }
// })
// }
// });
// get providers by zipCode and radius[0]
// if no providers, get providers by zipCode and radius[1]
// if no providers, get providers by zipCode and radius[2]
next((vm) => { next((vm) => {
vm.setCmsContent(resultMap.cmsContent); vm.setCmsContent(resultMap.cmsContent);
// vm.setFilter(radius);
// vm.setProviders(providers);
}); });
}, },
setup() { async setup() {
// TODO get TPA shops within radius of zipcode for account // TODO get TPA shops within radius of zipcode for account
// Set initialFilter to value associated with the minimum distance required to return // Set initialFilter to value associated with the minimum distance required to return
// at least one shop // at least one shop
// const radiusOptions = [25, 50, 100];
// const { zipCode } = useMainStore().order.customer.address;
// const tpaProvidersRadius25 = useMainStore().getTpaProviders(zipCode, radiusOptions[0]);
// const tpaProvidersRadius50 = useMainStore().getTpaProviders(zipCode, radiusOptions[1]);
// const tpaProvidersRadius100 = useMainStore().getTpaProviders(zipCode, radiusOptions[2]);
// let radius = '25 miles';
// const providers = await tpaProvidersRadius25.then((result25) => {
// if ((result25?.data ?? []).length === 0) {
// radius = '50 miles';
// console.log(`radius 50: ${radius}`);
// return tpaProvidersRadius50.then((result50) => {
// console.log(`result 50: ${JSON.stringify(result50)}`);
// if ((result50?.data ?? []).length === 0) {
// radius = '100 miles';
// console.log(`radius 100: ${radius}`);
// return tpaProvidersRadius100;
// }
// return result50;
// });
// }
// return result25;
// });
// console.log(`providers: ${JSON.stringify(providers)}`);
// const filter = radius;
// return { filter, providers, zipCode };
const initialFilter = '25 miles'; const initialFilter = '25 miles';
return { initialFilter }; return { initialFilter };
}, },
data() { data() {
const defaultRadius = 25; // const defaultRadius = 25;
const { zipCode } = useMainStore().order.customer.address; const { zipCode } = useMainStore().order.customer.address;
const providers = useMainStore().getTpaProviders(this.zipCode, defaultRadius)?.data ?? []; // const providers = useMainStore().getTpaProviders(this.zipCode, defaultRadius)?.data ?? [];
return { return {
// TODO should we default to this or policy.policyZipCode instead? // TODO should we default to this or policy.policyZipCode instead?
zipCode, zipCode,
filter: this.initialFilter, filter: this.initialFilter,
providers, providers: [],
selectedProviderNumber: providers.length === 1 // selectedProviderNumber: providers.length === 1
? providers[0].value // ? providers[0].value
: '', // : '',
selectedProviderNumber: '',
widget: { widget: {
siteHeader: 'SiteHeaderWidget', siteHeader: 'SiteHeaderWidget',
tpaSearchQuestion: 'TPASearchQuestion', tpaSearchQuestion: 'TPASearchQuestion',
@ -206,18 +260,9 @@ export default {
widgetFields.TEXT_BLOCK_WIDGET.TEXT widgetFields.TEXT_BLOCK_WIDGET.TEXT
); );
}, },
// TODO do we need this?
additionalButtonData() { additionalButtonData() {
const startDate = new Date();
const endDate = new Date();
endDate.setDate(startDate.getDate() + 6);
const formattedStartDate = startDate.toISOString().split('T')[0];
const formattedEndDate = endDate.toISOString().split('T')[0];
return { return {
startDate: formattedStartDate, displayAvailabilityIndicators: false
endDate: formattedEndDate
}; };
}, },
radiusInMiles() { radiusInMiles() {
@ -289,6 +334,12 @@ export default {
default: default:
return null; return null;
} }
},
setFilter(filter) {
this.filter = filter;
},
setProviders(providers) {
this.providers = providers;
} }
} }
}; };

View file

@ -413,12 +413,12 @@ export const useMainStore = defineStore({
order.customer.address.streetAddress = insured?.address; order.customer.address.streetAddress = insured?.address;
order.customer.address.city = insured?.city; order.customer.address.city = insured?.city;
order.customer.address.state = insured?.state; order.customer.address.state = insured?.state;
order.customer.address.zipCode = insured?.zipCode; order.customer.address.zipCode = insured?.zipCode?.toString();
order.customer.firstName = insured?.firstName; order.customer.firstName = insured?.firstName;
order.customer.lastName = insured?.lastName; order.customer.lastName = insured?.lastName;
// populate additional fields // populate additional fields
order.serviceLocation.zipCode = insured?.zipCode; order.serviceLocation.zipCode = insured?.zipCode?.toString();
// populate vehicles // populate vehicles
order.policy.vehicles = responsePolicy.vehicles ?? []; order.policy.vehicles = responsePolicy.vehicles ?? [];
@ -801,22 +801,39 @@ export const useMainStore = defineStore({
// TODO what info is returned here // TODO what info is returned here
getTpaProviders(zipCode, radius) { getTpaProviders(zipCode, radius) {
return { return new Promise((resolve, reject) => {
data: [ if (radius === 25) {
// { resolve({});
// buttonLabel: 'USA Auto Glass', } else if (radius === 50) {
// buttonLabelSubCopy: '1.5 mi', resolve({
// buttonBodyCopy: '760 Dearborn Park Ln, Worthington, OH 43085<br>614-123-5555', data: [
// value: '000123' {
// }, buttonLabel: 'USA Auto Glass',
{ buttonLabelSubCopy: '1.5 mi',
buttonLabel: 'USA Auto Glass', buttonBodyCopy: '760 Dearborn Park Ln, Worthington, OH 43085<br>614-123-5555',
buttonLabelSubCopy: '1.5 mi', value: '000123'
buttonBodyCopy: '760 Dearborn Park Ln, Worthington, OH 43085<br>614-123-5555', }
value: '000123' ]
} });
] } else {
}; resolve({
data: [
{
buttonLabel: 'USA Auto Glass',
buttonLabelSubCopy: '1.5 mi',
buttonBodyCopy: '760 Dearborn Park Ln, Worthington, OH 43085<br>614-123-5555',
value: '000123'
},
{
buttonLabel: 'USA Auto Glass',
buttonLabelSubCopy: '1.5 mi',
buttonBodyCopy: '760 Dearborn Park Ln, Worthington, OH 43085<br>614-123-5555',
value: '000123'
}
]
});
}
});
}, },
async getSupportingItems() { async getSupportingItems() {