path: root/iridescence/src/components/CartCheckout.vue

<template>
  <div id="cartCheckout">
    <div class="buttons has-addons">
      <router-link to="/cart" class="button is-primary is-rounded"
        >🛒 {{ checkoutReady }}</router-link
      >
      <button class="button is-static">x{{ inCart }}</button>
      <button class="button is-static is-rounded">
        {{ cartTotal }}
      </button>
    </div>
  </div>
</template>

<script>
export default {
  name: "CartCheckout",
  computed: {
    inCart() {
      return Object.values(this.$store.state.cart).reduce(
        (acc, cur) => acc + cur,
        0
      );
    },
    cartTotal() {
      return this.$store.getters.cartTotal;
    },
    checkoutReady() {
      if (this.inCart) {
        return "Checkout";
      } else {
        return "";
      }
    }
  }
};
</script>