businessCard/xiaochengxu/pages/mySet/mySet.vue

<template>
	<view class="content">
		<view class="content1 flex-between relative flex">
			<view class="user flex">
				<image :src="userInfo.head" mode="widthFix" class="img"></image>
				<view class="name">
					{{userInfo.nickname}}
				</view>
			</view>
			<view class="position">
				<image src="../../static/imgs/mySet/share.png" mode="widthFix" class="right-img"></image>
				<image src="../../static/imgs/mySet/ewm.png" mode="widthFix" class="right-img"></image>
			</view>
		</view>
		<view class="content2">
			<view class="row flex flex-between" v-for="(item,index) in menuList" :key='index' @click="menuClick(item.type)">
				<view class="flex">
					<image :src="item.src" mode="widthFix" class="nav-img"></image>
					<button class="left-btn" v-if='item.type=="contactCustomer"' open-type='contact'>{{item.name}}</button>
					<span class="left" v-else>{{item.name}}</span>
				</view>
				
				<span class="right"><image src="../../static/imgs/mySet/yjt.png" mode="widthFix" class="row-right-img"></image></span>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
				menuList: [{
						name: "我的名片",
						type: 'myInfo',
						src:'../../static/imgs/mySet/card.png'
					},
					{
						name: "我的主页",
						type: 'myHome',
						src:'../../static/imgs/mySet/home.png'
					},
					{
						name: "名片分类",
						type: "cardType",
						src:'../../static/imgs/mySet/type.png'
					},
					{
						name: "我的证件",
						type: "myCard",
						src:'../../static/imgs/mySet/card1.png'
					},
					{
						name: "帮助说明",
						type: "help",
						src:'../../static/imgs/mySet/help.png'
					},
					{
						name: "联系客服",
						type: "contactCustomer",
						src:'../../static/imgs/mySet/kf.png'
					},
					{
						name: "设置",
						type: 'set',
						src:'../../static/imgs/mySet/set.png'
					},
				]
			};
		},
		onShow() {
			this.userInfo = uni.getStorageSync("userInfo")
			console.log(this.userInfo)
		},
		methods: {
			menuClick(typeName) {
				let _url = '/pages/mySet/' + typeName
				console.log(_url)
				uni.navigateTo({
					url: _url
				})
			}
		}

	}
</script>

<style lang="scss" scoped>
	.content1 {
		background: #112253;
		padding: 0rpx 20rpx 160rpx 20rpx;
		box-sizing: border-box;
		border-radius: 0px 0px 20rpx 20rpx;

		.user {
			color: #fff;

			.name {
				font-weight: 700;
			}
		}

		.img {
			width: 124rpx;
			border-radius: 50%;
			margin-right: 32rpx;
		}

		.position {
			.right-img {
				width: 44rpx;
				margin-left: 40rpx;
			}
		}
	}

	.content2 {
		background: #fff;
		margin: 20rpx;
		padding:0 40rpx;
		position: relative;
		top: -100rpx;
		border-radius: 20rpx;
		.nav-img{
			width: 32rpx;
			margin-right:20rpx ;
		}
		.row{
			border-bottom: 1px solid #E6E6E6;
			padding: 35rpx 0;
			.row-right-img{
				width: 12rpx;
			}
		}
		.row:last-child{
			border: none;
		}
		.left-btn{
			background: #fff;
			padding: 0;
			margin: 0;
			font-size: 32rpx;
		}
		.left-btn:after{
			border: none!important;
		}
	}
</style>