merchant-app/pages/my.vue

<template>
	<view>

		<view class="info">
			<view class="head">
<!--				{{param.realName.charAt(0)}}-->
				{{param.realName == null ? "" : param.realName.charAt(0)}}
			</view>
			<view class="right">
				<view class="name">
					{{param.realName}}
				</view>
				<view class="phone">
					{{param.phone}}
				</view>
			</view>
		</view>



		<view class="menu-list">
			<view class="list-cell list-cell-arrow" @click="jumpFw()">
				<view class="menu-item-box">
					<view>服务协议</view>
				</view>
			</view>
			<view class="list-cell list-cell-arrow" @click="jumpYs()">
				<view class="menu-item-box">
<!--					<view class="iconfont icon-help menu-icon"></view>-->
					<view>隐私政策</view>
				</view>
			</view>

		</view>


		<view class="exit" @click="logout">退出登录</view>



	</view>


</template>

<script>
	import { logout } from '@/api/login'
  export default {
	 data() {
		  return {
			  param: {
				  realName: null,
				  phone: null,
				  idCard: null,
			  },
		  };
	 },
	 onLoad: function() {
		  this.param.realName = this.$store.state.user.nickName
		  this.param.idCard = this.$store.state.user.idCard
		  this.param.phone = this.$store.state.user.phone
	 },
	 methods:{
		 toDate(str){

		 },
		 logout(){
			 logout().then(response => {
				 uni.reLaunch({ url:  "wxlogin" })
			 });
		 }
		 ,
		 jumpFw(){
			 uni.navigateTo({
				 url: "/pages/fw"
			 })
		 },
		 jumpYs(){
			 uni.navigateTo({
				 url: "/pages/ys"
			 })
		 }
	 }
  }
</script>

<style lang='scss'>
	/*<view class="info">*/
	/*	<view class="head">*/

	/*	</view>*/
	/*	<view class="right">*/
	/*	<view class="name">*/
	/*					  员工姓名*/
	/*	</view>*/
	/*	<view class="phone">*/
	/*	13184998794*/
	/*	</view>*/
	/*	</view>*/
	/*</view>*/


	.info {
		height: 180rpx;
		/*background-color: #d7d6d6;*/
		display: flex;
		align-items: center;

		padding: 0rpx 40rpx 0rpx 40rpx;
		.head{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 120rpx;
			height: 120rpx;
			font-weight: 650;
			font-size: 47rpx;
			border-radius: 60rpx;
			color: #ffffff;
			background-color: #4ac5f6;
		}
		.right{
			display: grid;
			align-items: start; /* 垂直靠左 */
			justify-content: center; /* 水平居中 */
			height: 100rpx;
			margin-left: 20rpx;
			grid-template-rows: 50% 50%;
			.name{
				font-weight: 350;
				font-size: 38rpx;
			}
			.phone{
				margin-top: 18rpx;
				color: #717171;
			}
		}


	}

	.exit{
		margin-top: 20rpx;
		width: 100%;
		text-align: center;
		height: 100rpx;
		background-color: #ffffff;
		display: grid;
		place-items: center;
		color: #d00303;
		font-size: 35rpx;
	}

	.menu-list {
		margin: 0px;
	}


</style>