You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

167 lines
3.6 KiB

<template>
<view class="container" v-if="!isLoading">
<view class="space-upper">
<view class="wallet-image">
<image class="image" :src="$picUrl+ '/static/wallet.png'"></image>
</view>
<view class="wallet-account">
<view class="wallet-account_balance">
<text>{{ userInfo.balance }}</text>
</view>
<view class="wallet-account_lable">
<text>账户余额()</text>
</view>
</view>
</view>
<view class="space-lower">
<view v-if="setting.is_entrance" class="space-lower_item btn-recharge">
<view class="btn-submit" @click="onTargetRecharge()">充 值</view>
</view>
<view class="space-lower_item item-lable dis-flex flex-x-around">
<view class="lable-text" @click="onTargetRechargeOrder()">
<text>充值记录</text>
</view>
<view class="lable-text" @click="onTargetBalanceLog()">
<text>账单详情</text>
</view>
</view>
</view>
</view>
</template>
<script>
import * as UserApi from '@/api/user'
import SettingModel from '@/common/model/Setting'
import SettingKeyEnum from '@/common/enum/setting/Key'
export default {
data() {
return {
// 正在加载
isLoading: true,
// 会员信息
userInfo: {},
// 充值设置
setting: {},
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
// 获取页面数据
this.getPageData()
},
methods: {
// 获取页面数据
getPageData() {
const app = this
app.isLoading = true
Promise.all([app.getUserInfo(), app.getSetting()])
.then(() => app.isLoading = false)
},
// 获取会员信息
getUserInfo() {
const app = this
return new Promise((resolve, reject) => {
UserApi.info()
.then(result => {
app.userInfo = result.data.userInfo
resolve(app.userInfo)
})
})
},
// 获取充值设置
getSetting() {
const app = this
return new Promise((resolve, reject) => {
SettingModel.item(SettingKeyEnum.RECHARGE.value, false)
.then(data => {
app.setting = data
resolve(data)
})
})
},
// 跳转充值页面
onTargetRecharge() {
this.$navTo('pages/wallet/recharge/index')
},
// 跳转充值记录页面
onTargetRechargeOrder() {
this.$navTo('pages/wallet/recharge/order')
},
// 跳转账单详情页面
onTargetBalanceLog() {
this.$navTo('pages/wallet/balance/log')
}
}
}
</script>
<style>
page {
background: #fff;
}
</style>
<style lang="scss" scoped>
.container {
background: #fff;
}
.space-upper {
padding: 150rpx 0;
text-align: center;
}
.wallet-image .image {
width: 360rpx;
height: 260rpx;
}
.wallet-account {
margin-top: 20rpx;
}
.wallet-account_balance {
font-size: 56rpx;
}
.wallet-account_lable {
margin-top: 14rpx;
color: #cec1c1;
font-size: 26rpx;
}
.space-lower {
margin-top: 30rpx;
padding: 0 110rpx;
}
.btn-recharge .btn-submit {
width: 460rpx;
height: 84rpx;
margin: 0 auto;
border-radius: 50rpx;
background: #786cff;
color: white;
font-size: 30rpx;
display: flex;
justify-content: center;
align-items: center;
}
.item-lable {
margin-top: 80rpx;
font-size: 28rpx;
color: rgb(94, 94, 94);
padding: 0 100rpx;
}
</style>