488 lines
13 KiB
Vue
488 lines
13 KiB
Vue
<style lang="scss" scoped>
|
||
@import '@/static/scss/global.scss';
|
||
.discount {
|
||
margin: 0 auto;
|
||
padding: 40rpx;
|
||
border-radius: 20rpx 20rpx;
|
||
background-color: white;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-direction: column;
|
||
.color-p {
|
||
color: rgb(142, 210, 71);
|
||
}
|
||
.d-list {
|
||
margin-top: 50rpx;
|
||
width: 100%;
|
||
&-item {
|
||
// width: 650rpx;
|
||
background-color: rgba(142, 210, 71, 0.8);
|
||
border-radius: 20rpx;
|
||
padding: 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 40rpx;
|
||
color: #ffffff;
|
||
font-size: 28rpx;
|
||
.left {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
margin-right: 20rpx;
|
||
.tip {
|
||
margin-bottom: 10rpx;
|
||
margin-right: 6rpx;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
.btn {
|
||
margin-right: 10rpx;
|
||
font-size: 34rpx;
|
||
}
|
||
}
|
||
}
|
||
.close {
|
||
width: 270rpx;
|
||
margin-top: 50rpx;
|
||
border-radius: 50rpx;
|
||
background-color: rgb(142, 210, 71);
|
||
}
|
||
}
|
||
.balance_wrapper {
|
||
padding: 20rpx 30rpx;
|
||
color: #fff;
|
||
.balance_wrapper_bg {
|
||
padding: 40rpx 40rpx;
|
||
// flex-direction: column;
|
||
justify-content: space-around;
|
||
border-radius: 20rpx;
|
||
background-color: rgb(233, 187, 133);
|
||
font-size: 36rpx;
|
||
.balance_wrapper_bg_item {
|
||
text-align: center;
|
||
margin: 0 30rpx;
|
||
.balance_text {
|
||
font-size: 50rpx;
|
||
font-weight: bold;
|
||
text {
|
||
font-size: 32rpx;
|
||
font-weight: normal;
|
||
margin-right: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
.balance_wrapper_bg_item_dj {
|
||
color: grey;
|
||
}
|
||
}
|
||
.nav_box {
|
||
justify-content: space-around;
|
||
.box {
|
||
flex: 1;
|
||
font-size: 26rpx;
|
||
image {
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
padding: 20rpx 60rpx;
|
||
border-radius: 10rpx;
|
||
background: linear-gradient(90deg, rgb(255, 150, 100), rgb(255, 106, 89));
|
||
}
|
||
.right {
|
||
margin-left: 30rpx;
|
||
background: linear-gradient(90deg, rgb(60, 152, 250), rgb(130, 120, 220));
|
||
}
|
||
}
|
||
}
|
||
.navigate_wrapper {
|
||
margin-top: 20rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
padding: 20rpx 0rpx;
|
||
box-sizing: border-box;
|
||
padding-bottom: 0;
|
||
.uni-noticebar {
|
||
width: 94%;
|
||
margin: 20rpx auto;
|
||
::v-deep .uni-noticebar__content-text {
|
||
font-size: 30rpx !important;
|
||
}
|
||
}
|
||
.navigate_item {
|
||
margin-bottom: 60rpx;
|
||
width: 49%;
|
||
.icon {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
border-radius: 50%;
|
||
margin-right: 40rpx;
|
||
margin-left: 80rpx;
|
||
image {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
.navigate_item:nth-child(2n - 1) {
|
||
border-right: 1rpx solid #e6e6e6;
|
||
}
|
||
.navigate_item:nth-last-child(1) {
|
||
border-right: none;
|
||
}
|
||
// .border_r {
|
||
// border-right: 1rpx solid #e6e6e6;
|
||
// }
|
||
}
|
||
.button {
|
||
color: #ffffff;
|
||
}
|
||
::v-deep.u-form-item {
|
||
.u-form-item__body__left {
|
||
width: 160rpx !important;
|
||
}
|
||
}
|
||
</style>
|
||
<template>
|
||
<view>
|
||
<u-navbar
|
||
v-if="!embedded"
|
||
@rightClick="handlerRight"
|
||
:autoBack="true"
|
||
:placeholder="true"
|
||
title="账户余额"
|
||
leftIconColor="#fff"
|
||
bgColor="#4BB22E"
|
||
:titleStyle="titleStyle"
|
||
>
|
||
<view slot="right" class="button"> 资产明细 </view>
|
||
</u-navbar>
|
||
<view class="balance_wrapper bg-w">
|
||
<view class="balance_wrapper_bg flex3">
|
||
<view class="balance_wrapper_bg_item">
|
||
平台赠送
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="flex1">
|
||
<view class="balance_text"> {{ platformInfo.count }}</view><text>份</text><text>(</text> {{ platformInfo.plants }}<text>)棵</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="balance_wrapper_bg flex3">
|
||
<!-- <view class="balance_wrapper_bg_item">
|
||
平台赠送
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="flex1">
|
||
<view class="balance_text"> {{ platformInfo.count }}</view><text>份</text><text>(</text> {{ platformInfo.plants }}<text>)棵</text>
|
||
</view>
|
||
</view> -->
|
||
<view class="balance_wrapper_bg_item">
|
||
槟榔券
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="balance_text"> <text>¥</text> {{ balance }} </view>
|
||
</view>
|
||
<view v-if="false" class="balance_wrapper_bg_item balance_wrapper_bg_item_dj">
|
||
冻结
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="balance_text">
|
||
{{ freeze_asset_account }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-gap height="30rpx"></u-gap>
|
||
|
||
<view class="balance_wrapper_bg flex3">
|
||
<view class="balance_wrapper_bg_item">
|
||
槟榔兑付
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="balance_text"> <text>¥</text> {{ bldiduihuan }} </view>
|
||
</view>
|
||
<view v-if="false" class="balance_wrapper_bg_item balance_wrapper_bg_item_dj">
|
||
冻结
|
||
<u-gap height="30rpx"></u-gap>
|
||
<view class="balance_text">
|
||
{{ freeze_duifuAsset }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-gap height="30rpx"></u-gap>
|
||
|
||
<view class="nav_box flex2" v-if="false">
|
||
<view
|
||
class="box flex3"
|
||
@click="
|
||
handlerNavigate({ path: '/pages/licai/mine/account/bindBank' })
|
||
"
|
||
>
|
||
<image src="../../../../static/ic_bank.png" mode=""></image>绑定银行卡
|
||
</view>
|
||
<view
|
||
class="box right flex3"
|
||
@click="
|
||
handlerNavigate({ path: '/pages/licai/mine/account/withDraw' })
|
||
"
|
||
>
|
||
<image src="../../../../static/ic_widthdraw.png" mode=""></image
|
||
>领取补贴
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="navigate_wrapper flex1 bg-w">
|
||
<uni-notice-bar
|
||
v-if="false"
|
||
single
|
||
color="#FFFFFF"
|
||
background-color="#0BBE3C"
|
||
text="领取补贴税费6%，转换槟榔券税费0%"
|
||
/>
|
||
<view
|
||
@click="handlerNavigate(item)"
|
||
class="navigate_item flex2"
|
||
v-for="(item, index) in navList"
|
||
:key="index"
|
||
>
|
||
<view class="icon flex3" :style="{ backgroundColor: item.bgColor }">
|
||
<image :src="item.icon" mode=""></image>
|
||
</view>
|
||
{{ item.name }}
|
||
</view>
|
||
</view>
|
||
|
||
<view class="navigate_wrapper flex1 bg-w">
|
||
<uni-notice-bar
|
||
single
|
||
color="#FFFFFF"
|
||
background-color="#0BBE3C"
|
||
text="新资产余额1:1兑换"
|
||
/>
|
||
<view
|
||
@click="cashNewAsset(item)"
|
||
class="navigate_item flex2"
|
||
v-for="(item, index) in cashList"
|
||
:key="index"
|
||
>
|
||
<view class="icon flex3" :style="{ backgroundColor: item.bgColor }">
|
||
<image :src="item.icon" mode=""></image>
|
||
</view>
|
||
{{ item.name }}
|
||
</view>
|
||
</view>
|
||
<uni-popup ref="openPopup" type="center">
|
||
<view class="discount">
|
||
<text class="font32 color-p">兑付转换</text>
|
||
<view class="d-list">
|
||
<view class="d-list-item">
|
||
<text class="font28">槟榔兑付：</text>
|
||
<text>￥{{ bldiduihuan }}</text>
|
||
</view>
|
||
<u-form-item label="转换金额" prop="convertMoney" borderBottom>
|
||
<u--input
|
||
v-model="convertMoney"
|
||
type="number"
|
||
placeholder="请输入装换金额"
|
||
border="none"
|
||
></u--input>
|
||
</u-form-item>
|
||
</view>
|
||
<view class="footer flex flex-space-around">
|
||
<button type="primary" class="close" @click="closePopup">关闭</button>
|
||
<button
|
||
type="primary"
|
||
class="close"
|
||
style="margin-left: 20rpx"
|
||
@click="cashConvert"
|
||
>
|
||
确认转换
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
<!-- 输入框示例 -->
|
||
<uni-popup ref="alertDialog" type="dialog">
|
||
<uni-popup-dialog
|
||
type="error"
|
||
cancelText="取消"
|
||
confirmText="确认"
|
||
title="系统提示"
|
||
:content="alertMsg"
|
||
@confirm="cashAll"
|
||
></uni-popup-dialog>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getBankList,
|
||
widthDraw,
|
||
getUserBalance,
|
||
assetCashConvert,
|
||
myGivePerformance
|
||
} from '@/api/system/user.js'
|
||
import { oldAssetCaseBalance } from '@/api/system/api.js'
|
||
import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
||
export default {
|
||
components: { uniPopup },
|
||
data () {
|
||
return {
|
||
//槟榔券，购买券，槟榔兑付资产，辣椒土地资产
|
||
cashList: [
|
||
{
|
||
name: '槟榔券',
|
||
assetType: '5',
|
||
icon: require('@/static/ic_change.png'),
|
||
bgColor: 'rgb(11, 190, 60)'
|
||
},
|
||
|
||
{
|
||
name: '槟榔兑付',
|
||
assetType: '6',
|
||
icon: require('@/static/ic_change.png'),
|
||
bgColor: 'rgb(11, 190, 60)'
|
||
}
|
||
],
|
||
|
||
navList: [
|
||
{
|
||
name: '银行卡',
|
||
path: '/pages/licai/mine/account/bankList',
|
||
icon: require('@/static/ic_bank.png'),
|
||
bgColor: 'rgb(16, 160, 244)'
|
||
},
|
||
{
|
||
name: '充值记录',
|
||
path: '/pages/licai/mine/recharge/recored',
|
||
icon: require('@/static/ic_recharge_record.png'),
|
||
bgColor: 'rgb(11, 190, 160)'
|
||
},
|
||
{
|
||
name: '槟榔券转账',
|
||
path: '/pages/licai/mine/account/change?asstype=5',
|
||
icon: require('@/static/ic_change.png'),
|
||
bgColor: 'rgb(11, 190, 60)'
|
||
},
|
||
{
|
||
name: '兑付转账',
|
||
path: '/pages/licai/mine/account/change?asstype=6',
|
||
icon: require('@/static/ic_change.png'),
|
||
bgColor: 'rgb(11, 190, 60)'
|
||
},
|
||
// {
|
||
// name: "兑付转账",
|
||
// path: "/pages/licai/mine/account/change?asstype=4",
|
||
// icon: require("@/static/ic_change.png"),
|
||
// bgColor: "rgb(11, 190, 60)",
|
||
// },
|
||
// { name: '账单', path: '/pages/licai/mine/account/record', icon: require('@/static/ic_record.png'), bgColor: 'rgb(250, 90, 120)'},
|
||
{
|
||
name: '兑付明细',
|
||
path: '/pages/licai/mine/account/bldfList',
|
||
icon: require('@/static/ic_reward.png'),
|
||
bgColor: 'rgb(250, 190, 20)'
|
||
},
|
||
{
|
||
name: '兑付转换',
|
||
path: '',
|
||
icon: require('@/static/reaching.png'),
|
||
bgColor: 'rgb(11, 190, 60)'
|
||
}
|
||
],
|
||
balance: 0,
|
||
bldiduihuan: 0,
|
||
freeze_asset_account: 0, //购买券冻结
|
||
freeze_duifuAsset: 0, //槟榔兑付冻结
|
||
titleStyle: {
|
||
color: '#fff'
|
||
},
|
||
convertMoney: '',
|
||
cashAssetType: '',
|
||
alertMsg: '',
|
||
platformInfo: {
|
||
count: 0,
|
||
plants: 0,
|
||
},
|
||
}
|
||
},
|
||
props: {
|
||
embedded: {
|
||
type: Boolean,
|
||
default: false
|
||
}
|
||
},
|
||
mounted () {
|
||
if (this.embedded) {
|
||
this.getUserBalance()
|
||
this.getPlatformInfo()
|
||
}
|
||
},
|
||
onShow () {
|
||
if (!this.embedded) {
|
||
this.getUserBalance()
|
||
this.getPlatformInfo()
|
||
}
|
||
},
|
||
methods: {
|
||
// 土地兑付确认
|
||
async cashConvert () {
|
||
let res = await assetCashConvert({
|
||
convertType: 2,
|
||
convertMoney: this.convertMoney
|
||
})
|
||
if (res.code == 200) {
|
||
this.$toast('兑付成功')
|
||
this.getUserBalance()
|
||
this.convertMoney = ''
|
||
this.$refs.openPopup.close()
|
||
}
|
||
},
|
||
async cashAll () {
|
||
await oldAssetCaseBalance(this.cashAssetType)
|
||
this.$toast('兑付成功')
|
||
this.getUserBalance()
|
||
},
|
||
cashNewAsset (item) {
|
||
this.cashAssetType = item.assetType
|
||
this.alertMsg = '确认将【' + item.name + '】全部兑换为消费余额'
|
||
this.$refs.alertDialog.open()
|
||
},
|
||
handlerRight () {
|
||
uni.navigateTo({
|
||
url: '/pages/licai/mine/account/couponList'
|
||
})
|
||
},
|
||
handlerNavigate (item) {
|
||
// if (item.path === '/pages/licai/mine/account/withDraw') {
|
||
// return this.$toast("暂未开启");
|
||
// }
|
||
if (item.path) {
|
||
uni.navigateTo({
|
||
url: item.path
|
||
})
|
||
} else {
|
||
this.$refs.openPopup.open()
|
||
}
|
||
},
|
||
closePopup () {
|
||
this.$refs.openPopup.close()
|
||
},
|
||
async getUserBalance () {
|
||
let res = await getUserBalance()
|
||
if (res.code == 200) {
|
||
this.balance = res.data.bl_money
|
||
this.bldiduihuan = res.data.bl_df_money
|
||
this.freeze_asset_account = res.data.freeze_bl_money //购买券冻结
|
||
this.freeze_duifuAsset = res.data.freeze_bl_df_money //槟榔兑付冻结
|
||
console.log('res', res)
|
||
}
|
||
},
|
||
async getPlatformInfo() {
|
||
let res = await myGivePerformance({
|
||
type: 2,
|
||
investmentType: 2
|
||
});
|
||
if (res.code == 200) this.platformInfo = res.data;
|
||
},
|
||
}
|
||
}
|
||
</script>
|