wangmingchuan
/
yanzong_qianduan
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单和余额第三方支付开发

Browse Source
pifa
wangdong 7 months ago
parent 8258b1c1e3
commit 8d8b462eb9
3 changed files with 165 additions and 42 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 11
      App.vue
  2. 104
      pages/checkout/cashier/index.vue
  3. 92
      pages/wallet/recharge/index.vue

11
App.vue
Unescape View File

@ -24,7 +24,16 @@
// 获取商城基础信息
this.getStoreInfo()
},
onShow(options) {
console.log('app onShow', options);
if (options.referrerInfo) {
// wx.showToast({
// title: params.errStr,
// icon: 'none',
// });
uni.$emit('appShow', options.referrerInfo);
}
},
methods: {
// app启动参数

104
pages/checkout/cashier/index.vue
Unescape View File

@ -18,9 +18,12 @@
<view class="payment-method">
<view v-for="(item, index) in methods" :key="index" class="pay-item dis-flex flex-x-between" @click="handleSelectPayType(index)">
<view class="item-left dis-flex flex-y-center">
<view class="item-left_icon" :class="[item.method]">
<text class="iconfont" :class="[PayMethodIconEnum[item.method]]"></text>
</view>
<view v-if="item.method!=='huifu'" class="item-left_icon" :class="[item.method]">
<text class="iconfont" :class="[PayMethodIconEnum[item.method]]"></text>
</view>
<view v-else class="huifu-box">
<image :src="`${$picUrl}/static/yinlian.png`" mode="heightFix" class="huifu"></image>
</view>
<view class="item-left_text">
<text>{{ PayMethodEnum[item.method].name }}</text>
</view>
@ -117,10 +120,19 @@
this.orderId = Number(orderId)
// 获取收银台信息
this.getCashierInfo()
uni.$on('appShow', this.solveShowMsg);
},
onUnload() {
uni.$off('appShow', this.solveShowMsg);
},
methods: {
solveShowMsg(info) {
console.log(info);
if (this.miniPayRequest && Object.keys(this.miniPayRequest).length > 0 && info.appId === this.miniPayRequest.miniuser) {
this.onTradeQuery(this.miniPayRequest.out_trade_no, this.curPaymentItem.method);
}
},
// 获取收银台信息
getCashierInfo() {
const app = this
@ -160,6 +172,9 @@
// 选择支付方式
handleSelectPayType(index) {
this.curPaymentItem = this.methods[index]
if (this.curPaymentItem.method === 'huifu') {
this.createOrder();
}
},
// 判断当前页面来源于浏览器返回
@ -195,23 +210,55 @@
// 确认支付
handleSubmit() {
const app = this
// 判断是否选择了支付方式
if (!app.curPaymentItem) {
app.$toast('您还没有选择支付方式')
return
}
// 按钮禁用
if (app.disabled) return
app.disabled = true
// 提交到后端API
CashierApi.orderPay(app.orderId, {
method: app.curPaymentItem.method,
client: app.platform,
extra: app.getExtraAsUnify(app.curPaymentItem.method)
})
.then(result => app.onSubmitCallback(result))
.finally(err => setTimeout(() => app.disabled = false, 10))
},
// 判断是否选择了支付方式
if (!app.curPaymentItem) {
app.$toast('您还没有选择支付方式')
return
}
// 按钮禁用
if (app.disabled) return
app.disabled = true
if (app.curPaymentItem.method === 'huifu') {
app.disabled = false
if (!app.miniPayRequest || Object.keys(app.miniPayRequest).length === 0) {
app.$toast(`暂无${app.PayMethodEnum[app.curPaymentItem.method].name}支付信息`);
return
}
let appPayRequest = '';
appPayRequest = encodeURIComponent(JSON.stringify({
sign: app.miniPayRequest.sign,
prepayid: app.miniPayRequest.prepayid,
}));
uni.openEmbeddedMiniProgram({
appId: app.miniPayRequest.miniuser,
path: `${app.miniPayRequest.minipath}?appPayRequest=${appPayRequest}`
});
} else {
// 提交到后端API
this.createOrder();
}
},
createOrder() {
const app = this;
CashierApi.orderPay(app.orderId, {
method: app.curPaymentItem.method,
client: app.platform,
extra: app.getExtraAsUnify(app.curPaymentItem.method)
})
.then(result => {
console.log(result);
if (app.curPaymentItem.method === 'huifu') {
const { miniPayRequest, out_trade_no } = result.data.payment;
app.miniPayRequest = miniPayRequest;
app.miniPayRequest.out_trade_no = out_trade_no;
} else {
app.onSubmitCallback(result)
}
})
.finally(err => setTimeout(() => app.disabled = false, 10))
},
// 获取第三方支付的扩展参数
getExtraAsUnify(method) {
@ -355,7 +402,7 @@
.payment-method {
width: 94%;
margin: 0 auto 20rpx auto;
padding: 0 40rpx;
padding: 0 40rpx 0 20rpx;
background-color: #ffffff;
border-radius: 20rpx;
@ -369,8 +416,9 @@
}
.item-left_icon {
margin-right: 20rpx;
font-size: 44rpx;
width: 100rpx;
text-align: center;
font-size: 60rpx;
&.wechat {
color: #00c800;
@ -384,6 +432,14 @@
color: #ff9700;
}
}
.huifu-box {
width: 100rpx;
display: flex;
justify-content: center;
.huifu {
height: 44rpx;
}
}
.item-left_text {
font-size: 28rpx;

92
pages/wallet/recharge/index.vue
Unescape View File

@ -38,9 +38,12 @@
<view v-for="(item, index) in methods" :key="index" class="pay-item dis-flex flex-x-between"
@click="handleSelectPayType(index)">
<view class="item-left dis-flex flex-y-center">
<view class="item-left_icon" :class="[item.method]">
<text class="iconfont" :class="[PayMethodIconEnum[item.method]]"></text>
</view>
<view v-if="item.method!=='huifu'" class="item-left_icon" :class="[item.method]">
<text class="iconfont" :class="[PayMethodIconEnum[item.method]]"></text>
</view>
<view v-else class="huifu-box">
<image :src="`${$picUrl}/static/yinlian.png`" mode="heightFix" class="huifu"></image>
</view>
<view class="item-left_text">
<text>{{ PayMethodEnum[item.method].name }}</text>
</view>
@ -140,10 +143,19 @@
onLoad(options) {
// 获取页面数据
this.getPageData()
uni.$on('appShow', this.solveShowMsg);
},
onUnload() {
uni.$off('appShow', this.solveShowMsg);
},
methods: {
solveShowMsg(info) {
console.log(info);
if (this.miniPayRequest && Object.keys(this.miniPayRequest).length > 0 && info.appId === this.miniPayRequest.miniuser) {
this.onTradeQuery(this.miniPayRequest.out_trade_no, this.curPaymentItem.method);
}
},
// 选择充值套餐
onSelectPlan(planId) {
this.selectedPlanId = planId
@ -159,6 +171,9 @@
// 选择支付方式
handleSelectPayType(index) {
this.curPaymentItem = this.methods[index]
if (this.curPaymentItem.method === 'huifu' && (this.selectedPlanId > 0 || this.inputValue)) {
this.createOrder();
}
},
// 获取页面数据
@ -222,18 +237,52 @@
if (app.disabled) return
app.disabled = true
// 提交到后端
RechargeApi.submit({
planId: app.selectedPlanId,
customMoney: app.inputValue ? app.inputValue : '',
method: app.curPaymentItem.method,
client: app.platform,
extra: app.getExtraAsUnify(app.curPaymentItem.method)
})
.then(result => app.onSubmitCallback(result))
.finally(err => {
setTimeout(() => app.disabled = false, 10)
})
if (app.curPaymentItem.method === 'huifu') {
app.disabled = false
if (!this.selectedPlanId && !this.inputValue) {
app.$toast('请选择充值套餐或输入充值金额');
return;
}
if (!app.miniPayRequest || Object.keys(app.miniPayRequest).length === 0) {
app.$toast(`暂无${app.PayMethodEnum[app.curPaymentItem.method].name}支付信息`);
return
}
let appPayRequest = '';
appPayRequest = encodeURIComponent(JSON.stringify({
sign: app.miniPayRequest.sign,
prepayid: app.miniPayRequest.prepayid,
}));
uni.openEmbeddedMiniProgram({
appId: app.miniPayRequest.miniuser,
path: `${app.miniPayRequest.minipath}?appPayRequest=${appPayRequest}`
});
} else {
// 提交到后端API
this.createOrder();
}
},
createOrder() {
const app = this;
RechargeApi.submit({
planId: app.selectedPlanId,
customMoney: app.inputValue ? app.inputValue : '',
method: app.curPaymentItem.method,
client: app.platform,
extra: app.getExtraAsUnify(app.curPaymentItem.method)
})
.then(result => {
console.log(result);
if (app.curPaymentItem.method === 'huifu') {
const { miniPayRequest, out_trade_no } = result.data.payment;
app.miniPayRequest = miniPayRequest;
app.miniPayRequest.out_trade_no = out_trade_no;
} else {
app.onSubmitCallback(result)
}
})
.finally(err => setTimeout(() => app.disabled = false, 10))
},
// 获取第三方支付的扩展参数
getExtraAsUnify(method) {
@ -466,8 +515,9 @@
font-size: 26rpx;
.item-left_icon {
margin-right: 20rpx;
font-size: 44rpx;
width: 100rpx;
text-align: center;
font-size: 60rpx;
&.wechat {
color: #00c800;
@ -478,6 +528,14 @@
}
}
.huifu-box {
width: 100rpx;
display: flex;
justify-content: center;
.huifu {
height: 44rpx;
}
}
.item-left_text {
font-size: 30rpx;

Write Preview
Loading…
Cancel
Save