shell/pages/index/user.vue

<template>
	<view class="content">
		<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
		<view style="height: 43px;" class="topH"></view>
		<view class="topNavBox">
			<view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
			<view class="indexnav">我的</view>
		</view>
		<view class="top1">
			<view class="touxiang">
				<image class="touxiangImg" src="/static/img/touxiang.png" mode=""></image>
				<view class="nickName">微信用户</view>
			</view>
		</view>
		<view class="fuwu">
			<view class="fuwuTitle">我的服务</view>
			<view class="lineBox">
				<view class="line" @click="gohistory">
					<image src="/static/img/lscx.png" mode="" class="lineImg"></image>
					<view class="lineTxt">历史查询</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		props:['iStatusBarHeight',],
		components: {
		
			
		},
		data() {
			return {
				iStatusBarHeight:'',
			}
		},
		onLoad() {
		
		},
		onShow() {
		
		},
		methods: {
		   gohistory(){
			 uni.navigateTo({
				url:'/pages/index/history'
			 })
		   },
			
		},
		onShareAppMessage(){
				   
		}
	}
</script>

<style scoped>
.content{
	height: 100vh;
	background: #F4F5F7;
}
.top1{
	height: 300rpx;
	background: #FF4F00;
	border-radius: 0 0 5% 5%;
}
.indexnav{
		height: 44px;
		line-height: 44px;
		text-align: center;
		font-size: 36rpx;
	/* 	color: #FFFFFF; */
	}
.topNavBox{
	background: #FF4F00;
	width: 750rpx;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 111;
    color: #FFF;
}
.topH{
		background: #FF4F00;
}
.status_bar{
	background: #FF4F00;
}
.touxiangImg{
	width: 90rpx;height: 90rpx;
}
.nickName{
	line-height: 90rpx;
	font-size: 32rpx;
	color: #FFFFFF;
	padding-left: 20rpx;
}
.touxiang{
	display: flex;
	padding-left: 40rpx;
	padding-top: 40rpx;
}
.fuwu{
	width: 702rpx;
	margin-left: 24rpx;
	background: #FFFFFF;
	border-radius: 16rpx;
	margin-top: -100rpx;
}
.fuwuTitle{
	font-weight: 500;
	font-size: 28rpx;
	color: #1A1A1A;
	padding-top: 30rpx;padding-left: 30rpx;
}
.line{
	text-align: center;
}
.lineImg{
	width: 90rpx;height: 90rpx;
}
.lineTxt{
	font-size: 26rpx;
	color: #1A1A1A;
}
.lineBox{
	display: flex;
	padding-left: 55rpx;
	padding-bottom: 30rpx;
}
</style>