feat(orders) ORDERS-4645 Add pickups to storefront order invoice

CHANGELOG.md

@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## Draft
 - Blog Pages Do Not Include Link Rel Next/Prev Tags. [#2214](https://github.com/bigcommerce/cornerstone/issues/2214).
 - Add lang attribute to html tag to improve checkout accesibility [#2210]https://github.com/bigcommerce/cornerstone/pull/2210
+- Add pickups to storefront invoice [#2216](https://github.com/bigcommerce/cornerstone/pull/2216)
 
 ## Unreleased (unreleased)
 - Fixed "None" not being selected by default on unrequired Pick Lists without images [#2215](https://github.com/bigcommerce/cornerstone/pull/2215)

assets/scss/invoice.scss

@@ -115,6 +115,10 @@ th.ProductTotal,
     }
 }
 
+.NewAddress {
+    border-top: 1px solid #000;
+}
+
 .InvoiceItems,
 .PackingSlipItems {
     border-top: 1px solid #000;

lang/en.json

@@ -346,6 +346,7 @@
                 "ship_to": "Ship To",
                 "ship_to_multi": "Items shipped to {street}, {city}, {state}, {zip}, {country}",
                 "ship_to_multi_text": "Order will be shipped to multiple addresses",
+                "pickup_details": "Pickup Details",
                 "bill_to": "Bill To",
                 "how_to_pay": "Here's how to pay for your order:",
                 "order_details": "Order Details",
@@ -815,6 +816,10 @@
         "qty": "Qty",
         "code": "Code/SKU",
         "shipping_address": "Shipping Address",
+        "fulfillment": "Fulfillment",
+        "digital": "Digital",
+        "shipping": "Shipping",
+        "pickup": "Pickup",
         "product_name": "Product Name",
         "price": "Price",
         "total": "Total",

templates/pages/account/orders/invoice.html

@@ -56,6 +56,22 @@ <h3>{{lang 'account.orders.details.ship_to'}}</h3>
                     </div>
                 {{/unless}}
             {{/if}}
+            {{#if order.pickup_address}}
+                {{#unless order.has_multiple_shipping_addresses}}
+                    <div class="ShippingAddress">
+                        <h3>{{lang 'account.orders.details.pickup_details'}}</h3>
+                        <ul>
+                            <li><strong>{{order.pickup_address.line1}}</strong></li>
+                            <li>{{order.pickup_address.line2}}</li>
+                            <li>{{order.pickup_address.city}}, {{order.pickup_address.state}} {{order.pickup_address.zip}}</li>
+                            <li>{{order.pickup_address.country}}</li>
+                            <li>&nbsp;</li>
+                            <li>{{lang 'invoice.phone' number=order.pickup_address.phone}}</li>
+                            {{#if order.pickup_address.email}}<li>{{lang 'invoice.email' email=order.pickup_address.email}}</li>{{/if}}
+                        </ul>
+                    </div>
+                {{/unless}}
+            {{/if}}
         </div>
 
         <div class="InvoiceDetails">
@@ -89,7 +105,7 @@ <h2 class="InvoiceHeading">{{lang 'invoice.order_items'}}</h2>
                 <thead>
                 <tr>
                     {{#if order.has_multiple_shipping_addresses}}
-                        <th class="ProductAddress">{{lang 'invoice.shipping_address'}}</th>
+                        <th class="ProductAddress">{{lang 'invoice.fulfillment'}}</th>
                     {{/if}}
                     <th class="ProductQuantity">{{lang 'invoice.qty'}}</th>
                     <th class="ProductSku">{{lang 'invoice.code'}}</th>
@@ -100,12 +116,21 @@ <h2 class="InvoiceHeading">{{lang 'invoice.order_items'}}</h2>
                 </thead>
                 <tbody class="InvoiceItemList">
                 {{#each order.items}}
-                    <tr>
+                    <tr {{#if new_address}}class="NewAddress"{{/if}}>
                         {{#if ../order.has_multiple_shipping_addresses}}
                             <td class="ProductAddress">
                                 {{#each shipping_rows}}
+                                    {{#if is_pickup}}
+                                        <div><b>{{lang 'invoice.pickup'}}</b></div>
+                                    {{/if}}
+                                    {{#if is_shipping}}
+                                        <div><b>{{lang 'invoice.shipping'}}</b></div>
+                                    {{/if}}
+                                    {{#if is_digital}}
+                                        <div><b>{{lang 'invoice.digital'}}</b></div>
+                                    {{/if}}
                                     <div>{{address}}</div>
-                                    <div>{{city}}, {{state}} {{zip}}</div>
+                                    <div>{{city}} {{state}} {{zip}}</div>
                                     <div>{{country}}</div>
                                 {{/each}}
                             </td>
@@ -115,7 +140,6 @@ <h2 class="InvoiceHeading">{{lang 'invoice.order_items'}}</h2>
                         <td class="ProductDetails">
                             {{name}}
                             <div class="ProductAttributes">
-
                                 {{#each options}}
                                     <div class="ConfigurableProductRow">
                                         <div class="Label">{{name}}:</div>