making consts for refs

This commit is contained in:
Michaela Brydon 2024-07-18 10:57:03 -04:00
parent c4648df1f5
commit ba8e1cf5f0
3 changed files with 43 additions and 25 deletions

View file

@ -76,7 +76,7 @@
cmsWidgetName="DisclaimerWidget"
typeStyle="caption" />
<siteFooter
ref="siteFooter"
:ref="SITE_FOOTER_REF_NAME"
class="mt-5"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@ -86,10 +86,10 @@
</div>
</div>
<contentGroupModal
ref="RecalModal"
:ref="RECAL_MODAL_REF_NAME"
cmsWidgetName="RecalModal" />
<contentGroupModal
ref="DeductibleModal"
:ref="DEDUCTIBLE_MODAL_REF_NAME"
cmsWidgetName="DeductibleModal"
class="deductible-modal" />
</Form>
@ -127,6 +127,9 @@ import coverageStatuses from '@/constants/coverage-statuses';
import coverageType from '@/constants/coverage-type';
const SAFELITE_PROVIDER = 'Safelite';
const RECAL_MODAL_REF_NAME = "RecalModal";
const DEDUCTIBLE_MODAL_REF_NAME = "DeductibleModal";
const SITE_FOOTER_REF_NAME = "siteFooter";
export default {
name: 'coverage-statement',
@ -206,7 +209,10 @@ export default {
explanatoryText: 'ExplanatoryTextWidget',
nextStep: 'NextStepsWidget',
serviceProviderQuestion: 'ServiceProviderQuestion'
}
},
RECAL_MODAL_REF_NAME,
DEDUCTIBLE_MODAL_REF_NAME,
SITE_FOOTER_REF_NAME
};
},
computed: {
@ -328,17 +334,17 @@ export default {
this.selectedProvider === SAFELITE_PROVIDER
? 'Continue with Safelite'
: 'Continue';
this.$refs.siteFooter.updateButtonText(buttonText);
this.$refs[SITE_FOOTER_REF_NAME].updateButtonText(buttonText);
},
nextStepsBody(newValue, oldValue) {
if (newValue !== oldValue) {
setupModalLink(this, 'RecalModal');
setupModalLink(this, 'DeductibleModal');
setupModalLink(this, RECAL_MODAL_REF_NAME);
setupModalLink(this, DEDUCTIBLE_MODAL_REF_NAME);
}
},
verifiedItacAlertBody(newValue, oldValue) {
if (newValue !== oldValue) {
setupModalLink(this, 'DeductibleModal');
setupModalLink(this, DEDUCTIBLE_MODAL_REF_NAME);
}
}
},

View file

