270 lines
6.7 KiB
Vue
270 lines
6.7 KiB
Vue
<template>
|
||
<view>
|
||
<u-navbar title="收款账户" :border-bottom="false" :background="bgc" title-color='#fff' title-size='36'
|
||
back-icon-color="#fff" height='50'></u-navbar>
|
||
<view class="cont">
|
||
<!-- 银行卡 --> <!-- 银行卡 --> <!-- 银行卡 --> <!-- 银行卡 -->
|
||
<view class="card" @click="tobd(0)" v-if="yhkflag && infoList.BANK_CARD">
|
||
<view class="tit">
|
||
银行卡
|
||
</view>
|
||
<view class="txt"
|
||
style="display: flex;justify-content: space-between;width: 100%;padding-right: 30rpx;box-sizing: border-box;">
|
||
<text>需绑定银行卡</text>
|
||
<text>去绑定</text>
|
||
</view>
|
||
</view>
|
||
<view class="card" @click="tobd(0)" v-if="!yhkflag && infoList.BANK_CARD">
|
||
<view class="tit" style="display: flex;align-items: center;">
|
||
<view class=""
|
||
style="width: 50rpx;height: 50rpx;overflow: hidden;border-radius: 50%;position: relative;margin-right: 10rpx;">
|
||
<image
|
||
:src="'https://bkaear.market.alicloudapi.com/banklogo/' + infoList.BANK_CARD[0].cardInfo.Icon"
|
||
style="position: absolute;top: 0;left: -5rpx;" mode="heightFix"></image>
|
||
</view>
|
||
<text>{{infoList.BANK_CARD[0].name}}</text>
|
||
</view>
|
||
<view class="txt"
|
||
style="display: flex;justify-content: space-between;width: 100%;padding-right: 30rpx;box-sizing: border-box;">
|
||
<view>{{infoList.BANK_CARD[0].cardInfo.bankName}}</view>
|
||
<view>{{infoList.BANK_CARD[0].accountNo}}</view>
|
||
</view>
|
||
</view>
|
||
<!-- 银行卡 --> <!-- 银行卡 --> <!-- 银行卡 -->
|
||
|
||
<view class="card" style="background-color: #00BA88 ;" v-if="infoList.WECHAT">
|
||
<view class="tit">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uXQRpObfAZgNgamWSgk8" mode=""></image>
|
||
</view>
|
||
<view class="txt">
|
||
使用当前微信收款
|
||
<text v-if="wxaccountNo" style="margin-left: 120rpx;">{{wxaccountNo}}</text>
|
||
<text v-else style="margin-left: 240rpx;" @click="btnbd">点击绑定</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="card" style="background-color: #4C97E7 ;" @click="tobd(1)" v-if="infoList.OFFLINE_IMAGE">
|
||
<view class="tit">
|
||
线下二维码收款
|
||
</view>
|
||
<view class="txt"
|
||
style="display: flex;justify-content: space-between;width: 100%;padding-right: 30rpx;">
|
||
<text>需上传收款码</text>
|
||
<text v-if="infoList.OFFLINE_IMAGE[0]">已上传</text>
|
||
<text v-else>去上传</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="tip">注意：缴费收入将直接结算至收款账户，请谨慎填写 </view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
bgc: {
|
||
backgroundColor: "#8883F0",
|
||
},
|
||
infoList: [],
|
||
stause: false,
|
||
wxaccountNo: '',
|
||
yhkflag: true,
|
||
yhkaccountNo: '',
|
||
yhkid: '',
|
||
xxid: ''
|
||
}
|
||
},
|
||
onShow() {
|
||
this.getinfo()
|
||
this.getstause()
|
||
},
|
||
computed: {
|
||
|
||
},
|
||
methods: {
|
||
// 点击绑定微信openid
|
||
btnbd() {
|
||
let that = this
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '您是否要绑定当前微信收款？',
|
||
success: function(res) {
|
||
if (res.confirm) {
|
||
// 绑定请求
|
||
wx.login({
|
||
success(res) {
|
||
if (res.code) {
|
||
let openid = res.code
|
||
let data = {
|
||
accountType:2,
|
||
accountNo: openid,
|
||
}
|
||
that.$u.post("/app/account",data).then(res => {
|
||
if (res.code == 200) {
|
||
that.getinfo()
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'success',
|
||
duration: 1000,
|
||
})
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
} else if (res.cancel) {
|
||
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
tobd(num) {
|
||
if (num == 0) {
|
||
if (this.infoList.BANK_CARD == null || this.infoList.BANK_CARD.length === 0) {
|
||
uni.navigateTo({
|
||
url: '/page_user/mapditu/bdcard'
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/page_user/mapditu/bdcard?accountId=' + this.infoList.BANK_CARD[0].accountId
|
||
})
|
||
}
|
||
} else if (num == 1) {
|
||
if (this.infoList.OFFLINE_IMAGE == null || this.infoList.OFFLINE_IMAGE.length == 0) {
|
||
uni.navigateTo({
|
||
url: '/page_user/mapditu/bdAlipay'
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/page_user/mapditu/bdAlipay?accountId=' + this.infoList.OFFLINE_IMAGE[0]
|
||
.accountId
|
||
})
|
||
}
|
||
}
|
||
|
||
},
|
||
getstause() {
|
||
this.$u.get('/app/config/wa').then((res) => {
|
||
if (res.code == 200) {
|
||
this.stause = res.data
|
||
}
|
||
})
|
||
},
|
||
getinfo() {
|
||
this.$u.get('/app/account').then((res) => {
|
||
if (res.code == 200) {
|
||
this.infoList = res.data
|
||
// 判断当前微信openid
|
||
if (this.infoList.WECHAT && this.infoList.WECHAT[0] && this.infoList.WECHAT[0].accountNo) {
|
||
this.wxaccountNo = this.infoList.WECHAT[0].accountNo
|
||
this.wxaccountNo = this.wxaccountNo.substring(0, 5) + '********' + this.wxaccountNo.slice(-2)
|
||
}
|
||
//判断是否有银行卡
|
||
if (res.data.BANK_CARD && res.data.BANK_CARD[0] && res.data.BANK_CARD[0].accountNo) {
|
||
this.yhkflag = false
|
||
} else {
|
||
this.yhkflag = true
|
||
}
|
||
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
/deep/ .u-title {
|
||
padding-bottom: 22rpx;
|
||
}
|
||
|
||
/deep/ .u-icon__icon {
|
||
padding-bottom: 22rpx;
|
||
}
|
||
.cont {
|
||
display: flex;
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
margin: 0 auto;
|
||
|
||
.card {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
margin-top: 26rpx;
|
||
width: 636rpx;
|
||
height: 188rpx;
|
||
background: #8EA9E4;
|
||
box-shadow: 0rpx 16rpx 40rpx 0rpx rgba(42, 130, 228, 0.1);
|
||
border-radius: 20rpx;
|
||
|
||
.tit {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
image {
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
border-radius: 50%;
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
width: 80%;
|
||
margin-top: 20rpx;
|
||
margin-left: 48rpx;
|
||
font-family: AlibabaPuHuiTi,
|
||
AlibabaPuHuiTi;
|
||
font-weight: 400;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.txt {
|
||
// margin-top: 20rpx;
|
||
margin-left: 48rpx;
|
||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.txts {
|
||
width: 100%;
|
||
text-align: right;
|
||
margin-right: 48rpx;
|
||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
.tip {
|
||
margin-top: 62rpx;
|
||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #FF8D1A;
|
||
line-height: 36rpx;
|
||
}
|
||
|
||
.btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-top: 218rpx;
|
||
width: 590rpx;
|
||
height: 84rpx;
|
||
background: #8883F0;
|
||
border-radius: 40rpx;
|
||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||
font-weight: 400;
|
||
font-size: 36rpx;
|
||
color: #FFFFFF;
|
||
|
||
}
|
||
}
|
||
</style> |