|
|
@@ -26,6 +26,7 @@
|
|
|
<!-- #endif -->
|
|
|
<view class="type-item" @click="changePayType(3)">
|
|
|
<text class="icon iconfont iconyue"></text>
|
|
|
+
|
|
|
<view class="con">
|
|
|
<text class="tit">余额支付</text>
|
|
|
<text>可用余额 ¥{{ now_money }}</text>
|
|
|
@@ -34,8 +35,27 @@
|
|
|
<radio value="" color="#5dbc7c" :checked="payType == 3"></radio>
|
|
|
</label>
|
|
|
</view>
|
|
|
+ <view class="type-item" @click="changePayType(4)">
|
|
|
+ <!-- <text class="icon iconfont iconyue"></text> -->
|
|
|
+ <image src="../../static/icon/tailong.png" mode="widthFix" class="icon" style="width: 50rpx;margin-right:50rpx;"></image>
|
|
|
+ <view class="con">
|
|
|
+ <text class="tit">泰隆支付</text>
|
|
|
+ <!-- <text>可用余额 ¥{{ now_money }}</text> -->
|
|
|
+ </view>
|
|
|
+ <label class="radio">
|
|
|
+ <radio value="" color="#5dbc7c" :checked="payType == 4"></radio>
|
|
|
+ </label>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<text class="mix-btn" :class="{ clickbg: payLoding }" @click="!payLoding ? confirm() : ''">确认支付</text>
|
|
|
+ <uni-popup ref="popup" type="center" @change="closes" :maskClick="false">
|
|
|
+ <view class="qrimg">
|
|
|
+ <tki-qrcode :cid="cid" ref="qrcode" :val="val" :size="size" :unit="unit" :background="background"
|
|
|
+ :foreground="foreground" :pdground="pdground" :icon="icon" :iconSize="iconSize" :lv="lv" :onval="onval" :showLoading="showLoading"
|
|
|
+ :loadMake="loadMake" :usingComponents="usingComponents" @result="qrR" />
|
|
|
+ </view>
|
|
|
+ <navigator url="/pages/index/index" open-type="switchTab" class="mix-btn hollow">返回首页</navigator>
|
|
|
+ </uni-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -57,6 +77,23 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ cid: 'tki-qrcode-canvas', //canvasId，页面存在多个二维码组件时需设置不同的ID
|
|
|
+ size:300, //生成的二维码大小
|
|
|
+ unit: 'upx', //大小单位尺寸
|
|
|
+ // show: true,//默认使用组件中的image标签显示二维码
|
|
|
+ val: '', //要生成的内容
|
|
|
+ background: '#ffffff', //二维码背景色
|
|
|
+ foreground: '#333333', //二维码前景色
|
|
|
+ pdground: '#333333', //二维码角标色
|
|
|
+ icon: '', //二维码图标URL（必须是本地图片，网络图需要先下载至本地）
|
|
|
+ iconSize: 40, //二维码图标大小
|
|
|
+ lv: 3, //容错级别
|
|
|
+ onval: true, //监听val值变化自动重新生成二维码
|
|
|
+ loadMake: true, //组件初始化完成后自动生成二维码，val需要有值
|
|
|
+ usingComponents: false, //是否使用了自定义组件模式（主要是为了修复非自定义组件模式时 v-if 无法生成二维码的问题）
|
|
|
+ showLoading: false, //是否显示loading
|
|
|
+
|
|
|
+
|
|
|
payType: 2, //支付类型
|
|
|
// #ifdef H5
|
|
|
payName: 'weixin',
|
|
|
@@ -119,6 +156,22 @@
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
+ closes(e) {
|
|
|
+ console.log(e)
|
|
|
+ // if(!e.show) {
|
|
|
+ // uni.showModal({
|
|
|
+ // title: '提示',
|
|
|
+ // content: '请确认是否支付完成，即将返回首页',
|
|
|
+ // complete(e) {
|
|
|
+ // console.log(e)
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ // }
|
|
|
+
|
|
|
+ },
|
|
|
+ qrR() {
|
|
|
+
|
|
|
+ },
|
|
|
//选择支付方式
|
|
|
changePayType(type) {
|
|
|
this.payType = type;
|
|
|
@@ -131,6 +184,9 @@
|
|
|
if (this.payType == 3) {
|
|
|
this.payName = 'yue';
|
|
|
}
|
|
|
+ if(this.payType == 4) {
|
|
|
+ this.payName = 'tailong';
|
|
|
+ }
|
|
|
},
|
|
|
// 支付金额
|
|
|
orderMoneyPay() {
|
|
|
@@ -329,9 +385,16 @@
|
|
|
} else {
|
|
|
obj.$api.msg(msg);
|
|
|
}
|
|
|
- } else {
|
|
|
+ } else if(obj.payName == 'ali'){
|
|
|
// 立即支付
|
|
|
obj.orderMoneyPay();
|
|
|
+ }else if(obj.payName == 'tailong') {
|
|
|
+ console.log(data,'data.result.jsConfig')
|
|
|
+ console.log(data.result.jsConfig.body.qrcodeAdr,'res.data.result.jsConfig.body.qrcodeAdr')
|
|
|
+ obj.val = data.result.jsConfig.body.qrcodeAdr
|
|
|
+ obj.$refs.popup.open()
|
|
|
+ uni.hideLoading();
|
|
|
+ obj.payLoding = false;
|
|
|
}
|
|
|
})
|
|
|
.catch(e => {
|
|
|
@@ -436,4 +499,30 @@
|
|
|
.clickbg {
|
|
|
background-color: $color-gray !important;
|
|
|
}
|
|
|
+ .qrimg {
|
|
|
+ width: 400rpx;
|
|
|
+ height: 400rpx;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+ .mix-btn {
|
|
|
+ margin-top: 30upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 300upx;
|
|
|
+ height: 80upx;
|
|
|
+ font-size: $font-lg;
|
|
|
+ color: #fff;
|
|
|
+ background-color: $base-color;
|
|
|
+ border-radius: 10upx;
|
|
|
+ &.hollow{
|
|
|
+ background: #fff;
|
|
|
+ color: #303133;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
