Jungle
Jungle کیتن
30000 IQD
وردەکارییەکان
{
Alpine.data("productDetails", () => ({
productId: '4431',
error: false,
auth: false,
isLoading: false,
quantity: 0,
cartId: null,
isInCart: false,
showSizeTooltip: false,
tooltipX: 0,
tooltipY: 0,
init() {
if (this.auth) {
this.fetchCart();
}
// Listen for cart updates from other components
this.$watch('quantity', (value) => {
this.isInCart = value > 0;
});
},
async addToCart() {
// Check if user is authenticated
if (!'') {
window.dispatchEvent(new CustomEvent('open-auth-modal'));
return;
}
await this.createOrUpdateCart(1);
},
async increaseQuantity() {
const newQuantity = this.quantity + 1;
await this.updateQuantity(this.productId, newQuantity);
},
async decreaseQuantity() {
const newQuantity = this.quantity - 1;
await this.updateQuantity(this.productId, newQuantity);
},
// Creates cart for the first time or updates existing cart
async createOrUpdateCart(initialQuantity = 1) {
this.isLoading = true;
try {
const response = await fetch('/carts/store', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest',
'X-CSRF-TOKEN': document.querySelector(
'meta[name="csrf-token"]').getAttribute(
'content')
},
body: JSON.stringify({
product_id: this.productId,
quantity: initialQuantity
})
});
const data = await response.json();
if (response.ok) {
this.quantity = initialQuantity;
this.showNotification(data.message ||
`${this.productName} added to cart!`, 'success');
} else {
this.showNotification(data.message || 'Failed to add to cart!',
'error');
throw new Error('Failed to add to cart.');
}
} catch (error) {
console.error('Error creating/updating cart:', error);
this.showNotification('Failed to add to cart. Please try again.', 'error');
} finally {
this.isLoading = false;
}
},
// Updates the quantity of an item
async updateQuantity(itemId, quantity) {
// Basic validation
if (quantity < 1) {
// If user enters 0 or less, treat it as a remove action
await this.removeItem(itemId);
return;
}
this.isLoading = true;
try {
const response = await fetch(`/carts/product/${itemId}`, {
method: 'PATCH',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest',
'X-CSRF-TOKEN': document.querySelector(
'meta[name="csrf-token"]').getAttribute(
'content')
},
body: JSON.stringify({
quantity: quantity
})
});
const data = await response.json();
console.log(data);
if (response.ok) {
// Update local state
// window.cartManager.setQuantity(itemId, quantity);
this.quantity = quantity;
if (quantity === 0) {
this.showNotification(data.message || 'Item removed from cart!',
'info');
} else {
this.showNotification(data.message || 'Quantity updated!',
'success');
}
} else {
this.showNotification(data.message || 'Failed to update quantity!',
'error');
// throw new Error('Failed to update quantity.');
}
} catch (error) {
console.error('Error updating quantity:', error);
this.showNotification('Failed to update quantity. Please try again.',
'error');
// Refresh local state from server if needed
await this.fetchCart();
} finally {
this.isLoading = false;
}
},
// Remove item from cart
async removeItem(itemId) {
this.isLoading = true;
try {
const response = await fetch(`/carts/product/${itemId}`, {
method: 'DELETE',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest',
'X-CSRF-TOKEN': document.querySelector(
'meta[name="csrf-token"]').getAttribute(
'content')
}
});
const data = await response.json();
if (response.ok) {
// Update local state
// window.cartManager.setQuantity(itemId, 0);
this.quantity = 0;
this.showNotification(data.message || 'Item removed from cart!',
'success');
} else {
this.showNotification(data.message || 'Failed to remove item!',
'error');
throw new Error('Failed to remove item.');
}
} catch (error) {
console.error('Error removing item:', error);
this.showNotification('Failed to remove item. Please try again.', 'error');
} finally {
this.isLoading = false;
}
},
// Fetch current cart state from server (for consistency)
async fetchCart() {
try {
const response = await fetch('/carts/index', {
method: 'GET',
headers: {
'Accept': 'application/json',
'X-Requested-With': 'XMLHttpRequest',
}
});
const data = await response.json();
if (response.ok && data.data.cart) {
// Update local cart state
const newCart = {};
data.data.cart.forEach(item => {
newCart[item.product_id] = item.quantity;
});
// Update this component's quantity
this.quantity = newCart[this.productId] || 0;
if (this.quantity > 0) {
this.isInCart = true;
}
this.cartId = data.data.cart.id;
}
} catch (error) {
console.error('Error fetching cart:', error);
}
},
updateTooltipPosition(event) {
this.tooltipX = event.pageX + 14;
this.tooltipY = event.pageY + 14;
},
showNotification(message, type = 'info') {
setTimeout(() => {
setTimeout(() => {
if (typeof notify !== 'undefined') {
notify(message, type);
} else {
console.log(`${type.toUpperCase()}: ${message}`);
}
}, 300);
});
},
}))
})
بەخێربێیتەوە هەژمار دروست بکە
بە ژمارەی مۆبایلەکەت بچۆ ژوورەوە تۆمارکردنەکەت تەواو بکە
ئەم ژمارە مۆبایلە بۆ هەژمارەکەت بەکاردەهێنرێت
ڕازیم کە PetLand Online ڕێگەی پێبدرێت نیشانەی وێبی شیکاری لە نامەی هەواڵیدا دابنێت و پڕۆفایلێکی بەکارهێنەری تایبەت دروست بکات لەسەر بنەمای کڕین و ڕەفتاری بەکارهێنانم، لەگەڵ ناردنی ئاگادارییەک کاتێک شتێکم لە سەبەتەی کڕیندا داناوە. وردەکاری زیاتر لە سیاسەتی تایبەتمەندیمان، بڕگەی ٥دا دەدۆزرێتەوە. تێدەگەم کە دەتوانم ڕەزامەندییەکەم لە هەر کاتێکدا بکشێنمەوە بە ناردنی ئیمەیڵ بۆ [email protected].