123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395 |
- <!-- +---------------------------------------------------------------------- -->
- <!-- | CRMEB [ CRMEB赋能开发者,助力企业发展 ] -->
- <!-- +---------------------------------------------------------------------- -->
- <!-- | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved. -->
- <!-- +---------------------------------------------------------------------- -->
- <!-- | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权 -->
- <!-- +---------------------------------------------------------------------- -->
- <!-- | Author: CRMEB Team <admin@crmeb.com> -->
- <!-- +---------------------------------------------------------------------- -->
- {extend name="public/container"}
- {block name="title"}订单详情{/block}
- {block name="head_top"}
- <style>
- body {
- padding-bottom: 1.12rem;
- background-color: #f5f5f5;
- }
- a[href^="tel"] {
- color: #191C6E;
- }
- </style>
- {/block}
- {block name="content"}
- <div v-cloak id="app">
- <div class="order-detail">
- <!-- 退款 -->
- {if condition="$order.refund_reason neq '' && $order.refund_status eq 0"}
- <div class="section return">
- <div>卖家拒绝退款</div>
- <div class="time">拒绝退款原因:{$order.refund_reason}</div>
- <div class="time">处理时间:{$order.refund_reason_time}</div>
- </div>
- {/if}
- <!-- 退货 -->
- {if condition="$order.refund_status eq 1"}
- <div class="section return">
- <div>退款中</div>
- <div class="time">申请时间:{$order.refund_application_time}</div>
- </div>
- {elseif condition="$order.refund_status eq 2"}
- <div class="section return">
- <div>已退款</div>
- <div class="time">{$order._status._msg}</div>
- </div>
- {/if}
- {if condition="$order.refund_status eq 0 && $order.refund_reason eq ''"}
- <div class="section status">
- <div class="image">
- <img src="{$order.status_pic}">
- </div>
- <div class="text">
- <div>{$order._status._title}</div>
- <div class="time">{$order._status._msg}</div>
- </div>
- </div>
- {/if}
- <div class="section contact">
- <div>
- <span>{$order.real_name}</span>
- <span>{$order.user_phone}</span>
- </div>
- <div class="address">{$order.user_address}</div>
- </div>
- <div class="section goods">
- {volist name="order.cartInfo" id="cart"}
- <div class="goods-bd">
- <div class="image">
- <img src="{$cart.productInfo.image}">
- </div>
- <div class="text">
- <div class="name">{$cart.productInfo.store_name}</div>
- <div class="money">
- <div class="price">¥
- <span>{$cart.truePrice}</span>
- </div>
- </div>
- </div>
- {if condition="$order._status._type eq 3"}
- <div>
- <div class="num">x{$cart.cart_num}</div>
- <a href="{:url('my/order_reply')}?unique={$cart.unique}">评价</a>
- </div>
- {/if}
- </div>
- {/volist}
- <div class="goods-ft">共{$order.total_num}件商品,总金额 <span>¥{$order.pay_price}</span></div>
- </div>
- <!-- 待收货 -->
- {if condition="$order.status EGT 1"}
- <div class="section express">
- <div class="image">
- <img src="/wap/first/zsff/images/express.png">
- </div>
- <div class="text">
- <div>物流公司:<span>{$order.delivery_name}</span></div>
- <div>快递单号:<span id="account">{$order.delivery_id}</span></div>
- </div>
- <button type="button" data-clipboard-action="copy" data-clipboard-target="#account" @click="copyNo" id="copy">复制单号</button>
- </div>
- {/if}
- <ul class="section list">
- <li>
- <div>订单编号:</div>
- <div>{$order.order_id}</div>
- </li>
- <li>
- <div>下单时间:</div>
- <div>{$order.add_time|date="Y-m-d H:i",###}</div>
- </li>
- <li>
- <div>商品金额:</div>
- <div>¥{$order.total_price}</div>
- </li>
- <li>
- <div>支付方式:</div>
- <div>{$order._status._payType}</div>
- </li>
- {gt name="order.total_postage" value="0"}
- <li>
- <div>运费:</div>
- <div>¥{$order.total_postage}</div>
- </li>
- {/gt}
- {gt name="order.use_gold" value="0"}
- <li>
- <div>使用{$gold_name}:</div>
- <div>{$order.use_gold}</div>
- </li>
- {/gt}
- {gt name="order.back_gold" value="0"}
- <li>
- <div>退还{$gold_name}:</div>
- <div>¥{$order.back_gold}</div>
- </li>
- {/gt}
- <li>
- <div>实付款:</div>
- <div>¥{$order.pay_price}</div>
- </li>
- <li>
- <div>买家留言:</div>
- <div class="msg">{$order.mark}</div>
- </li>
- </ul>
- <div class="footer">
- {if condition="$order._status._type eq 0"}
- <a href="javascript:void(0);" class="blue" @click="submit">立即付款</a>
- <a href="javascript:void(0);" @click="removeOrder('取消')">取消订单</a>
- {elseif condition="$order._status._type eq 1 && $order.refund_reason eq '' && $order.refund_status eq 0 && $order.pay_price gt 0"}
- <a href="javascript:void(0);" @click="applyRefundOrder">申请退款</a>
- {elseif condition="$order._status._type eq 2"}
- <a href="javascript:void(0);" class="blue" @click="userTake">确认收货</a>
- {elseif condition="$order._status._type eq 3 && $order.refund_reason eq '' && $order.refund_status eq 0 && $order.pay_price gt 0"}
- <a href="javascript:void(0);" @click="applyRefundOrder">申请退款</a>
- <a href="javascript:void(0);" @click="removeOrder('删除')">删除订单</a>
- {elseif condition="$order._status._type eq 4 && $order.refund_reason eq '' && $order.refund_status eq 0 && $order.pay_price gt 0"}
- <a href="javascript:void(0);" @click="applyRefundOrder">申请退款</a>
- <a href="javascript:void(0);" @click="removeOrder('删除')">删除订单</a>
- {elseif condition="$order.refund_reason neq '' && $order.refund_status eq 0 && $order._status._type eq 3 && $order.pay_price gt 0"}
- <a href="javascript:void(0);" class="blue" @click="applyRefundOrder()">再次申请</a>
- <a href="javascript:void(0);" @click="removeOrder('删除')">删除订单</a>
- {elseif condition="$order.refund_status eq 2 || $order._status._type eq 3 && $order.pay_price eq 0"}
- <a href="javascript:void(0);" @click="removeOrder('删除')">删除订单</a>
- {/if}
- <a href="javascript:void(0);" @click="services">联系客服</a>
- {if condition="$order.status EGT 1"}
- <a href="javascript:void(0);" @click="express">查看物流</a>
- {/if}
- </div>
- </div>
- <!-- 支付弹窗 -->
- <pay-dialog
- :open.sync="payDialogOpen"
- :money="money"
- :now_money="now_money"
- :special_id="id"
- :pay_type_num="pay_type_num"
- :is-wechat="isWechat"
- :is-alipay="is_alipay"
- :is-balance="is_yue"
- :template-id="templateId"
- :wxpay-h5="wxpayH5"
- @change="changeVal"
- ></pay-dialog>
- <base-login :login-show="loginShow" :site-name="site_name"></base-login>
- <quick-menu></quick-menu>
- </div>
- <script>
- require(['vue', 'store', 'helper','layer','clipboard','components/pay-dialog/index', 'components/base-login/index', '{__WAP_PATH}zsff/js/enter.js', 'quick'], function (Vue, api, $h,layer,ClipboardJS, PayDialog, BaseLogin) {
- var site_name = '{$Auth_site_name}';
- var id="{$order.id}";
- var orderId="{$order.order_id}";
- var money="{$order.pay_price}";
- var isWechat={$isWechat ? 'true' : 'false'};
- var is_yue={$is_yue ? 'true' : 'false'};
- var now_money={$now_money};
- var is_alipay={$is_alipay ? 'true' : 'false'};
- var wxpayH5={$is_h5_wechat_payment_switch ? 'true' : 'false'};
- var callback_url = '{$callback_url}';
- var app = new Vue({
- el: '#app',
- components: {
- 'pay-dialog': PayDialog,
- 'base-login': BaseLogin
- },
- data: {
- loginShow: false,
- isWechat:isWechat,
- url:isWechat ? $h.U({c:'index',a:'login'}):$h.U({c:'login',a:'phone_check'}),
- id:id,
- orderId:orderId,
- payDialogOpen:false, // 是否显示支付弹窗
- money:money,
- pay_type_num:50,
- is_alipay: is_alipay, //支付宝是否开启
- now_money: now_money, //余额
- is_yue:is_yue, //余额是否开启
- templateId: '',
- wxpayH5: wxpayH5,
- site_name: site_name
- },
- mounted: function () {
- api.baseGet($h.U({c:'index',a:'user_login'}),function (res) {
- this.loginShow=false;
- }.bind(this),function (res) {
- this.loginShow=true;
- return false;
- }.bind(this));
- this.subscribeTemplate();
- },
- methods: {
- subscribeTemplate: function () {
- api.baseGet($h.U({
- c: 'special',
- a: 'getTemplateIds',
- q: {
- pay_type_num: this.pay_type_num,
- special_id: this.id
- }
- }), function (res) {
- this.templateId = res.data.msg;
- }.bind(this));
- },
- submit: function () {
- this.payDialogOpen=true;
- },
- copyNo:function(delivery_id){
- var clipboard = new ClipboardJS('#copy');
- clipboard.on('success', function (e) {
- $h.pushMsgOnce('复制成功');
- e.clearSelection();
- });
- clipboard.on('error', function (e) {
- $h.pushMsgOnce('复制失败');
- });
- },
- userTake:function(){
- var that = this;
- layer.confirm('确定立即收货?',{icon:3},function(index){
- layer.close(index);
- $h.loadFFF();
- api.userTakeOrder(that.orderId,function(){
- $h.loadClear();
- $h.pushMsg('收货成功',function(){
- location.reload(true);
- });
- },function(e){ $h.loadClear(); return true; });
- })
- },
- removeOrder: function (title) {
- var that = this;
- layer.confirm('确认'+title+'该订单?', { icon: 3, title: false, btn: ['确定', '取消'] }, function (index) {
- layer.close(index);
- $h.loadFFF();
- api.removeUserOrder(that.orderId, function () {
- $h.loadClear();
- $h.pushMsg(title+'成功', function () {
- location.replace($h.U({
- c: 'special',
- a: 'order_store_list'
- }));
- });
- }, function (e) { $h.loadClear(); return true; });
- })
- },
- // 联系客服
- services:function(){
- api.baseGet($h.U({
- c: 'public_api',
- a: 'public_data'
- }), function (res) {
- var data = res.data.data;
- if (data.customer_service === '3') {
- if (data.site_service_phone) {
- layer.confirm('是否拨打 <a href="tel:' + data.site_service_phone + '">' + data.site_service_phone + '</a> 进行咨询?', {
- title: false,
- closeBtn: false,
- btn: ['拨打', '取消']
- }, function (index) {
- window.location.assign('tel:' + data.site_service_phone);
- layer.close(index);
- });
- } else {
- layer.msg('抱歉,无法联系客服');
- }
- } else {
- window.location.assign($h.U({
- c: 'service',
- a: 'service_list'
- }));
- }
- });
- },
- applyRefundOrder:function(){
- location.replace($h.U({
- c:'my',
- a:'refund_apply',
- p:{order_id:this.orderId}
- }));
- },
- pay_order:function(data){
- this.orderId=data.data.result.orderId || '';
- switch (data.data.status){
- case "PAY_ERROR":case 'ORDER_EXIST':case 'ORDER_ERROR':
- this.extendOrder(data.msg);
- break;
- case 'WECHAT_PAY':
- this.wechatPay(data.data.result.jsConfig);
- break;
- case 'WECHAT_H5_PAY':
- this.payDialogOpen=false;
- var callbackUrl = callback_url + '?type=2&id=0';
- var mwebUrl = data.data.result.jsConfig.mweb_url + '&redirect_url=' + encodeURIComponent(callbackUrl);
- window.location.href = mwebUrl;
- break;
- case 'SUCCESS':
- this.successOrder(data.msg);
- break;
- case 'ZHIFUBAO_PAY':
- window.location.href=$h.U({m:'wap',c:'alipay',a:'index',q:{info:data.data.result,params:'goods'}});
- break;
- }
- },
- wechatPay:function(config){
- var that = this;
- mapleWx($jssdk(),function(){
- this.chooseWXPay(config,function(){
- that.successOrder();
- },{
- fail:that.extendOrder,
- cancel:that.extendOrder
- });
- });
- },
- successOrder:function(msg){
- $h.showMsg({
- title:msg ? msg :'支付成功',
- icon:'success',
- success:function (){
- location.reload();
- }
- });
- },
- extendOrder:function(msg){
- if (typeof msg === 'object') {
- if (msg.errMsg === 'chooseWXPay:cancel') {
- msg = '微信支付取消';
- } else {
- msg = '支付失败';
- }
- } else {
- msg = '支付失败';
- }
- $h.pushMsg(msg, function () {
- location.reload();
- });
- },
- enter: function () {
- this.loginShow = true;
- },
- //所有插件回调处理事件
- changeVal: function (opt) {
- if (typeof opt != 'object') opt = {};
- var action = opt.action || '';
- var value = opt.value || '';
- this[action] && this[action](value);
- },
- express: function () {
- window.location.assign("{:url('my/express')}?uni=" + orderId);
- }
- }
- });
- });
- </script>
- {/block}
|