110 lines
3.4 KiB
JavaScript
110 lines
3.4 KiB
JavaScript
// 订单页面JavaScript功能
|
|
|
|
// 强制设置商品图片样式的函数
|
|
function forceProductImageStyle(imgElement) {
|
|
if (!imgElement) return;
|
|
|
|
// 强制设置所有样式属性
|
|
imgElement.style.width = '80px';
|
|
imgElement.style.height = '80px';
|
|
imgElement.style.objectFit = 'cover';
|
|
imgElement.style.borderRadius = '4px';
|
|
imgElement.style.display = 'block';
|
|
imgElement.style.maxWidth = '80px';
|
|
imgElement.style.maxHeight = '80px';
|
|
imgElement.style.minWidth = '80px';
|
|
imgElement.style.minHeight = '80px';
|
|
|
|
// 设置属性避免被覆盖
|
|
imgElement.setAttribute('width', '80');
|
|
imgElement.setAttribute('height', '80');
|
|
}
|
|
|
|
// 页面加载完成后的处理
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// 强制设置所有商品图片样式
|
|
const productImages = document.querySelectorAll('.product-image');
|
|
productImages.forEach(function(img) {
|
|
forceProductImageStyle(img);
|
|
|
|
// 图片加载完成后再次强制设置
|
|
if (img.complete) {
|
|
forceProductImageStyle(img);
|
|
} else {
|
|
img.onload = function() {
|
|
forceProductImageStyle(img);
|
|
};
|
|
}
|
|
});
|
|
|
|
// 为订单卡片添加悬停效果
|
|
const orderCards = document.querySelectorAll('.order-card');
|
|
orderCards.forEach(card => {
|
|
card.addEventListener('mouseenter', function() {
|
|
this.style.boxShadow = '0 4px 15px rgba(0,0,0,0.1)';
|
|
});
|
|
|
|
card.addEventListener('mouseleave', function() {
|
|
this.style.boxShadow = '';
|
|
});
|
|
});
|
|
});
|
|
|
|
// 额外的保险措施：定期检查并修正商品图片样式
|
|
setInterval(function() {
|
|
const productImages = document.querySelectorAll('.product-image');
|
|
productImages.forEach(function(img) {
|
|
// 检查图片是否超出预期尺寸
|
|
const rect = img.getBoundingClientRect();
|
|
if (rect.width > 85 || rect.height > 85) {
|
|
forceProductImageStyle(img);
|
|
}
|
|
});
|
|
}, 1000); // 每秒检查一次
|
|
|
|
function cancelOrder(orderId) {
|
|
if (confirm('确定要取消这个订单吗？取消后无法恢复。')) {
|
|
fetch(`/order/cancel/${orderId}`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
}
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
showAlert(data.message, 'success');
|
|
setTimeout(() => location.reload(), 1000);
|
|
} else {
|
|
showAlert(data.message, 'error');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
showAlert('操作失败，请重试', 'error');
|
|
});
|
|
}
|
|
}
|
|
|
|
function confirmReceipt(orderId) {
|
|
if (confirm('确定已收到商品吗？确认后订单将完成。')) {
|
|
fetch(`/order/confirm_receipt/${orderId}`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
}
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
showAlert(data.message, 'success');
|
|
setTimeout(() => location.reload(), 1000);
|
|
} else {
|
|
showAlert(data.message, 'error');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
showAlert('操作失败，请重试', 'error');
|
|
});
|
|
}
|
|
}
|