<template>
|
<view>
|
<view class='order-details'>
|
<!-- 给header上与data上加on为退款订单-->
|
<view class='header bg-color' :class='isGoodsReturn ? "on" : ""'
|
:style="'padding-top:' + statusBarTop + 'px'">
|
|
<view class='picTxt acea-row row-middle'>
|
<view class='data' :class='isGoodsReturn ? "on" : ""'>
|
<view class="return iconfont icon-xiangzuo" @click.stop="goback"></view>
|
<view class='state'>{{ orderInfo.orderStatusMsg }}</view>
|
<view>{{ orderInfo.createTime }}</view>
|
</view>
|
</view>
|
</view>
|
|
<view v-if="isLoaded" class="pad30">
|
<view class='nav'>
|
<view class='navCon acea-row row-between-wrapper'>
|
<view :class="!orderInfo.paid ? 'on' : ''">待付款</view>
|
<view :class="orderInfo.paid && orderInfo.status == 0 ? 'on' : ''">待发货</view>
|
<view :class="orderInfo.status == 1 ? 'on' : ''">待收货</view>
|
<view :class="orderInfo.status >= 2 ? 'on' : ''">已完成</view>
|
</view>
|
<view class='progress acea-row row-between-wrapper'>
|
<view class='iconfont'
|
:class='(!orderInfo.paid ? "icon-webicon318" : "icon-yuandianxiao") + " font-color " + (orderInfo.paid ? "font-color" : "")'>
|
</view>
|
<view class='line' :class='orderInfo.paid > 0 ? "bg-color" : ""'></view>
|
<view class='iconfont'
|
:class='(orderInfo.status == 0 ? "icon-webicon318" : "icon-yuandianxiao") + " " + (orderInfo.paid && orderInfo.status >= 0 ? "font-color" : "")'>
|
</view>
|
<view class='line' :class='orderInfo.status > 0 ? "bg-color" : ""'></view>
|
<view class='iconfont'
|
:class='(orderInfo.status == 1 ? "icon-webicon318" : "icon-yuandianxiao") + " " + (orderInfo.paid && orderInfo.status >= 1 ? "font-color" : "")'>
|
</view>
|
<view class='line' :class='orderInfo.status > 1 ? "bg-color" : ""'></view>
|
<view class='iconfont'
|
:class='(orderInfo.status >= 2 ? "icon-webicon318" : "icon-yuandianxiao") + " " + (orderInfo.paid && orderInfo.status >= 2 ? "font-color" : "")'>
|
</view>
|
</view>
|
</view>
|
<view v-if="cartInfo && cartInfo.length && orderInfo && orderInfo.storeProductCardList.length"
|
class='address borRadius14'>
|
<view class='name' style="margin-bottom: 0;"><text class="address_label"
|
style="width: max-content;margin-right:0;">收件人：</text>{{ orderInfo.realName }}<text
|
class='phone'>{{ orderInfo.userPhone }}</text></view>
|
<view class="storeProductCardBox"
|
v-for="storeProductCardItem, storeProductCardIndex in orderInfo.storeProductCardList"
|
:key="storeProductCardIndex">
|
<view style="display:flex;align-items: center; margin-bottom: 10rpx;"><text>卡号：</text><text
|
style="font-size: 32rpx;">{{ storeProductCardItem.cardNo }}</text><text
|
style="font-size: 38rpx;" class="btnCopy"
|
@tap="copy(storeProductCardItem.cardNo)"></text></view>
|
<view style="display:flex;align-items: center;"><text>卡密：</text><text
|
style="font-size: 27rpx;">{{ storeProductCardItem.cardKey }}</text><text class="btnCopy"
|
@tap="copy(storeProductCardItem.cardKey)"></text></view>
|
<view
|
style="font-size: 23rpx;line-height: 28rpx; text-align: right; position: absolute;right:30rpx;bottom:30rpx;">
|
<view>激活有效期</view>
|
<view>
|
{{ storeProductCardItem.activateTime ? storeProductCardItem.activateTime.split('T')[0] :
|
''
|
}}
|
</view>
|
</view>
|
</view>
|
<view class="storeProductCardBox">
|
{{ cartInfo[0]['redirectRemark'] ? cartInfo[0]['redirectRemark'] : '' }}
|
</view>
|
<view class="storeProductCardBox" style="background: none;" v-if="cartInfo[0]['virtualCardImage']">
|
<image style="width:300rpx;height:300rpx;margin:0 auto;display: block;"
|
:src="cartInfo[0]['virtualCardImage']" mode="widthFix"></image>
|
<view class="btnDownload" @click="downloadImage(cartInfo[0]['virtualCardImage'])">下载到手机相册</view>
|
</view>
|
</view>
|
<view v-else-if="orderInfo.shippingType === 2" class='address borRadius14'>
|
<view><text class="address_label">收货地址</text> 现场自提</view>
|
<view class='name' style="margin-bottom: 0;"><text class="address_label">收件人</text>{{
|
orderInfo.realName }}<text class='phone'>{{ orderInfo.userPhone }}</text></view>
|
</view>
|
<view v-else class='address borRadius14'>
|
<view><text class="address_label">收货地址</text>{{ orderInfo.userAddress }}</view>
|
<view class='name' style="margin-bottom: 0;"><text class="address_label">收件人</text>{{
|
orderInfo.realName }}<text class='phone'>{{ orderInfo.userPhone }}</text>
|
<view v-if="orderInfo.paid && orderInfo.status == 0" @click="changeAddress" class='bnt blue'
|
:class="orderInfo.canChangeAddress ? '' : 'disable'">修改</view>
|
</view>
|
<view v-if="orderInfo.shippingType === 3">工作人员将为您线下送货</view>
|
</view>
|
<orderItemGoods :evaluate='evaluate' :productType="orderInfo.type" :orderId="order_id" :ids="id"
|
:uniId="uniId" :cartInfo="cartInfo" :orderProNum="orderProNum" :jump="true"
|
:zonePromotionList="zonePromotionList"></orderItemGoods>
|
<!-- #ifndef MP -->
|
<div class="goodCall borRadius14" @click="kefuClick">
|
<span class="iconfont icon-kefu"></span><span>联系客服</span>
|
</div>
|
<!-- #endif -->
|
<!-- #ifdef MP -->
|
<div class="goodCall borRadius14">
|
<button open-type='contact' hover-class='none'>
|
<span class="iconfont icon-kefu"></span><span>联系客服</span>
|
</button>
|
</div>
|
<!-- #endif -->
|
</view>
|
|
<view v-if="isLoaded" class="pad30">
|
<view class='nav refund' v-if="orderInfo.refundStatus > 0">
|
<view class="title">
|
<image src="https://ossacmall.bluedeer.com.cn/app/static/images/shuoming.png" mode=""></image>
|
{{ orderInfo.refundStatus == 1 ? '商家审核中' : orderInfo.refundStatus == 2 ? '商家已退款' : '商家拒绝退款' }}
|
</view>
|
<view class="con pad30">
|
{{ orderInfo.refundStatus == 1 ? "您已成功发起退款申请，请耐心等待商家处理；退款前请与商家协商一致，有助于更好的处理售后问题" :
|
orderInfo.refundStatus == 2 ? "退款已成功受理，如商家已寄出商品请尽快退回；感谢您的支持" : "拒绝原因：" +
|
orderInfo.refundReason }}
|
</view>
|
</view>
|
<view class='wrapper borRadius14'>
|
<view class='item acea-row row-between'>
|
<view class="item_label">订单编号</view>
|
<view class='conter acea-row row-middle row-right'>{{ orderInfo.orderId }}
|
<!-- #ifndef H5 -->
|
<text class='copy copy_text' @tap='copy(orderInfo.orderId)'></text>
|
<!-- #endif -->
|
<!-- #ifdef H5 -->
|
<text class='copy copy-data copy_text' :data-clipboard-text="orderInfo.orderId"></text>
|
<!-- #endif -->
|
</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">下单时间</view>
|
<view class='conter'>{{ (orderInfo.createTime || 0) }}</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">支付状态</view>
|
<view class='conter' v-if="orderInfo.paid">已支付</view>
|
<view class='conter' v-else>未支付</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">支付方式</view>
|
<view class='conter' v-if="Number(orderInfo.payPrice) > 0 && orderInfo.payCareBean > 0">悦养豆+现金
|
</view>
|
<view class='conter' v-else-if="orderInfo.payCareBean > 0">悦养豆</view>
|
<view class='conter' v-else>现金</view>
|
<!-- <view class='conter'>{{orderInfo.payTypeStr}}</view> -->
|
</view>
|
|
<view class='item acea-row row-between'>
|
<view class="item_label">商品总价</view>
|
<view class='conter'
|
v-if="toNumber(orderInfo.proTotalPrice) > 0 && toNumber(orderInfo.payCareBean) > 0">
|
￥{{ toNumber(orderInfo.proTotalPrice) }}+{{ toThousands(toNumber(orderInfo.payCareBean))
|
}}悦养豆
|
</view>
|
<view class='conter' v-else-if="toNumber(orderInfo.payCareBean) > 0">
|
{{ toThousands(toNumber(orderInfo.payCareBean)) }}悦养豆
|
</view>
|
<view class='conter' v-else>¥{{ toNumber(orderInfo.proTotalPrice) }}</view>
|
</view>
|
<view class='item acea-row row-between' v-if="toNumber(orderInfo.payPostage) > 0">
|
<view class="item_label">运费</view>
|
<view class='conter'>￥{{ toNumber(orderInfo.payPostage) }}</view>
|
</view>
|
<view class='item acea-row row-between' v-if='orderInfo.couponId'>
|
<view class="item_label">优惠券抵扣</view>
|
<view class='conter'>-￥{{ toNumber(orderInfo.couponPrice) }}</view>
|
</view>
|
<view class='item acea-row row-between' v-if="getTotalPromotionFee() > 0">
|
<view class="item_label">专区活动优惠抵扣</view>
|
<view class='conter'>-￥{{ toNumber(getTotalPromotionFee()) }}</view>
|
</view>
|
<view class='item acea-row row-between' v-if="orderInfo.useIntegral > 0">
|
<view class="item_label">积分抵扣</view>
|
<view class='conter'>-￥{{ toNumber(orderInfo.deductionPrice) }}</view>
|
</view>
|
<view class='item acea-row row-between' v-if="orderInfo.mark">
|
<view class="item_label">买家留言</view>
|
<view class='conter'>{{ orderInfo.mark }}</view>
|
</view>
|
</view>
|
<!-- 退款订单详情 "-->
|
<view v-if="isGoodsReturn" class='wrapper borRadius14'>
|
<view class='item acea-row row-between'>
|
<view class="item_label">收货人</view>
|
<view class='conter'>{{ orderInfo.realName }}</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">联系电话</view>
|
<view class='conter'>{{ orderInfo.userPhone }}</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">收货地址</view>
|
<view class='conter'>{{ orderInfo.userAddress }}</view>
|
</view>
|
</view>
|
<view v-if="orderInfo.status >= 0">
|
<view class='wrapper borRadius14' v-if="hasExpress">
|
<block v-if="orderInfo.deliveryMulti">
|
<view class='item acea-row row-between'>
|
<view class="item_label">配送方式</view>
|
<view class='conter'>发货</view>
|
</view>
|
<block v-for="expressItem, expressIndex in orderInfo.deliveryList" :key="expressIndex">
|
<view class='item acea-row row-between'>
|
<view class="item_label">快递公司</view>
|
<view class='conter'>{{ expressItem.name || '' }}</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">快递号</view>
|
<navigator v-if="orderInfo.status >= 0" hover-class='none'
|
class='conter express_number'
|
:url="'/pages/users/goods_logistics/index?orderId=' + orderInfo.orderId + '&dataId=' + orderInfo.id + '&isMulti=true&expressNumber=' + expressItem.number + '&expressId=' + expressItem.id">
|
{{ expressItem.number || '' }}<text class="express_btn">查看物流</text>
|
</navigator>
|
|
<view v-else class='conter '>{{ expressItem.number || '' }}</view>
|
</view>
|
</block>
|
</block>
|
<block v-if="!orderInfo.deliveryMulti">
|
<view class='item acea-row row-between'>
|
<view class="item_label">配送方式</view>
|
<view class='conter'>发货</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">快递公司</view>
|
<view class='conter'>{{ orderInfo.deliveryName || '' }}</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">快递号</view>
|
<navigator v-if="orderInfo.status >= 0" hover-class='none' class='conter express_number'
|
:url="'/pages/users/goods_logistics/index?orderId=' + orderInfo.orderId + '&dataId=' + orderInfo.id + '&expressNumber=' + orderInfo.deliveryId">
|
{{ orderInfo.deliveryId || '' }}<text class="express_btn">查看物流</text>
|
</navigator>
|
<view v-else class='conter '>{{ orderInfo.deliveryId || '' }}</view>
|
</view>
|
</block>
|
</view>
|
<view class='wrapper borRadius14' v-else-if='orderInfo.deliveryType == "send"'>
|
<view class='item acea-row row-between'>
|
<view class="item_label">配送方式</view>
|
<view class='conter'>送货</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">配送人姓名</view>
|
<view class='conter'>{{ orderInfo.deliveryName || '' }}</view>
|
</view>
|
<view class='item acea-row row-between'>
|
<view class="item_label">联系电话</view>
|
<view class='conter acea-row row-middle row-right'>{{ orderInfo.deliveryId || '' }}<text
|
class='copy' @tap='goTel'>拨打</text></view>
|
</view>
|
</view>
|
<view class='wrapper borRadius14' v-else-if='orderInfo.deliveryType == "fictitious"'>
|
<view class='item acea-row row-between'>
|
<view class="item_label">虚拟发货</view>
|
<view class='conter'>已发货，请注意查收</view>
|
</view>
|
</view>
|
</view>
|
<view class='wrapper borRadius14'>
|
<view class='item actualPay acea-row row-between'>
|
<view class="item_label">实付</view>
|
<view class='conter'>
|
<text class='money color-blue'
|
v-if="toNumber(orderInfo.payPrice) > 0 && toNumber(orderInfo.payCareBean) > 0"><text
|
class="color-blue">￥{{ toNumber(orderInfo.payPrice) }}+{{
|
toThousands(toNumber(orderInfo.payCareBean)) }}悦养豆</text>
|
</text>
|
<text class='money color-blue' v-else-if="toNumber(orderInfo.payCareBean) > 0">{{
|
toThousands(toNumber(orderInfo.payCareBean)) }}悦养豆</text>
|
<text class='money color-blue' v-else>¥{{ toNumber(orderInfo.payPrice) }}</text>
|
</view>
|
</view>
|
</view>
|
<view style='height:166rpx;'></view>
|
<view class='footer acea-row row-right row-middle' v-if="isGoodsReturn == false">
|
<view class="bnt gray" v-if="!orderInfo.paid" @click.stop="cancelOrder">取消订单</view>
|
<view class='bnt blue' v-if="!orderInfo.paid" @tap='pay_open(orderInfo.orderId)'>立即付款</view>
|
<view class='bnt gray' v-if="orderInfo.status == 3" @tap='delOrder'>删除订单</view>
|
<view class='bnt yellow' v-if="orderInfo.combinationId > 0" @tap='goJoinPink'>查看拼团</view>
|
<!-- <navigator class='bnt yellow'
|
v-if="orderInfo.deliveryType == 'express' && orderInfo.status >0&&orderInfo.status <3"
|
hover-class='none' :url="'/pages/users/goods_logistics/index?orderId='+ orderInfo.orderId">查看物流
|
</navigator> -->
|
<view class='bnt blue' v-if="orderInfo.status == 1" @tap='confirmOrder'>确认收货</view>
|
<view class='bnt blue' v-if="orderInfo.status == 3 && orderInfo.type !== 1" @tap='goOrderConfirm'>
|
再次购买
|
</view>
|
</view>
|
</view>
|
</view>
|
<payment :isClicking="isClicking" :payMode='payMode' :pay_close="pay_close" @lockFn='lockFn'
|
@onChangeFun='onChangeFun' :orderInfo="orderInfo"></payment>
|
</view>
|
</template>
|
<script>
|
import BigNumber from 'bignumber.js';
|
import {
|
getOrderDetail,
|
getOrderDetailForWx,
|
orderTake,
|
orderDel,
|
orderCancel,
|
qrcodeApi
|
} from '@/api/order.js';
|
import {
|
openOrderRefundSubscribe
|
} from '@/utils/SubscribeMessage.js';
|
import home from '@/components/home';
|
import payment from '@/components/payment';
|
import orderItemGoods from "@/components/orderItemGoods";
|
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
|
import {
|
toLogin
|
} from '@/libs/login.js';
|
import {
|
mapGetters
|
} from "vuex";
|
// #ifdef MP
|
import uQRCode from '@/js_sdk/Sansnn-uQRCode/uqrcode.js'
|
// #endif
|
export default {
|
components: {
|
payment,
|
home,
|
orderItemGoods
|
},
|
data() {
|
return {
|
isLoaded: false,
|
codeImg: '',
|
qrcodeSize: 100,
|
order_id: '',
|
evaluate: 0,
|
cartInfo: [], //购物车产品
|
orderInfo: {
|
systemStore: {},
|
pstatus: {}
|
}, //订单详情
|
system_store: {},
|
isGoodsReturn: false, //是否为退款订单
|
status: {}, //订单底部按钮状态
|
isClose: false,
|
payMode: [{
|
name: "微信支付",
|
icon: "icon-weixinzhifu",
|
value: 'weixin',
|
title: '微信快捷支付'
|
}],
|
pay_close: false,
|
pay_order_id: '',
|
totalPrice: '0',
|
isAuto: false, //没有授权的不会自动授权
|
isShowAuth: false, //是否隐藏授权
|
id: 0, //订单id
|
uniId: '',
|
utils: this.$util,
|
type: 'normal',
|
statusBarTop: 0,
|
careBeanRate: 0,
|
isWxPay: false,
|
orderNo: '',
|
options: {},
|
isPageShow: false,
|
hasFirstLoginListener: false,
|
orderProNum: 0,
|
hasExpress: false,
|
isClicking: false,
|
zonePromotionList: []
|
};
|
},
|
computed: mapGetters(['isLogin', 'chatUrl', 'userInfo']),
|
onLoad: function () {
|
let that = this;
|
|
if (that.$store.getters.isSystemHide) {
|
console.log('系统事件触发了onshow事件');
|
that.$store.getters.isSystemHide = false;
|
}
|
|
let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
that.statusBarTop = menuButtonInfo.top;
|
// },
|
// onShow() {
|
// console.log('show');
|
// let that = this;
|
that.isPageShow = true;
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
console.log('------------------page onShow start-----------------');
|
console.log('route', currPage.route);
|
console.log('options', currPage.options);
|
console.log('------------------page onShow end-----------------');
|
let options = currPage.options ? currPage.options : {};
|
that.options = options;
|
console.log('order details options-------------------', options);
|
options.type == undefined || options.type == null ? this.type = 'normal' : this.type = options.type;
|
if (!options.order_id && !options.uniId && !options.out_trade_no && !options.scene) return this.$util
|
.Tips({
|
title: '缺少参数'
|
}, {
|
tab: 3,
|
url: 1
|
});
|
if (that.options.out_trade_no) {
|
that.isWxPay = true;
|
that.$set(this, 'orderNo', options.out_trade_no);
|
} else {
|
that.isWxPay = false;
|
this.$set(this, 'order_id', options.order_id);
|
}
|
if (that.options.scene) {
|
if (this.$Cache.get('order_details_scene') && this.$Cache.get('order_details_scene') == options
|
.scene && this.$Cache.get(
|
'order_details_param')) {
|
let params = JSON.parse(this.$Cache.get('order_details_param'));
|
if (params.out_trade_no) {
|
that.isWxPay = true;
|
that.$set(this, 'orderNo', params.out_trade_no);
|
} else if (params.order_id) {
|
that.isWxPay = false;
|
that.$set(this, 'order_id', params.order_id);
|
} else {
|
return this.$util.Tips({
|
title: '缺少参数'
|
}, {
|
tab: 3,
|
url: 1
|
});
|
}
|
} else {
|
uni.$once('finishSceneParam', (res) => {
|
console.log(res);
|
if (res && res.data) {
|
this.$Cache.set('order_details_scene', options.scene);
|
this.$Cache.set('order_details_param', res.data);
|
if (res.data.out_trade_no) {
|
that.isWxPay = true;
|
that.$set(this, 'orderNo', res.data.out_trade_no);
|
} else if (res.data.order_id) {
|
that.isWxPay = false;
|
that.$set(this, 'order_id', res.data.order_id);
|
} else {
|
return this.$util.Tips({
|
title: '缺少参数'
|
}, {
|
tab: 3,
|
url: 1
|
});
|
}
|
}
|
});
|
}
|
}
|
this.isLoaded = false;
|
|
if (!that.$store.getters.careBeanRate) {
|
uni.$once('updateCareBeanRate', that.careBeanRateReadyFn);
|
} else {
|
that.careBeanRate = that.$store.getters.careBeanRate;
|
}
|
|
//正常注册过才能进入这个页面
|
if (that.$store.getters.isBelong) {
|
that.belongInfoReadyFn({
|
isRegister: false
|
})
|
} else {
|
uni.$once('BELONG_READY', that.belongInfoReadyFn);
|
}
|
},
|
onHide() {
|
console.log('hide')
|
let that = this;
|
that.isPageShow = false;
|
this.isClose = true;
|
uni.$off('updateCareBeanRate', that.careBeanRateReadyFn);
|
uni.$off('BELONG_READY', that.belongInfoReadyFn);
|
},
|
onReady: function () {
|
// #ifdef H5
|
this.$nextTick(function () {
|
const clipboard = new ClipboardJS(".copy-data");
|
clipboard.on("success", () => {
|
this.$util.Tips({
|
title: '复制成功'
|
});
|
});
|
});
|
// #endif
|
|
},
|
methods: {
|
getTotalPromotionFee() {
|
let total = 0;
|
if (!this.zonePromotionList || !Array.isArray(this.zonePromotionList)) return 0;
|
this.zonePromotionList.forEach(promotion => {
|
if (promotion.promotionFee) {
|
total += Number(promotion.promotionFee) || 0;
|
}
|
});
|
return total;
|
},
|
downloadImage(imageUrl) {
|
uni.showLoading()
|
uni.downloadFile({
|
url: imageUrl, // 远程图片地址
|
success: (res) => {
|
if (res.statusCode === 200) {
|
uni.getSetting({
|
success(res2) {
|
if (!res2.authSetting['scope.writePhotosAlbum']) {
|
uni.authorize({
|
scope: 'scope.writePhotosAlbum',
|
success() {
|
uni.saveImageToPhotosAlbum({
|
filePath: res.tempFilePath,
|
success: () => {
|
uni.hideLoading();
|
uni.showToast({
|
title: "保存成功",
|
icon: "success"
|
});
|
},
|
fail: (err) => {
|
uni.hideLoading();
|
uni.showToast({
|
title: "保存失败",
|
icon: "none"
|
});
|
console.log("保存失败：", err);
|
}
|
});
|
},
|
fail() {
|
uni.hideLoading();
|
}
|
})
|
} else {
|
uni.saveImageToPhotosAlbum({
|
filePath: res.tempFilePath,
|
success: () => {
|
uni.hideLoading();
|
uni.showToast({
|
title: "保存成功",
|
icon: "success"
|
});
|
},
|
fail: (err) => {
|
uni.hideLoading();
|
uni.showToast({
|
title: "保存失败",
|
icon: "none"
|
});
|
console.log("保存失败：", err);
|
}
|
});
|
}
|
}
|
})
|
}
|
},
|
fail: (err) => {
|
uni.hideLoading()
|
uni.showToast({
|
title: "图片下载失败",
|
icon: "none"
|
});
|
console.log("下载失败：", err);
|
}
|
});
|
},
|
changeAddress() {
|
let that = this;
|
if (that.orderInfo.canChangeAddress) {
|
uni.navigateTo({
|
url: '/pages/users/user_address_list/index?orderId=' + that.orderInfo.orderId +
|
'&dataId=' + that.orderInfo.id
|
});
|
} else {
|
that.$util.Tips({
|
title: '温馨提示：您已过了修改地址的时间段，如有修改的需求，请联系客服协助修改',
|
icon: 'none'
|
});
|
}
|
},
|
careBeanRateReadyFn() {
|
let that = this;
|
that.$nextTick(() => {
|
that.$set(that, 'careBeanRate', that.$store.getters.careBeanRate)
|
})
|
},
|
belongInfoReadyFn(data) {
|
let that = this;
|
if (!data.isRegister) {
|
that.checkLoginFn()
|
}
|
},
|
checkLoginFn() {
|
let that = this;
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
that.addTrack('yy_pageView', {
|
pageTitle_var: '订单详情',
|
pagePath_var: currPage.route,
|
pageType_var: '订单'
|
});
|
if (that.$store.getters.isLogin) {
|
that.getOrderInfo();
|
} else {
|
that.$util.Tips({
|
title: '数据错误，请登录平台后再下单',
|
icon: 'none'
|
});
|
let timer = setTimeout(() => {
|
clearTimeout(timer);
|
uni.switchTab({
|
url: '/pages/index/index'
|
})
|
}, 2000)
|
|
}
|
},
|
goback() {
|
let pages = getCurrentPages();
|
console.log(pages);
|
if (pages.length > 1) {
|
return uni.navigateBack({
|
delta: 1,
|
})
|
} else {
|
uni.switchTab({
|
url: '/pages/index/index'
|
});
|
}
|
},
|
kefuClick() {
|
location.href = this.chatUrl;
|
},
|
goGoodCall() {
|
let that = this
|
uni.navigateTo({
|
url: `/pages/customer_list/index?orderId=${that.order_id}`
|
})
|
},
|
openSubcribe: function (e) {
|
let page = e;
|
uni.showLoading({
|
title: '正在加载',
|
})
|
openOrderRefundSubscribe().then(res => {
|
uni.hideLoading();
|
uni.navigateTo({
|
url: page,
|
});
|
}).catch(() => {
|
uni.hideLoading();
|
});
|
},
|
/**
|
* 事件回调
|
*
|
*/
|
onChangeFun: function (e) {
|
let opt = e;
|
let action = opt.action || null;
|
let value = opt.value != undefined ? opt.value : null;
|
(action && this[action]) && this[action](value);
|
this.isClicking = false;
|
},
|
lockFn: function () {
|
this.isClicking = true;
|
},
|
/**
|
* 拨打电话
|
*/
|
makePhone: function () {
|
uni.makePhoneCall({
|
phoneNumber: this.system_store.phone
|
})
|
},
|
/**
|
* 打开地图
|
*
|
*/
|
showMaoLocation: function () {
|
if (!this.system_store.latitude || !this.system_store.longitude) return this.$util.Tips({
|
title: '缺少经纬度信息无法查看地图！'
|
});
|
uni.openLocation({
|
latitude: parseFloat(this.system_store.latitude),
|
longitude: parseFloat(this.system_store.longitude),
|
scale: 8,
|
name: this.system_store.name,
|
address: this.system_store.address + this.system_store.detailedAddress,
|
success: function () {
|
|
},
|
});
|
},
|
/**
|
* 关闭支付组件
|
*
|
*/
|
payClose: function () {
|
this.pay_close = false;
|
},
|
/**
|
* 打开支付组件
|
*
|
*/
|
pay_open: function () {
|
this.pay_close = true;
|
this.pay_order_id = this.orderInfo.orderId;
|
this.totalPrice = this.orderInfo.payPrice;
|
},
|
/**
|
* 支付成功回调
|
*
|
*/
|
pay_complete: function () {
|
this.pay_close = false;
|
this.pay_order_id = '';
|
this.getOrderInfo();
|
},
|
/**
|
* 支付失败回调
|
*
|
*/
|
pay_fail: function () {
|
this.pay_close = false;
|
this.pay_order_id = '';
|
},
|
/**
|
* 获取订单详细信息
|
*
|
*/
|
getOrderInfo: function () {
|
let that = this;
|
uni.showLoading({
|
title: "正在加载中"
|
});
|
that.getOrderApi().then(res => {
|
that.isLoaded = true;
|
uni.hideLoading();
|
that.$set(that, 'order_id', res.data.orderId);
|
that.$set(that, 'orderInfo', res.data);
|
that.$set(that, 'evaluate', res.data.status == 2 ? 2 : 0);
|
that.$set(that, 'system_store', res.data.systemStore);
|
let num = 0;
|
res.data.orderInfoList.forEach((item) => {
|
console.log(item);
|
num += item.cartNum;
|
//测试用 错误
|
//item.payPrice = BigNumber(item.price).minus(BigNumber(item.payCareBean).div(this.careBeanRate)).toNumber()
|
})
|
that.$set(that, 'orderProNum', num);
|
that.$set(that, 'cartInfo', res.data.orderInfoList);
|
that.$set(that, 'zonePromotionList', res.data.zonePromotionList || []);
|
if (res.data.refundStatus != 0) {
|
that.isGoodsReturn = true;
|
};
|
if (that.orderInfo.shippingType == 2 && that.orderInfo.paid) that.markCode(res.data
|
.verifyCode);
|
if (that.orderInfo.refundStatus > 0) {
|
uni.setNavigationBarColor({
|
frontColor: '#ffffff',
|
backgroundColor: '#666666'
|
})
|
}
|
if (that.orderInfo.deliveryType == 'express' && (that.orderInfo.deliveryMulti && that
|
.orderInfo.deliveryList.length > 0) || (!that.orderInfo.deliveryMulti && that
|
.orderInfo.deliveryId)) {
|
that.hasExpress = true;
|
}
|
}).catch(err => {
|
uni.hideLoading();
|
that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
}, '/pages/users/order_list/index');
|
});
|
},
|
getOrderApi: function () {
|
let that = this;
|
if (that.isWxPay) {
|
return new Promise((resolve, reject) => {
|
getOrderDetailForWx(that.orderNo).then((res) => {
|
resolve(res);
|
}).catch((e) => {
|
console.log(e);
|
reject();
|
})
|
});
|
} else {
|
return new Promise((resolve, reject) => {
|
getOrderDetail(that.order_id).then((res) => {
|
resolve(res);
|
}).catch((e) => {
|
console.log(e);
|
reject(e);
|
})
|
});
|
}
|
},
|
/**
|
*
|
* 生成二维码
|
*/
|
markCode(text) {
|
qrcodeApi({
|
height: '145',
|
text: text,
|
width: '145'
|
}).then(res => {
|
this.codeImg = res.data.code
|
});
|
},
|
/**
|
*
|
* 剪切订单号
|
*/
|
// #ifndef H5
|
copy: function (text) {
|
let that = this;
|
uni.setClipboardData({
|
data: text
|
});
|
},
|
// #endif
|
/**
|
* 打电话
|
*/
|
goTel: function () {
|
uni.makePhoneCall({
|
phoneNumber: this.orderInfo.deliveryId
|
})
|
},
|
/**
|
* 设置底部按钮
|
*
|
*/
|
getOrderStatus: function () {
|
let orderInfo = this.orderInfo || {},
|
_status = orderInfo.pstatus || {
|
type: 0
|
},
|
status = {};
|
let type = parseInt(_status.type),
|
delivery_type = orderInfo.deliveryType,
|
seckill_id = orderInfo.seckillId ? parseInt(orderInfo.seckillId) : 0,
|
bargain_id = orderInfo.bargainId ? parseInt(orderInfo.bargainId) : 0,
|
combination_id = orderInfo.combinationId ? parseInt(orderInfo.combinationId) : 0;
|
status = {
|
type: type == 9 ? -9 : type,
|
class_status: 0
|
};
|
if (type == 1 && combination_id > 0) status.class_status = 1; //查看拼团
|
if (type == 2 && delivery_type == 'express') status.class_status = 2; //查看物流
|
if (type == 2) status.class_status = 3; //确认收货
|
if (type == 4 || type == 0) status.class_status = 4; //删除订单
|
if (!seckill_id && !bargain_id && !combination_id && (type == 3 || type == 4)) status.class_status =
|
5; //再次购买
|
this.$set(this, 'status', status);
|
},
|
/**
|
* 去拼团详情
|
*
|
*/
|
goJoinPink: function () {
|
uni.navigateTo({
|
url: '/pages/activity/goods_combination_status/index?id=' + this.orderInfo.pinkId,
|
});
|
},
|
/**
|
* 再此购买
|
*
|
*/
|
goOrderConfirm: function () {
|
//let orderId=this.orderInfo.id;
|
let orderId = this.order_id;
|
let details = [];
|
this.cartInfo.forEach((item, index) => {
|
details.push({
|
attrValueId: item.attrId,
|
payCareBean: item.payCareBean,
|
productId: item.productId,
|
productNum: item.cartNum,
|
orderNo: orderId,
|
zoneId: item.storeZoneId
|
});
|
});
|
this.$Order.getPreOrder(
|
"again",
|
details,
|
orderId,
|
(this.cartInfo[0].storeZoneId ? this.cartInfo[0].storeZoneId : 0),
|
false,
|
(this.orderInfo.userBkFlag && this.cartInfo[0].birthdayGift) ? 1 : ''
|
);
|
},
|
confirmOrder: function () {
|
let that = this;
|
that.$refs.showConfirm.show({
|
title: '确认收货',
|
content: '为保障权益，请收到货确认无误后，再确认收货',
|
center: true,
|
success: function (res) {
|
if (res.confirm) {
|
orderTake(that.orderInfo.id).then(res => {
|
return that.$util.Tips({
|
title: '操作成功',
|
icon: 'success'
|
}, function () {
|
that.getOrderInfo();
|
});
|
}).catch(err => {
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
})
|
}
|
}
|
})
|
},
|
/**
|
*
|
* 删除订单
|
*/
|
delOrder: function () {
|
let that = this;
|
that.$refs.showConfirm.show({
|
title: '提示',
|
content: '您确定要删除订单吗？<br>删除后订单将无法恢复哦～',
|
center: true,
|
showCancel: true,
|
confirmText: '确定',
|
success: function (res) {
|
console.log(res);
|
if (res.confirm) {
|
orderDel(that.orderInfo.id).then(res => {
|
return that.$util.Tips({
|
title: '删除成功',
|
icon: 'success'
|
}, {
|
tab: 3,
|
url: 1
|
});
|
}).catch(err => {
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
});
|
} else if (res.cancel) {
|
console.log('用户点击取消');
|
}
|
}
|
});
|
// orderDel(that.orderInfo.id).then(res => {
|
// return that.$util.Tips({
|
// title: '删除成功',
|
// icon: 'success'
|
// }, {
|
// tab: 3,
|
// url: 1
|
// });
|
// }).catch(err => {
|
// return that.$util.Tips({
|
// title: (err&&err.message)?err.message:err
|
// });
|
// });
|
},
|
cancelOrder() {
|
let that = this
|
that.$refs.showConfirm.show({
|
title: '提示',
|
content: '您确定要取消订单吗？<br>取消后订单将无法恢复哦～',
|
center: true,
|
success: function (res) {
|
if (res.confirm) {
|
orderCancel(that.orderInfo.id)
|
.then((data) => {
|
that.$util.Tips({
|
title: '取消成功'
|
}, {
|
tab: 3
|
})
|
})
|
.catch((err) => {
|
that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
})
|
that.getDetail();
|
});
|
} else if (res.cancel) {
|
console.log('用户点击取消');
|
}
|
}
|
});
|
},
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.storeProductCardBox {
|
background: rgba(1, 109, 204, 0.07);
|
border-radius: 11rpx 11rpx 11rpx 11rpx;
|
padding: 30rpx;
|
font-size: 23rpx;
|
line-height: 1.25;
|
color: #016DCC;
|
margin-top: 20rpx;
|
position: relative;
|
|
.btnCopy {
|
width: 1em;
|
height: 1em;
|
margin-left: 15rpx;
|
display: inline-block;
|
background: url(https://ossacmall.bluedeer.com.cn/app/static/images/i_copy2.png) center bottom/contain no-repeat;
|
}
|
|
.btnDownload {
|
font-size: 27rpx;
|
line-height: 76rpx;
|
text-align: center;
|
width: max-content;
|
margin: 0 auto;
|
padding: 0 20rpx;
|
border-radius: 11rpx;
|
color: #ffffff;
|
background-color: #016DCC;
|
margin-top: 10rpx;
|
}
|
}
|
|
.shuoming {
|
width: 32rpx;
|
height: 32rpx;
|
}
|
|
.goodCall {
|
text-align: center;
|
width: 100%;
|
height: 86rpx;
|
padding: 0 30rpx;
|
border-bottom: 1rpx solid #eee;
|
font-size: 30rpx;
|
line-height: 86rpx;
|
background: #fff;
|
|
.icon-kefu {
|
font-size: 36rpx;
|
margin-right: 15rpx;
|
}
|
|
/* #ifdef MP */
|
button {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
height: 86rpx;
|
font-size: 30rpx;
|
color: #000000;
|
}
|
|
/* #endif */
|
}
|
|
.order-details .header {
|
padding: 50rpx 30rpx 100rpx 30rpx;
|
}
|
|
.order-details .header.on {
|
background-color: #666 !important;
|
}
|
|
.order-details .header .pictrue {
|
width: 110rpx;
|
height: 110rpx;
|
}
|
|
.order-details .header .pictrue image {
|
width: 100%;
|
height: 100%;
|
}
|
|
.order-details .header .data {
|
color: #000000;
|
font-size: 25rpx;
|
padding-left: 60rpx;
|
position: relative;
|
|
.return {
|
position: absolute;
|
left: 0;
|
top: 10rpx;
|
}
|
}
|
|
.order-details .header .data.on {
|
margin-left: 0;
|
}
|
|
.order-details .header .data .state {
|
font-weight: bold;
|
margin-bottom: 7rpx;
|
padding-top: 6rpx;
|
}
|
|
.order-details .header .data .time {
|
margin-left: 20rpx;
|
}
|
|
.order-details .nav {
|
background-color: #fff;
|
font-size: 26rpx;
|
color: #282828;
|
padding: 27rpx 0;
|
width: 100%;
|
border-radius: 14rpx;
|
margin: -70rpx auto 0 auto;
|
}
|
|
.order-details .font-color {
|
color: #04C763 !important;
|
}
|
|
.order-details .nav .navCon {
|
padding: 0 40rpx;
|
}
|
|
.order-details .nav .on {
|
color: #04C763;
|
}
|
|
.order-details .nav .progress {
|
padding: 0 65rpx;
|
margin-top: 10rpx;
|
flex-wrap: nowrap;
|
}
|
|
.order-details .nav .progress .line {
|
width: 100rpx;
|
height: 2rpx;
|
background-color: #939390;
|
|
&.bg-color {
|
background-color: #04C763 !important;
|
}
|
}
|
|
.order-details .nav .progress .iconfont {
|
font-size: 38rpx;
|
color: #939390;
|
margin-top: -2rpx;
|
}
|
|
.order-details .address {
|
font-size: 30rpx;
|
color: #000000;
|
background-color: #fff;
|
margin-top: 15rpx;
|
padding: 30rpx 24rpx;
|
word-break: break-all;
|
position: relative;
|
|
.address_label {
|
display: inline-block;
|
font-size: 27rpx;
|
width: 4em;
|
margin-right: 1em;
|
white-space: nowrap;
|
text-align: justify;
|
text-align-last: justify;
|
color: #979797;
|
}
|
|
.copy_text {
|
display: inline-block;
|
width: 28rpx;
|
height: 28rpx;
|
margin-left: 1em;
|
background: url(https://ossacmall.bluedeer.com.cn/app/static/images/i_copy.png) center center/contain no-repeat;
|
}
|
|
}
|
|
.order-details .address .name {
|
font-size: 30rpx;
|
color: #282828;
|
margin-bottom: 0;
|
position: relative;
|
padding-right: 102rpx;
|
|
.bnt {
|
position: absolute;
|
right: 0;
|
top: 50%;
|
margin-top: -21rpx;
|
width: 90rpx;
|
height: 42rpx;
|
line-height: 42rpx;
|
text-align: center;
|
border-radius: 5rpx;
|
color: #fff;
|
background-color: #016DCC;
|
font-size: 20rpx;
|
|
&.disable {
|
color: #000000;
|
background-color: #DDDDDD;
|
}
|
}
|
}
|
|
.order-details .address .name .phone {
|
margin-left: 40rpx;
|
}
|
|
.order-details .line {
|
width: 100%;
|
height: 3rpx;
|
}
|
|
.order-details .line image {
|
width: 100%;
|
height: 100%;
|
display: block;
|
}
|
|
.order-details .wrapper {
|
background-color: #fff;
|
margin-top: 12rpx;
|
padding: 30rpx 24rpx;
|
}
|
|
.order-details .wrapper .item {
|
font-size: 27rpx;
|
color: #282828;
|
}
|
|
.order-details .wrapper .item~.item {
|
margin-top: 20rpx;
|
}
|
|
.order-details .wrapper .item .conter {
|
color: #000000;
|
// width: 490rpx;
|
text-align: right;
|
|
&.express_number {
|
color: #016DCC;
|
text-decoration: underline
|
}
|
}
|
|
.order-details .wrapper .item .item_label {
|
color: #979797;
|
}
|
|
.order-details .wrapper .item .express_btn {
|
display: inline-block;
|
padding: 0 10rpx;
|
color: #ffffff;
|
background: #016DCC;
|
font-size: 20rpx;
|
line-height: 2em;
|
text-decoration: none;
|
margin-left: 15rpx;
|
border-radius: 5rpx;
|
}
|
|
.order-details .wrapper .item.actualPay .item_label {
|
color: #000000;
|
}
|
|
.order-details .wrapper .item .conter .copy {
|
font-size: 20rpx;
|
color: #016DCC !important;
|
margin-left: 24rpx;
|
|
&.copy_text {
|
display: inline-block;
|
width: 28rpx;
|
height: 28rpx;
|
background: url(https://ossacmall.bluedeer.com.cn/app/static/images/i_copy.png) center center/contain no-repeat;
|
}
|
}
|
|
|
|
.order-details .wrapper .actualPay .money {
|
font-weight: bold;
|
font-size: 30rpx;
|
}
|
|
.order-details .footer {
|
width: 100%;
|
height: 136rpx;
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
background-color: #fff;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
}
|
|
.order-details .footer .bnt {
|
width: 220rpx;
|
height: 76rpx;
|
line-height: 76rpx;
|
text-align: center;
|
border-radius: 11rpx;
|
color: #fff;
|
font-size: 27rpx;
|
}
|
|
.order-details .footer .bnt.gray {
|
color: #000000;
|
background-color: #DDDDDD;
|
}
|
|
.order-details .footer .bnt.yellow {
|
color: #000000;
|
background-color: #FFE20E
|
}
|
|
.order-details .footer .bnt.blue {
|
color: #ffffff;
|
background-color: #016DCC
|
}
|
|
.order-details .footer .bnt~.bnt {
|
margin-left: 18rpx;
|
}
|
|
.order-details .writeOff {
|
background-color: #fff;
|
margin-top: 15rpx;
|
padding-bottom: 50rpx;
|
}
|
|
.order-details .writeOff .title {
|
font-size: 30rpx;
|
color: #282828;
|
height: 87rpx;
|
border-bottom: 1px solid #f0f0f0;
|
padding: 0 24rpx;
|
line-height: 87rpx;
|
}
|
|
.order-details .writeOff .grayBg {
|
background-color: #f2f5f7;
|
width: 590rpx;
|
height: 384rpx;
|
border-radius: 20rpx 20rpx 0 0;
|
margin: 50rpx auto 0 auto;
|
padding-top: 55rpx;
|
}
|
|
.order-details .writeOff .grayBg .pictrue {
|
width: 290rpx;
|
height: 290rpx;
|
margin: 0 auto;
|
}
|
|
.order-details .writeOff .grayBg .pictrue image {
|
width: 100%;
|
height: 100%;
|
display: block;
|
}
|
|
.order-details .writeOff .gear {
|
width: 590rpx;
|
height: 30rpx;
|
margin: 0 auto;
|
}
|
|
.order-details .writeOff .gear image {
|
width: 100%;
|
height: 100%;
|
display: block;
|
}
|
|
.order-details .writeOff .num {
|
background-color: #f0c34c;
|
width: 590rpx;
|
height: 84rpx;
|
color: #282828;
|
font-size: 48rpx;
|
margin: 0 auto;
|
border-radius: 0 0 20rpx 20rpx;
|
text-align: center;
|
padding-top: 4rpx;
|
}
|
|
.order-details .writeOff .rules {
|
margin: 46rpx 30rpx 0 30rpx;
|
border-top: 1px solid #f0f0f0;
|
padding-top: 10rpx;
|
}
|
|
.order-details .writeOff .rules .item {
|
margin-top: 20rpx;
|
}
|
|
.order-details .writeOff .rules .item .rulesTitle {
|
font-size: 28rpx;
|
color: #282828;
|
}
|
|
.order-details .writeOff .rules .item .rulesTitle .iconfont {
|
font-size: 30rpx;
|
color: #333;
|
margin-right: 8rpx;
|
margin-top: 5rpx;
|
}
|
|
.order-details .writeOff .rules .item .info {
|
font-size: 28rpx;
|
color: #999;
|
margin-top: 7rpx;
|
}
|
|
.order-details .writeOff .rules .item .info .time {
|
margin-left: 20rpx;
|
}
|
|
.order-details .map {
|
height: 86rpx;
|
font-size: 30rpx;
|
color: #282828;
|
line-height: 86rpx;
|
border-bottom: 1px solid #f0f0f0;
|
margin-top: 15rpx;
|
background-color: #fff;
|
padding: 0 24rpx;
|
}
|
|
.order-details .map .place {
|
font-size: 26rpx;
|
width: 176rpx;
|
height: 50rpx;
|
border-radius: 25rpx;
|
line-height: 50rpx;
|
text-align: center;
|
}
|
|
.order-details .map .place .iconfont {
|
font-size: 27rpx;
|
height: 27rpx;
|
line-height: 27rpx;
|
margin: 2rpx 3rpx 0 0;
|
}
|
|
.order-details .address .name .iconfont {
|
font-size: 34rpx;
|
margin-left: 10rpx;
|
}
|
|
.refund {
|
padding: 0 !important;
|
margin-top: 15rpx;
|
background-color: #fff;
|
|
.title {
|
display: flex;
|
align-items: center;
|
font-size: 30rpx;
|
color: #333;
|
height: 86rpx;
|
border-bottom: 1px solid #f5f5f5;
|
font-weight: 400;
|
padding: 0 24rpx;
|
|
image {
|
width: 32rpx;
|
height: 32rpx;
|
margin-right: 10rpx;
|
}
|
}
|
|
.con {
|
font-size: 25rpx;
|
color: #666666;
|
padding: 30rpx 24rpx;
|
}
|
}
|
</style>
|
|
<style>
|
.qs-btn {
|
width: auto;
|
height: 60rpx;
|
text-align: center;
|
line-height: 60rpx;
|
border-radius: 50rpx;
|
color: #fff;
|
font-size: 27rpx;
|
padding: 0 3%;
|
color: #aaa;
|
border: 1px solid #ddd;
|
margin-right: 20rpx;
|
}
|
</style>
|
