diff options
Diffstat (limited to 'iridescence/src/components')
-rw-r--r-- | iridescence/src/components/InventoryList.vue | 33 | ||||
-rw-r--r-- | iridescence/src/components/Navbar.vue | 7 | ||||
-rw-r--r-- | iridescence/src/components/ProductCard.vue (renamed from iridescence/src/components/InventoryCard.vue) | 4 | ||||
-rw-r--r-- | iridescence/src/components/ProductFilter.vue (renamed from iridescence/src/components/InventoryFilter.vue) | 4 | ||||
-rw-r--r-- | iridescence/src/components/ProductList.vue | 36 | ||||
-rw-r--r-- | iridescence/src/components/ProductSearch.vue (renamed from iridescence/src/components/InventorySearch.vue) | 8 |
6 files changed, 46 insertions, 46 deletions
diff --git a/iridescence/src/components/InventoryList.vue b/iridescence/src/components/InventoryList.vue deleted file mode 100644 index a4962cd..0000000 --- a/iridescence/src/components/InventoryList.vue +++ /dev/null @@ -1,33 +0,0 @@ -<template> - <div id="inventoryList"> - <div class="columns is-multiline is-variable is-7-desktop"> - <div - class="column is-one-quarter" - v-for="item in inventory" - :key="item.id" - > - <InventoryCard v-bind="item"></InventoryCard> - </div> - </div> - </div> -</template> - -<script> -import InventoryCard from "@/components/InventoryCard.vue"; - -export default { - name: "InventoryList", - components: { - InventoryCard - }, - data() { - return {}; - }, - computed: { - inventory() { - return this.$store.getters.inventory; - } - }, - methods: {} -}; -</script> diff --git a/iridescence/src/components/Navbar.vue b/iridescence/src/components/Navbar.vue index 65d5032..551ce5a 100644 --- a/iridescence/src/components/Navbar.vue +++ b/iridescence/src/components/Navbar.vue @@ -77,11 +77,8 @@ export default { } }, categories() { - const inventory = this.$store.getters.inventory; - console.log(inventory); - console.log(inventory.map(item => item.categories)); - - //console.log(cats); + const products = this.$store.getters.products; + console.log(products.map(item => item.categories)); return []; } }, diff --git a/iridescence/src/components/InventoryCard.vue b/iridescence/src/components/ProductCard.vue index 6bcc548..269e416 100644 --- a/iridescence/src/components/InventoryCard.vue +++ b/iridescence/src/components/ProductCard.vue @@ -1,5 +1,5 @@ <template> - <div id="inventoryCard"> + <div id="productCard"> <div class="card"> <div class="card-image"> <figure class="image is-4by3"> @@ -28,7 +28,7 @@ <script> export default { - name: "InventoryCard", + name: "ProductCard", props: { id: Number, name: String, diff --git a/iridescence/src/components/InventoryFilter.vue b/iridescence/src/components/ProductFilter.vue index 349b0f5..6fdd461 100644 --- a/iridescence/src/components/InventoryFilter.vue +++ b/iridescence/src/components/ProductFilter.vue @@ -1,5 +1,5 @@ <template> - <div id="inventoryFilter"> + <div id="productFilter"> <aside class="menu"> <p class="menu-label"> Availability @@ -47,6 +47,6 @@ <script> export default { - name: "InventoryFilter" + name: "ProductFilter" }; </script> diff --git a/iridescence/src/components/ProductList.vue b/iridescence/src/components/ProductList.vue new file mode 100644 index 0000000..537e802 --- /dev/null +++ b/iridescence/src/components/ProductList.vue @@ -0,0 +1,36 @@ +<template> + <div id="productsList"> + <div class="columns is-multiline is-variable is-7-desktop"> + <div + class="column is-one-quarter" + v-for="item in products" + :key="item.id" + > + <ProductCard v-bind="item"></ProductCard> + </div> + </div> + </div> +</template> + +<script> +import ProductCard from "@/components/ProductCard.vue"; + +export default { + name: "ProductsList", + components: { + ProductCard + }, + data() { + return {}; + }, + computed: { + products() { + return this.$store.getters.products; + } + }, + methods: {}, + created() { + this.$store.dispatch("refreshProducts"); + } +}; +</script> diff --git a/iridescence/src/components/InventorySearch.vue b/iridescence/src/components/ProductSearch.vue index 6145246..d452e83 100644 --- a/iridescence/src/components/InventorySearch.vue +++ b/iridescence/src/components/ProductSearch.vue @@ -1,5 +1,5 @@ <template> - <div id="inventorySearch"> + <div id="productSearch"> <div class="field is-grouped is-grouped-multiline"> <div class="control is-expanded"> <input @@ -32,7 +32,7 @@ <script> export default { - name: "InventorySearch", + name: "ProductSearch", data() { return { term: "" @@ -40,12 +40,12 @@ export default { }, computed: { noResults() { - return !this.$store.getters.inventory.length; + return !this.$store.getters.products.length; } }, methods: { updateSearch() { - this.$store.commit("filterTerm", this.term); + this.$store.commit("searchTerm", this.term); } } }; |