<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>订单详情</title>
<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
<link rel="stylesheet" type="text/css" href="css/iconfont.css" />
<link rel="stylesheet" type="text/css" href="css/main.css" />
<script type="text/javascript">
// 屏蔽分享
window.hiddenAllWechatMenu = true;
</script>
<style>
.mui-table-view-cell>a:not(.mui-btn) {margin-left: -12px;}
</style>
</head>
<body>
<!--底部菜单开始-->
<footer class="mui-bar mui-bar-tab" id="footer-bar-tab">
<a class="mui-tab-item ">
<span class="iconfont icon-shouye"></span>
<span class="mui-tab-label">首页</span>
</a>
<a class="mui-tab-item">
<span class="iconfont icon-liebiao"></span>
<span class="mui-tab-label">列表</span>
</a>
<a class="mui-tab-item">
<span class="iconfont icon-gouwuche"></span>
<span class="mui-tab-label">购物车</span>
</a>
<a class="mui-tab-item">
<span class="iconfont icon-huiyuan"></span>
<span class="mui-tab-label">会员</span>
</a>
</footer>
<!--底部菜单结束-->
<div class="mui-content">
<div class="address-cantainner">
<input type="hidden" id="salesPostFirm" name="salesPostFirm" value=""/>
<input type="hidden" id="salesPostNum" name="salesPostNum" value=""/>
<ul class="mui-table-view mui-table-view-striped my-grid-view-no mui-table-view-condensed">
<li class="mui-table-view-cell">
<div class="mui-table">
<!--<div class="mui-table-cell mui-col-xs-12 table-middle" style="display: none;">
<div class="add-address"><span class="iconfont icon-jia"></span>添加收货地址</div>
</div>-->
<div class="mui-table-cell mui-col-xs-1 mui-text-left table-middle">
<p><span class="iconfont icon-dingwei"></span></p>
</div>
<div class="mui-table-cell mui-col-xs-10 mui-text-left table-middle">
<div>收货人：<span id="receiver"></span> <span class="mui-pull-right" id="salesAddressTel">16899996678</span></div>
<p id="salesAddressInfo"></p>
</div>
<!--<div class="mui-table-cell mui-col-xs-1 mui-text-right table-middle">
<p><span class="mui-icon mui-icon-arrowright"></span></p>
</div>-->
</div>
</li>
</ul>
</div>
<div class="clearing-box">
<ul class="mui-table-view mui-table-view-striped my-grid-view-no mui-table-view-condensed shopping-cart-list">
</ul>
<ul class="mui-table-view">
<li class="mui-table-view-cell" style="padding-left:7px;">
<a class="btn-youhuiquan">
商品总价<span class="mui-pull-right">¥<span id="salesAmount">0.00</span></span>
</a>
</li>
<li class="mui-table-view-cell" style="padding-left:7px;" id="isCouponReduce">
<a class="btn-youhuiquan">
抵扣金额<span class="mui-pull-right">-¥<span id="couponReduce">0.00</span></span>
</a>
</li>
<li class="mui-table-view-cell" style="padding-left:7px;" id="">
<a class="btn-youhuiquan">
邮费<span class="mui-pull-right">¥<span id="salesPostage">0.00</span></span>
</a>
</li>
</ul>
<div class="mui-content-padded mui-text-right">实付：<span class="pro-price">¥<span id="salesYetAmount">0.00</span></span></div>
</div>
<ul class="mui-table-view my-grid-view-no status-list">
<li class="mui-table-view-cell">
订单状态：<span id="statusName"></span>
</li>
<li class="mui-table-view-cell">
订单编号：<span id="orderId"></span>
</li>
<li class="mui-table-view-cell">
下单时间：<span id="salesCreateDate"></span>
</li>
<li class="mui-table-view-cell" id="isShowOrderRemark">
订单留言：<span id="salesUserRemark"></span>
</li>
</ul>
<br />
<div class="mui-content-padded mui-text-center" id="operation">
<!--<button type="button" class="my-btn-black">申请售后</button><button type="button" class="my-btn-black">查看物流</button>-->
</div>
</div>
<!-- 加载ing begin-->
<div class="loading covers">
<div class="loading-bj"></div>
<p>正在加载...</p>
</div>
<!-- 加载ing end -->
<script src="js/mui.min.js"></script>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/main.js"></script>
<script src="js/wechat-utils-1.0.js"></script>
<script>
window.addEventListener('pageshow', function(e) {
// 通过persisted属性判断是否存在 BF Cache
if(e.persisted) {
location.reload();
}
});
var orderId = getParam("orderId");//从URL带过来的订单id
var orderStatus = {
1: '<button type="button" class="my-btn-black my-order-btn order_operate" fixedStatus="pay" orderId>立即支付</button><button type="button" class="my-btn-black order_operate " fixedStatus="1" orderId>取消订单</button>',
2: '<button type="button" class="my-btn-black order_operate " fixedStatus="aftermarket" orderId>申请售后</button>', //申请退款
3: '<button type="button" class="my-btn-black order_operate " fixedStatus="3" orderId>取消申请</button>', //退款申请中，可以取消退款
5: '<button type="button" class="my-btn-black order_operate " fixedStatus="aftermarket" orderId>申请售后</button>', //已发货状态，可以申请退货、申请换货；
6: '<button type="button" class="my-btn-black order_operate " fixedStatus="5" orderId>取消申请</button>', //申请退货中，可以取消申请；
7: '<button type="button" class="my-btn-black order_operate " fixedStatus="6" orderId>取消退货</button>', //退货中，可以取消退货
11: '<button type="button" class="my-btn-black order_operate " fixedStatus="8" orderId>取消申请</button>' //申请换货中，可以取消申请
};
//dom加载完毕
mui.ready(function() {
$.ajax(base_path + '/wechat/cart/getShopOrderByOrderId?dates=' + new Date().getTime(), {
data: {
"orderId": orderId
},
dataType: 'json',
xhrFields: {
withCredentials: true
},
crossDomain: true,
type: 'get',
timeout: 15000,
success: function(dt) {
if(dt.isRedirect) {
location.href = dt.redirectURL;
} else {
console.log(dt);
var order = dt.data
$("#receiver").html(order.salesAddressName);
$("#salesAddressTel").html(order.salesAddressTel);
$("#salesAmount").html(accDiv(order.salesAmount,100));
if(order.salesTransportationType == 1){ //订单运输类型 1:邮寄 2:自提
$("#salesAddressInfo").html('收货地址：<span>'+ order.salesAddressInfo +'</span>');
}else{
$("#salesAddressInfo").html('自提地点：<span>'+ order.salesChannelAddress +'</span>');
}
if(order.salesPostFirm != null && order.salesPostFirm != "" && typeof(order.salesPostFirm) != "undefined"){
$("#salesPostFirm").val(order.salesPostFirm);
}
if(order.salesPostNum != null && order.salesPostNum != "" && typeof(order.salesPostNum) != "undefined"){
$("#salesPostNum").val(order.salesPostNum);
}
var isPostage = 0;
if(order.salesPostage == null || typeof(order.salesPostage)=="undefined"){
$("#salesPostage").html(0);
}else{
isPostage = order.salesPostage
$("#salesPostage").html(accDiv(order.salesPostage,100));
}
// if(order.couponReduce != null && order.couponReduce != "" && typeof(order.couponReduce) != "undefined"){
var newCouponReduce = order.salesAmount - order.salesYetAmount + isPostage;
if(newCouponReduce <= 0){
newCouponReduce = 0;
$("#isCouponReduce").hide();
}else{
$("#couponReduce").html(accDiv(newCouponReduce,100));
$("#isCouponReduce").show();
}
// }else{
// $("#isCouponReduce").hide();
// }
$("#salesYetAmount").html(accDiv(order.salesYetAmount,100));
var str = "";
mui.each(order.orderItemList, function(index) {
str += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-5"><img class="mui-media-object wh-100" src="'+ this.itemProductPic +'"></div><div class="mui-table-cell table-middle mui-col-xs-7" style="line-height:2.5">'+ this.itemProductName +'<h6>颜色：'+ this.productColor +'<span class="center">数量：'+ this.itemNum +'</span></h6><div>¥'+ accDiv(this.itemProductDiscount,100) +'</div></div></div>';
});
document.querySelector('.shopping-cart-list').innerHTML = str;
/*订单状态*/
var statusName = "";
switch (parseInt(order.salesStatus)){
case 0 :
statusName = "取消订单";
break;
case 1 :
statusName = "待支付";
break;
case 2 :
statusName = "已支付";
break;
case 3 :
statusName = "退款申请中";
break;
case 4 :
statusName = "已退款";
break;
case 5 :
statusName = "已发货";
break;
case 6 :
statusName = "申请退货中";
break;
case 7 :
statusName = "退货中";
break;
case 8 :
statusName = "订单退货完成";
break;
case 9 :
statusName = "换货中";
break;
case 10 :
statusName = "换货完成";
break;
case 11 :
statusName = "申请换货中";
break;
case 12 :
statusName = "订单完成";
break;
default:
break;
}
$("#statusName").html(statusName);
$("#orderId").html(order.salesOrderid);
$("#salesUserRemark").html(order.salesUserRemark);
if(order.salesUserRemark != null && order.salesUserRemark != "" && typeof(order.salesUserRemark) != "undefined"){
$("#isShowOrderRemark").show();
}else{
$("#isShowOrderRemark").hide();
}
$("#salesCreateDate").html(order.salesCreateDate);
var status = order.salesStatus;
var statusHtml = '';
statusHtml = orderStatus[status]; //获取订单状态所展示的按钮
if(statusHtml == null || statusHtml == "" || typeof(statusHtml) == "undefined") {
statusHtml = '';
}
if(status == 5 || status == 12 || status == 6 || status == 11) { //状态为取消，待支付，代发货，退货，换货都没有物流信息
if(order.salesPostFirm != null && order.salesPostFirm != "" && typeof(order.salesPostFirm) != "undefined" && order.salesPostNum != null && order.salesPostNum != "" && typeof(order.salesPostNum) != "undefined"){
statusHtml += '<button type="button" class="my-btn-black order_operate order_logistics" fixedStatus="logistics" orderId>查询物流</button>';
}
}
statusHtml = statusHtml.replace(/\orderId/g,'orderId="'+ order.salesOrderid +'"')
$("#operation").html(statusHtml);
$(".loading").hide().css("opacity", "0"); //隐藏（正在加载...）
}
},
error: function(xhr, type, errorThrown) {
console.log(xhr);
mui.alert("获取订单列表失败！网络错误");
}
});
});
/*订单按钮触发事件*/
$(document).on('tap', '.order_operate', function() {
var status = $(this).attr("fixedStatus");
var orderId = $(this).attr("orderId");
var remark = "";
if( status == "pay") { //调用支付接口
pay(orderId);
}else if(status == "logistics") { //查询物流
var salesPostFirm = $("#salesPostFirm").val();
var salesPostNum = $("#salesPostNum").val();
location.href = "logistics-massage.html?salesPostFirm="+salesPostFirm + "&salesPostNum="+salesPostNum;
}else if(status == "aftermarket"){
location.href = "customer-service.html?orderId=" + orderId;
}else{
updateOrderStatus(orderId, status, remark);
}
});
/*修改订单状态*/
function updateOrderStatus(orderId, status, remark) {
var msg = "";
if(status == 1){
msg = "是否取消该订单";
}else if(status == 3){
msg = "是否取消申请退款";
}else if(status == 5){
msg = "是否取消申请退货";
}else if(status == 6){
msg = "是否取消申请退货";
}else if(status == 8){
msg = "是否取消申请换货";
}
var btnArray = ['否', '是'];
mui.confirm(msg, "", btnArray, function(e){
if (e.index == 1) {
$.ajax(base_path + '/wechat/cart/updateOrderStatus?dates=' + new Date().getTime(), {
data: {
"status": status, //更改后的状态
"orderId": orderId, //订单id
"remark": remark
},
dataType: 'json',
xhrFields: {
withCredentials: true
},
crossDomain: true,
type: 'get',
timeout: 15000,
success: function(dt) {
if(dt.resultCode == 200) {
//mui.alert("获取订单列表失败！网络错误");
//location.reload();//刷新
}
location.reload();//刷新
},
error: function(xhr, type, errorThrown) {
console.log(xhr);
mui.alert("获取订单列表失败！网络错误");
}
});
}
})
}
/*支付*/
function pay(orderId) {
$.ajax(base_path + '/wechat/cart/orderPay?dates=' + new Date().getTime(), {
data: {
"orderId": orderId
},
dataType: 'json',
xhrFields: {
withCredentials: true
},
crossDomain: true,
type: 'get',
timeout: 15000,
success: function(dt) {
if(dt.resultCode == "500") {
mui.alert(dt.message);
isPay = true;
return;
};
if(dt.data.info == "isOK") {
location.href='pay-win.html?orderId='+ dt.data.orderId + "&dates=" + new Date().getTime()
// mui.openWindow({
// url: base_path+"/wechat/order/paySuccess?orderId=" + dt.data.orderId + "&dates=" + new Date().getTime()
// });
return;
};
if(dt.status) {
var str = dt.data.info;
var obj = JSON.parse("{" + str + "}");
WeixinJSBridge.invoke('getBrandWCPayRequest', obj, function(res) {
if(res.err_msg == 'get_brand_wcpay_request:ok') {
$.ajax(base_path + '/wechat/order/checkOrderPaySuccess?dates=' + new Date().getTime(), {
data: {
"orderId": dt.data.orderId
},
dataType: 'json',
xhrFields: {
withCredentials: true
},
crossDomain: true,
type: 'get',
timeout: 15000,
success: function(dataobj) {
if(dataobj.isRedirect) {
location.href = dataobj.redirectURL;
} else {
if(dataobj.status == true) { // 支付成功
location.href = "pay-win.html?orderId=" + dataobj.data + "&dates=" + new Date().getTime();
} else {
location.href = "order-details.html?orderId=" + dataobj.data + "&dates=" + new Date().getTime(); // 前往订单详情
}
}
},
error: function(xhr, type, errorThrown) {
console.log(xhr);
}
});
} else {
isPay = true;
mui.toast("对不起，支付失败!请稍后重试!");
}
});
} else {
isPay = true;
mui.alert(dt.message);
location.href = "order-details.html?orderId=" + dt.data.orderId + "&dates=" + new Date().getTime(); // 前往订单详情
}
},
error: function(xhr, type, errorThrown) {
console.log(xhr);
mui.alert("获取订单列表失败！网络错误");
}
});
}
</script>
</body>
</html>