jje_uniapp/pages/my/index.vue

<template>
	<view class="page" >
		<view class="backImage">
			<image class="backImage" src="/static/me/u655.png"></image>
		</view>

		<view class="content">

				<view class="userInfo flex-row">
					<view class="userPhoto">
						<image class="userPhoto" src="/static/logo.png"></image>
					</view>
					<view class="userTitle flex-col justify-center">
						<text class="nickName">HI,亲爱的{{ userInfo.ncikName }}</text>
						<view class="flex-row">
							<text class="xinxTitle">啊擦黄寺大街快乐崇拜哈少得可怜</text>
							<u-icon name="arrow-right" color="#333333" size="16"></u-icon>
						</view>
					</view>
				</view>

				<view class="sudoku flex-col">
					<view class="balance-name">
						<text>我的资产</text>
					</view>
					<view class="balance flex-row justify-around">
						<view @click="goRecharge">
							<view class="icon flex-row justify-center">
								<u-icon name="/static/me/u701.png" color="red" size="30"></u-icon>
							</view>
							<view class="name">
								余额
							</view>
							<view class="num">
								<text>￥{{userInfo.balance || 0}}</text>
							</view>
						</view>
						<view>
							<view class="icon flex-row justify-center">
								<u-icon name="/static/me/u680.png" color="red" size="30"></u-icon>
							</view>
							<view class="name">
								积分
							</view>
							<view class="num">
								<text>{{userInfo.integral|| 0}}</text>
							</view>
						</view>
						<view @click="goCoupon">
							<view class="icon flex-row justify-center">
								<u-icon name="/static/me/u687.png" color="red" size="30"></u-icon>
							</view>
							<view class="name">
								优惠券
							</view>
							<view class="num">
								<text>{{userInfo.coupon || 0}}</text>
							</view>
						</view>
						<view>
							<view class="icon flex-row justify-center">
								<u-icon name="/static/me/u694.png" color="red" size="30"></u-icon>
							</view>
							<view class="name">
								电子币
							</view>
							<view class="num">
								<text>{{userInfo.electronicCurrency || 0}}</text>
							</view>
						</view>
					</view>

				</view>

				<view class="group">
					<uni-list>
						<uni-list-item :to="item.to" :title="item.title" showArrow :thumb="item.thumb" thumb-size="sm" :rightText="item.rightText"  v-for="(item,index) in group1" :key="index" />
					</uni-list>
				</view>

				<view class="group">
					<uni-list>
						<uni-list-item :to="item.to" :title="item.title" showArrow :thumb="item.thumb" thumb-size="sm"  v-for="(item,index) in group2" :key="index" />
					</uni-list>
				</view>

				<view class="tabBarLineHeight"></view>

		</view>
		<view class="tabBarView">
			<tab-bar :tabIndex="tabIndex"></tab-bar>
		</view>
	</view>
</template>

<script >
import tabBar from "../../components/tabBar/tabBar";
export default {
	components: {
		tabBar
	},
	data() {
		return {
			group1:[
				// {thumb:'/static/me/u1796.png',title:'贡献奖励记录',rightText:'',to:''},
				{thumb:'/static/me/u1803.png',title:'实名认证',rightText:'',to:'/myPages/realNameAuth/index'},
				// {thumb:'/static/me/u1812.png',title:'服务对象管理',rightText:'',to:'/myPages/ServiceObjectManagement/index'},
        		{thumb:'/static/me/u3.png',title:'推广中心',rightText:'',to:'/myPages/promotionCenter/index'},
				// {thumb:'/static/me/u1833.png',title:'新老系统切换',rightText:'',to:'/myPages/systemSwitch/index'},
				{thumb:'/static/me/u826.png',title:'储值服务',rightText:'',to:'/myPages/recharge/index'}
			],
			group2:[
				{thumb:'/static/me/u1829.png',title:'关于我们',rightText:'',to:'/myPages/aboutOur/index'},
				{thumb:'/static/me/u10.png',title:'个人信息',rightText:'',to:'/myPages/userInfo/index'},
				{thumb:'/static/me/u101.png',title:'设置',rightText:'',to:'/myPages/setting/index'}
			],
			height:'',
			title: 'Hello',
			tabIndex: 4,
			userInfo: {}
		}
	},

	// 分享到朋友圈
	onShareTimeline() { },
	// 分享到用户
	onShareAppMessage(OBJECT) { },
	onLoad() {
		uni.hideTabBar({
			animation:false
		})
		let sysInfo = uni.getSystemInfoSync()
		this.height = sysInfo.screenHeight +'px'
	},

	onShow(){
		this.userInfo = uni.getStorageSync('userInfo')
		if (this.userInfo.isAttestation){
			this.group1[0].rightText = '已认证'
		}else {
			this.group1[0].rightText = '未实名认证，去认证'
		}
	},

	methods: {

		goRecharge(){
			uni.navigateTo({
				url:'/myPages/recharge/index'
			})
		},

		goCoupon(){
			uni.navigateTo({
				url:'/myPages/coupon/index'
			})
		}
	}
}
</script>

<style>

	@import '/common/css/common.css';
	@import './index.rpx.css';
</style>