@ -32,7 +32,7 @@ ref="theForm"
:validationRules="rules.optionRequired"
isRequired />
<siteFooter
ref="siteFooter"
:ref="SITE_FOOTER_REF_NAME"
class="mt-5"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="isForwardActionDisabled"
@ -45,15 +45,15 @@ ref="theForm"
:ref="RECAL_MODAL_REF_NAME"
cmsWidgetName="RecalModal" />
<steeringModal
ref="StateSteeringModal"
:ref="STEERING_MODAL_REF_NAME"
cmsWidgetName="StateSteeringModal" />
<shopPreferenceModal
ref="ShopPreferenceDrawer"
:ref="SHOP_PREFERENCE_MODAL_REF_NAME"
cmsWidgetName="ShopPreferenceDrawer"
:showSteeringLink="showSteeringLink"
@openSteering="openStateSteeringModal" />
<tpaRecalModal
ref="TPARecalModal"
:ref="TPA_RECAL_MODAL_REF_NAME"
cmsWidgetName="TPARecalModal"
:ackError="ackError"
@buttonClick="navigateWithTPAAck" />
@ -86,10 +86,13 @@ import contentGroupModal from '@/iss-components/content-group-modal/content-grou
const options = { SAFELITE: 'SafeliteOption', TPA: 'TPAOption' };
const RECAL_MODAL_REF_NAME = "RecalModal";
const STEERING_MODAL_REF_NAME = "StateSteeringModal";
const SHOP_PREFERENCE_MODAL_REF_NAME = "ShopPreferenceDrawer";
const TPA_RECAL_MODAL_REF_NAME = "TPARecalModal";
const SITE_FOOTER_REF_NAME = "siteFooter";
export default {
name: 'provider-preference',
components: {
siteFooter,
siteHeader,
@ -116,21 +119,25 @@ export default {
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
vm.showSteeringLink = !!vm.$refs.StateSteeringModal.ModalBodyText;
vm.showSteeringLink = !!vm.$refs[STEERING_MODAL_REF_NAME].ModalBodyText;
if (vm.showSteeringLink) {
vm.$refs.StateSteeringModal.openModal();
vm.openStateSteeringModal();
}
});
},
data() {
return {
RECAL_MODAL_REF_NAME,
selectedProvider: null,
showSteeringLink: false,
tpaAcknowledgement: false,
rules: {
optionRequired: globalRules.OPTION_REQUIRED
}
},
RECAL_MODAL_REF_NAME,
STEERING_MODAL_REF_NAME,
SHOP_PREFERENCE_MODAL_REF_NAME,
TPA_RECAL_MODAL_REF_NAME,
SITE_FOOTER_REF_NAME
};
},
computed: {
@ -229,8 +236,8 @@ export default {
this.mainStore.updateIsSafeliteProvider(false);
if (this.mainStore.issConfig.enableTPAFlow) {
if (this.mainStore.hasRecalibrationPart) {
this.$refs.TPARecalModal.openModal();
this.$refs.siteFooter.removeLoader();
this.$refs[TPA_RECAL_MODAL_REF_NAME].openModal();
this.$refs[SITE_FOOTER_REF_NAME].removeLoader();
return;
}
scenario =
@ -253,7 +260,7 @@ export default {
}
},
openStateSteeringModal() {
this.$refs.StateSteeringModal.openModal();
this.$refs[STEERING_MODAL_REF_NAME].openModal();
}
}
};

View file

@ -86,7 +86,7 @@
" />
<shopQuestion
v-show="isShopQuestionDisplayed"
ref="shopQuestion"
:ref="SHOP_QUESTION_REF_NAME"
v-model="selectedProvider"
:selectedAppointmentType="selectedAppointmentType"
:isDisplayed="isShopQuestionDisplayed"
@ -95,10 +95,10 @@
setMobileProviderNumber
" />
<contentGroupModal
ref="RecalModal"
:ref="RECAL_MODAL_REF_NAME"
cmsWidgetName="RecalModal" />
<siteFooter
ref="siteFooter"
:ref="SITE_FOOTER_REF_NAME"
class="mt-5"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="
@ -152,6 +152,11 @@ defineRule('mobile-location-required', (value) => {
return true;
});
defineRule('selection-required', required(errorMessages.OPTION_REQUIRED));
const SHOP_QUESTION_REF_NAME = "shopQuestion";
const RECAL_MODAL_REF_NAME = "RecalModal";
const SITE_FOOTER_REF_NAME = "siteFooter";
export default {
name: 'service-location',
components: {
@ -217,7 +222,7 @@ export default {
resultMap.mobileFeePart,
resultMap.shopQuestionInitialData?.mobileProviderNumber
);
vm.$refs.shopQuestion.initializeComponent(resultMap.shopQuestionInitialData);
vm.$refs[SHOP_QUESTION_REF_NAME].initializeComponent(resultMap.shopQuestionInitialData);
});
},
setup() {
@ -389,7 +394,7 @@ export default {
);
},
async reloadShopData(zipCode) {
await this.$refs.shopQuestion.reloadShopData(zipCode);
await this.$refs[SHOP_QUESTION_REF_NAME].reloadShopData(zipCode);
},
async forwardButtonAction() {
let provider = this.selectedProvider;