diff options
author | Adam T. Carpenter <atc@53hor.net> | 2022-10-26 21:02:31 -0400 |
---|---|---|
committer | Adam T. Carpenter <atc@53hor.net> | 2022-10-26 21:02:31 -0400 |
commit | 9f3098e80c6b6c87e9bfbfe36239a39e5cafb29f (patch) | |
tree | db9ca419266117facecdff6d30460669f3148efb /iridescence/src/components/ProductCard.vue | |
parent | f243a3b7341012227d6e8342a65f9c5d7784256f (diff) | |
download | theglassyladies-9f3098e80c6b6c87e9bfbfe36239a39e5cafb29f.tar.xz theglassyladies-9f3098e80c6b6c87e9bfbfe36239a39e5cafb29f.zip |
init: add some stories and personas and begin layout out domain
Diffstat (limited to 'iridescence/src/components/ProductCard.vue')
-rw-r--r-- | iridescence/src/components/ProductCard.vue | 74 |
1 files changed, 0 insertions, 74 deletions
diff --git a/iridescence/src/components/ProductCard.vue b/iridescence/src/components/ProductCard.vue deleted file mode 100644 index 144dd9e..0000000 --- a/iridescence/src/components/ProductCard.vue +++ /dev/null @@ -1,74 +0,0 @@ -<template> - <div id="productCard"> - <div class="card"> - <div class="card-image"> - <figure class="image is-square"> - <a @click="setDetailId"> - <img :src="thumbnail" :alt="name" title="Click to expand." /> - </a> - </figure> - </div> - <div class="card-content"> - <div class="content"> - <p class="title is-4"> - <a @click="setDetailId"> - {{ name }} - </a> - </p> - <p class="subtitle is-4"> - {{ dollars }} - </p> - <p class="subtitle is-6">{{ stock }}</p> - </div> - - <div class="content"> - {{ shortDescription }} - </div> - </div> - </div> - </div> -</template> - -<script> -export default { - name: "ProductCard", - props: { - id: Number, - name: String, - quantity: Number, - cents: Number, - photo_thumbnail: String, - photo_base: String, - photo_fullsize: String, - description: String - }, - computed: { - stock() { - if (this.quantity == 0) { - return "Made to order"; - } else { - return [this.quantity, "in stock"].join(" "); - } - }, - dollars() { - return "$ " + (this.cents / 100).toFixed(2); - }, - thumbnail() { - return process.env.VUE_APP_IMAGE_ROOT + this.photo_thumbnail; - }, - shortDescription() { - let description = this.description.split(" "); - if (description.length < 10) { - return this.description; - } else { - return description.splice(0, 10).join(" ") + "…"; - } - } - }, - methods: { - setDetailId() { - this.$store.commit("productDetailId", this.id); - } - } -}; -</script> |