Merge pull request #1286 from Safelite/feature/CSR-1422

Feature/csr 1422

src/constants/store-actions.js

@@ -86,6 +86,7 @@ const storeActions = {
         "saveSupportingItemsSuppressingStateResetting",
     SAVE_VAPS: "saveVaps",
     SAVE_CUSTOMER_DETAILS: "saveCustomerDetails",
+    SAVE_SERVICE_LOCATION_TECH_NOTES: "saveServiceLocationTechNotes",
 };
 
 export { storeActions };

src/constants/store-mutations.js

@@ -34,11 +34,13 @@ const storeMutations = {
 
     UPDATE_SERVICE_ZIP: "updateServiceZip",
     UPDATE_SERVICE_LOCATION: "updateServiceLocation",
+    UPDATE_SERVICE_LOCATION_TECH_NOTES: "updateServiceLocationTechNotes",
+    UPDATE_TECH_NOTES: "updateTechNotes",
     UPDATE_SCHEDULE: "updateSchedule",
 
     UPDATE_CUSTOMER_EMAIL_ADDRESS: "updateCustomerEmailAddress",
 
-    //CUSTOMER MUTATIONS
+    // CUSTOMER MUTATIONS
     UPDATE_CUSTOMER_DETAILS: "updateCustomerDetails",
 
     // ORDER MUTATIONS

src/digital-components/textarea-question/textarea-question.vue

@@ -54,7 +54,7 @@ export default {
             },
         },
         remainingCount() {
-            return this.maxLength - this.value.length;
+            return this.maxLength - (this.value?.length ?? 0);
         },
         urgentCountdown() {
             return this.remainingCount <= this.maxLength * 0.1 ? true : false;

src/layouts/customer-details/customer-details.vue

@@ -32,7 +32,7 @@
             <checkboxQuestion
                 class="mb-5"
                 cmsWidgetName="TextMeQuestionWidget"
-                v-model="textMeUpdates" />
+                v-model="isSmsOptin" />
             <textareaQuestion
                 class="mb-4"
                 v-model="techNotes"
@@ -68,6 +68,7 @@ import { required, regex } from "@/helpers/validation-rules";
 import { Form, defineRule } from "vee-validate";
 import { useField, validate } from "vee-validate";
 import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
+import store from "@/store";
 
 // DEFINE VALIDATION RULES
 defineRule("first-name-required", required(errorMessages.FIRST_NAME_REQUIRED));
@@ -105,12 +106,12 @@ export default {
     },
     data() {
         return {
-            techNotes: "",
+            firstName: this.getFirstNameFromStore(),
-            firstName: "",
+            lastName: this.getLastNameFromStore(),
-            lastName: "",
+            emailAddress: this.getEmailAddressFromStore(),
-            emailAddress: "",
+            phoneNumber: this.getPhoneNumberFromStore(),
-            phoneNumber: "",
+            isSmsOptin: this.getIsSmsOptinFromStore(),
-            textMeUpdates: null,
+            techNotes: this.getTechNotesFromStore(),
         };
     },
     computed: {
@@ -122,10 +123,46 @@ export default {
         arePagePrerequisitesValid() {
             return true;
         },
+        getFirstNameFromStore() {
+            return store.getters.order.customer.firstName;
+        },
+        getLastNameFromStore() {
+            return store.getters.order.customer.lastName;
+        },
+        getEmailAddressFromStore() {
+            return store.getters.order.customer.emailAddress;
+        },
+        getPhoneNumberFromStore() {
+            return store.getters.order.customer.phoneNumber;
+        },
+        getIsSmsOptinFromStore() {
+            return store.getters.order.customer.isSmsOptin;
+        },
+        getTechNotesFromStore() {
+            return store.getters.order.serviceLocation.techNotes;
+        },
         backButtonAction() {
             this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
         },
         forwardButtonAction() {
+            this.dispatchStoreAction(
+                this.storeActions.SAVE_CUSTOMER_DETAILS,
+                {
+                    firstName: this.firstName,
+                    lastName: this.lastName,
+                    emailAddress: this.emailAddress,
+                    phoneNumber: this.phoneNumber,
+                    isSmsOptin: this.isSmsOptin,
+                },
+                false
+            );
+
+            this.dispatchStoreAction(
+                this.storeActions.SAVE_SERVICE_LOCATION_TECH_NOTES,
+                this.techNotes,
+                false
+            );
+
             this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route);
         },
     },

src/store/index.js

@@ -59,9 +59,14 @@ const getDefaultState = () => {
                         zipCodeCtu: null,
                     },
                 },
+                techNotes: null,
             },
             customer: {
+                firstName: null,
+                lastName: null,
                 emailAddress: null,
+                phoneNumber: null,
+                isSmsOptin: null,
             },
             damage: {
                 isRepair: null,
@@ -272,6 +277,9 @@ export const mutations = {
             },
         };
     },
+    updateServiceLocationTechNotes(state, techNotes) {
+        state.order.serviceLocation.techNotes = techNotes;
+    },
     updateSchedule(state, scheduleInfo) {
         if (scheduleInfo) {
             state.order.schedule.date = scheduleInfo.date;
@@ -281,14 +289,13 @@ export const mutations = {
             state.order.schedule.jobMaxMinutes = scheduleInfo.jobMaxMinutes;
         }
     },
-    updateCustomerDetails(state, detailsInfo) {
+    updateCustomerDetails(state, customerDetails) {
-        if (detailsInfo) {
+        if (customerDetails) {
-            state.order.customerDetails.firstName = detailsInfo.firstName;
+            state.order.customer.firstName = customerDetails.firstName;
-            state.order.customerDetails.lastName = detailsInfo.lastName;
+            state.order.customer.lastName = customerDetails.lastName;
-            state.order.customerDetails.email = detailsInfo.email;
+            state.order.customer.emailAddress = customerDetails.emailAddress;
-            state.order.customerDetails.telephone = detailsInfo.telephone;
+            state.order.customer.phoneNumber = customerDetails.phoneNumber;
-            state.order.customerDetails.textUpdates = detailsInfo.textUpdates;
+            state.order.customer.isSmsOptin = customerDetails.isSmsOptin;
-            state.order.customerDetails.techNotes = detailsInfo.techNotes;
         }
     },
 
@@ -1966,8 +1973,8 @@ export const actions = {
         context.commit(storeMutations.UPDATE_SCHEDULE, scheduleInfo);
     },
 
-    saveDetails(context, scheduleInfo) {
+    saveCustomerDetails(context, customerDetails) {
-        context.commit(storeMutations.UPDATE_DETAILS, scheduleInfo);
+        context.commit(storeMutations.UPDATE_CUSTOMER_DETAILS, customerDetails);
     },
 
     saveServiceZipCodeInfo(context, serviceZipCodeInfo) {
@@ -2001,6 +2008,10 @@ export const actions = {
         context.commit(storeMutations.UPDATE_SERVICE_LOCATION, serviceLocationInfo);
     },
 
+    saveServiceLocationTechNotes(context, techNotesInfo) {
+        context.commit(storeMutations.UPDATE_SERVICE_LOCATION_TECH_NOTES, techNotesInfo);
+    },
+
     saveEmail(context, email) {
         context.commit(storeMutations.UPDATE_CUSTOMER_EMAIL_ADDRESS, email === "" ? null : email);
     },