From 1f5fb50b84e957bcc1492baf3b5a1daef9150d43 Mon Sep 17 00:00:00 2001
From: Yentl Storms <Yentl.Storms@itenium.be>
Date: Thu, 28 Mar 2019 20:47:01 +0100
Subject: [PATCH] 4A Add a product price

---
 cli-socks/src/components/Product.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/cli-socks/src/components/Product.vue b/cli-socks/src/components/Product.vue
index 090cd43..7210165 100644
--- a/cli-socks/src/components/Product.vue
+++ b/cli-socks/src/components/Product.vue
@@ -6,7 +6,7 @@
 
     <div class="product-info">
         <h1>
-          {{ product.name }}
+          {{ title }}
           <!-- eslint-disable-next-line vue/no-unused-vars -->
           <i v-for="i in averageReviewScore" class="fa fa-star" :key="i"></i>
         </h1>
@@ -56,13 +56,14 @@ export default class Product extends Vue {
   product = {
     name: "Vue Socks",
     brand: "Vue",
+    price: 5,
     variants: [
       {id: 1, color: "green"},
       {id: 2, color: "blue"}
     ],
     inventory: 3,
     reviews: []
-  }
+  };
 
   selectedVariantIndex = 0;
 
@@ -77,6 +78,10 @@ export default class Product extends Vue {
     return Math.round(this.product.reviews.reduce((a, c) => a + c, 0) / this.product.reviews.length);
   }
 
+  get title() {
+      return `${this.product.name} ($${this.product.price})`;
+  }
+
   addToCart() {
     this.product.inventory--;
     const selectedVariant = this.product.variants[this.selectedVariantIndex];