123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427 |
- <!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>
|