CSR-1012 | modal footer button updates

src/digital-components/modal/modal.vue

@@ -35,7 +35,7 @@
                         ref="buttonMain"
                         suppressLoader
                         :buttonText="ModalCloseButtonText"
-                        @click-event="buttonMainClick" />
+                        @click-event="footerButtonClick" />
                 </div>
             </div>
         </div>
@@ -49,8 +49,11 @@ export default {
     name: "modal",
     props: {
         cmsWidgetName: String,
-        buttonClick: {
+
+        footerButtonCallback: {
             type: Function,
+            // return true to close modal
+            // if undefined, footer button closes modal
         },
     },
     computed: {
@@ -73,12 +76,7 @@ export default {
             return this.getCmsContent(this.cmsWidgetName, "FooterText");
         },
         showModalBody() {
-            return (
-                this.ModalImage ||
-                this.ModalHeadline ||
-                this.ModalSubheadertext ||
-                this.ModalBodyText
-            );
+            return this.ModalBodyText;
         },
     },
     methods: {
@@ -88,9 +86,11 @@ export default {
         closeModal() {
             this.$refs.modalXButton.click();
         },
-        buttonMainClick() {
-            if (this.buttonClick) {
-                this.buttonClick();
+        async footerButtonClick() {
+            if (this.footerButtonCallback) {
+                if (await this.footerButtonCallback()) {
+                    this.closeModal();
+                }
             } else {
                 this.closeModal();
             }

src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue

@@ -16,7 +16,10 @@
                 aria-label="Modal window" />
         </div>
     </div>
-    <modal ref="zipCodeInputModal" :cmsWidgetName="this.modalWidgetName" :buttonClick="setZip">
+    <modal
+        ref="zipCodeInputModal"
+        :cmsWidgetName="this.modalWidgetName"
+        :footerButtonCallback="setZip">
         <div class="ps-4 pe-4 pb-4">
             <textboxQuestion
                 ref="zipInputTextQuestion"
@@ -106,7 +109,7 @@ export default {
             const zipLength = 5;
             if (!this.serviceZipCodeInput || this.serviceZipCodeInput.length < zipLength) {
                 // prevent reading 1111 as 01111
-                return;
+                return false;
             }
 
             const zipCodeData = await this.getZipCodeData(this.serviceZipCodeInput);
@@ -119,8 +122,11 @@ export default {
                 this.serviceZip = this.serviceZipCodeInput;
                 this.serviceZipState = zipCodeData.state;
 
-                this.$refs.zipCodeInputModal.closeModal();
+                // close modal
+                return true;
             }
+
+            return false;
         },
     },
     computed: {