@ecomplus/storefront-components 1.0.0-beta.17 → 1.0.0-beta.171

package/src/js/ShippingLine.js

@@ -1,6 +1,10 @@
 import {
   i19days,
+  i19free,
   i19freeShipping,
+  i19pickUpToday,
+  i19receiveToday,
+  i19untilTomorrow,
   i19upTo,
   i19workingDays
 } from '@ecomplus/i18n'
@@ -17,6 +21,10 @@ export default {
     shippingLine: {
       type: Object,
       required: true
+    },
+    productionDeadline: {
+      type: Number,
+      default: 0
     }
   },
 
@@ -29,17 +37,25 @@ export default {
       if (shipping.delivery_time) {
         days += shipping.delivery_time.days
       }
-      return `${i18n(i19upTo)} ${days} ${i18n(isWorkingDays ? i19workingDays : i19days)}`
+      days += this.productionDeadline
+      if (days > 1) {
+        return `${i18n(i19upTo)} ${days} ` +
+          i18n(isWorkingDays ? i19workingDays : i19days).toLowerCase()
+      }
+      return i18n(days === 1
+        ? i19untilTomorrow
+        : shipping.pick_up ? i19pickUpToday : i19receiveToday)
     },
 
     freightValueStr () {
-      const freight = typeof this.shippingLine.total_price === 'number'
-        ? this.shippingLine.total_price
-        : this.shippingLine.price
+      const { shippingLine } = this
+      const freight = typeof shippingLine.total_price === 'number'
+        ? shippingLine.total_price
+        : shippingLine.price
       if (freight) {
         return formatMoney(freight)
       } else {
-        return i18n(i19freeShipping)
+        return i18n(shippingLine.pick_up ? i19free : i19freeShipping)
       }
     }
   }

package/src/js/TheAccount.js

