汇融云链2
This commit is contained in:
246
mallplusui-uniapp-app2/components/payments/paymentsByAli.vue
Normal file
246
mallplusui-uniapp-app2/components/payments/paymentsByAli.vue
Normal file
@@ -0,0 +1,246 @@
|
||||
<template>
|
||||
<view class="pay-type-list">
|
||||
|
||||
<view class="type-item b-b" v-for="item in payments" :key="item.code" @click="toPayHandler(item.code)"
|
||||
v-if="!(type == 2 && item.code == 'balancepay')">
|
||||
<text v-if=" item.code == 'wechatpay'" class="icon yticon icon-weixinzhifu"></text>
|
||||
<text v-if=" item.code == 'alipay'" class="icon yticon icon-alipay"></text>
|
||||
<text v-if=" item.code == 'offline'" class="icon yticon icon-weixinzhifu"></text>
|
||||
<text v-if=" item.code == 'balancepay'" class="icon yticon icon-erjiye-yucunkuan"></text>
|
||||
|
||||
<view class="con">
|
||||
<text class="tit">{{ item.name }}</text>
|
||||
<text>{{ item.memo }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiBaseUrl } from '@/config/config.js';
|
||||
import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue';
|
||||
import Api from '@/common/api';
|
||||
export default {
|
||||
props: {
|
||||
// 如果是商品订单此参数必须
|
||||
orderId: {
|
||||
type: String,
|
||||
default () {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
// 如果是充值订单此参数必须
|
||||
recharge: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 用户id
|
||||
uid: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 订单类型
|
||||
type: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 1;
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
payments: []
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getPayments();
|
||||
},
|
||||
methods: {
|
||||
// 获取可用支付方式列表
|
||||
async getPayments () {
|
||||
|
||||
let params = {};
|
||||
this.orderInfo = await Api.apiCall('get',Api.order.paymentlist,params);
|
||||
this.payments = this.formatPayments(this.orderInfo)
|
||||
|
||||
},
|
||||
// 支付方式处理
|
||||
formatPayments (payments) {
|
||||
payments = payments.filter(item => item.code !== 'wechatpay');
|
||||
|
||||
|
||||
// 如果是充值订单 过滤余额支付 过滤非线上支付方式
|
||||
if (this.type === 2) {
|
||||
payments = payments.filter(item => item.code !== 'balancepay' || item.is_online === 1)
|
||||
}
|
||||
|
||||
// 设置logo图片
|
||||
payments.forEach(item => {
|
||||
this.$set(item, 'icon', '/static/image/' + item.code + '.png');
|
||||
});
|
||||
|
||||
return payments;
|
||||
},
|
||||
// 用户点击支付方式处理
|
||||
async toPayHandler (code) {
|
||||
let params = {'orderId':this.orderId};
|
||||
let data = {
|
||||
payment_code: code,
|
||||
payment_type: this.type
|
||||
}
|
||||
data['ids'] = (this.type == 1 || this.type == 5 || this.type == 6) ? this.orderId : this.uid
|
||||
|
||||
// 判断订单支付类型
|
||||
if (this.type == 2 && this.recharge) {
|
||||
data['params'] = {
|
||||
money: this.recharge,
|
||||
trade_type: 'JSAPI'
|
||||
}
|
||||
} else if ((this.type == 5 || this.type == 6) && this.recharge) {
|
||||
data['params'] = {
|
||||
trade_type: 'JSAPI',
|
||||
formid: this.orderId
|
||||
}
|
||||
}else {
|
||||
data['params'] = {
|
||||
trade_type: 'JSAPI'
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
let _this = this;
|
||||
switch (code) {
|
||||
case 'alipay':
|
||||
let res = await Api.apiCall('get',Api.order.webPay,params);
|
||||
console.log(res);
|
||||
if (res) {
|
||||
|
||||
uni.requestPayment({
|
||||
provider: 'alipay',
|
||||
tradeNO:res.data.trade_no,
|
||||
success: function (e) {
|
||||
if (e.errMsg === 'requestPayment:ok') {
|
||||
_this.$common.successToShow(res.msg, () => {
|
||||
_this.$common.redirectTo('/pages/order/payment/result?id=' + res.data.id);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$common.errorToShow(res.msg);
|
||||
|
||||
}
|
||||
break
|
||||
case 'balancepay':
|
||||
//用户余额支付
|
||||
let params1 = {'orderId':this.orderId};
|
||||
let data1 = await Api.apiCall('post',Api.order.balancePay,params1);
|
||||
console.log(data1)
|
||||
if (data1) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/payment/result?order=' + JSON.stringify(data1)
|
||||
})
|
||||
}else {
|
||||
this.$api.msg('余额支付失败');
|
||||
}
|
||||
break;
|
||||
case 'offline':
|
||||
//线下支付
|
||||
this.$common.modelShow('线下支付说明', '请联系客服进行线下支付',() => {}, false, '取消', '确定')
|
||||
break;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
.app {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.price-box {
|
||||
background-color: #fff;
|
||||
height: 265upx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 28upx;
|
||||
color: #909399;
|
||||
|
||||
.price{
|
||||
font-size: 50upx;
|
||||
color: #303133;
|
||||
margin-top: 12upx;
|
||||
&:before{
|
||||
content: '￥';
|
||||
font-size: 40upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay-type-list {
|
||||
margin-top: 20upx;
|
||||
background-color: #fff;
|
||||
padding-left: 60upx;
|
||||
|
||||
.type-item{
|
||||
height: 120upx;
|
||||
padding: 20upx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-right: 60upx;
|
||||
font-size: 30upx;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.icon{
|
||||
width: 100upx;
|
||||
font-size: 52upx;
|
||||
}
|
||||
.icon-erjiye-yucunkuan {
|
||||
color: #fe8e2e;
|
||||
}
|
||||
.icon-weixinzhifu {
|
||||
color: #36cb59;
|
||||
}
|
||||
.icon-alipay {
|
||||
color: #01aaef;
|
||||
}
|
||||
.tit{
|
||||
font-size: $font-lg;
|
||||
color: $font-color-dark;
|
||||
margin-bottom: 4upx;
|
||||
}
|
||||
.con{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: $font-sm;
|
||||
color: $font-color-light;
|
||||
}
|
||||
}
|
||||
.mix-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 630upx;
|
||||
height: 80upx;
|
||||
margin: 80upx auto 30upx;
|
||||
font-size: $font-lg;
|
||||
color: #fff;
|
||||
background-color: $base-color;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
|
||||
}
|
||||
|
||||
</style>
|
||||
287
mallplusui-uniapp-app2/components/payments/paymentsByApp.vue
Normal file
287
mallplusui-uniapp-app2/components/payments/paymentsByApp.vue
Normal file
@@ -0,0 +1,287 @@
|
||||
<template>
|
||||
<view class="pay-type-list">
|
||||
<view class="type-item b-b" v-for="item in paymentss" :key="item.code" @click="toPayHandler(item.code)" v-if="!(type == 2 && item.code == 'balancepay')">
|
||||
<text v-if="item.code == 'wechatpay'" class="icon yticon icon-weixinzhifu"></text>
|
||||
<text v-if="item.code == 'alipay'" class="icon yticon icon-alipay"></text>
|
||||
<text v-if="item.code == 'offline'" class="icon yticon icon-weixinzhifu"></text>
|
||||
<text v-if="item.code == 'balancepay'" class="icon yticon icon-erjiye-yucunkuan"></text>
|
||||
|
||||
<view class="con">
|
||||
<text class="tit">{{ item.name }}</text>
|
||||
<text>{{ item.memo }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue';
|
||||
import Api from '@/common/api';
|
||||
export default {
|
||||
props: {
|
||||
// 如果是商品订单此参数必须
|
||||
orderId: {
|
||||
type: String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
// 如果是充值订单此参数必须
|
||||
recharge: {
|
||||
type: Number,
|
||||
default() {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 用户id
|
||||
uid: {
|
||||
type: Number,
|
||||
default() {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 订单类型
|
||||
type: {
|
||||
type: Number,
|
||||
default() {
|
||||
return 1;
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
paymentss: []
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.getPayment();
|
||||
},
|
||||
methods: {
|
||||
// 获取可用支付方式列表
|
||||
async getPayment() {
|
||||
console.log('getPayments');
|
||||
let params = {};
|
||||
this.orderInfo = await Api.apiCall('get', Api.order.paymentlist, params);
|
||||
this.paymentss = this.formatPayments(this.orderInfo);
|
||||
},
|
||||
// 支付方式处理
|
||||
formatPayments(payments) {
|
||||
// 如果是充值订单 过滤余额支付 过滤非线上支付方式
|
||||
if (this.type === 2) {
|
||||
payments = payments.filter(item => item.code !== 'balancepay' || item.is_online === 1);
|
||||
}
|
||||
|
||||
// 设置logo图片
|
||||
payments.forEach(item => {
|
||||
this.$set(item, 'icon', '/static/image/' + item.code + '.png');
|
||||
});
|
||||
return payments;
|
||||
},
|
||||
// 用户点击支付方式处理
|
||||
async toPayHandler(code) {
|
||||
let _this = this;
|
||||
let params = { orderId: this.orderId };
|
||||
let data = {
|
||||
payment_code: code,
|
||||
payment_type: _this.type
|
||||
};
|
||||
|
||||
data['ids'] = this.type == 1 || this.type == 5 || this.type == 6 ? this.orderId : this.uid;
|
||||
if ((this.type == 5 || this.type == 6) && this.recharge) {
|
||||
data['params'] = {
|
||||
trade_type: 'APP',
|
||||
formid: this.orderId
|
||||
};
|
||||
}
|
||||
switch (code) {
|
||||
case 'alipay':
|
||||
/**
|
||||
* 支付宝支付需要模拟GET提交数据
|
||||
*/
|
||||
if (_this.type == 1 && _this.orderId) {
|
||||
data['params'] = {
|
||||
trade_type: 'APP'
|
||||
};
|
||||
} else if (_this.type == 2 && _this.recharge) {
|
||||
data['params'] = {
|
||||
trade_type: 'APP',
|
||||
money: _this.recharge
|
||||
};
|
||||
}
|
||||
|
||||
let res = await Api.apiCall('get', Api.order.aliAppPay, params);
|
||||
if (res) {
|
||||
console.log(res);
|
||||
uni.requestPayment({
|
||||
provider: 'alipay',
|
||||
orderInfo: res,
|
||||
success: function(data) {
|
||||
let rawdataResult = JSON.parse(data.rawdata).result;
|
||||
let r = rawdataResult.split(';')[0];
|
||||
let r1 = rawdataResult.split(';')[0].length - 1;
|
||||
let r2 = rawdataResult.split(';')[0].length - 2;
|
||||
let alipayTradeAppPayResponse = JSON.parse(r.substr(0, r1)).alipay_trade_app_pay_response;
|
||||
let out_trade_no = alipayTradeAppPayResponse.out_trade_no;
|
||||
_this.$common.successToShow('支付成功', () => {
|
||||
//_this.redirectHandler(res.data.payment_id)
|
||||
_this.redirectHandler(out_trade_no);
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
_this.$comon.errorToShow(res.msg);
|
||||
}
|
||||
|
||||
break;
|
||||
case 'wechatpay':
|
||||
// 微信 H5支付
|
||||
if (_this.type == 1 && _this.orderId) {
|
||||
data['params'] = {
|
||||
trade_type: 'APP'
|
||||
};
|
||||
} else if (_this.type == 2 && _this.recharge) {
|
||||
data['params'] = {
|
||||
trade_type: 'APP',
|
||||
money: _this.recharge
|
||||
};
|
||||
}
|
||||
|
||||
// 微信app支付
|
||||
let res1 = await Api.apiCall('get', Api.order.appPay, params);
|
||||
debugger
|
||||
console.log(res1)
|
||||
console.log(data)
|
||||
if (res1) {
|
||||
// 调用微信支付
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
orderInfo: res1,
|
||||
success: function(data) {
|
||||
console.log(res1)
|
||||
console.log(data)
|
||||
_this.$common.successToShow('支付成功', () => {
|
||||
_this.redirectHandler(data);
|
||||
});
|
||||
},
|
||||
fail: function(res) {
|
||||
console.log(JSON.stringify(res));
|
||||
}
|
||||
});
|
||||
} else {
|
||||
_this.$common.errorToShow(res.msg);
|
||||
}
|
||||
|
||||
break;
|
||||
case 'balancepay':
|
||||
/**
|
||||
* 用户余额支付
|
||||
*
|
||||
*/
|
||||
let params1 = { orderId: this.orderId };
|
||||
let data1 = await Api.apiCall('post', Api.order.balancePay, params1);
|
||||
console.log(data1);
|
||||
if (data1) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/payment/result?order=' + JSON.stringify(data1)
|
||||
});
|
||||
} else {
|
||||
this.$api.msg(data1.data);
|
||||
}
|
||||
break;
|
||||
case 'offline':
|
||||
/**
|
||||
* 线下支付
|
||||
*/
|
||||
_this.$common.modelShow('线下支付说明', '请联系客服进行线下支付', () => {}, false, '取消', '确定');
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 支付成功后跳转操作
|
||||
redirectHandler(paymentId) {
|
||||
this.$common.redirectTo('/pages/order/payment/result?id=' + paymentId);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.app {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.price-box {
|
||||
background-color: #fff;
|
||||
height: 265upx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 28upx;
|
||||
color: #909399;
|
||||
|
||||
.price {
|
||||
font-size: 50upx;
|
||||
color: #303133;
|
||||
margin-top: 12upx;
|
||||
&:before {
|
||||
content: '￥';
|
||||
font-size: 40upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay-type-list {
|
||||
margin-top: 20upx;
|
||||
background-color: #fff;
|
||||
padding-left: 60upx;
|
||||
|
||||
.type-item {
|
||||
height: 120upx;
|
||||
padding: 20upx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-right: 60upx;
|
||||
font-size: 30upx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 100upx;
|
||||
font-size: 52upx;
|
||||
}
|
||||
.icon-erjiye-yucunkuan {
|
||||
color: #fe8e2e;
|
||||
}
|
||||
.icon-weixinzhifu {
|
||||
color: #36cb59;
|
||||
}
|
||||
.icon-alipay {
|
||||
color: #01aaef;
|
||||
}
|
||||
.tit {
|
||||
font-size: $font-lg;
|
||||
color: $font-color-dark;
|
||||
margin-bottom: 4upx;
|
||||
}
|
||||
.con {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: $font-sm;
|
||||
color: $font-color-light;
|
||||
}
|
||||
}
|
||||
.mix-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 630upx;
|
||||
height: 80upx;
|
||||
margin: 80upx auto 30upx;
|
||||
font-size: $font-lg;
|
||||
color: #fff;
|
||||
background-color: $base-color;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
|
||||
}
|
||||
</style>
|
||||
412
mallplusui-uniapp-app2/components/payments/paymentsByH5.vue
Normal file
412
mallplusui-uniapp-app2/components/payments/paymentsByH5.vue
Normal file
@@ -0,0 +1,412 @@
|
||||
<template>
|
||||
<view class="pay-type-list">
|
||||
|
||||
<view class="type-item b-b" v-for="item in payments" :key="item.code" @click="toPayHandler(item.code)"
|
||||
v-if="!(type == 2 && item.code == 'balancepay')">
|
||||
<text v-if=" item.code == 'wechatpay'" class="icon yticon icon-weixinzhifu"></text>
|
||||
<text v-if=" item.code == 'alipay'" class="icon yticon icon-alipay"></text>
|
||||
<text v-if=" item.code == 'offline'" class="icon yticon icon-weixinzhifu"></text>
|
||||
<text v-if=" item.code == 'balancepay'" class="icon yticon icon-erjiye-yucunkuan"></text>
|
||||
<view class="con">
|
||||
<text class="tit">{{ item.name }}</text>
|
||||
<text>{{ item.memo }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--<view class='cell-group payment-method'>
|
||||
<view class='cell-item add-title-item' v-for="item in payments" :key="item.code" @click="toPayHandler(item.code)"
|
||||
v-if="!(type == 2 && item.code == 'balancepay')">
|
||||
<view class='cell-item-hd'>
|
||||
<image class='cell-hd-icon' :src='item.icon'></image>
|
||||
</view>
|
||||
<view class='cell-item-bd'>
|
||||
<view class="cell-bd-view">
|
||||
<text class="cell-bd-text">{{ item.name }}</text>
|
||||
</view>
|
||||
<view class="cell-bd-view">
|
||||
<text class="cell-bd-text address">{{ item.memo }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class='cell-item-ft'>
|
||||
<image class='cell-ft-next icon' src='../../../static/image/right.png'></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>-->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
baseUrl
|
||||
} from '@/config/config.js'
|
||||
import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue';
|
||||
import Api from '@/common/api';
|
||||
export default {
|
||||
props: {
|
||||
// 如果是商品订单此参数必须
|
||||
orderId: {
|
||||
type: String,
|
||||
default () {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
// 如果是充值订单此参数必须
|
||||
recharge: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 用户id
|
||||
uid: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 订单类型
|
||||
type: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 1
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
payments: [],
|
||||
openid: ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getPayments()
|
||||
},
|
||||
methods: {
|
||||
// 获取可用支付方式列表
|
||||
async getPayments() {
|
||||
let params = {};
|
||||
this.orderInfo = await Api.apiCall('get',Api.order.paymentlist,params);
|
||||
this.payments = this.formatPayments(this.orderInfo)
|
||||
},
|
||||
// 支付方式处理
|
||||
formatPayments(payments) {
|
||||
// h5支付并且是在微信浏览器内 过滤支付宝支付
|
||||
if (this.$common.isWeiXinBrowser()) {
|
||||
payments = payments.filter(item => item.code !== 'alipay')
|
||||
}
|
||||
|
||||
// 如果是充值订单 过滤余额支付 过滤非线上支付方式
|
||||
if (this.type === 2) {
|
||||
payments = payments.filter(
|
||||
item => item.code !== 'balancepay' || item.is_online === 1
|
||||
)
|
||||
}
|
||||
|
||||
// 设置logo图片
|
||||
payments.forEach(item => {
|
||||
this.$set(item, 'icon', '/static/image/' + item.code + '.png')
|
||||
})
|
||||
console.log(payments)
|
||||
return payments
|
||||
},
|
||||
checkWXJSBridge(data) {
|
||||
let that = this
|
||||
let interval = setInterval(() => {
|
||||
if (typeof window.WeixinJSBridge != 'undefined') {
|
||||
clearTimeout(interval)
|
||||
that.onBridgeReady(data)
|
||||
}
|
||||
}, 200)
|
||||
},
|
||||
onBridgeReady(data) {
|
||||
var _this = this
|
||||
window.WeixinJSBridge.invoke(
|
||||
'getBrandWCPayRequest', {
|
||||
appId: data.appId, // 公众号名称，由商户传入
|
||||
timeStamp: data.timeStamp, // 时间戳，自1970年以来的秒数
|
||||
nonceStr: data.nonceStr, // 随机串
|
||||
package: data.package,
|
||||
signType: data.signType, // 微信签名方式：
|
||||
paySign: data.paySign // 微信签名
|
||||
},
|
||||
function(res) {
|
||||
if (res.err_msg === 'get_brand_wcpay_request:ok') {
|
||||
_this.$common.successToShow('支付成功')
|
||||
} else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
|
||||
_this.$common.errorToShow('取消支付')
|
||||
} else {
|
||||
_this.$common.errorToShow('支付失败')
|
||||
}
|
||||
setTimeout(() => {
|
||||
_this.$common.redirectTo(
|
||||
'/pages/order/payment/result?id=' + data.payment_id
|
||||
)
|
||||
}, 1000)
|
||||
}
|
||||
)
|
||||
},
|
||||
// 用户点击支付方式处理
|
||||
async toPayHandler(code) {
|
||||
let params = {'orderId':this.orderId};
|
||||
let data = {
|
||||
payment_code: code,
|
||||
payment_type: this.type
|
||||
}
|
||||
data['orderId'] = (this.type == 1 || this.type == 5 || this.type == 6) ? this.orderId : this.uid
|
||||
switch (code) {
|
||||
case 'alipay':
|
||||
|
||||
let res = await Api.apiCall('get',Api.order.aliWapPay,params);
|
||||
console.log('============================')
|
||||
console.log(res);
|
||||
console.log('success:' + JSON.stringify(res));
|
||||
if (res) {
|
||||
|
||||
document.body.appendChild(JSON.stringify(res))
|
||||
let testForm = document.getElementsByName('punchout_form')
|
||||
// 模拟GET提交
|
||||
/*
|
||||
const url = res.data.url
|
||||
const data = res.data.data
|
||||
let tempForm = document.createElement('form')
|
||||
tempForm.id = 'aliPay'
|
||||
tempForm.methods = 'post'
|
||||
tempForm.action = url
|
||||
tempForm.target = '_self'
|
||||
let input = []
|
||||
for (let k in data) {
|
||||
input[k] = document.createElement('input')
|
||||
input[k].type = 'hidden'
|
||||
input[k].name = k
|
||||
input[k].value = data[k]
|
||||
tempForm.appendChild(input[k])
|
||||
}
|
||||
tempForm.addEventListener('submit', function() {}, false)
|
||||
document.body.appendChild(tempForm)*/
|
||||
testForm.dispatchEvent(new Event('submit'))
|
||||
console.log(tempForm);
|
||||
testForm.submit()
|
||||
document.body.removeChild(testForm)
|
||||
|
||||
}
|
||||
break
|
||||
case 'wechatpay':
|
||||
|
||||
/**
|
||||
* 微信支付有两种
|
||||
* 判断是否在微信浏览器
|
||||
* 微信jsapi支付
|
||||
*/
|
||||
let isWeiXin = this.$common.isWeiXinBrowser()
|
||||
|
||||
if (isWeiXin) {
|
||||
var transitUrl =
|
||||
baseUrl +
|
||||
'wap/#/pages/order/payment/auth?order_id=' +
|
||||
this.orderId +
|
||||
'&type=' +
|
||||
this.type;
|
||||
|
||||
if (this.type == 1 && this.orderId) {
|
||||
// 微信jsapi支付
|
||||
// if (this.openid) {
|
||||
// data['params'] = {
|
||||
// trade_type: 'JSAPI_OFFICIAL',
|
||||
// openid: this.openid
|
||||
// }
|
||||
// } else {
|
||||
// data['params'] = {
|
||||
// trade_type: 'JSAPI_OFFICIAL',
|
||||
// url: window.location.href
|
||||
// }
|
||||
// }
|
||||
data['params'] = {
|
||||
trade_type: 'JSAPI_OFFICIAL',
|
||||
url: transitUrl
|
||||
}
|
||||
} else if (this.type == 2 && this.recharge) {
|
||||
data['params'] = {
|
||||
trade_type: 'JSAPI_OFFICIAL',
|
||||
money: this.recharge,
|
||||
url: transitUrl + '&uid=' + this.uid + '&money=' + this.recharge
|
||||
}
|
||||
// if (this.openid) {
|
||||
// data['params'] = {
|
||||
// money: this.recharge,
|
||||
// openid: this.openid
|
||||
// }
|
||||
// } else {
|
||||
// data['params'] = {
|
||||
// money: this.recharge,
|
||||
// url: window.location.href
|
||||
// }
|
||||
// }
|
||||
} else if ((this.type == 5 || this.type == 6) && this.recharge) {
|
||||
data['params'] = {
|
||||
orderId: this.orderId
|
||||
}
|
||||
}
|
||||
let res = await Api.apiCall('get',Api.order.webPay,params);
|
||||
console.log(res);
|
||||
if (res) {
|
||||
this.checkWXJSBridge(res)
|
||||
}else{
|
||||
window.location.href = res.msg
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
// 微信 H5支付
|
||||
if (this.type == 1 && this.orderId) {
|
||||
data['params'] = {
|
||||
trade_type: 'MWEB',
|
||||
return_url: baseUrl +
|
||||
'wap/#/pages/order/payment/result'
|
||||
}
|
||||
} else if (this.type == 2 && this.recharge) {
|
||||
data['params'] = {
|
||||
trade_type: 'MWEB',
|
||||
money: this.recharge,
|
||||
return_url: baseUrl + 'wap/#/pages/order/payment/result'
|
||||
}
|
||||
} else if ((this.type == 5 || this.type == 6) && this.recharge) {
|
||||
data['params'] = {
|
||||
orderId: this.orderId
|
||||
}
|
||||
}
|
||||
console.log(data);
|
||||
// 微信h5支付
|
||||
let res = await Api.apiCall('get',Api.order.wapPay,params);
|
||||
console.log(res);
|
||||
if (res) {
|
||||
|
||||
if (res) {
|
||||
location.href = res
|
||||
} else {
|
||||
this.$common.errorToShow(res)
|
||||
}
|
||||
}
|
||||
}
|
||||
break
|
||||
case 'balancepay':
|
||||
/**
|
||||
* 用户余额支付
|
||||
*
|
||||
*/
|
||||
if ((this.type == 5 || this.type == 6) && this.recharge) {
|
||||
data['params'] = {
|
||||
orderId: this.orderId
|
||||
}
|
||||
}
|
||||
let params1 = {'orderId':this.orderId};
|
||||
let data1 = await Api.apiCall('post',Api.order.balancePay,params1);
|
||||
console.log(data1)
|
||||
if (data1) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/payment/result?order=' + JSON.stringify(data1)
|
||||
})
|
||||
}else {
|
||||
this.$api.msg(data1.data);
|
||||
}
|
||||
|
||||
break
|
||||
case 'offline':
|
||||
/**
|
||||
* 线下支付
|
||||
*/
|
||||
this.$common.modelShow(
|
||||
'线下支付说明',
|
||||
'请联系客服进行线下支付qq:951449465',
|
||||
() => {},
|
||||
false,
|
||||
'取消',
|
||||
'确定'
|
||||
)
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
.app {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.price-box {
|
||||
background-color: #fff;
|
||||
height: 265upx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 28upx;
|
||||
color: #909399;
|
||||
|
||||
.price{
|
||||
font-size: 50upx;
|
||||
color: #303133;
|
||||
margin-top: 12upx;
|
||||
&:before{
|
||||
content: '￥';
|
||||
font-size: 40upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay-type-list {
|
||||
margin-top: 20upx;
|
||||
background-color: #fff;
|
||||
padding-left: 60upx;
|
||||
|
||||
.type-item{
|
||||
height: 120upx;
|
||||
padding: 20upx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-right: 60upx;
|
||||
font-size: 30upx;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.icon{
|
||||
width: 100upx;
|
||||
font-size: 52upx;
|
||||
}
|
||||
.icon-erjiye-yucunkuan {
|
||||
color: #fe8e2e;
|
||||
}
|
||||
.icon-weixinzhifu {
|
||||
color: #36cb59;
|
||||
}
|
||||
.icon-alipay {
|
||||
color: #01aaef;
|
||||
}
|
||||
.tit{
|
||||
font-size: $font-lg;
|
||||
color: $font-color-dark;
|
||||
margin-bottom: 4upx;
|
||||
}
|
||||
.con{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: $font-sm;
|
||||
color: $font-color-light;
|
||||
}
|
||||
}
|
||||
.mix-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 630upx;
|
||||
height: 80upx;
|
||||
margin: 80upx auto 30upx;
|
||||
font-size: $font-lg;
|
||||
color: #fff;
|
||||
background-color: $base-color;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
|
||||
}
|
||||
|
||||
</style>
|
||||
249
mallplusui-uniapp-app2/components/payments/paymentsByWx.vue
Normal file
249
mallplusui-uniapp-app2/components/payments/paymentsByWx.vue
Normal file
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<view class="pay-type-list">
|
||||
|
||||
<view class="type-item b-b" v-for="item in payments" :key="item.code"
|
||||
report-submit="true" @click="toPayHandler(item.code)"
|
||||
v-if="!(type == 2 && item.code == 'balancepay')">
|
||||
<!-- <text class="icon yticon icon-weixinzhifu"></text> -->
|
||||
<image :src="item.img" style="width: 80upx;height: 80upx;margin-right: 20upx;"></image>
|
||||
<view class="con">
|
||||
<text class="tit">{{ item.name }}</text>
|
||||
<text>{{ item.memo }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiBaseUrl } from '@/config/config.js'
|
||||
import mallplusCopyright from '@/components/mall-copyright/mallplusCopyright.vue';
|
||||
import Api from '@/common/api';
|
||||
export default {
|
||||
props: {
|
||||
// 如果是商品订单此参数必须
|
||||
orderId: {
|
||||
type: String,
|
||||
default () {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
// 如果是充值订单此参数必须
|
||||
recharge: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 用户id
|
||||
uid: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 订单类型
|
||||
type: {
|
||||
type: Number,
|
||||
default () {
|
||||
return 1
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
payments: [],
|
||||
imgList: [
|
||||
'/static/image/wechatpay.png','/static/image/balancepay.png','/static/image/payment_balance.png',
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getPayments()
|
||||
},
|
||||
methods: {
|
||||
// 获取可用支付方式列表
|
||||
async getPayments () {
|
||||
|
||||
let params = {};
|
||||
this.orderInfo = await Api.apiCall('get',Api.order.paymentlist,params);
|
||||
this.payments = this.formatPayments(this.orderInfo)
|
||||
for(var i = 0;i < this.payments.length;i++){
|
||||
this.payments[i].img = this.imgList[i]
|
||||
}
|
||||
console.log('------',this.payments)
|
||||
},
|
||||
|
||||
// 支付方式处理
|
||||
formatPayments (payments) {
|
||||
// 过滤支付宝支付
|
||||
payments = payments.filter(item => item.code !== 'alipay')
|
||||
|
||||
// 如果是充值订单 过滤余额支付 过滤非线上支付方式
|
||||
if (this.type === 2) {
|
||||
payments = payments.filter(item => item.code !== 'balancepay' || item.is_online === 1)
|
||||
}
|
||||
|
||||
// 设置logo图片
|
||||
payments.forEach(item => {
|
||||
this.$set(item, 'icon', '/static/image/' + item.code + '.png')
|
||||
})
|
||||
|
||||
return payments
|
||||
},
|
||||
// 用户点击支付方式处理
|
||||
async toPayHandler (code) {
|
||||
|
||||
let params = {'orderId':this.orderId,
|
||||
payment_type: this.type};
|
||||
|
||||
|
||||
// 判断订单支付类型
|
||||
if (this.type == 2 && this.recharge) {
|
||||
|
||||
}else if ((this.type == 5 || this.type == 6) && this.recharge) {
|
||||
|
||||
}
|
||||
let _this = this
|
||||
switch (code) {
|
||||
case 'wechatpay':
|
||||
|
||||
let res = await Api.apiCall('post',Api.order.weixinAppletPay,params);
|
||||
console.log(res);
|
||||
if (res) {
|
||||
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
timeStamp: res.timeStamp,
|
||||
nonceStr: res.nonceStr,
|
||||
package: res.package,
|
||||
signType: res.signType,
|
||||
paySign: res.paySign,
|
||||
success: function (e) {
|
||||
if (e.errMsg === 'requestPayment:ok') {
|
||||
_this.$common.successToShow(res.msg, () => {
|
||||
_this.$common.redirectTo('/pages/order/payment/result?id=' + res.id)
|
||||
})
|
||||
}else{
|
||||
this.$common.errorToShow(res.msg)
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$common.errorToShow(res.msg)
|
||||
}
|
||||
|
||||
break
|
||||
case 'balancepay':
|
||||
/**
|
||||
* 用户余额支付
|
||||
*
|
||||
*/
|
||||
let params1 = {'orderId':this.orderId};
|
||||
let data1 = await Api.apiCall('post',Api.order.balancePay,params1);
|
||||
console.log(data1)
|
||||
if (data1) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/payment/result?order=' + JSON.stringify(data1)
|
||||
})
|
||||
}else {
|
||||
this.$api.msg(data1.data);
|
||||
}
|
||||
break
|
||||
case 'offline':
|
||||
/**
|
||||
* 线下支付
|
||||
*/
|
||||
this.$common.modelShow('线下支付说明', '请联系客服进行线下支付', () => {},false, '取消', '确定')
|
||||
break
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
.app {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.price-box {
|
||||
background-color: #fff;
|
||||
height: 265upx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 28upx;
|
||||
color: #909399;
|
||||
|
||||
.price{
|
||||
font-size: 50upx;
|
||||
color: #303133;
|
||||
margin-top: 12upx;
|
||||
&:before{
|
||||
content: '￥';
|
||||
font-size: 40upx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay-type-list {
|
||||
margin-top: 20upx;
|
||||
background-color: #fff;
|
||||
padding-left: 60upx;
|
||||
|
||||
.type-item{
|
||||
height: 120upx;
|
||||
padding: 20upx 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-right: 60upx;
|
||||
font-size: 30upx;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.icon{
|
||||
width: 100upx;
|
||||
font-size: 52upx;
|
||||
}
|
||||
.icon-erjiye-yucunkuan {
|
||||
color: #fe8e2e;
|
||||
}
|
||||
.icon-weixinzhifu {
|
||||
color: #36cb59;
|
||||
}
|
||||
.icon-alipay {
|
||||
color: #01aaef;
|
||||
}
|
||||
.tit{
|
||||
font-size: $font-lg;
|
||||
color: $font-color-dark;
|
||||
margin-bottom: 4upx;
|
||||
}
|
||||
.con{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: $font-sm;
|
||||
color: $font-color-light;
|
||||
}
|
||||
}
|
||||
.mix-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 630upx;
|
||||
height: 80upx;
|
||||
margin: 80upx auto 30upx;
|
||||
font-size: $font-lg;
|
||||
color: #fff;
|
||||
background-color: $base-color;
|
||||
border-radius: 10upx;
|
||||
box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
|
||||
}
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user