|
@@ -19,7 +19,7 @@
|
|
|
<!-- Listing Page -->
|
|
|
<div class="container-fluid browsing-history">
|
|
|
<div class="row">
|
|
|
- <div v-for="product in products" :key="product._id" class="col-xl-2 col-lg-2 col-md3 col-sm-6 col-6 br bb">
|
|
|
+ <div v-for="(product, index) in products" :key="product._id" class="col-xl-2 col-lg-2 col-md3 col-sm-6 col-6 br bb">
|
|
|
<div class="history-box">
|
|
|
<!-- Product Image -->
|
|
|
<a href="" class="a-link-normal">
|
|
@@ -54,7 +54,7 @@
|
|
|
<!-- Product Buttons -->
|
|
|
<div class="a-row">
|
|
|
<nuxt-link :to="`/products/${product._id}`" class="a-button-history margin-right-10">Update</nuxt-link>
|
|
|
- <nuxt-link to="#" class="a-button-history margin-right-10">Delete</nuxt-link>
|
|
|
+ <a href="#" @click="onDeleteProduct(product._id, index)" class="a-button-history margin-right-10">Delete</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -76,6 +76,16 @@ export default {
|
|
|
} catch (err) {
|
|
|
|
|
|
}
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async onDeleteProduct (id, index) {
|
|
|
+ try {
|
|
|
+ let response = await this.$axios.$delete(`http://localhost:3000/api/products/${id}`)
|
|
|
+ this.products.splice(index, 1)
|
|
|
+ } catch (err) {
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|