You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
457 lines
11 KiB
457 lines
11 KiB
<template>
|
|
<view class="payMoney pageBg">
|
|
<view class="topCon">
|
|
<view class="price">
|
|
<text>￥</text> {{ $u.utils.priceTo(info.price) }}
|
|
</view>
|
|
<view class="schoolName">
|
|
{{ info.schoolName}}
|
|
</view>
|
|
</view>
|
|
<view class="cardInfoPadding">
|
|
<view class="cardInfo">
|
|
<view class="flex-box-s">
|
|
<text>学车类型</text>
|
|
<text>{{ info.trainingModel}}</text>
|
|
</view>
|
|
<view class="flex-box-s">
|
|
<text>学车班型</text>
|
|
<text>{{info.className}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view class="payWay">
|
|
<view class="zfb" @click="changePayWay(2)">
|
|
<view class="leftCon">
|
|
<view class="icon">
|
|
<image src="@/static/images/jiaofei_zfbIphone@2x.png" mode=""></image>
|
|
</view>
|
|
<view class="text">
|
|
支付宝支付
|
|
</view>
|
|
<view class="recommendIcon">
|
|
<image src="@/static/images/third_img_tuijianIphone@2x.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
<view class="rightStatusIcon">
|
|
<image src="@/static/images/jiaofei_zhifu_selectIphone@2x.png" mode="" v-if="payWay==2">
|
|
</image>
|
|
<image src="@/static/images/jiaofei_zhifu_unselectIphone@2x.png" mode="" v-else></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="otherWay" @click="showOtherWay=true" v-if="!showOtherWay">
|
|
<view class="txt">其它付款方式</view>
|
|
<view class="icon">
|
|
<image src="@/static/images/third_icon_gengduoIphone@2x.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
<view class="zfb" @click="changePayWay(1)" v-else>
|
|
<view class="leftCon">
|
|
<view class="icon">
|
|
<image src="@/static/images/jiaofei_wxIphone@2x.png" mode=""></image>
|
|
</view>
|
|
<view class="text">
|
|
微信支付
|
|
</view>
|
|
</view>
|
|
<view class="rightStatusIcon">
|
|
<image src="@/static/images/jiaofei_zhifu_selectIphone@2x.png" mode="" v-if="payWay==1">
|
|
</image>
|
|
<image src="@/static/images/jiaofei_zhifu_unselectIphone@2x.png" mode="" v-else></image>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="payBtnBox">
|
|
<view class="payBtn bgLinear" @click="goPay">确认支付</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import indexApi from '@/api/index.js'
|
|
let polling = null
|
|
let timerNum = 0
|
|
export default {
|
|
data() {
|
|
return {
|
|
info: {
|
|
schoolName: '翔力驾校',
|
|
balance: 120,
|
|
},
|
|
payInfo: {},
|
|
payWay: 2,
|
|
isPoll: false,
|
|
trainingApplyId: 'dddc910e7eac47ba8b6452f0629ff5f2',
|
|
showOtherWay: false
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
// trainingOrderId=832df06eff634376816c00e812a413c7&trainingApplyId=dddc910e7eac47ba8b6452f0629ff5f2
|
|
this.getTrainingApplyDetailsFn()
|
|
|
|
},
|
|
|
|
onShow() {
|
|
// 判断是否要轮询
|
|
if(this.isPoll) this.isPoll()
|
|
},
|
|
|
|
methods: {
|
|
// 轮询
|
|
async getPrepaidResultFn() {
|
|
const [err, res] = await learnDriveApi.getChangeModelPrepaidResult({outTradeNo: this.payInfo.outTradeNo})
|
|
if(res.code==0) {
|
|
uni.switchTab({
|
|
url: '/pages/tabbar/userCenter/userCenter'
|
|
})
|
|
}
|
|
console.log(res)
|
|
},
|
|
|
|
|
|
// 切换支付方式
|
|
changePayWay(num) {
|
|
this.payWay = num
|
|
},
|
|
// car://paymoney/carstep:8888
|
|
// zlxcpay://
|
|
// 创建培训费支付
|
|
async createPrepaidFn() {
|
|
const latLng = await this.$u.utils.getLocation()
|
|
let obj = {
|
|
clientIp: '127.0.0.1',
|
|
deviceId: 'IMEI',
|
|
deviceType: '1',
|
|
ipType: '04',
|
|
riskType: '01',
|
|
verifyRt: '01',
|
|
verifyTp: '01',
|
|
latitude: latLng.lat,
|
|
longitude: latLng.lng,
|
|
payType: this.payWay,
|
|
fromAppurl: 'paymoney://car:8898/carstep',
|
|
trainingOrderId: this.info.trainingOrderId,
|
|
}
|
|
console.log(obj)
|
|
setTimeout(()=>{
|
|
uni.navigateTo({
|
|
url: '/pages/application/success'
|
|
})
|
|
},2000)
|
|
const [err, res] = await indexApi.createPrepaid(obj)
|
|
|
|
if(res.code==0) {
|
|
this.payInfo = res.data
|
|
if (this.payWay == 1) {
|
|
this.wxPay()
|
|
} else {
|
|
this.zfbPay()
|
|
}
|
|
}else {
|
|
this.$u.toast(res.message)
|
|
return false
|
|
}
|
|
uni.hideLoading()
|
|
console.log('this.payInfo支付信息')
|
|
console.log(res)
|
|
},
|
|
// 点击去支付培训费
|
|
async goPay() {
|
|
uni.showLoading({
|
|
title: '创建订单...'
|
|
})
|
|
await this.createPrepaidFn()
|
|
|
|
|
|
|
|
},
|
|
// 轮询定时
|
|
pollFn() {
|
|
polling = setInterval(async ()=>{
|
|
timerNum ++
|
|
if(timerNum>30) {
|
|
clearInterval(polling)
|
|
polling = null
|
|
}
|
|
await this.getPrepaidResultFn()
|
|
},1000)
|
|
|
|
},
|
|
zfbPay() {
|
|
uni.hideLoading()
|
|
let url = encodeURIComponent(this.payInfo.appURL)
|
|
this.isPoll = true
|
|
let urls = `alipays://platformapi/startapp?appId=10000007&qrcode=${url}`
|
|
console.log('支付宝路径')
|
|
console.log(this.payInfo.appURL)
|
|
console.log(urls)
|
|
|
|
// #ifdef APP-PLUS
|
|
plus.runtime.openURL(urls)
|
|
// #endif
|
|
|
|
// #ifdef H5
|
|
window.location.href = 'paymoney://car:8898/carstep'
|
|
window.open(urls)
|
|
// #endif
|
|
|
|
|
|
},
|
|
wxPay() {
|
|
this.isPoll = true
|
|
// #ifdef APP-PLUS
|
|
this.sweixin ? this.sweixin.launchMiniProgram({
|
|
// path: '/pages/payment/payment?paymoney='+this.info.price+'&ordersn='+this.payInfo.outTradeNo+'&tokenCode='+ this.payInfo.tokenCode, //跳转小程序页面路径 pages/index/index
|
|
path: '/pages/payment/payment?tokenCode=' + this.payInfo.tokenCode, //跳转小程序页面路径 pages/index/index
|
|
type: 0, //可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
|
|
id: 'gh_012fd4bda1c2' //小程序的原始id
|
|
}) : plus.nativeUI.alert('当前环境不支持微信操作!');
|
|
// #endif
|
|
|
|
//调⽤APP交互
|
|
var par = {username:"gh_012fd4bda1c2",path:'/pages/payment/payment?tokenCode=' + this.payInfo.tokenCode,miniProgramType:"0"}
|
|
this.$u.utils.appPostMessage("jumpWXMiniProgram",par);
|
|
|
|
uni.hideLoading()
|
|
},
|
|
// 查询报名详情-
|
|
async getTrainingApplyDetailsFn() {
|
|
if(!this.trainingApplyId) return
|
|
const [err, res] = await indexApi.getTrainingApplyDetails({ trainingApplyId: this.trainingApplyId })
|
|
console.log('查询报名详情')
|
|
console.log(res)
|
|
this.schoolPayInfo = res.data
|
|
this.trainingOrderId = res.data.trainingOrderId
|
|
|
|
if(!this.trainingOrderId) {
|
|
// // 创建订单
|
|
let obj = {
|
|
trainingApplyId: res.data.trainingApplyId,
|
|
trainingClassId: res.data.trainingClassId,
|
|
trainingSchoolId: res.data.trainingSchoolId,
|
|
}
|
|
const [err2, res2] = await indexApi.createOrder(obj)
|
|
console.log('****创建的订单***')
|
|
console.log(res2)
|
|
this.trainingOrderId = res2.data
|
|
setTimeout(()=>{
|
|
this.getOrderDetailsFn()
|
|
},1000)
|
|
}
|
|
|
|
await this.getOrderDetailsFn()
|
|
|
|
},
|
|
// 获取订单信息
|
|
async getOrderDetailsFn(poll) {
|
|
if(!this.trainingOrderId) return
|
|
const [err, res] = await indexApi.getOrderDetails({
|
|
trainingOrderId: this.trainingOrderId
|
|
})
|
|
console.log('******')
|
|
console.log(res.data)
|
|
this.info = res.data
|
|
if(!poll) return
|
|
if(this.info.orderStatus !=0&&this.currenPoll==1) {
|
|
console.log('停止订单轮询')
|
|
clearInterval(polling)
|
|
polling = null
|
|
timerNum = 1
|
|
if(!info.examinationPrice) {
|
|
uni.navigateTo({
|
|
url: 'pages/learnDriveStep/payMoney/payMoneySuccess'
|
|
})
|
|
}else {
|
|
}
|
|
}
|
|
if(this.info.examinationStatus !=0&&this.currenPoll==2) {
|
|
console.log('停止考务轮询')
|
|
console.log(polling)
|
|
clearInterval(polling)
|
|
polling = null
|
|
uni.navigateTo({
|
|
url: 'pages/learnDriveStep/payMoney/payMoneySuccess'
|
|
})
|
|
}
|
|
console.log('订单详情')
|
|
console.log(res)
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.payMoney {
|
|
min-height: 100vh;
|
|
.topCon {
|
|
text-align: center;
|
|
padding: 116rpx 0 72rpx 0;
|
|
.price {
|
|
font-size: 56rpx;
|
|
color: #E63633;
|
|
|
|
text {
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
|
|
.schoolName {
|
|
font-size: 28rpx;
|
|
color: #666;
|
|
}
|
|
}
|
|
.cardInfoPadding {
|
|
padding: 20rpx 32rpx;
|
|
}
|
|
.cardInfo {
|
|
background-color: #fff;
|
|
border-radius: 16rpx;
|
|
padding: 0 16px;
|
|
.flex-box-s {
|
|
height: 120rpx;
|
|
line-height: 120rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
&:last-child {
|
|
border-top: 1px solid #f7f7f7;
|
|
}
|
|
text {
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
}
|
|
}
|
|
}
|
|
.payWay {
|
|
padding: 0 32rpx;
|
|
|
|
.otherWay {
|
|
display: flex;
|
|
background-color: #fff;
|
|
border-radius: 16rpx;
|
|
padding: 0 16px;
|
|
height: 120rpx;
|
|
justify-content: center;
|
|
align-items: center;
|
|
.txt {
|
|
font-size: 28rpx;
|
|
color: #999;
|
|
}
|
|
.icon {
|
|
width: 20rpx;
|
|
height: 12rpx;
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: block;
|
|
}
|
|
margin-left: 16rpx;
|
|
}
|
|
}
|
|
.zfb {
|
|
background-color: #fff;
|
|
border-radius: 16rpx;
|
|
padding: 0 16px;
|
|
height: 120rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 20rpx;
|
|
|
|
.leftCon {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.icon {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
|
|
image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.text {
|
|
font-size: 32rpx;
|
|
color: #333;
|
|
margin: 0 10rpx 0 20rpx;
|
|
}
|
|
|
|
.recommendIcon {
|
|
width: 64rpx;
|
|
height: 34rpx;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: block;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rightStatusIcon {
|
|
width: 42rpx;
|
|
height: 42rpx;
|
|
|
|
image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.payBtnBox {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
padding: 32rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100vw;
|
|
height: 128rpx;
|
|
background: #FFFFFF;
|
|
box-shadow: 0px -1px 0px 0px #E8E9EC;
|
|
|
|
.payBtn {
|
|
width: 100%;
|
|
height: 96rpx;
|
|
background: linear-gradient(180deg, #3593FB 0%, #53D3E5 100%);
|
|
border-radius: 50rpx;
|
|
line-height: 96rpx;
|
|
text-align: center;
|
|
font-size: 36rpx;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
|
|
.footBox {
|
|
display: flex;
|
|
padding: 0 32rpx;
|
|
justify-content: space-between;
|
|
.btn {
|
|
width: 48%;
|
|
height: 98rpx;
|
|
background: #2168FC;
|
|
border-radius: 16rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
line-height: 98rpx;
|
|
&.border {
|
|
background: none;
|
|
border: 1px solid #2168FC;
|
|
color: #2168FC;
|
|
|
|
}
|
|
}
|
|
}
</style>
|