¨4.0.1¨

Themes/Storefront/resources/assets/public/js/components/compare/Index.js

@@ -1,15 +1,10 @@
-import store from '../../store';
-import ProductRating from '../ProductRating.vue';
-import ProductHelpersMixin from '../../mixins/ProductHelpersMixin';
+import store from "../../store";
+import ProductHelpersMixin from "../../mixins/ProductHelpersMixin";
 
 export default {
-    components: { ProductRating },
+    mixins: [ProductHelpersMixin],
 
-    mixins: [
-        ProductHelpersMixin,
-    ],
-
-    props: ['compare'],
+    props: ["compare"],
 
     data() {
         return {
@@ -39,10 +34,10 @@ export default {
     methods: {
         badgeClass(product) {
             if (product.is_in_stock) {
-                return 'badge-success';
+                return "badge-success";
             }
 
-            return 'badge-danger';
+            return "badge-danger";
         },
 
         hasAttribute(product, attribute) {
@@ -56,9 +51,11 @@ export default {
         attributeValues(product, attribute) {
             for (let productAttribute of product.attributes) {
                 if (productAttribute.name === attribute.name) {
-                    return productAttribute.values.map((productAttributeValue) => {
-                        return productAttributeValue.value;
-                    }).join(', ');
+                    return productAttribute.values
+                        .map((productAttributeValue) => {
+                            return productAttributeValue.value;
+                        })
+                        .join(", ");
                 }
             }
         },
@@ -66,14 +63,11 @@ export default {
         remove(product) {
             this.$delete(this.products, product.id);
 
-            if (! this.hasAnyProduct) {
+            if (!this.hasAnyProduct) {
                 this.relatedProducts = [];
             }
 
-            $.ajax({
-                method: 'DELETE',
-                url: route('compare.destroy', { id: product.id }),
-            });
+            store.removeFromCompareList(product.id);
         },
 
         inWishlist(product) {
@@ -86,34 +80,40 @@ export default {
 
         addToCart(product) {
             if (product.options_count !== 0) {
-                return window.location.href = this.productUrl(product);
+                return (window.location.href = this.productUrl(product));
             }
 
-            $.ajax({
-                method: 'POST',
-                url: route('cart.items.store', { product_id: product.id, qty: 1 }),
-            }).then((cart) => {
-                store.updateCart(cart);
+            axios
+                .post(
+                    route("cart.items.store", {
+                        product_id: product.id,
+                        qty: 1,
+                    })
+                )
+                .then((response) => {
+                    store.updateCart(response.data);
 
-                $('.header-cart').trigger('click');
-            }).catch((xhr) => {
-                this.$notify(xhr.responseJSON.message);
-            });
+                    $(".header-cart").trigger("click");
+                })
+                .catch((error) => {
+                    this.$notify(error.response.data.message);
+                });
         },
 
-        fetchRelatedProducts() {
+        async fetchRelatedProducts() {
             this.fetchingRelatedProducts = true;
 
-            $.ajax({
-                method: 'GET',
-                url: route('compare.related_products.index'),
-            }).then((relatedProducts) => {
-                this.relatedProducts = relatedProducts;
-            }).catch((xhr) => {
-                this.$notify(xhr.responseJSON.message);
-            }).always(() => {
+            try {
+                const response = await axios.get(
+                    route("compare.related_products.index")
+                );
+
+                this.relatedProducts = response.data;
+            } catch (error) {
+                this.$notify(error.response.data.message);
+            } finally {
                 this.fetchingRelatedProducts = false;
-            });
+            }
         },
     },
 };