Commit b61853e7 authored by 潘永坪's avatar 潘永坪

分销客户端支付页面开发

parent 57cd498c
<template> <template>
<view> <view class="wrap">
<!-- 分销客户端扫码支付页面 --> <!-- 分销客户端扫码支付页面 -->
<view class="list"> <view class="list" v-for="(item,index) in orderList" :key="index">
<view> <view class="content">
<text>长江索道</text> <text>{{item.merchantName}}</text>
<text>单程票</text> <text>{{item.productName}}</text>
</view> </view>
<view> <view class="content">
<text>日期</text> <text>日期</text>
<text>2023-06-14</text> <text>{{item.endPlayDate}}</text>
</view> </view>
<view> <view class="content">
<text>数量</text> <text>数量</text>
<text>3</text> <text>{{item.orderNum}}</text>
</view> </view>
</view> </view>
<view class="bottom"> <view class="bottom">
<text> <text class="bottom-left" @click="makePhone()">
客服
<image src="@/static/img/orderPayment/customer.png" style="width: 96rpx;height: 96rpx;"></image>
</text> </text>
<text> <view class="bottom-right">
¥245 <text class="money">
<text style="font-size: 32rpx;">¥</text>{{pdOrderMoney}}
</text> </text>
<text class="btn"> <text class="btn">
去支付 去支付
</text> </text>
</view> </view>
</view>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
onLoad(option){
//#ifdef MP-WEIXIN
this.enterUrl = option.q
this.payType = 42
//#endif
//#ifdef MP-ALIPAY
this.enterUrl = uni.getStorageSync('alipayQrCode')
this.payType = 33
//#endif
if (this.enterUrl) {
this.orderId = this.getUrlKey('orderId')
} else {
this.orderId = option.orderId||''
}
this.openid = uni.getStorageSync('openid') || ''
if (this.openid) {
this.initDetail()
} else {
this.login() //极个别手机从公众号跳转回来没有openid,再次获取openid
}
},
data() { data() {
return { return {
enterUrl: '', //进入页面路由
orderList: [], //订单列表
pdOrderMoney: '', //实际总价
errorMessage: '', //错误信息
bodyShow: false, //控制初始化数据成功显示
payType: '', //支付类型
timeStamp: '', //支付参数
nonceStr: '',
package: '',
signType: '',
paySign: '',
orderInfo: '', //支付宝订单号
background: '', //去支付的背景颜色
orderId: '', //订单Id
openid: '', //用户Id
afterBuyUrl: '', //支付成功后地址跳转
} }
}, },
methods: { methods: {
//---拨打电话
makePhone(){
uni.makePhoneCall({
phoneNumber: '4000720368'
})
},
login() {
//---登录
let _this = this
uni.getProvider({
service: 'oauth',
success(proRes) {
uni.login({
provider: proRes.provider[0],
success: function(res) {
if (res.code) {
let source = ''
if (proRes.provider[0] == 'weixin') {
source = 3
} else if (proRes.provider[0] == 'alipay') {
source = 4
}
let data = {
code: res.code,
source, //微信小程序3,支付宝小程序4
appid:uni.getStorageSync('appid')||''
}
if(uni.getStorageSync('enterOptions').query){
data.companyId=uni.getStorageSync('enterOptions').query.companyId||''
}
_this.$request('wechat/wx/getUserInfoByCode', data)
.then(res => {
if (res.code == '00') {
_this.openid = res.data.openid
uni.setStorageSync('openid', _this.openid)
_this.initDetail()
} else {
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
.catch(err => {
uni.showToast({
title: '登录失败',
icon: 'none'
})
})
}
}
})
}
})
},
initDetail() {
//---初始化产品信息,以及获取支付需要的参数
let data = {
orderId: this.orderId, //订单Id
userId: this.openid, //用户Id
payType: this.payType //支付类型
}
this.$request('orderc/order/findOrderInfo', data).then(res => {
if (res.code == '00') {
if(res.data.orderType=='10'){
//组合票和联票跳订单列表
this.afterBuyUrl='/pages/my/order/orderList/orderList'
}else{
//单票跳详情
this.afterBuyUrl='/pages/my/order/electronicTicket/electronicTicket'
}
this.bodyShow = true
//支付参数开始
this.timeStamp = res.data.timestamp
this.nonceStr = res.data.noncestr
this.package = res.data.package
this.signType = res.data.signType
this.paySign = res.data.sign
//支付宝入参
this.orderInfo = res.data.payInfo || ''
//支付参数结束
this.pdOrderMoney = res.data.pdOrderMoney
if (this.pdOrderMoney == 0 && res.data.subOrderType == -1) {
this.afterBuyUrl='/pages/my/order/electronicTicket/electronicTicket'
uni.navigateTo({
url: '/pages/payment/paySuccess/paySuccess?orderId=' + _this.orderId+'&afterBuyUrl=' + _this.afterBuyUrl
})
}
this.errorMessage = res.data.errorMessage
this.totalMoney = res.data.totalMoney
this.orderList = res.data.orderList||[]
if(this.orderList.length==0){
//单票
this.orderList.push({
merchantName:res.data.merchantName,
productName:res.data.productName,
unitPrice:res.data.unitPrice,
orderNum:res.data.orderNum,
depositReceived:res.data.depositReceived,
pdDiscountMoney:res.data.pdDiscountMoney,
endPlayDate:res.data.endPlayDate
})
}
} else {
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
goPay() {
//-------------------------------------------------------去支付
let _this = this
if (this.errorMessage) {
uni.showToast({
title: this.errorMessage,
icon: 'none'
})
return
}
this.background = '#E6E6E6'
setTimeout(() => {
this.background = 'f9690e'
}, 1000)
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay',
timeStamp: this.timeStamp,
nonceStr: this.nonceStr,
package: this.package,
signType: this.signType,
paySign: this.paySign,
success: function(res) {
uni.navigateTo({
url: '/pages/payment/paySuccess/paySuccess?orderId=' + _this.orderId+'&afterBuyUrl=' + _this.afterBuyUrl
})
},
fail: function(err) {
uni.showToast({
title: err.errMsg,
icon: 'none'
})
}
})
//#endif
// #ifdef MP-ALIPAY
uni.requestPayment({
provider: 'alipay', // 服务提供商 支付宝支付: alipay 微信支付: wxpay
orderInfo: this.orderInfo, // 支付宝订单号
success: function(res) {
uni.navigateTo({
url: '/pages/payment/paySuccess/paySuccess?orderId=' + _this.orderId+'&afterBuyUrl=' + _this.afterBuyUrl
})
},
fail: function(err) {
uni.showToast({
title: err.errMsg,
icon: 'none'
})
}
})
// #endif
},
getUrlKey(name) {
//---------------------------------------------------------------获取url
return (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(decodeURIComponent(this.enterUrl)) || [, ''])[1].replace(/\+/g, '%20') || ''
}
} }
} }
</script> </script>
<style scoped> <style scoped>
.wrap{
padding: 0 24rpx 160rpx 24rpx;
}
.list{
background: #fff;
padding: 24rpx;
border-radius: 5rpx;
margin-top: 30rpx;
}
.list>view:not(:first-child){
margin-top: 30rpx;
}
.content{
display: flex;
align-items: center;
}
.content text:first-child{
width: 50%;
font-size: 28rpx;
font-weight: bold;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.bottom{
position: fixed;
bottom: 0;
background: #fff;
display: flex;
align-items: center;
height: 120rpx;
width: 100%;
padding: 0 24rpx;
justify-content:space-between;
left: 0;
}
.bottom-left{
width: 30%;
}
.bottom-right{
flex: 1;
text-align: right;
}
.money{
color: #FE7C00;
font-weight: bold;
font-size: 40rpx;
}
.btn{
width: 320rpx;
height: 80rpx;
line-height: 68rpx;
font-size: 32rpx;
border-radius:24rpx;
font-weight: bold;
margin-left: 40rpx;
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment