<template>
	<view>
		<view class="header">
			<view class="header-top">
				<view class="message">
					<view style="font-size:112rpx;color:#fff">{{user_total_weath}}</view>
					<view class="grade">
						{{__('总余额(￥)')}}
					</view>
				</view>
			</view>
			<view class="header-bottom" v-if="Config.PLANTFORM_FX_ENABLE">
				<view class="growth">
					<view class="num">{{__('余额(￥)')}}</view>
					<view>{{user_money}}</view>
				</view>
				<view class="integral">
					<view class="num">{{__('佣金(￥)')}}</view>
					<view>{{user_commission_now}}</view>
				</view>
			</view>
		</view>
		<!-- <view class="header" style="height:(Height)rpx">
          <view class="totalMoney"><label style="font-size:112rpx">{{user_total_weath}}</label><label style="font-size:30rpx">元</label></view>
          <view class="portionMoney"><label>余额：(user_money)元</label><label>佣金：(user_commission_now)元</label></view>
        </view> -->
		<view class="m-btn-box" v-if="false">
			<navigator url="/member/cash/recharge" class="u-btn u-btn-default" v-if="(isECashCard)">{{__('我要充值')}}</navigator>
		</view>
		<view class="m-btn-box">
			<navigator url="/member/cash/predepositapply" class="u-btn btn-line-primary">{{__('我要提现')}}</navigator>
		</view>
		<view class="m-btn-box" v-if="Config.PLANTFORM_FX_ENABLE">
			<navigator url="/member/cash/commissionapply" class="u-btn btn-line-primary">{{__('佣金转入余额')}}</navigator>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'


	export default {
		data() {
			return {
				user_total_weath: 0, user_money: 0, user_commission_now: 0, Height: 0, isECashCard: true, isMemDist: true
			};
		},

		computed: mapState(['Config', 'StateCode', 'notice', 'plantformInfo', 'shopInfo', 'userInfo', 'hasLogin']),
		onLoad: function(options) {
			uni.setNavigationBarTitle({
				title:this.__('我的财富')
			});

			var that = this;
			that.$.getSystemInfo({
				success: function (e) {
					that.setData({Height: e.windowHeight})
				}
			}), this.setData({user_total_weath: options.user_total_weath, user_money: options.user_money, user_commission_now: options.user_commission_now});
		},
		methods: {
			...mapMutations(['logout', 'getPlantformInfo', 'forceUserInfo', 'login'])
		}
	}
</script>

<style lang="scss">
	@import "../../styles/_variables";

	/* .header{
      width: 100%;
      height: 400rpx;
      display: flex;
      flex-flow: column;
      justify-content: center;
      align-items: center;
    }
    .portionMoney{
      width: 60%;
      display: flex;
      font-size: 28rpx;
      justify-content: space-around
    } */
	.header{
		width: 100%;
		height: 480rpx;
	}
	.header-top{
		width: 100%;
		height: 280rpx;
		background: $default-skin-bg;
		display: flex;
		justify-content: center
	}
	.cover{
		position:fixed;width:100%;height:100%;top:0px;background:rgba(0,0,0,0.4);overflow: hidden;
	}
	.message{
		/* margin-top: 30rpx; */
		display: flex;
		flex-flow: column;
		align-items: center;
		justify-content: center
	}
	.grade{
		font-size: 28rpx;
		color: #fff;
		text-align: center
	}
	.header-top image{
		width: 140rpx;
		height: 140rpx;
		border-radius: 50%
	}
	.header-bottom{
		width: 100%;
		height: 84rpx;
		padding: 20rpx 0;
		display: flex;
		background: $default-skin-bg;
		padding-bottom:40rpx;
	}
	.growth{
		width: 50%;
		border-right: 1px solid #fff;
		font-size: 28rpx;
		color: #fff;
		text-align: center;
	}
	.integral{
		width: 50%;
		font-size: 28rpx;
		color: #fff;
		text-align: center;
	}
	.num{
		margin: 8rpx 0
	}
</style>
