Allow product removal on Checkout page.

2 files changed, 7 insertions, 1 deletions

diff --git a/client/src/views/Checkout.vue b/client/src/views/Checkout.vue
index 83d0940..8adeb4a 100644
--- a/client/src/views/Checkout.vue
+++ b/client/src/views/Checkout.vue
@@ -10,6 +10,7 @@
               <i>${{ item.price }}</i>
             </div>
             <span class="badge bg-primary rounded-pill">{{ item.quantity }}</span>
+            <span class="badge bg-danger rounded-pill ms-2" @click="remove(item.id)">x</span>
           </li>
         </ul>
         <p class="text-center my-3 fw-bold">You can buy {{ cartSize }} items for ${{ cartPrice }}.</p>
@@ -31,6 +32,11 @@ export default {
     cartPrice() {
       return this.$store.getters.getCartPrice;
     }
+  },
+  methods: {
+    remove(id) {
+      this.$store.commit('removeFromCart', id);
+    }
   }
 }
 </script>
diff --git a/client/src/views/Product.vue b/client/src/views/Product.vue
index ff43857..d1fde29 100644
--- a/client/src/views/Product.vue
+++ b/client/src/views/Product.vue
@@ -47,7 +47,7 @@ export default {
       this.$store.commit('addToCart');
     },
     remove() {
-      this.$store.commit('removeFromCart');
+      this.$store.commit('removeFromCart', this.$route.params.id);
     }
   }
 }