display product list, rest addtocart

web/themes/custom/materiotheme/vuejs/components/Pages/Cart.vue

@@ -0,0 +1,45 @@
+<template>
+  <div id="cart">
+    <div class="loading" v-if="!false">
+      <span>Loading ...</span>
+    </div>
+    <div class="">
+      This the cart
+    </div>
+  </div>
+</template>
+
+<script>
+
+// import Showroom from 'vuejs/components/Content/Showroom'
+// import { mapState, mapActions } from 'vuex'
+
+export default {
+  name: "cart",
+  // data() {
+  //   return {
+  //     items:[],
+  //     page:0
+  //   }
+  // },
+  // computed: {
+  //   ...mapState({
+  //     items: state => state.Showrooms.items
+  //   })
+  // },
+  created(){
+    // if(!this.items.length)
+    //   this.getItems()
+  },
+  methods: {
+    // ...mapActions({
+    //   getItems: 'Showrooms/getItems'
+    // })
+  },
+  // components: {
+  //   Showroom
+  // }
+}
+</script>
+<style lang="scss" scoped>
+</style>

web/themes/custom/materiotheme/vuejs/components/Pages/Pricing.vue

@@ -0,0 +1,48 @@
+<template>
+  <div id="pricing">
+    <div class="loading" v-if="!pricing.length">
+      <span>Loading ...</span>
+    </div>
+    <Product
+      v-else
+      v-for="product in pricing"
+      v-bind:key="product.uuid"
+      :product="product"
+    />
+  </div>
+</template>
+
+<script>
+
+import Product from 'vuejs/components/Content/Product'
+import { mapState, mapActions } from 'vuex'
+
+export default {
+  name: "Pricing",
+  // data() {
+  //   return {
+  //     items:[],
+  //     page:0
+  //   }
+  // },
+  computed: {
+    ...mapState({
+      pricing: state => state.Pages.pricing
+    })
+  },
+  created(){
+    if(!this.pricing.length)
+      this.getPricing()
+  },
+  methods: {
+    ...mapActions({
+      getPricing: 'Pages/getPricing'
+    })
+  },
+  components: {
+    Product
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>