![在这里插入图片描述](https://img-blog.csdnimg.cn/20210106172731226.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzg0ODU3Ng==,size_16,color_FFFFFF,t_70)
支付组件
<template>
<view>
<u-popup v-model="show" mode="bottom" :closeable="true" @close="close">
<view class="plr-40">
<view class="center ptb-30">选择支付方式</view>
<u-radio-group v-model="value">
<u-radio name="2" class="w100 bb ptb-30">
微信支付
</u-radio>
<u-radio name="1" class="w100 ptb-30">
余额支付
</u-radio>
</u-radio-group>
<view class="ptb-50">
<u-button type="primary" @click="pay">确定</u-button>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import {baseUrl} from '../common/http.js';
export default {
props: ['show','money'],
data() {
return {
value: 2,
};
},
created() {
console.log(this.money);
},
methods: {
close() {
this.$emit('close')
},
pay() {
if (this.value == 1) {
this.$http('/addons/ddrive/user/service_pay', {
type: this.value
}, "POST").then(data => {
uni.showToast({
title: '支付成功'
})
this.close()
})
} else if (this.value == 2) {
this.$http('/addons/ddrive/user/service_pay', {
type: this.value
}, "POST").then(data => {
console.log(data);
let _this = this
uni.requestPayment({
provider: 'wxpay',
orderInfo: data,
success: function(res) {
console.log('success:' + JSON.stringify(res));
uni.showToast({
title: '支付成功'
})
_this.close()
},
fail: function(err) {
console.log('fail:' + JSON.stringify(err));
}
});
})
}
}
}
}
</script>
<style lang="scss">
/deep/.u-primary-hover {
background-color: $blue !important;
}
/deep/.u-radio {
display: flex;
flex-direction: row-reverse;
}
/deep/.u-radio-group {
width: 100% !important;
}
/deep/.u-radio__label {
width: 100%;
}
</style>