@@ -1,10 +1,13 @@
 import {
   i19addresses,
+  i19favorites,
   i19hello,
   i19isNotYou,
   i19logout,
+  i19noSavedFavoritesMsg,
   i19orders,
-  i19registration
+  i19registration,
+  i19subscriptions
 } from '@ecomplus/i18n'
 
 import {
@@ -14,12 +17,14 @@ import {
 
 import ecomPassport from '@ecomplus/passport-client'
 import LoginBlock from '../LoginBlock.vue'
+import RecommendedItems from '../RecommendedItems.vue'
 
 export default {
   name: 'TheAccount',
 
   components: {
-    LoginBlock
+    LoginBlock,
+    RecommendedItems
   },
 
   props: {
@@ -29,7 +34,12 @@ export default {
         return {}
       }
     },
-    isOrdersList: Boolean,
+    currentTab: {
+      type: String,
+      validator: function (value) {
+        return ['orders', 'favorites', 'subscriptions', 'points', 'account'].includes(value)
+      }
+    },
     ecomPassport: {
       type: Object,
       default () {
@@ -38,20 +48,30 @@ export default {
     }
   },
 
+  data () {
+    return {
+      favoriteIds: [],
+      navTabs: []
+    }
+  },
+
   computed: {
     i19addresses: () => i18n(i19addresses),
+    i19favorites: () => i18n(i19favorites),
     i19hello: () => i18n(i19hello),
     i19isNotYou: () => i18n(i19isNotYou),
     i19logout: () => i18n(i19logout),
+    i19noSavedFavoritesMsg: () => i18n(i19noSavedFavoritesMsg),
     i19orders: () => i18n(i19orders),
+    i19subscriptions: () => i18n(i19subscriptions),
     i19registration: () => i18n(i19registration),
 
     activeTab: {
       get () {
-        return this.isOrdersList ? 1 : 0
+        return this.currentTab || 'account'
       },
-      set (tabIndex) {
-        this.$emit('update:is-orders-list', tabIndex === 1)
+      set (tab) {
+        this.$emit('update:current-tab', tab)
       }
     },
 
@@ -70,6 +90,27 @@ export default {
   },
 
   methods: {
+    hasTab (tabValue) {
+      return this.navTabs.some(tab => tab.value === tabValue)
+    },
+
+    insertSubscriptionTab () {
+      const hasSubscriptions = this.hasTab('subscriptions')
+      if (this.ecomPassport.checkAuthorization() && !hasSubscriptions) {
+        this.ecomPassport.requestApi('/orders.json?transactions.type=recurrence&limit=1&fields=_id')
+          .then(({ data }) => {
+            const { result } = data
+            if (result.length) {
+              this.navTabs.push({
+                label: this.i19subscriptions,
+                value: 'subscriptions'
+              })
+            }
+          })
+          .catch(console.error)
+      }
+    },
+
     login (ecomPassport) {
       if (ecomPassport.checkAuthorization()) {
         this.localCustomer = ecomPassport.getCustomer()
@@ -83,5 +124,45 @@ export default {
         this.$emit('logout')
       }
     }
+  },
+
+  watch: {
+    customer: {
+      handler (customer) {
+        const hasPoints = this.hasTab('points')
+        if (Array.isArray(customer.loyalty_points_entries) && customer.loyalty_points_entries.length && !hasPoints) {
+          this.navTabs.push({
+            label: 'Cashback',
+            value: 'points'
+          })
+        }
+      },
+      immediate: true,
+      deep: true
+    }
+  },
+
+  created () {
+    this.navTabs = [
+      {
+        label: this.i19registration,
+        value: 'account'
+      },
+      {
+        label: this.i19orders,
+        value: 'orders'
+      },
+      {
+        label: this.i19favorites,
+        value: 'favorites'
+      }
+    ]
+    const { favorites } = this.ecomPassport.getCustomer()
+    this.favoriteIds = favorites || []
+    this.insertSubscriptionTab()
+    this.ecomPassport.on('login', this.insertSubscriptionTab)
+    this.$once('hook:beforeDestroy', () => {
+      this.ecomPassport.off('login', this.insertSubscriptionTab)
+    })
   }
 }

package/src/js/TheCart.js

@@ -0,0 +1,146 @@
+import {
+  i19checkout,
+  i19continueShopping,
+  i19discount,
+  i19emptyCart
+} from '@ecomplus/i18n'
+
+import {
+  i18n,
+  formatMoney
+} from '@ecomplus/utils'
+
+import ecomCart from '@ecomplus/shopping-cart'
+import APrices from './../APrices.vue'
+import CartItem from './../CartItem.vue'
+import DiscountApplier from './../DiscountApplier.vue'
+import ShippingCalculator from './../ShippingCalculator.vue'
+import EarnPointsProgress from './../EarnPointsProgress.vue'
+import RecommendedItems from './../RecommendedItems.vue'
+
+export default {
+  name: 'TheCart',
+
+  components: {
+    APrices,
+    CartItem,
+    DiscountApplier,
+    ShippingCalculator,
+    EarnPointsProgress,
+    RecommendedItems
+  },
+
+  props: {
+    amount: {
+      type: Object,
+      default () {
+        return {}
+      }
+    },
+    checkoutUrl: {
+      type: String,
+      default: '/app/#/checkout'
+    },
+    zipCode: String,
+    discountCoupon: String,
+    modulesPayload: Object,
+    ecomCart: {
+      type: Object,
+      default () {
+        return ecomCart
+      }
+    }
+  },
+
+  data () {
+    return {
+      localZipCode: this.zipCode,
+      canApplyDiscount: false,
+      isCouponApplied: false
+    }
+  },
+
+  computed: {
+    i19checkout: () => i18n(i19checkout),
+    i19continueShopping: () => i18n(i19continueShopping),
+    i19discount: () => i18n(i19discount),
+    i19emptyCart: () => i18n(i19emptyCart),
+
+    cart () {
+      return this.ecomCart.data
+    },
+
+    isValidCart () {
+      return this.ecomCart.data.items.find(({ quantity }) => quantity)
+    },
+
+    localDiscountCoupon: {
+      get () {
+        return this.discountCoupon
+      },
+      set (couponCode) {
+        this.$emit('update:discount-coupon', couponCode)
+      }
+    }
+  },
+
+  methods: {
+    formatMoney,
+
+    selectShippingService (service) {
+      this.$emit('select-shipping', service)
+      this.$nextTick(() => {
+        this.canApplyDiscount = true
+      })
+    },
+
+    setDiscountRule (discountRule) {
+      this.$emit('set-discount-rule', discountRule)
+      this.$nextTick(() => {
+        this.isCouponApplied = Boolean(this.discountCoupon && this.amount.discount)
+      })
+    }
+  },
+
+  watch: {
+    localZipCode (zipCode) {
+      this.$emit('update:zip-code', zipCode)
+    },
+
+    canApplyDiscount (canApplyDiscount) {
+      if (!canApplyDiscount) {
+        this.isCouponApplied = false
+      }
+    }
+  },
+
+  mounted () {
+    this.$nextTick(() => {
+      this.canApplyDiscount = !this.localZipCode
+    })
+    const { ecomCart } = this
+    const getNumItems = () => ecomCart.data.items.reduce((numItems, { flags, quantity }) => {
+      if (!flags || !flags.includes('freebie')) {
+        numItems += quantity
+      }
+      return numItems
+    }, 0)
+    let oldNumItems = getNumItems()
+    const cartWatcher = () => {
+      this.canApplyDiscount = !this.localZipCode
+      const numItems = getNumItems()
+      if (oldNumItems !== numItems) {
+        ecomCart.data.items.forEach(({ _id, quantity, flags }) => {
+          if (Array.isArray(flags) && flags.includes('freebie') && quantity === 1) {
+            ecomCart.removeItem(_id)
+          }
+        })
+        oldNumItems = numItems
+      }
+    }
+    ecomCart.on('change', cartWatcher)
+    this.$once('hook:beforeDestroy', () => {
+      ecomCart.off('change', cartWatcher)
+    })
+  }
+}