Merge pull request #2510 from patzick/bugfix/#2450-show-prices-after-…

…adding-product-to-cart-in-offline-mode Bugfix/#2450 show prices after adding product to cart in offline mode
vuestorefront · Feb 27, 2019 · 85d985b · 85d985b
2 parents 4f30bf4 + 450cc11
commit 85d985b
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,9 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [1.8.3] - 2019.02.27
+### Added
+- New reactive helper to check online state. Usage: `import { onlineHelper } from '@vue-storefront/core/helpers'` and then `onlineHelper.isOnline` - @patzick (#2510)
+
 ### Fixed
 - Problem with placing second order (unbinding payment methods after first order) - @patzick (#2195, #2503)
 
@@ -34,6 +37,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Inconsistent filters behaviour - clear filters on page load - @patzick (#2435)
 - fix price is never below 0 and user can't add 0 or below 0 products to cart @RakowskiPrzemyslaw (#2437)
 - Check for placing single order in case of error in any payment module - @patzick (#2409)
+- Display prices in products added in offline mode. - @patzick (#2450)
 
 ### Deprecated / Removed
 - `@vue-storefront/store` package deprecated - @filrak

diff --git a/core/helpers/index.ts b/core/helpers/index.ts
@@ -2,6 +2,7 @@ import rootStore from '@vue-storefront/core/store'
 import SearchQuery from '@vue-storefront/core/lib/search/searchQuery'
 import { remove as removeAccents } from 'remove-accents'
 import { Logger } from '@vue-storefront/core/lib/logger'
+import Vue from 'vue'
 
 /**
  * Create slugify -> "create-slugify" permalink  of text
@@ -159,3 +160,10 @@ export function once (key, fn) {
 }
 
 export const isServer: boolean = typeof window === 'undefined'
+
+// Online/Offline helper
+export const onlineHelper = Vue.observable({ 
+  isOnline: isServer || navigator.onLine 
+})
+!isServer && window.addEventListener('online',  () => onlineHelper.isOnline = true)
+!isServer && window.addEventListener('offline', () => onlineHelper.isOnline = false)
diff --git a/core/modules/cart/store/getters.ts b/core/modules/cart/store/getters.ts
@@ -4,10 +4,11 @@ import i18n from '@vue-storefront/i18n'
 import CartState from '../types/CartState'
 import RootState from '@vue-storefront/core/types/RootState'
 import AppliedCoupon from '../types/AppliedCoupon'
+import { onlineHelper } from '@vue-storefront/core/helpers'
 
 const getters: GetterTree<CartState, RootState> = {
   totals (state) {
-    if (state.platformTotalSegments) {
+    if (state.platformTotalSegments && onlineHelper.isOnline) {
       return state.platformTotalSegments
     } else {
       let shipping = state.shipping instanceof Array ? state.shipping[0] : state.shipping

diff --git a/src/themes/default/components/core/blocks/Microcart/Product.vue b/src/themes/default/components/core/blocks/Microcart/Product.vue
@@ -53,7 +53,7 @@
           {{ product.priceInclTax * product.qty | price }}
         </span>
       </div>
-      <div class="prices" v-if="product.totals && displayItemDiscounts">
+      <div class="prices" v-else-if="product.totals">
         <span class="h4 serif cl-error price-special" v-if="product.totals.discount_amount">
           {{ product.totals.row_total_incl_tax - product.totals.discount_amount | price }}&nbsp;
         </span>
@@ -64,6 +64,11 @@
           {{ product.totals.row_total_incl_tax | price }}
         </span>
       </div>
+      <div class="prices" v-else>
+        <span class="h4 serif price-regular">
+          {{ product.regular_price * product.qty | price }}
+        </span>
+      </div>
       <div class="links">
         <div class="mt5" @click="removeItem">
           <remove-button />