diff options
Diffstat (limited to 'iridescence/src/components/ProductCard.vue')
| -rw-r--r-- | iridescence/src/components/ProductCard.vue | 24 |
1 files changed, 7 insertions, 17 deletions
diff --git a/iridescence/src/components/ProductCard.vue b/iridescence/src/components/ProductCard.vue index 67fbfbd..f796f92 100644 --- a/iridescence/src/components/ProductCard.vue +++ b/iridescence/src/components/ProductCard.vue @@ -3,7 +3,7 @@ <div class="card"> <div class="card-image"> <figure class="image is-square"> - <a href="#"> + <a @click="setDetailId"> <img :src="thumbnail" :alt="name" title="Click to expand." /> </a> </figure> @@ -11,7 +11,7 @@ <div class="card-content"> <div class="content"> <p class="title is-4"> - <a href="#"> + <a @click="setDetailId"> {{ name }} </a> </p> @@ -26,27 +26,12 @@ </div> </div> </div> - <ProductDetail - v-if="id == 6" - v-bind="{ - id: id, - name: name, - quantity: quantity, - cents: cents, - photo_base: photo_base, - photo_fullsize: photo_fullsize, - description: description - }" - ></ProductDetail> </div> </template> <script> -import ProductDetail from "@/components/ProductDetail.vue"; - export default { name: "ProductCard", - components: { ProductDetail }, props: { id: Number, name: String, @@ -79,6 +64,11 @@ export default { return description.splice(0, 10).join(" ") + "…"; } } + }, + methods: { + setDetailId() { + this.$store.commit("productDetailId", this.id); + } } }; </script> |