<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="v
iewport" content="width=device-width, initial-scale=1, maximum-scale=1
.0, user-scalable=0,shrink-to-fit=no, v
iewport-fit=cover">
<meta name="keywords" content="蓝桥到家">
<meta name="description" itemprop="description" content="生鲜副食、饮品乳品、鲜花蛋糕">
<meta http-equiv="X-UA-Compatible" content="
ie=edge">
<title>确认订单</title>
<link rel="stylesheet" type="text/css" href="
../styles/reset
.css" />
<link rel="stylesheet" type="text/css" href="
../styles/iconfont/iconfont
.css" />
<link rel="stylesheet" type="text/css" href="
../styles/order-confirm
.css" />
<link rel="stylesheet" type="text/css" href="
../styles/common
.css" />
<script type="text/javascript" src="
../js/common
.js"></script>
<script type="text/javascript" src="
../js/zepto
.min
.js"></script>
<script type="text/javascript" src="
../js/data
.js"></script>
</head>
<body>
<div class="wrap">
<!-- 头部 start -->
<header class="header_bar">
<a href="shopcart
.html">
<div class="header_bar_back"></div>
</a>
<div class="header_bar_title">确认订单</div>
</header>
<!-- 头部 end -->
<div class="container">
<!-- 订单信息 start -->
<div class="order-address">
<h5>配送至：</h5>
<a id="addressSelectLink" href="#">
<div class="address" id="selectedAddress">
<!-- 地址信息将通过JavaScript动态生成 -->
</div>
</a>
</div>
<h3 id="storeName">商家名称</h3>
<ul class="order-detail" id="orderItems">
<!-- 订单商品将通过JavaScript动态生成 -->
</ul>
<div class="order-cost">
<p>配送费</p>
<p id="deliveryFee">￥0</p>
</div>
<!-- 合计部分 -->
<div class="total">
<div class="total-left" id="totalPrice">
总计：0 元
</div>
<div class="total-right" id="paymentBtn">
去支付
</div>
</div>
<!-- 订单信息 end -->
</div>
</div>
<script>
$(function() {
// 检查用户是否已登录
if (!checkLogin()) return;
// 获取店铺ID
const urlParams = new URLSearchParams(window
.location
.search);
const storeId =
parseInt(urlParams
.get('storeId') || '0');
if (storeId === 0) {
alert('订单信息错误');
window
.location
.href = 'shopcart
.html';
return;
}
// 获取店铺数据
const store = getStoreById(storeId);
// 生鲜果蔬专区特殊处理
let storeName = '';
let deliveryFee = 0;
if (storeId === 999) {
// 生鲜果蔬专区
storeName = '生鲜果蔬专区';
deliveryFee = 5; // 设置配送费
} else if (!store) {
alert('店铺不存在');
window
.location
.href = 'shopcart
.html';
return;
} else {
storeName = store
.name;
deliveryFee = store
.deliveryFee;
}
// 获取购物车中该店铺的商品
const storeItems = cart
.getItemsByStore(storeId);
if (storeItems
.length === 0) {
alert('购物车为空');
if (storeId === 999) {
window
.location
.href = 'fresh
.html';
} else {
window
.location
.href = 'shop
.html?id=' + storeId;
}
return;
}
// 更新地址选择链接
$('#addressSelectLink')
.attr('href', 'address-select
.html?from=order-confirm&storeId=' + storeId);
// 渲染收货地址
function renderSelectedAddress() {
const selectedAddressEl = $('#selectedAddress');
const defaultAddress = addressManager
.getDefaultAddress();
// 调试信息
console
.log('地址管理器:', addressManager);
console
.log('默认地址:', defaultAddress);
if (defaultAddress) {
selectedAddressEl
.html(`
<div class="address-content">
<div class="address-info">
<p class="address-detail">${defaultAddress
.province}${defaultAddress
.city}${defaultAddress
.district}${defaultAddress
.detail}</p>
<p class="address-contact">${defaultAddress
.name} ${defaultAddress
.phone}</p>
</div>
<div class="address-arrow">
<span class="iconfont icon-youjiantou"></span>
</div>
</div>
`);
} else {
selectedAddressEl
.html(`
<div class="address-content">
<div class="address-info">
<p class="address-placeholder">请选择收货地址</p>
</div>
<div class="address-arrow">
<span class="iconfont icon-youjiantou"></span>
</div>
</div>
`);
}
}
// 渲染店铺名称
$('#storeName')
.text(storeName);
// 渲染配送费
$('#deliveryFee')
.text('￥' + deliveryFee);
// 渲染订单商品
let orderItemsHtml = '';
let subtotal = 0;
storeItems
.forEach(item => {
const itemTotal = item
.price * item
.quantity;
subtotal += itemTotal;
orderItemsHtml += `
<li>
<div class="goods">
<img src="${item
.image
.replace('images/', '
../images/')}">
<p>${item
.name} x ${item
.quantity}</p>
</div>
<p>￥${formatPrice(itemTotal)}</p>
</li>
`;
});
$('#orderItems')
.html(orderItemsHtml);
// 计算总价（商品小计 + 配送费）
const total = subtotal + deliveryFee;
$('#totalPrice')
.text(`总计：${formatPrice(total)} 元`);
// 支付按钮点击事件
$('#paymentBtn')
.on('click', function() {
// 检查是否有收货地址
const defaultAddress = addressManager
.getDefaultAddress();
if (!defaultAddress) {
alert('请先添加收货地址');
window
.location
.href = 'address-select
.html?from=order-confirm&storeId=' + storeId;
return;
}
// 保存订单信息到本地存储
const currentUser = JSON
.parse(localStorage
.getItem("currentUser"));
const orderKey = `orders_${currentUser
.phone}`;
const existingOrders = JSON
.parse(localStorage
.getItem(orderKey) || "[]");
const newOrder = {
id: new
Date()
.getTime(),
storeId: storeId,
storeName: storeName,
items: storeItems,
subtotal: subtotal,
deliveryFee: deliveryFee,
total: total,
status: "待支付",
createTime: new
Date()
.toLocaleString(),
address: defaultAddress
};
existingOrders
.push(newOrder);
localStorage
.setItem(orderKey, JSON
.stringify(existingOrders));
// 清空该店铺的购物车
storeItems
.forEach(item => {
cart
.up
dateQuantity(storeId, item
.productId, 0);
});
// 跳转到支付页面
window
.location
.href = 'payment
.html?orderId=' + newOrder
.id;
});
// 初始化页面
renderSelectedAddress();
});
</script>
<style>
</style>
</body>
</html> 第二段代码：<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="v
iewport" content="width=device-width, initial-scale=1, maximum-scale=1
.0, user-scalable=0,shrink-to-fit=no, v
iewport-fit=cover">
<meta name="keywords" content="蓝桥到家">
<meta name="description" itemprop="description" content="生鲜副食、饮品乳品、鲜花蛋糕">
<meta http-equiv="X-UA-Compatible" content="
ie=edge">
<title>确认订单</title>
<link rel="stylesheet" type="text/css" href="
../styles/reset
.css" />
<link rel="stylesheet" type="text/css" href="
../styles/iconfont/iconfont
.css" />
<link rel="stylesheet" type="text/css" href="
../styles/order-confirm
.css" />
<link rel="stylesheet" type="text/css" href="
../styles/common
.css" />
<script type="text/javascript" src="
../js/common
.js"></script>
<script type="text/javascript" src="
../js/zepto
.min
.js"></script>
<script type="text/javascript" src="
../js/data
.js"></script>
</head>
<body>
<div class="wrap">
<!-- 头部 start -->
<header class="header_bar">
<a href="shopcart
.html">
<div class="header_bar_back"></div>
</a>
<div class="header_bar_title">确认订单</div>
</header>
<!-- 头部 end -->
<div class="container">
<!-- 订单信息 start -->
<div class="order-address">
<h5>配送至：</h5>
<a id="addressSelectLink" href="#">
<div class="address" id="selectedAddress">
<!-- 地址信息将通过JavaScript动态生成 -->
</div>
</a>
</div>
<div id="storeOrdersContainer">
<!-- 多商家订单将通过JavaScript动态生成 -->
</div>
<!-- 合计部分 -->
<div class="total">
<div class="total-left" id="totalPrice">
总计：0 元
</div>
<div class="total-right" id="paymentBtn">
去支付
</div>
</div>
<!-- 订单信息 end -->
</div>
</div>
<script>
$(function() {
// 检查用户是否已登录
if (!checkLogin()) return;
// 获取店铺ID列表
const urlParams = new URLSearchParams(window
.location
.search);
const storeIdsParam = urlParams
.get('storeIds');
if (!storeIdsParam) {
alert('订单信息错误');
window
.location
.href = 'shopcart
.html';
return;
}
const storeIds = storeIdsParam
.split(',')
.map(id =>
parseInt(id));
// 更新地址选择链接
$('#addressSelectLink')
.attr('href', 'address-select
.html?from=multi-order-confirm&storeIds=' + storeIdsParam);
// 渲染收货地址
function renderSelectedAddress() {
const selectedAddressEl = $('#selectedAddress');
const defaultAddress = addressManager
.getDefaultAddress();
if (defaultAddress) {
selectedAddressEl
.html(`
<div class="address-content">
<div class="address-info">
<p class="address-detail">${defaultAddress
.province}${defaultAddress
.city}${defaultAddress
.district}${defaultAddress
.detail}</p>
<p class="address-contact">${defaultAddress
.name} ${defaultAddress
.phone}</p>
</div>
<div class="address-arrow">
<span class="iconfont icon-youjiantou"></span>
</div>
</div>
`);
} else {
selectedAddressEl
.html(`
<div class="address-content">
<div class="address-info">
<p class="address-placeholder">请选择收货地址</p>
</div>
<div class="address-arrow">
<span class="iconfont icon-youjiantou"></span>
</div>
</div>
`);
}
}
// 渲染多商家订单
function renderMultiStoreOrders() {
const storeOrdersContainerEl = $('#storeOrdersContainer');
let storeOrdersHtml = '';
let grandTotal = 0;
storeIds
.forEach(storeId => {
// 获取店铺数据
const store = getStoreById(storeId);
// 生鲜果蔬专区特殊处理
let storeName = '';
let deliveryFee = 0;
if (storeId === 999) {
// 生鲜果蔬专区
storeName = '生鲜果蔬专区';
deliveryFee = 5; // 设置配送费
} else if (!store) {
storeName = '未知商家';
deliveryFee = 0;
} else {
storeName = store
.name;
deliveryFee = store
.deliveryFee;
}
// 获取购物车中该店铺的商品
const storeItems = cart
.getItemsByStore(storeId);
if (storeItems
.length === 0) return;
let orderItemsHtml = '';
let subtotal = 0;
storeItems
.forEach(item => {
const itemTotal = item
.price * item
.quantity;
subtotal += itemTotal;
orderItemsHtml += `
<li>
<div class="goods">
<img src="${item
.image
.replace('images/', '
../images/')}">
<p>${item
.name} x ${item
.quantity}</p>
</div>
<p>￥${formatPrice(itemTotal)}</p>
</li>
`;
});
// 计算该店铺的总价（商品小计 + 配送费）
const storeTotal = subtotal + deliveryFee;
grandTotal += storeTotal;
storeOrdersHtml += `
<div class="store-order">
<h3 class="store-name">${storeName}</h3>
<ul class="order-detail">
${orderItemsHtml}
</ul>
<div class="order-cost">
<p>配送费</p>
<p>￥${deliveryFee}</p>
</div>
<div class="store-total">
<p>商家合计：￥${formatPrice(storeTotal)}</p>
</div>
</div>
`;
});
storeOrdersContainerEl
.html(storeOrdersHtml);
// 更新总价
$('#totalPrice')
.text(`总计：${formatPrice(grandTotal)} 元`);
return grandTotal;
}
// 支付按钮点击事件
$('#paymentBtn')
.on('click', function() {
// 检查是否有收货地址
const defaultAddress = addressManager
.getDefaultAddress();
if (!defaultAddress) {
alert('请先添加收货地址');
window
.location
.href = 'address-select
.html?from=multi-order-confirm&storeIds=' + storeIdsParam;
return;
}
// 保存订单信息到本地存储
const currentUser = JSON
.parse(localStorage
.getItem("currentUser"));
const orderKey = `orders_${currentUser
.phone}`;
const existingOrders = JSON
.parse(localStorage
.getItem(orderKey) || "[]");
// 创建多个订单，每个商家一个订单
const newOrderIds = [];
storeIds
.forEach(storeId => {
// 获取店铺数据
const store = getStoreById(storeId);
// 生鲜果蔬专区特殊处理
let storeName = '';
let deliveryFee = 0;
if (storeId === 999) {
// 生鲜果蔬专区
storeName = '生鲜果蔬专区';
deliveryFee = 5; // 设置配送费
} else if (!store) {
storeName = '未知商家';
deliveryFee = 0;
} else {
storeName = store
.name;
deliveryFee = store
.deliveryFee;
}
// 获取购物车中该店铺的商品
const storeItems = cart
.getItemsByStore(storeId);
if (storeItems
.length === 0) return;
// 计算小计
const subtotal = storeItems
.reduce((sum, item) => sum + item
.price * item
.quantity, 0);
const total = subtotal + deliveryFee;
const newOrder = {
id: new
Date()
.getTime() + storeId, // 确保ID唯一
storeId: storeId,
storeName: storeName,
items: storeItems,
subtotal: subtotal,
deliveryFee: deliveryFee,
total: total,
status: "待支付",
createTime: new
Date()
.toLocaleString(),
address: defaultAddress
};
existingOrders
.push(newOrder);
newOrderIds
.push(newOrder
.id);
// 清空该店铺的购物车
storeItems
.forEach(item => {
cart
.up
dateQuantity(storeId, item
.productId, 0);
});
});
localStorage
.setItem(orderKey, JSON
.stringify(existingOrders));
// 跳转到支付页面，传递所有订单ID
window
.location
.href = 'payment
.html?orderIds=' + newOrderIds
.join(',');
});
// 初始化页面
renderSelectedAddress();
renderMultiStoreOrders();
});
</script>
<style>
.store-order {
margin-bottom: 20px;
background-color: #
fff;
border-radius: 5px;
overflow: hidden;
}
.store-name {
padding: 10px 15px;
font-size: 16px;
font-weight: bold;
background-color: #f9f9f9;
border-bottom: 1px solid #eee;
}
.store-total {
padding: 10px 15px;
text-align: right;
font-weight: bold;
color: #
ff6000;
border-top: 1px solid #eee;
}
</style>
</body>
</html> 以上两段代码的
区别是什么 在哪些地方做了修改
本文探讨了使用Date.parse方法进行日期比较时遇到的浏览器兼容性问题，特别是在不同格式下的表现差异。
扫一扫
4437
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
