INSR-6047 - New elements and functionality
Page is functional and has all necessary elements No styling done
This commit is contained in:
parent
d56629b346
commit
55f7dcf0fb
1 changed files with 68 additions and 43 deletions
|
|
@ -15,16 +15,26 @@
|
|||
id="sub-header"
|
||||
cmsWidgetName="SiteSubHeader"
|
||||
class="mb-0 mt-4 text-center" />
|
||||
<buttonQuestion
|
||||
ref="buttonQuestion"
|
||||
v-model="selectedProvider"
|
||||
class="provider-preference"
|
||||
questionText="Select an option:"
|
||||
:answers="prefAnswers"
|
||||
groupName="prefQuestions"
|
||||
buttonTypeString="providerPrefRadio"
|
||||
:validationRules="rules.optionRequired"
|
||||
isRequired />
|
||||
<div
|
||||
class="body-text"
|
||||
v-html="scheduleWithSafeliteText"></div>
|
||||
<buttonMain
|
||||
ref="buttonMain"
|
||||
variant="navigation"
|
||||
buttonText="Schedule now"
|
||||
:class="
|
||||
(disableForwardAction || isForwardActionDisabled) &&
|
||||
'form-test-invalid'
|
||||
"
|
||||
@clickEvent="forwardButtonAction(options.SAFELITE)" />
|
||||
<div
|
||||
class="body-text"
|
||||
v-html="scheduleWithOtherText"></div>
|
||||
<textLink
|
||||
linkType="navigation"
|
||||
text="Find another shop"
|
||||
href="#"
|
||||
@clickEvent="forwardButtonAction(options.TPA)" />
|
||||
<siteFooter
|
||||
:ref="SITE_FOOTER_REF_NAME"
|
||||
class="mt-5"
|
||||
|
|
@ -33,6 +43,7 @@
|
|||
:isForwardButtonNavigationDisabled="isForwardNavigationDisabled"
|
||||
@backClicked="navigateBack"
|
||||
@forwardClicked="forwardButtonAction" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -80,6 +91,8 @@ import globalRules from '@/constants/global-rules';
|
|||
import bailoutMessage from '@/constants/bailoutMessage';
|
||||
import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal.vue';
|
||||
import showIssLoadingModal from '@/helpers/loading-modal-helper';
|
||||
import textLink from '@/ux-components/text-link/text-link.vue';
|
||||
import buttonMain from '@/ux-components/button-main/button-main.vue';
|
||||
|
||||
const options = { SAFELITE: 'SafeliteOption', TPA: 'TPAOption' };
|
||||
const RECAL_MODAL_REF_NAME = 'RecalModal';
|
||||
|
|
@ -97,10 +110,12 @@ export default {
|
|||
// eslint-disable-next-line vue/no-reserved-component-names
|
||||
Form,
|
||||
buttonQuestion,
|
||||
buttonMain,
|
||||
steeringModal,
|
||||
shopPreferenceModal,
|
||||
tpaRecalModal,
|
||||
contentGroupModal
|
||||
contentGroupModal,
|
||||
textLink
|
||||
},
|
||||
mixins: [baseFormMixin],
|
||||
async beforeRouteEnter(to, from, next) {
|
||||
|
|
@ -176,6 +191,15 @@ export default {
|
|||
},
|
||||
ackError() {
|
||||
return errorMessages.ACKNOWLEDGEMENT_REQUIRED;
|
||||
},
|
||||
scheduleWithSafeliteText() {
|
||||
return this.getCmsContent('ScheduleWithSafeliteText', 'BodyText');
|
||||
},
|
||||
scheduleWithOtherText() {
|
||||
return this.getCmsContent('ScheduleWithOtherText', 'BodyText');
|
||||
},
|
||||
options() {
|
||||
return options;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -223,41 +247,42 @@ export default {
|
|||
showIssLoadingModal(true);
|
||||
this.navigateForward(this.navigationScenarios.CLICKED_FORWARD_WITH_TPA_ENABLED);
|
||||
},
|
||||
forwardButtonAction() {
|
||||
if (this.selectedProvider) {
|
||||
let scenario = null;
|
||||
switch (this.selectedProvider) {
|
||||
case options.SAFELITE:
|
||||
this.mainStore.updateIsSafeliteProvider(true);
|
||||
forwardButtonAction(selectedProvider) {
|
||||
console.log('forwardButtonAction', selectedProvider);
|
||||
let scenario = null;
|
||||
switch (selectedProvider) {
|
||||
case options.SAFELITE:
|
||||
this.mainStore.updateIsSafeliteProvider(true);
|
||||
scenario =
|
||||
this.navigationScenarios
|
||||
.CLICKED_FORWARD_WITH_SAFELITE;
|
||||
break;
|
||||
case options.TPA:
|
||||
this.mainStore.updateIsSafeliteProvider(false);
|
||||
console.log('enableTPAFlow', this.mainStore.issConfig.enableTPAFlow);
|
||||
if (this.mainStore.issConfig.enableTPAFlow) {
|
||||
console.log('hasRecalibrationPart', this.mainStore.hasRecalibrationPart);
|
||||
if (this.mainStore.hasRecalibrationPart) {
|
||||
this.$refs[TPA_RECAL_MODAL_REF_NAME].openModal();
|
||||
return;
|
||||
}
|
||||
scenario =
|
||||
this.navigationScenarios
|
||||
.CLICKED_FORWARD_WITH_SAFELITE;
|
||||
break;
|
||||
case options.TPA:
|
||||
this.mainStore.updateIsSafeliteProvider(false);
|
||||
if (this.mainStore.issConfig.enableTPAFlow) {
|
||||
if (this.mainStore.hasRecalibrationPart) {
|
||||
this.$refs[TPA_RECAL_MODAL_REF_NAME].openModal();
|
||||
return;
|
||||
}
|
||||
scenario =
|
||||
this.navigationScenarios
|
||||
.CLICKED_FORWARD_WITH_TPA_ENABLED;
|
||||
} else {
|
||||
this.mainStore.setBailout(bailoutMessage.TPANotEnabled());
|
||||
scenario =
|
||||
this.navigationScenarios
|
||||
.CLICKED_FORWARD_WITH_TPA_DISABLED;
|
||||
}
|
||||
break;
|
||||
default:
|
||||
}
|
||||
this.navigateForward(scenario);
|
||||
this.mainStore.saveProviderPreferenceData({
|
||||
selectedProvider: this.selectedProvider,
|
||||
tpaAcknowledgement: this.tpaAcknowledgement
|
||||
});
|
||||
.CLICKED_FORWARD_WITH_TPA_ENABLED;
|
||||
} else {
|
||||
this.mainStore.setBailout(bailoutMessage.TPANotEnabled());
|
||||
scenario =
|
||||
this.navigationScenarios
|
||||
.CLICKED_FORWARD_WITH_TPA_DISABLED;
|
||||
}
|
||||
break;
|
||||
default:
|
||||
}
|
||||
this.navigateForward(scenario);
|
||||
this.mainStore.saveProviderPreferenceData({
|
||||
selectedProvider: selectedProvider,
|
||||
tpaAcknowledgement: this.tpaAcknowledgement
|
||||
});
|
||||
},
|
||||
openStateSteeringModal() {
|
||||
this.$refs[STEERING_MODAL_REF_NAME].openModal();
|
||||
|
|
|
|||
Loading…
Reference in a new issue