<template>
	<c-tabbar :current="4">
		<view class="p-30">
			<view class="flex flex-row justify-center items-center" style="margin-bottom: 50upx;" @click="navigateTo('/pages/my/personal/personal')">
				<view class="flex justify-center items-center">
					<image class="avatar" src="../../../static/avatar.png" mode="aspectFit"></image>
				</view>
				<view class="flex-1" style="padding-left: 20upx;">
					<view class="name">{{userInfo.nickName}}</view>
					<view class="c-666">{{userInfo.phone}}</view>
					<view class="c-666">ID：{{userInfo.id}}</view>
				</view>
				<view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			
			<view class="wage p-30 flex flex-col">
				<view class="flex flex-row">
					<view class="flex flex-1 flex-col">
						<view class="wage-tip">可提现金额(元)</view>
						<view class="money">0.00</view>
					</view>	
					<view class="flex flex-col justify-center">
						<!-- <view class="wage-tip1 flex flex-row items-center">去提现 <u-icon name="arrow-right" color="#fff" size="13"></u-icon></view>
						<view class="wage-tip flex flex-row items-center" style="margin-top: 20upx"><u-icon name="info-circle" color="#84b6f9" size="13"></u-icon> 每月15号结算上月订单</view> -->
						<u-button text="提现" shape="circle" size="small" @click="navigateTo('/pages/my/wallet/wallet')"></u-button>
					</view>	
				</view>	
				<!-- <view class="flex flex-row">
					<view class="flex flex-1 flex-col" style="padding: 10upx 0;">
						<view><text class="wage-tip">总收益</text><text class="nums">0.00</text></view>
						<view style="padding-top: 20upx"><text class="wage-tip">昨日预估</text><text class="nums">0.00</text></view>
					</view>
					<view class="flex flex-1 flex-col" style="padding: 10upx 0;">
						<view><text class="wage-tip">七日预估</text><text class="nums">0.00</text></view>
						<view style="padding-top: 20upx"><text class="wage-tip">本月预估</text><text class="nums">0.00</text></view>
					</view>
				</view> -->
			</view>
			
			<view class="c-menu">
				<u-cell class="no-line" title="账号管理" :isLink="true" arrow-direction="right"></u-cell>
			</view>
			<view class="c-menu">
				<u-cell class="no-line" title="邀请好友" :isLink="true" arrow-direction="right" url="/pages/my/inviteFriend/inviteFriend"></u-cell>
			</view>
			<view class="c-menu">
				<u-cell title="客服微信" :isLink="true" arrow-direction="right" @click="show = true"></u-cell>
				<u-cell class="no-line" title="意见反馈" :isLink="true" arrow-direction="right" url="/pages/my/feedback/feedback"></u-cell>
			</view>
			<view class="c-menu">
				<u-cell title="用户协议" :isLink="true" arrow-direction="right" url="/pages/agreement/user/user"></u-cell>
				<u-cell title="隐私政策" class="no-line" :isLink="true" arrow-direction="right" url="/pages/agreement/privacy/privacy"></u-cell>
			</view>
		</view>
		
		<service-modal :show="show" @close="show = false"></service-modal>
	</c-tabbar>
</template>

<script>
	import CTabbar from '@/components/gTabbar.vue'
	import serviceModal from '@/components/modal/serviceModal.vue'
	import { getCustomerList } from '@/api/index.js'
	import {
		mapState
	} from 'vuex'
	export default {
		computed: {
			...mapState(['userInfo'])
		},
		components: {
			CTabbar,
			serviceModal
		},
		data() {
			return {
				loading: true,
				show: false,
				chooseCS: 0,
				// 基本案列数据
				radiolist: [],
			}
		},
		// onShow() {
		// 	this.getServiceList()
		// },
		// methods: {
		// 	async getServiceList() {
		// 		const res = await getCustomerList({})
		// 		this.radiolist = res.data
		// 		this.chooseCS = 0
		// 	},
		// 	groupChange(n) {
		// 		this.chooseCS = n
		// 	}
		// }
	}
</script>

<style lang="scss">
	.avatar {
		width: 140upx;
		height: 140upx;
		border-radius: 50%;
		overflow: hidden;
	}
	.name {
		font-size: 35upx;
		font-weight: bold;
		color: #323333;
		padding: 2upx 0;
	}
	.c-666 {
		font-size: 30upx;
	    color: #666!important;
		padding: 2upx 0;
	}
	.wage {
		background-color: $uni-theme;
		border-radius: 20upx;
		font-size: 25upx;
	}
	.wage-tip {
		color: #84b6f9;
	}
	.wage-tip1 {
		color: #fff;
	}
	.money {
		color: #f4f8ff;
		font-size: 50upx;
		font-weight: bold;
		padding-top: 15upx;
		padding-bottom: 30upx;
	}
	.nums {
		color: #f4f8ff;
		margin-left: 15upx;
	}
</style>
