From 19eb891ca99878588b560060ebd0fd42b74278c3 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Wed, 19 Feb 2025 10:18:48 -0500
Subject: [PATCH] WIP

---
 .../donation-block/donation-block.vue         | 30 +++++++++----------
 src/layouts/confirmation/confirmation.vue     | 13 ++++----
 src/store/index.js                            | 14 +++++----
 3 files changed, 30 insertions(+), 27 deletions(-)

diff --git a/src/fmg-components/donation-block/donation-block.vue b/src/fmg-components/donation-block/donation-block.vue
index d895e801b..2d57a9a29 100644
--- a/src/fmg-components/donation-block/donation-block.vue
+++ b/src/fmg-components/donation-block/donation-block.vue
@@ -1,9 +1,6 @@
 <template>
     <div class="donation-block">
-        <form
-            ref="donationForm"
-            id="donation-form"
-            @submit.prevent="handleDonationAction">
+        <form ref="donationForm" id="donation-form" @submit.prevent="handleDonationAction">
             <div class="row">
                 <div class="col">
                     <p class="headline text-center" v-html="DonationHeadline"></p>
@@ -26,11 +23,16 @@
             <div class="row">
                 <div class="col">
                     <div class="donation-slider my-4">
-                        <input name="amount" id="one" type="radio" value=1 checked />
+                        <input
+                            name="amount"
+                            id="one"
+                            type="radio"
+                            :value="donationValues[0]"
+                            checked />
                         <label for="one" class="label">$1</label>
-                        <input name="amount" id="three" type="radio" value=3 />
+                        <input name="amount" id="three" type="radio" :value="donationValues[1]" />
                         <label for="three" class="label">$3</label>
-                        <input name="amount" id="five" type="radio" value=5 />
+                        <input name="amount" id="five" type="radio" :value="donationValues[2]" />
                         <label for="five" class="label">$5</label>
                         <div class="indicator-bar"></div>
                     </div>
@@ -78,6 +80,7 @@ export default {
         modelValue: String,
         showDonationSuccess: Boolean,
         showDonationError: Boolean,
+        donationValues: Array,
     },
     computed: {
         DonationHeadline() {
@@ -113,17 +116,14 @@ export default {
             },
         },
     },
-    // data() {
-    //     return {
-    //         donationSuccess: true,
-    //         donationError: true,
-    //     };
-    // },
     methods: {
         handleDonationAction(submitEvent) {
-            console.log("running handleDonationAction(), submitEvent.target.elements.amount.value: ", submitEvent.target.elements.amount.value)
+            console.log(
+                "running handleDonationAction(), submitEvent.target.elements.amount.value: ",
+                submitEvent.target.elements.amount.value
+            );
             this.selectedValue = submitEvent.target.elements.amount.value;
-        }
+        },
     },
     components: {
         textLink,
diff --git a/src/layouts/confirmation/confirmation.vue b/src/layouts/confirmation/confirmation.vue
index d5993595f..fb6c1d5f0 100644
--- a/src/layouts/confirmation/confirmation.vue
+++ b/src/layouts/confirmation/confirmation.vue
@@ -223,7 +223,7 @@ export default {
         const donationItems = lineItemsFromSubmittedOrder.supportingItems?.filter(
             (item) => item.partNumber === "DONATION"
         );
-        const donationAmount = (donationItems?.length > 0) ? donationItems[0].sellingPrice : 0;
+        const donationAmount = donationItems?.length > 0 ? donationItems[0].sellingPrice : 0;
 
         // Call the "next" function to complete the transition to this page.
         next((vm) => {
@@ -244,7 +244,6 @@ export default {
             donationAmount: 0,
             showDonationSuccess: null,
             showDonationError: null,
-
         };
     },
     computed: {
@@ -530,11 +529,11 @@ export default {
                 false
             ).catch((error) => {
                 // this.$refs.navbar.removeLoader();
-                console.error("Error!!! error: ", error)
+                console.error("Error!!! error: ", error);
                 return error;
             });
 
-            console.log("ran addDonation()... (*fake call*) donationResponse: ", donationResponse)
+            console.log("ran addDonation()... (*fake call*) donationResponse: ", donationResponse);
 
             if (donationResponse?.status == "200") {
                 this.showDonationSuccess = true;
@@ -553,16 +552,16 @@ export default {
                     false
                 );
             }
-
         },
     },
     watch: {
         donationAmount(newValue) {
+            newValue = parseInt(newValue);
             console.log("WATCHED donationAmount changed: ", newValue);
-            
+
             // this.addDonation(newValue);
             // TODO - when backend code is final, then remove the below and restore the line above
-            if (newValue == 5) {
+            if (newValue === 5) {
                 this.addDonation(newValue, "FAILING_PLATE"); // throws error
             } else {
                 this.addDonation(newValue, "2fast"); // should give successful response
diff --git a/src/store/index.js b/src/store/index.js
index 6a27116e1..00259cb2b 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -3158,11 +3158,13 @@ export const actions = {
 
     addDonationToSubmittedOrder(context, donationAmount) {
         console.log("running addDonationToSubmittedOrder()... donationAmount: ", donationAmount);
-        
+
         const submittedOrder = deepClone(baseMixin.methods.getSubmittedOrder());
-        
+
         if (donationAmount > 0) {
-            console.log("running addDonationToSubmittedOrder()... adding donation to supportingItems in session storage ")
+            console.log(
+                "running addDonationToSubmittedOrder()... adding donation to supportingItems in session storage "
+            );
             submittedOrder.lineItems.supportingItems.push({
                 partNumber: "DONATION",
                 description: null,
@@ -3177,9 +3179,11 @@ export const actions = {
             });
         } else {
             // filter out all donations
-            console.log("running addDonationToSubmittedOrder()... removing all donation items in supportingItems in session storage ")
+            console.log(
+                "running addDonationToSubmittedOrder()... removing all donation items in supportingItems in session storage "
+            );
 
-            const nonDonationItems = submittedOrder.lineItems.supportingItems.filter(item => {
+            const nonDonationItems = submittedOrder.lineItems.supportingItems.filter((item) => {
                 return item.partType !== "DONATION";
             });
             submittedOrder.lineItems.supportingItems = nonDonationItems;