CASH-1918: Mobile First modal data events

src/constants/analytics.js

@@ -14,6 +14,7 @@ const GaCategories = {
     EVOX: "Evox",
     APPOINTMENT: "Appointment",
     SERVICE_LOCATION: "service-location",
+    CONFIRMATION_CLICKED: "confirmation clicked",
 };
 
 const GaActions = {
@@ -26,6 +27,8 @@ const GaActions = {
     MOBILE_AVAILABLE: "mobile_available",
     SHOPS_FIRST_DISPLAYED: "shops_first_displayed",
     MORE_LOCATIONS_CLICKED: "more_locations_clicked",
+    YES: "yes",
+    NO: "no",
 };
 
 const GaLabels = {

src/layouts/schedule/mobile-first-modal/mobile-first-modal.vue

@@ -58,6 +58,7 @@ export default {
                 timeSlot: null,
                 date: null,
             },
+            confirmedAppointment: false,
         };
     },
     methods: {
@@ -67,6 +68,7 @@ export default {
             this.modal.openModal();
         },
         onModalClosed() {
+            this.pushEvent();
             this.$emit("close-mobile-first-modal");
         },
         closeModal() {
@@ -78,6 +80,7 @@ export default {
                 routeCode: this.selectedAppontment.timeSlot.id,
                 date: this.selectedAppontment.date,
             };
+            this.confirmedAppointment = true;
             this.$emit("confirm-appointment", selectedTimeSlot);
             this.modal.closeModal();
         },
@@ -90,6 +93,19 @@ export default {
         setIsModalOpen(isOpen) {
             this.isModalOpen = isOpen;
         },
+        pushEvent() {
+            let gaAction = this.confirmedAppointment ? this.GaActions.YES : this.GaActions.NO;
+            this.pushEventToGA(
+                this.GaCategories.CONFIRMATION_CLICKED,
+                gaAction,
+                this.selectedAppontment.timeSlot.startTime +
+                    "-" +
+                    this.selectedAppontment.timeSlot.endTime +
+                    " " +
+                    this.selectedAppontment.date,
+                true
+            );
+        },
     },
     computed: {
         modalName() {