zcb_APP/pages/my/index.vue

<template>
	<view class="content pdx-30">
		<view class="w flex ai_center mgt-100">
			<image class="w-100 h-100" src="/static/logo.png"></image>
			<view class="text-32">用户名称用户名称</view>
			<view>V年</view>
		</view>

		<view class="w flex jc_between mgy-20">
			<view class="flex">
				<view>v1</view>
				<view class="mgl-10">新手上路</view>
			</view>
			<view class="flex">
				<view>等级越高赚钱越多</view>
				<view class="mgl-10">查看攻略</view>
			</view>
		</view>
		<view></view>

		<view class="w flex jc_center">
			<view>
				<view>999.99</view>
				<view>去提现</view>
				<view>累计收益</view>
			</view>
			<view>
				<view>999.99</view>
				<view>悬赏金额</view>
			</view>
		</view>

		<view class="w flex jc_between mgy-20">
			<view v-for="item in tagList" :key="item.name" @click="navTo(item.pagePath)">
				<image class="w-100 h-100" :src="item.icon" mode="scaleToFill" />
				<view>{{ item.name }}</view>
			</view>
		</view>

		<view class="w flex ai_center">
			<image src="/static/logo.png" mode="scaleToFill" />
			<view class="mgl-10">
				<view>发布悬赏</view>
				<view>任务要急做？点这里快速发</view>
			</view>
		</view>

		<view class="w mgt-20">
			<view class="flex jc_between ai_center w pdy-10" v-for="item in menuList" :key="item.name"
				@click="navTo(item.pagePath)">
				<view class="flex ai_center">
					<image class="w-40 h-40" :src="item.icon" mode="scaleToFill" />
					<view class="mgl-10">{{ item.name }}</view>
				</view>
				<image class="w-40 h-40" src="/static/logo.png" mode="scaleToFill" />
			</view>
		</view>

	</view>
</template>

<script>
export default {
	data() {
		return {
			title: '我的',
			tagList: [
				{ icon: '/static/logo.png', name: '我的接单', pagePath: '/pages/myTakeOrder/index' },
				{ icon: '/static/logo.png', name: '我的悬赏', pagePath: '/pages/myBounty/index' },
				{ icon: '/static/logo.png', name: '开通会员', pagePath: '/pages/activateVIP/index' },
				{ icon: '/static/logo.png', name: '邀请好友', pagePath: '/pages/inviteFriends/index' },
			],
			menuList: [
				{ icon: '/static/logo.png', name: '我的工具包', pagePath: '/pages/myTools/index' },
				{ icon: '/static/logo.png', name: '我的消息', pagePath: '/pages/myMessage/index' },
				{ icon: '/static/logo.png', name: '维权', pagePath: '/pages/safeguardRights/index' },
				{ icon: '/static/logo.png', name: '收益统计', pagePath: '/pages/statisticsEarnings/index' },
				{ icon: '/static/logo.png', name: '我的店铺', pagePath: '/pages/myShop/index' },
				{ icon: '/static/logo.png', name: '系统设置', pagePath: '/pages/setting/index' },
			]
		}
	},
	onLoad() {

	},
	methods: {
		navTo(url) {
			uni.navigateTo({ url });
		}
	}
}
</script>

<style>
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
</style>