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

Revert "CASH-376 removing transition prevents rendering CTA on top of modal"

Browse source 
This reverts commit 6fa7dcb364.
This commit is contained in:
Matt Caimi 2025-04-30 11:34:32 -04:00
parent 9a6a2fa0d0
commit 59a8202ad2
1 changed files with 66 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

130
src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue
View file

@ -1,70 +1,72 @@
<template> <template>
<div class="mobile-location-questions"> <transition name="fade" mode="out-in">
<div class="text-center" :id="componentId"> <div class="mobile-location-questions">
<label <div class="text-center" :id="componentId">
for="mobileLocationLinkPromptId" <label
:aria-label="mobileLocationLinkPromptText" for="mobileLocationLinkPromptId"
class="form-label fw-bold w-100 ps-4 pe-4 pt-4 text-black" :aria-label="mobileLocationLinkPromptText"
v-html="mobileLocationLinkPromptText"></label> class="form-label fw-bold w-100 ps-4 pe-4 pt-4 text-black"
<div class="update-mobile-location-text-link"> v-html="mobileLocationLinkPromptText"></label>
<textLink <div class="update-mobile-location-text-link">
ref="mobileLocationLink" <textLink
id="mobileLocationLinkPromptId" ref="mobileLocationLink"
linkType="text" id="mobileLocationLinkPromptId"
:text="mobileLocationLinkText" linkType="text"
href="#!" :text="mobileLocationLinkText"
@click-event="openModal" /> href="#!"
@click-event="openModal" />
</div>
<div v-show="errorMessage" class="row my-1 form-test-error">
<span
class="d-inline-flex small mt-0 center-error-message"
aria-atomic="true"
aria-live="polite">
{{ errorMessage }}
</span>
</div>
<textBlock
v-if="mobileFeeApplies"
:customText="mobileFeeText"
cmsWidgetName="MobileFeeDisclaimerWidget"
typeStyle="caption" />
</div> </div>
<div v-show="errorMessage" class="row my-1 form-test-error"> <modal
<span :ref="modalName"
class="d-inline-flex small mt-0 center-error-message" :headerText="modalHeaderText"
aria-atomic="true" :footerButtonText="modalFooterText"
aria-live="polite"> :onModalOpenedCallback="onModalOpened"
{{ errorMessage }} :onModalClosedCallback="onModalClosed"
</span> @isModalOpened="setModalStatus"
</div> @footer-button-event="setMobileLocation">
<textBlock <template v-if="isModalOpened">
v-if="mobileFeeApplies" <addressQuestions
:customText="mobileFeeText" ref="addressQuestions"
cmsWidgetName="MobileFeeDisclaimerWidget" v-model="internalModel.addressQuestions"
typeStyle="caption" /> captureApartmentNumberOrBusinessName="true"
preserveCityAndStateOnReset="true" />
<vehicleProtectedQuestion
ref="vehicleProtectedQuestion"
v-model="internalModel.isVehicleProtected"
cmsWidgetName="VehicleProtectedQuestionWidget" />
<textBlock cmsWidgetName="WorkspaceRequirementsWidget" typeStyle="caption" />
<alert
ref="alertInvalidZip"
v-if="displayInvalidZipAlert"
class="my-4"
cmsWidgetName="AlertInvalidZipWidget"
alertClass="alert-danger"
v-bind:isDismissible="false" />
<alert
ref="alertMismatchStateAndZip"
v-if="displayMismatchStateAndZipAlert"
class="my-4"
cmsWidgetName="AlertMismatchStateAndZipWidget"
alertClass="alert-danger"
v-bind:isDismissible="false" />
</template>
</modal>
</div> </div>
<modal </transition>
:ref="modalName"
:headerText="modalHeaderText"
:footerButtonText="modalFooterText"
:onModalOpenedCallback="onModalOpened"
:onModalClosedCallback="onModalClosed"
@isModalOpened="setModalStatus"
@footer-button-event="setMobileLocation">
<template v-if="isModalOpened">
<addressQuestions
ref="addressQuestions"
v-model="internalModel.addressQuestions"
captureApartmentNumberOrBusinessName="true"
preserveCityAndStateOnReset="true" />
<vehicleProtectedQuestion
ref="vehicleProtectedQuestion"
v-model="internalModel.isVehicleProtected"
cmsWidgetName="VehicleProtectedQuestionWidget" />
<textBlock cmsWidgetName="WorkspaceRequirementsWidget" typeStyle="caption" />
<alert
ref="alertInvalidZip"
v-if="displayInvalidZipAlert"
class="my-4"
cmsWidgetName="AlertInvalidZipWidget"
alertClass="alert-danger"
v-bind:isDismissible="false" />
<alert
ref="alertMismatchStateAndZip"
v-if="displayMismatchStateAndZipAlert"
class="my-4"
cmsWidgetName="AlertMismatchStateAndZipWidget"
alertClass="alert-danger"
v-bind:isDismissible="false" />
</template>
</modal>
</div>
</template> </template>
<script> <script>