<template>
|
<view>
|
<view class='payment-status'>
|
<view class="header"></view>
|
<view class='status' v-if="!order_pay_info.paid||order_pay_info.payType == 'offline'">
|
<view class='iconfont icons icon-iconfontguanbi'></view>
|
<view class="text">订单支付失败</view>
|
</view>
|
<view class='status' v-else>
|
<view class='iconfont icons icon-duihao2'></view>
|
<view class="text">订单支付成功</view>
|
</view>
|
<view class='wrapper'>
|
<view class='item acea-row row-between-wrapper'>
|
<view class='itemLabel'>订单编号</view>
|
<view class='itemCom'>{{order_pay_info.orderId}}</view>
|
</view>
|
<view class='item acea-row row-between-wrapper'>
|
<view class='itemLabel'>下单时间</view>
|
<view class='itemCom'>{{order_pay_info.createTime?order_pay_info.createTime:'-'}}</view>
|
</view>
|
<view class='item acea-row row-between-wrapper'>
|
<view class='itemLabel'>支付方式</view>
|
<view class='itemCom' v-if="order_pay_info.payPrice>0&&order_pay_info.payCareBean>0">现金+悦养豆</view>
|
<view class='itemCom' v-else-if="order_pay_info.payCareBean>0">悦养豆</view>
|
<view class='itemCom' v-else>现金</view>
|
|
<!-- <view class='itemCom' v-if="order_pay_info.payType=='weixin'">微信支付</view>
|
<view class='itemCom' v-else-if="order_pay_info.payType=='yue'">余额支付</view>
|
<view class='itemCom' v-else-if="order_pay_info.payType=='offline'">线下支付</view>
|
<view class='itemCom' v-else-if="order_pay_info.payType=='alipay'">支付宝支付</view> -->
|
</view>
|
<view class='item acea-row row-between-wrapper'>
|
<view class='itemLabel'>支付金额</view>
|
<view class='itemCom'
|
v-if="toNumber(order_pay_info.payPrice)>0&&toNumber(order_pay_info.payCareBean)>0">
|
¥{{toNumber(order_pay_info.payPrice)}}
|
+{{ toThousands(toNumber(order_pay_info.payCareBean) )}}悦养豆</view>
|
<view class='itemCom' v-else-if="toNumber(order_pay_info.payCareBean)>0">
|
{{toThousands(toNumber(order_pay_info.payCareBean)) }}悦养豆
|
</view>
|
<view class='itemCom' v-else>¥{{toNumber(order_pay_info.payPrice)}}</view>
|
</view>
|
<!--失败时加上这个 -->
|
<view class='item acea-row row-between-wrapper'
|
v-if="order_pay_info.paid==0 && order_pay_info.payType == 'offline'">
|
<view class='itemLabel'>失败原因</view>
|
<view class='itemCom'>{{status==2 ? '取消支付':msg}}</view>
|
</view>
|
</view>
|
<view v-if="showBanner" @click="goToLink" class="banner">
|
<image class="bannerImg" :src="orderBanner.orderBannerImg" mode="aspectFit"></image>
|
</view>
|
<!--失败时： 重新购买 -->
|
<view @tap="goOrderDetails">
|
<button formType="submit" class='returnBnt returnBnt1' hover-class='none'>查看订单</button>
|
</view>
|
<button @click="goPink(order_pay_info.pinkId)" class='returnBnt returnBnt2' formType="submit"
|
hover-class='none'
|
v-if="order_pay_info.pinkId && order_pay_info.paid!=0 && status!=2 && status!=1">邀请好友参团</button>
|
<button @click="goIndex" class='returnBnt returnBnt2' formType="submit" hover-class='none'
|
v-else>返回首页</button>
|
</view>
|
<!-- #ifdef MP -->
|
<!-- #endif -->
|
<personalAndShareCoupon ref="personalAndShareCouponRef" @share="handleShareCoupon"></personalAndShareCoupon>
|
</view>
|
</template>
|
|
<script>
|
import {
|
HTTP_REQUEST_URL,
|
THIRD_APPID
|
} from '@/config/app';
|
let app = getApp();
|
import {
|
getIndexConfig,
|
} from '@/api/api.js';
|
import {
|
getOrderDetail
|
} from '@/api/order.js';
|
import {
|
getCounponPackStatus,
|
couponPackSharelink,
|
getZoneDetail
|
} from '@/api/store'
|
import {
|
openOrderSubscribe
|
} from '@/utils/SubscribeMessage.js';
|
import {
|
toLogin
|
} from '@/libs/login.js';
|
import {
|
mapGetters
|
} from "vuex";
|
import personalAndShareCoupon from '@/components/personalAndShareCoupon/index.vue'
|
export default {
|
components: {
|
personalAndShareCoupon
|
},
|
computed: mapGetters(['isLogin', 'uid']),
|
data() {
|
return {
|
orderId: '',
|
order_pay_info: {
|
paid: 1,
|
_status: {}
|
},
|
isAuto: false, //没有授权的不会自动授权
|
isShowAuth: false, //是否隐藏授权
|
status: 0,
|
msg: '',
|
isDelete: false,
|
isPageShow: false,
|
isLastOne: false,
|
showBanner: false,
|
orderBanner: {},
|
tabLinkArr: [
|
'pages/index/index',
|
'pages/goods_cate/goods_cate',
|
'pages/user/index'
|
],
|
isCouponShare: false,
|
activityId: '',
|
friendStatus: '',
|
couponZoneId: 0,
|
shareProductId: 0,
|
shareProductName: '',
|
shareProductImage: '',
|
zoneType: null,
|
zoneShareSwitch: 0,
|
couponPackStatus: null,
|
};
|
},
|
onShow: function(options) {
|
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-----------------');
|
if (!options) {
|
options = currPage.options ? currPage.options : {};
|
}
|
that.$store.commit('UPDATE_isSystemHide', {
|
isSystemHide: false
|
});
|
that.addTrack('yy_pageView', {
|
pageTitle_var: '订单支付状态',
|
pagePath_var: currPage.$page.fullPath,
|
pageType_var: '订单'
|
});
|
if (!options.order_id) return this.$util.Tips({
|
title: '缺少参数无法查看订单支付状态'
|
}, {
|
tab: 3,
|
url: 1
|
});
|
this.isLastOne = options.isLastOne ? true : false;
|
this.orderId = options.order_id;
|
this.status = options.status || 0;
|
this.msg = options.msg || '';
|
|
//正常未登录不会进入这个页面
|
if (that.$store.getters.isBelong) {
|
that.belongInfoReadyFn({
|
isRegister: false
|
})
|
} else {
|
uni.$once('BELONG_READY', that.belongInfoReadyFn);
|
}
|
},
|
onHide: function() {
|
let that = this;
|
that.isPageShow = false;
|
uni.$off('BELONG_READY', that.belongInfoReadyFn);
|
},
|
// #ifdef MP
|
onShareAppMessage: function(options) {
|
let that = this;
|
that.$store.commit('UPDATE_isSystemHide', {
|
isSystemHide: (new Date()).getTime()
|
});
|
if (that.isCouponShare) {
|
that.isCouponShare = false;
|
if (that.$refs.personalAndShareCouponRef) {
|
that.$refs.personalAndShareCouponRef.hide();
|
}
|
return that.buildCouponShareConfig(options);
|
}
|
return {};
|
},
|
// #endif
|
methods: {
|
goToThird(url, appId) {
|
//第三方小程序
|
// /pages/home/index?source=INSMART&sourceScene=test&agentNo=90028476&agentChannel=BK&agentCompany=123&agentBranch=123
|
let miniProgramInfo = uni.getAccountInfoSync().miniProgram;
|
|
if (url.indexOf('?') < 0) {
|
url += '?';
|
} else {
|
url += '&';
|
}
|
if (app.globalData.source) {
|
url += 'source=' + app.globalData.source;
|
} else {
|
url += 'source=MALL';
|
}
|
url += '&sourceScene=home';
|
url += '&agentNo=' + ((this.$store.getters.belong && this.$store.getters.belong.agentNo) ? this.$store
|
.getters.belong.agentNo : '');
|
url += '&agentChannel=' + ((this.$store.getters.belong && this.$store.getters.belong.channel) ? this.$store
|
.getters.belong.channel : ''); //归属代理人渠道
|
url += '&agentCompany=' + ((this.$store.getters.belong && this.$store.getters.belong.companyCode) ? this
|
.$store.getters.belong.companyCode : ''); //agentCompany
|
|
url += '&agentBranch=' + ((this.$store.getters.belong && this.$store.getters.belong.branchCode) ? this
|
.$store.getters.belong.branchCode : ''); //归属代理人支公司
|
url += '&custAgentOrgNo=' + ((this.$store.getters.belong && this.$store.getters.belong.subCode) ? this
|
.$store.getters.belong.subCode : ''); //归属代理人机构编码
|
|
url += 'unionId=' + this.$store.getters.unionId;
|
url += '&mobile=' + ((this.$store.getters.belong && this.$store.getters.belong.mobile) ? this.$store
|
.getters.belong.mobile : this.$store.getters.userInfo.mobile);
|
console.log(url);
|
uni.navigateToMiniProgram({
|
appId: appId ? appId : THIRD_APPID,
|
path: url,
|
envVersion: miniProgramInfo.envVersion == 'release' ? 'release' : 'trial',
|
})
|
},
|
goToLink(item, type) {
|
let that = this;
|
|
function go() {
|
if (that.orderBanner.orderBannerAppId) {
|
that.goToThird(that.orderBanner.orderBannerUrl, that.orderBanner.orderBannerAppId);
|
} else if (that.isTabLink(that.orderBanner.orderBannerUrl)) {
|
let arr = that.orderBanner.orderBannerUrl.split('?');
|
if (arr.length > 1) {
|
that.$store.commit('updateSwitchParams', {
|
switchParams: arr[1]
|
});
|
}
|
uni.switchTab({
|
url: arr[0]
|
});
|
} else {
|
uni.navigateTo({
|
url: that.orderBanner.orderBannerUrl.replace("{{token}}", that.$store.getters.token)
|
.replace("{{unionId}}", that.$store.getters.unionId)
|
})
|
}
|
}
|
if (that.orderBanner.orderBannerUrl.indexOf('needLogin=true') > 0 && !that.$store.getters.isLogin) {
|
toLogin(that);
|
that.loginBackFn = function() {
|
go();
|
}
|
} else {
|
go();
|
}
|
},
|
isTabLink(link) {
|
let isTab = false;
|
this.tabLinkArr.forEach((item) => {
|
if (link.indexOf(item) >= 0) {
|
isTab = true;
|
}
|
})
|
return isTab;
|
},
|
belongInfoReadyFn(data) {
|
let that = this;
|
if (!data.isRegister) {
|
that.checkLoginFn()
|
} else {
|
that.getOrderPayInfo();
|
}
|
},
|
checkLoginFn() {
|
let that = this;
|
|
if (that.$store.getters.isLogin) {
|
that.getOrderPayInfo();
|
} else {
|
toLogin(that)
|
}
|
},
|
/**
|
*
|
* 支付完成查询支付状态
|
*
|
*/
|
getOrderPayInfo: function() {
|
let that = this;
|
uni.showLoading({
|
title: '正在加载中'
|
});
|
getIndexConfig().then(res => {
|
if (res.data) {
|
// res.data.orderBannerAppId='wx64d2ecbbeb3eae79';
|
// res.data.orderBannerUrl='/pages/index/index';
|
//that.orderBanner.orderBannerDate[0]='2026-01-16 00:00:00';
|
|
that.$set(that, "orderBanner", {
|
orderBannerDate: res.data.orderBannerDate,
|
orderBannerImg: res.data.orderBannerImg,
|
orderBannerUrl: res.data.orderBannerUrl,
|
orderBannerAppId: res.data.orderBannerAppId
|
});
|
var curTime = (new Date()).getTime();
|
var startTime = (new Date(that.orderBanner.orderBannerDate[0].replace(/-/g, '/')
|
.replace('T', ' ').split('.')[0])).getTime();
|
var endTime = (new Date(that.orderBanner.orderBannerDate[1].replace(/-/g, '/').replace(
|
'T', ' ').split('.')[0])).getTime();
|
if (curTime >= startTime && curTime <= endTime) {
|
that.showBanner = true;
|
}
|
}
|
});
|
getOrderDetail(that.orderId).then(res => {
|
uni.hideLoading();
|
that.$set(that, 'order_pay_info', res.data);
|
uni.setNavigationBarTitle({
|
title: res.data.paid ? '支付成功' : '支付失败'
|
});
|
that.isDelete = false;
|
if (res.data.paid)
|
that.getCounponStatus(res.data)
|
|
}).catch(err => {
|
that.isDelete = true;
|
uni.hideLoading();
|
});
|
},
|
getCounponStatus(orderDetail) {
|
let that = this
|
let hasShow = false
|
orderDetail.orderInfoList.forEach(item => {
|
if (!item.storeZoneId) return
|
getCounponPackStatus(item.storeZoneId).then(res => {
|
const {
|
issued,
|
friendCouponStatus,
|
friendCoupon,
|
selfCoupon,
|
shareUnavailable
|
} = res.data || {}
|
console.log('订单下单成功后专区1+1券分享数据：', res.data)
|
if (selfCoupon && shareUnavailable == false && !hasShow) {
|
hasShow = true
|
that.couponZoneId = item.storeZoneId
|
that.shareProductId = item.productId
|
that.shareProductName = item.productName || item.storeName || ''
|
that.friendStatus = friendCouponStatus
|
that.activityId = selfCoupon?.activityId || ''
|
that.couponPackStatus = res.data
|
getZoneDetail(that.couponZoneId, {}).then(zoneRes => {
|
that.zoneType = zoneRes.data.zoneType
|
that.zoneShareSwitch = zoneRes.data.shareSwitch
|
that.shareProductImage = zoneRes.data.shareImage
|
})
|
that.$refs.personalAndShareCouponRef.show({
|
couponPackStatus: res.data,
|
orderPage: true,
|
id: item.storeZoneId + '' + item.productId
|
})
|
}
|
})
|
})
|
},
|
canShareFriendCoupon() {
|
return this.friendStatus && !['RECEIVED', 'USED', 'EXPIRED'].includes(this.friendStatus);
|
},
|
handleShareCoupon() {
|
let that = this;
|
if (!that.canShareFriendCoupon()) {
|
return;
|
}
|
if (!that.isLogin) {
|
toLogin(that);
|
return;
|
}
|
// #ifdef MP
|
that.isCouponShare = true;
|
// #endif
|
// #ifndef MP
|
uni.showToast({
|
title: '请在微信小程序中分享给好友',
|
icon: 'none'
|
});
|
// #endif
|
},
|
buildCouponShareConfig(options) {
|
let that = this;
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
return couponPackSharelink({
|
activityId: that.activityId
|
}).then(res => {
|
const data = res.data || {};
|
let shareUrl = data.path || '/pages/zone/index?id=' + that.couponZoneId + (that
|
.uid ? ('&spread=' +
|
that.uid) : '');
|
shareUrl += '&shareToken=' + (data.shareToken || '');
|
let belong = that.$store.getters.belong;
|
if (belong && that.$util.setShareBelong(belong)) {
|
shareUrl += (shareUrl.indexOf('?') >= 0 ? '&' : '?') + that.$util.setShareBelong(belong);
|
}
|
that.addTrack('yy_contentPageShare', {
|
'sharePosition_var': '好友券分享按钮',
|
'shareType_var': '微信好友',
|
'pageTitle_var': '订单支付状态',
|
'pageType_var': '订单',
|
'pagePath_var': currPage.$page.fullPath,
|
'productID_var': '-',
|
'productName_var': '-',
|
'contentId_var': that.couponPackStatus?.friendCoupon?.id,
|
'contentName_var': that.couponPackStatus?.friendCoupon?.name,
|
'contentType_var': '优惠券',
|
'contentLabel_var': '-',
|
});
|
return {
|
title: '好友专享优惠券',
|
path: shareUrl,
|
imageUrl: data.shareCoverImage || that.shareProductImage,
|
};
|
}).catch(err => {
|
uni.showToast({
|
title: err.message || '分享失败，请稍后重试',
|
icon: 'none'
|
});
|
return {};
|
});
|
},
|
/**
|
* 去首页关闭当前所有页面
|
*/
|
goIndex: function(e) {
|
let that = this;
|
if (false) {
|
//if(that.isLastOne){
|
that.$refs.showConfirm.show({
|
title: '温馨提示',
|
content: '本月您还剩最后一张权益券，好好规划使用哦～下月惊喜权益已在筹备，记得留意呀～',
|
center: true,
|
confirmText: '好的',
|
cancelText: '我再逛逛',
|
success: function(res) {
|
console.log(2222, res);
|
if (res.confirm) {
|
uni.$emit('returnEvent', {
|
name: 'order'
|
});
|
setTimeout(() => {
|
uni.switchTab({
|
url: '/pages/index/index'
|
});
|
}, 100)
|
} else {
|
uni.switchTab({
|
url: '/pages/goods_cate/goods_cate'
|
});
|
}
|
}
|
});
|
} else {
|
uni.$emit('returnEvent', {
|
name: 'order'
|
});
|
uni.switchTab({
|
url: '/pages/index/index'
|
});
|
}
|
},
|
// 去参团页面；
|
goPink: function(id) {
|
uni.navigateTo({
|
url: '/pages/activity/goods_combination_status/index?id=' + id
|
});
|
},
|
/**
|
*
|
* 去订单详情页面
|
*/
|
goOrderDetails: function(e) {
|
let that = this;
|
if (that.isDelete) {
|
return that.$util.Tips({
|
title: '订单不存在'
|
}, {
|
tab: 1,
|
url: '/pages/index/index'
|
})
|
}
|
if (false) {
|
//if(that.isLastOne){
|
that.$refs.showConfirm.show({
|
title: '温馨提示',
|
content: '本月您还剩最后一张权益券，好好规划使用哦～下月惊喜权益已在筹备，记得留意呀～',
|
center: true,
|
confirmText: '好的',
|
cancelText: '我再逛逛',
|
success: function(res) {
|
console.log(111111, res);
|
if (res.confirm) {
|
uni.showLoading({
|
title: '正在加载',
|
})
|
openOrderSubscribe().then(res => {
|
uni.hideLoading();
|
uni.navigateTo({
|
url: '/pages/order_details/index?isFromPay=true&order_id=' +
|
that.orderId
|
});
|
}).catch(() => {
|
uni.hideLoading();
|
});
|
} else {
|
uni.switchTab({
|
url: '/pages/goods_cate/goods_cate'
|
});
|
}
|
}
|
});
|
} else {
|
uni.showLoading({
|
title: '正在加载',
|
})
|
openOrderSubscribe().then(res => {
|
uni.hideLoading();
|
uni.navigateTo({
|
url: '/pages/order_details/index?isFromPay=true&order_id=' + that.orderId
|
});
|
}).catch(() => {
|
uni.hideLoading();
|
});
|
}
|
|
}
|
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.header {
|
width: 100%;
|
height: 100rpx;
|
background-color: #FFE20E;
|
position: absolute;
|
left: 0;
|
top: 0;
|
}
|
|
.banner {
|
width: 710rpx;
|
height: 300rpx;
|
margin: 0 auto;
|
}
|
|
.bannerImg {
|
width: 100%;
|
height: 100%;
|
}
|
|
.payment-status .icons {
|
font-size: 40rpx;
|
line-height: 70rpx;
|
width: 70rpx;
|
height: 70rpx;
|
border-radius: 50%;
|
color: #fff;
|
text-align: center;
|
text-shadow: 0px 4px 0px #df1e14;
|
margin: 0 auto;
|
background-color: #999;
|
}
|
|
.icon-duihao2 {
|
background-color: #04C763 !important;
|
text-shadow: none !important;
|
}
|
|
.icon-iconfontguanbi {
|
background-color: #999 !important;
|
text-shadow: none !important;
|
}
|
|
.payment-status .iconfont.fail {
|
text-shadow: 0px 4px 0px #7a7a7a;
|
}
|
|
.payment-status .status {
|
width: 712rpx;
|
padding: 60rpx 0 60rpx 0;
|
margin: 30rpx auto 0 auto;
|
background: #FFFFFF;
|
border-radius: 15rpx 15rpx 15rpx 15rpx;
|
position: relative;
|
}
|
|
.payment-status .status .text {
|
font-size: 30rpx;
|
line-height: 46rpx;
|
text-align: center;
|
margin: 25rpx 0 0 0;
|
background-color: #ffffff;
|
border-radius: 15rpx;
|
}
|
|
.payment-status .wrapper {
|
|
width: 712rpx;
|
box-sizing: border-box;
|
padding: 35rpx;
|
margin: 30rpx auto 30rpx auto;
|
background: #FFFFFF;
|
border-radius: 15rpx 15rpx 15rpx 15rpx;
|
}
|
|
.payment-status .wrapper .item {
|
font-size: 28rpx;
|
color: #282828;
|
}
|
|
.payment-status .wrapper .item~.item {
|
margin-top: 20rpx;
|
}
|
|
.payment-status .wrapper .item .itemLabel {
|
color: #979797;
|
}
|
|
.payment-status .wrapper .item .itemCom {
|
color: #000000;
|
}
|
|
.payment-status .returnBnt {
|
width: 382rpx;
|
height: 76rpx;
|
position: fixed;
|
left: 50%;
|
margin-left: -191rpx;
|
bottom: 230rpx;
|
background: #016DCC;
|
border-radius: 11rpx;
|
|
color: #fff;
|
font-size: 27rpx;
|
text-align: center;
|
line-height: 76rpx;
|
|
&.returnBnt2 {
|
color: #000000;
|
background: #FFE20E;
|
bottom: 130rpx;
|
}
|
}
|
</style>
|
