CASH-816
CASH-816 post tech review changes, made fix in modal to avoid having to fix unit tests
This commit is contained in:
parent
ba1217d36c
commit
372a0cafad
2 changed files with 13 additions and 57 deletions
|
|
@ -39,7 +39,10 @@
|
||||||
:isDisabled="footerButtonDisabled"
|
:isDisabled="footerButtonDisabled"
|
||||||
:buttonText="footerButtonText"
|
:buttonText="footerButtonText"
|
||||||
@click-event="validateAndEmit"
|
@click-event="validateAndEmit"
|
||||||
:class="isFooterButtonDisabled && 'form-test-invalid'" />
|
:class="[
|
||||||
|
isFooterButtonDisabled && 'form-test-invalid',
|
||||||
|
{ 'form-test-invalid': footerButtonDisabled === true }
|
||||||
|
]" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -139,9 +142,6 @@ export default {
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
isFooterButtonDisabled() {
|
isFooterButtonDisabled() {
|
||||||
if (this.footerButtonDisabled !== undefined) {
|
|
||||||
return this.footerButtonDisabled;
|
|
||||||
}
|
|
||||||
if (!this.meta.touched) {
|
if (!this.meta.touched) {
|
||||||
return !this.meta.valid;
|
return !this.meta.valid;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<transition name="fade" mode="out-in">
|
<transition name="fade" mode="out-in">
|
||||||
<div v-if="isDisplayed" class="shop-question" aria-live="polite">
|
<div v-if="isDisplayed" class="shop-question" aria-live="polite">
|
||||||
<alert
|
|
||||||
ref="alertDropoffInformation"
|
|
||||||
v-if="displayDropoffInformation"
|
|
||||||
class="mb-4 drop-off-alert"
|
|
||||||
cmsWidgetName="AlertDropoffInformationWidget"
|
|
||||||
alertClass="alert-info"
|
|
||||||
v-bind:isDismissible="false" />
|
|
||||||
<div class="modal-link">
|
<div class="modal-link">
|
||||||
<text-link
|
<text-link
|
||||||
linkType="text"
|
linkType="text"
|
||||||
:text="shopQuestionLinkText"
|
:text="shopQuestionLinkText"
|
||||||
:shopProviderData="shopProviderData"
|
|
||||||
href="#!"
|
href="#!"
|
||||||
@click-event="openModal"></text-link>
|
@click-event="openModal"></text-link>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -27,7 +19,7 @@
|
||||||
:footerButtonDisabled="
|
:footerButtonDisabled="
|
||||||
displayInvalidZipAlert || displayNoShopsAlert || !selectedProviderNumber
|
displayInvalidZipAlert || displayNoShopsAlert || !selectedProviderNumber
|
||||||
"
|
"
|
||||||
@footer-button-event="SetZipCodeAndShop">
|
@footer-button-event="setZipCodeAndShop">
|
||||||
<serviceZipQuestion
|
<serviceZipQuestion
|
||||||
ref="serviceZipQuestion"
|
ref="serviceZipQuestion"
|
||||||
class="shop-question-zipcode"
|
class="shop-question-zipcode"
|
||||||
|
|
@ -47,47 +39,12 @@
|
||||||
cmsWidgetName="AlertInvalidZipWidget"
|
cmsWidgetName="AlertInvalidZipWidget"
|
||||||
alertClass="alert-danger"
|
alertClass="alert-danger"
|
||||||
v-bind:isDismissible="false" />
|
v-bind:isDismissible="false" />
|
||||||
<alert
|
|
||||||
ref="alertMilitaryBaseZip"
|
|
||||||
class="my-5"
|
|
||||||
cmsWidgetName="AlertMilitaryBaseZipWidget"
|
|
||||||
v-if="displayMilitaryZipAlert"
|
|
||||||
alertClass="alert-warning" />
|
|
||||||
|
|
||||||
<alert
|
|
||||||
ref="alertMobileOnly"
|
|
||||||
class="my-5"
|
|
||||||
cmsWidgetName="AlertMobileOnlyWidget"
|
|
||||||
v-if="displayServiceableMobileOnly"
|
|
||||||
alertClass="alert-warning" />
|
|
||||||
|
|
||||||
<alert
|
|
||||||
ref="alertRecalNoMobile"
|
|
||||||
class="my-5"
|
|
||||||
cmsWidgetName="AlertRecalNoMobileWidget"
|
|
||||||
v-if="displayRecalibrationWarning"
|
|
||||||
@text-link-clicked="openModalAction"
|
|
||||||
alertClass="alert-warning" />
|
|
||||||
|
|
||||||
<alert
|
|
||||||
ref="alertInshopOnly"
|
|
||||||
class="my-5"
|
|
||||||
cmsWidgetName="AlertInshopOnlyWidget"
|
|
||||||
v-if="displayServiceableInshopOnly"
|
|
||||||
alertClass="alert-warning" />
|
|
||||||
|
|
||||||
<alert
|
<alert
|
||||||
ref="alertNoShops"
|
ref="alertNoShops"
|
||||||
class="my-5"
|
class="my-5"
|
||||||
cmsWidgetName="AlertNoShopsWidget"
|
cmsWidgetName="AlertNoShopsWidget"
|
||||||
v-if="displayNoShopsAlert"
|
v-if="displayNoShopsAlert"
|
||||||
alertClass="alert-warning" />
|
alertClass="alert-warning" />
|
||||||
<alert
|
|
||||||
ref="alertMobileFeeFree"
|
|
||||||
class="my-5"
|
|
||||||
cmsWidgetName="AlertMobileFeeFreeWidget"
|
|
||||||
v-if="showMobileFreeAlert"
|
|
||||||
alertClass="alert-success" />
|
|
||||||
<div v-if="!displayInvalidZipAlert">
|
<div v-if="!displayInvalidZipAlert">
|
||||||
<buttonQuestion
|
<buttonQuestion
|
||||||
ref="buttonQuestion"
|
ref="buttonQuestion"
|
||||||
|
|
@ -153,13 +110,6 @@ import {
|
||||||
defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
|
defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
|
||||||
defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
|
defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
|
||||||
|
|
||||||
function getShopsByZip(zipCode, shops, numberToGet = 3) {
|
|
||||||
return shops
|
|
||||||
.filter((shop) => shop.address && shop.address.zipCode && shop.address.zipCode !== "")
|
|
||||||
.sort((a, b) => a.distanceInMiles - b.distanceInMiles)
|
|
||||||
.slice(0, numberToGet);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "shop-question-popup",
|
name: "shop-question-popup",
|
||||||
mixins: [baseMixin],
|
mixins: [baseMixin],
|
||||||
|
|
@ -496,7 +446,7 @@ export default {
|
||||||
this.shopIndex = 3;
|
this.shopIndex = 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
const sortedShops = getShopsByZip(zipCode, this.shopProviders, this.shopIndex);
|
const sortedShops = this.getShopsByZip(zipCode, this.shopProviders, this.shopIndex);
|
||||||
|
|
||||||
const toTitleCase = (str) => {
|
const toTitleCase = (str) => {
|
||||||
return str.replace(/\w\S*/g, function (txt) {
|
return str.replace(/\w\S*/g, function (txt) {
|
||||||
|
|
@ -561,7 +511,7 @@ export default {
|
||||||
this.displayNoServiceAlert = false;
|
this.displayNoServiceAlert = false;
|
||||||
this.displayNoShopsAlert = false;
|
this.displayNoShopsAlert = false;
|
||||||
},
|
},
|
||||||
async SetZipCodeAndShop() {
|
async setZipCodeAndShop() {
|
||||||
if (
|
if (
|
||||||
this.displayInvalidZipAlert ||
|
this.displayInvalidZipAlert ||
|
||||||
this.displayNoShopsAlert ||
|
this.displayNoShopsAlert ||
|
||||||
|
|
@ -646,6 +596,12 @@ export default {
|
||||||
this.closeModal();
|
this.closeModal();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
getShopsByZip(zipCode, shops, numberToGet = 3) {
|
||||||
|
return shops
|
||||||
|
.filter((shop) => shop.address && shop.address.zipCode && shop.address.zipCode !== "")
|
||||||
|
.sort((a, b) => a.distanceInMiles - b.distanceInMiles)
|
||||||
|
.slice(0, numberToGet);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
shopProviderData: {
|
shopProviderData: {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue