taibai_shopping/app/static/js/admin_orders.js

// 订单管理JavaScript功能
document.addEventListener('DOMContentLoaded', function() {
    // 初始化所有模态框
    const shipModal = new bootstrap.Modal(document.getElementById('shipModal'));
    const refundModal = new bootstrap.Modal(document.getElementById('refundModal'));
    const cancelModal = new bootstrap.Modal(document.getElementById('cancelModal'));
    
    // 当前操作的订单ID
    let currentOrderId = null;
    
    // 显示发货模态框
    window.showShipModal = function(orderId, orderSn) {
        currentOrderId = orderId;
        document.getElementById('shipOrderSn').value = orderSn;
        shipModal.show();
    };
    
    // 显示退款模态框
    window.showRefundModal = function(orderId, orderSn) {
        currentOrderId = orderId;
        document.getElementById('refundOrderSn').value = orderSn;
        refundModal.show();
    };
    
    // 显示取消模态框
    window.showCancelModal = function(orderId, orderSn) {
        currentOrderId = orderId;
        document.getElementById('cancelOrderSn').value = orderSn;
        cancelModal.show();
    };
    
    // 处理发货表单提交
    document.getElementById('shipForm').addEventListener('submit', function(e) {
        e.preventDefault();
        
        if (!currentOrderId) {
            showAlert('错误', '订单ID不能为空', 'danger');
            return;
        }
        
        const formData = new FormData(this);
        const submitBtn = this.querySelector('button[type="submit"]');
        
        // 显示加载状态
        const originalText = submitBtn.innerHTML;
        submitBtn.innerHTML = '<i class="bi bi-arrow-clockwise spin"></i> 处理中...';
        submitBtn.disabled = true;
        
        fetch(`/admin/orders/${currentOrderId}/ship`, {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                showAlert('成功', '发货成功！', 'success');
                shipModal.hide();
                setTimeout(() => {
                    location.reload();
                }, 1000);
            } else {
                showAlert('错误', data.message || '发货失败', 'danger');
            }
        })
        .catch(error => {
            console.error('Error:', error);
            showAlert('错误', '网络请求失败', 'danger');
        })
        .finally(() => {
            // 恢复按钮状态
            submitBtn.innerHTML = originalText;
            submitBtn.disabled = false;
        });
    });
    
    // 处理退款表单提交
    document.getElementById('refundForm').addEventListener('submit', function(e) {
        e.preventDefault();
        
        if (!currentOrderId) {
            showAlert('错误', '订单ID不能为空', 'danger');
            return;
        }
        
        const formData = new FormData(this);
        const submitBtn = this.querySelector('button[type="submit"]');
        
        // 显示加载状态
        const originalText = submitBtn.innerHTML;
        submitBtn.innerHTML = '<i class="bi bi-arrow-clockwise spin"></i> 处理中...';
        submitBtn.disabled = true;
        
        fetch(`/admin/orders/${currentOrderId}/refund`, {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                showAlert('成功', '退款成功！', 'success');
                refundModal.hide();
                setTimeout(() => {
                    location.reload();
                }, 1000);
            } else {
                showAlert('错误', data.message || '退款失败', 'danger');
            }
        })
        .catch(error => {
            console.error('Error:', error);
            showAlert('错误', '网络请求失败', 'danger');
        })
        .finally(() => {
            // 恢复按钮状态
            submitBtn.innerHTML = originalText;
            submitBtn.disabled = false;
        });
    });
    
    // 处理取消表单提交
    document.getElementById('cancelForm').addEventListener('submit', function(e) {
        e.preventDefault();
        
        if (!currentOrderId) {
            showAlert('错误', '订单ID不能为空', 'danger');
            return;
        }
        
        const formData = new FormData(this);
        const submitBtn = this.querySelector('button[type="submit"]');
        
        // 显示加载状态
        const originalText = submitBtn.innerHTML;
        submitBtn.innerHTML = '<i class="bi bi-arrow-clockwise spin"></i> 处理中...';
        submitBtn.disabled = true;
        
        fetch(`/admin/orders/${currentOrderId}/cancel`, {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                showAlert('成功', '订单取消成功！', 'success');
                cancelModal.hide();
                setTimeout(() => {
                    location.reload();
                }, 1000);
            } else {
                showAlert('错误', data.message || '取消失败', 'danger');
            }
        })
        .catch(error => {
            console.error('Error:', error);
            showAlert('错误', '网络请求失败', 'danger');
        })
        .finally(() => {
            // 恢复按钮状态
            submitBtn.innerHTML = originalText;
            submitBtn.disabled = false;
        });
    });
    
    // 通用提示函数
    function showAlert(title, message, type) {
        // 创建提示框
        const alertDiv = document.createElement('div');
        alertDiv.className = `alert alert-${type} alert-dismissible fade show position-fixed`;
        alertDiv.style.cssText = 'top: 20px; right: 20px; z-index: 9999; min-width: 300px;';
        alertDiv.innerHTML = `
            <strong>${title}</strong> ${message}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        `;
        
        document.body.appendChild(alertDiv);
        
        // 3秒后自动关闭
        setTimeout(() => {
            if (alertDiv.parentNode) {
                alertDiv.parentNode.removeChild(alertDiv);
            }
        }, 3000);
    }
});

// 旋转动画CSS（如果需要）
if (!document.querySelector('#admin-orders-style')) {
    const style = document.createElement('style');
    style.id = 'admin-orders-style';
    style.textContent = `
        .spin {
            animation: spin 1s linear infinite;
        }
        
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }
    `;
    document.head.appendChild(style);
}