taibai_shopping/app/static/js/checkout.js

// 订单结算页面脚本
let selectedAddressId = 0;
let subtotal = 0;

// 初始化页面
document.addEventListener('DOMContentLoaded', function() {
    // 从页面获取初始数据
    const defaultAddress = document.querySelector('input[name="address_id"]:checked');
    if (defaultAddress) {
        selectedAddressId = parseInt(defaultAddress.value);
    }

    // 获取商品总价
    const subtotalElement = document.getElementById('subtotal');
    if (subtotalElement) {
        subtotal = parseFloat(subtotalElement.textContent.replace('¥', ''));
    }
});

// 选择地址
function selectAddress(addressId) {
    selectedAddressId = addressId;

    // 更新UI
    document.querySelectorAll('.address-card').forEach(card => {
        card.classList.remove('selected');
    });

    const selectedCard = document.querySelector(`[data-address-id="${addressId}"]`);
    if (selectedCard) {
        selectedCard.classList.add('selected');
    }

    // 更新单选按钮
    const radioButton = document.querySelector(`input[value="${addressId}"]`);
    if (radioButton) {
        radioButton.checked = true;
    }
}

// 更新运费
function updateShippingFee() {
    const shippingMethodElement = document.querySelector('input[name="shipping_method"]:checked');
    if (!shippingMethodElement) return;

    const shippingMethod = shippingMethodElement.value;
    let fee = 0;

    switch(shippingMethod) {
        case 'express':
            fee = 10;
            break;
        case 'same_day':
            fee = 20;
            break;
        default:
            fee = 0;
    }

    const shippingFeeElement = document.getElementById('shippingFee');
    const totalAmountElement = document.getElementById('totalAmount');
    
    if (shippingFeeElement) {
        shippingFeeElement.textContent = `¥${fee.toFixed(2)}`;
    }
    
    if (totalAmountElement) {
        totalAmountElement.textContent = `¥${(subtotal + fee).toFixed(2)}`;
    }
}

// 提交订单
function submitOrder() {
    // 验证地址选择
    if (!selectedAddressId) {
        showAlert('请选择收货地址', 'warning');
        return;
    }

    // 获取表单数据
    const shippingMethodElement = document.querySelector('input[name="shipping_method"]:checked');
    const paymentMethodElement = document.querySelector('input[name="payment_method"]:checked');
    const remarkElement = document.getElementById('orderRemark');

    if (!shippingMethodElement) {
        showAlert('请选择配送方式', 'warning');
        return;
    }

    if (!paymentMethodElement) {
        showAlert('请选择支付方式', 'warning');
        return;
    }

    const shippingMethod = shippingMethodElement.value;
    const paymentMethod = paymentMethodElement.value;
    const remark = remarkElement ? remarkElement.value : '';

    // 获取选中的购物车商品ID
    const urlParams = new URLSearchParams(window.location.search);
    const selectedItems = urlParams.getAll('items');

    if (selectedItems.length === 0) {
        showAlert('没有选中的商品', 'error');
        return;
    }

    const orderData = {
        selected_items: selectedItems,
        address_id: selectedAddressId,
        shipping_method: shippingMethod,
        payment_method: paymentMethod,
        remark: remark
    };

    // 显示加载状态
    const submitBtn = document.querySelector('.btn-danger');
    if (!submitBtn) {
        showAlert('提交按钮未找到', 'error');
        return;
    }

    const originalText = submitBtn.innerHTML;
    submitBtn.innerHTML = '<i class="bi bi-hourglass-split"></i> 提交中...';
    submitBtn.disabled = true;

    // 提交订单
    fetch('/order/create', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(orderData)
    })
    .then(response => {
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        if (data.success) {
            showAlert('订单创建成功！正在跳转到支付页面...', 'success');
            setTimeout(() => {
                window.location.href = `/order/pay/${data.payment_sn}`;
            }, 1500);
        } else {
            showAlert(data.message || '订单创建失败', 'error');
            // 恢复按钮状态
            submitBtn.innerHTML = originalText;
            submitBtn.disabled = false;
        }
    })
    .catch(error => {
        console.error('提交订单错误:', error);
        showAlert('提交订单失败，请重试', 'error');
        // 恢复按钮状态
        submitBtn.innerHTML = originalText;
        submitBtn.disabled = false;
    });
}