Populate fields and detect changes on submit.

src/layouts/review/review-sections/customer-review/customer-details-modal-question/customer-details-modal-question.vue

@@ -68,11 +68,22 @@ export default {
             isSmsOptIn: false,
         };
     },
-    props: {},
+    props: {
+        previousCustomerValues: Object,
+    },
     computed: {
         modal() {
             return this.$refs.CustomerDetailsModal;
         },
+        haveCustomerDetailsChanged() {
+            return (
+                this.firstName !== this.previousCustomerValues?.firstName ||
+                this.lastName !== this.previousCustomerValues?.lastName ||
+                this.emailAddress !== this.previousCustomerValues?.emailAddress ||
+                this.phoneNumber !== this.previousCustomerValues?.phoneNumber ||
+                this.isSmsOptIn !== this.previousCustomerValues?.isSmsOptIn
+            );
+        },
     },
     methods: {
         openModal() {
@@ -81,12 +92,24 @@ export default {
         closeModal() {
             this.modal.closeModal();
         },
-        onModalOpened() {},
+        onModalOpened() {
+            this.firstName = this.previousCustomerValues?.firstName ?? "";
+            this.lastName = this.previousCustomerValues?.lastName ?? "";
+            this.emailAddress = this.previousCustomerValues?.emailAddress ?? "";
+            this.phoneNumber = this.previousCustomerValues?.phoneNumber ?? "";
+            this.isSmsOptIn = this.previousCustomerValues?.isSmsOptIn ?? false;
+        },
         onModalClosed() {},
         setModalStatus(isOpened) {
             this.isModalOpened = isOpened;
         },
-        setContactDetails() {},
+        async setContactDetails() {
+            if (this.haveCustomerDetailsChanged) {
+                console.log("change detected");
+            }
+
+            this.closeModal();
+        },
     },
     components: {
         modal,

src/layouts/review/review.vue

@@ -89,7 +89,9 @@
                 <hr class="my-0" />
             </div>
 
-            <customerDetailsModalQuestion ref="customerDetailsModalQuestion" />
+            <customerDetailsModalQuestion
+                ref="customerDetailsModalQuestion"
+                :previousCustomerValues="customerInfo" />
 
             <funnelFooter
                 cmsWidgetName="FunnelFooterWidget"