Merge pull request #1524 from Safelite/feature/CSR-1388-tech-review-changes

Feature/csr 1388 tech review changes

src/fmg-components/cart/cart.vue

@@ -2,19 +2,20 @@
     <div class="cart">
         <div class="px-0">
             <div
-                class="row vin-toggle flex align-items-center"
+                class="row vin-toggle flex align-items-center py-4"
                 :class="[isExpanded ? 'expanded' : '']"
                 @click="toggleIsExpanded()">
                 <div class="col d-flex justify-content-between">
                     <span class="label">{{ amountDueText }}</span
-                    ><span class="label amount-due">{{ currencyFormatter.format(amountDue) }}</span>
+                    ><span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span>
                 </div>
             </div>
             <div class="price-table">
                 <div class="service-type">
-                    <textBlock :cmsWidgetName="servicePackageTitleWidget" /><span>{{
-                        currencyFormatter.format(packagePrice)
-                    }}</span>
+                    <textBlock :cmsWidgetName="servicePackageTitleWidget" />
+                    <span>
+                        {{ getFormattedAmount("", packagePrice) }}
+                    </span>
                 </div>
 
                 <!-- Packaged Cart Items -->
@@ -52,36 +53,25 @@
                         :text="recycleFeeCartItem.name"
                         href="#!"
                         @click-event="openModal(recyclingModalCmsWidgetName)" />
-                    <span v-else-if="cartItem == recycleFeeCartItem">{{
-                        recycleFeeCartItem.name
-                    }}</span>
-                    <span
-                        >{{
-                            `${
-                                cartItem.category == "promos"
-                                    ? "(" + currencyFormatter.format(cartItem.subTotal * -1) + ")"
-                                    : currencyFormatter.format(cartItem.subTotal)
-                            }`
-                        }}
-                    </span>
+                    <span>{{ getFormattedAmount(cartItem.category, cartItem.subTotal) }}</span>
                 </div>
 
                 <!-- Sub total, sales tax, total columns -->
                 <div class="sub-total">
                     <span>{{ subtotalText }}</span
-                    ><span>{{ currencyFormatter.format(subTotal) }}</span>
+                    ><span>{{ getFormattedAmount("", subTotal) }}</span>
                 </div>
                 <div class="sales-tax">
                     <span>{{ salesTaxText }}</span
-                    ><span>{{ currencyFormatter.format(salesTax) }}</span>
+                    ><span>{{ getFormattedAmount("", salesTax) }}</span>
                 </div>
                 <div v-if="showAsPaid" class="amount-paid">
                     <span>{{ amountPaidText }}</span
-                    ><span>{{ currencyFormatter.format(amountPaid) }}</span>
+                    ><span>{{ getFormattedAmount("", amountPaid) }}</span>
                 </div>
                 <div class="amount-due">
                     <span>{{ amountDueText }}</span
-                    ><span>{{ currencyFormatter.format(amountDue) }}</span>
+                    ><span>{{ getFormattedAmount("", amountDue) }}</span>
                 </div>
             </div>
         </div>
@@ -180,6 +170,11 @@ export default {
 
             return vapsTypeName.Text;
         },
+        getFormattedAmount(category, amount) {
+            return category == "promos"
+                ? "(" + this.currencyFormatter.format(amount * -1) + ")"
+                : this.currencyFormatter.format(amount);
+        },
         removeItem(cartItemType, category) {
             this.lineItems[category] = this.lineItems[category].filter(
                 (lineItemsToKeep) => lineItemsToKeep.cartItemType != cartItemType

src/layouts/payment-method/payment-method.vue

@@ -19,7 +19,7 @@
                         <span>{{ noPiaDisclaimer }}</span>
                     </p>
 
-                    <hr />
+                    <hr class="my-0" />
 
                     <cart
                         :damage="damageInfo"