building-sign/pages/worker/my/my.vue

<template>
	<view class="pad-x120">
		<!-- 头部 -->
		<status-nav :ifReturn="false" navBarTitle="个人中心" :titleColor="titleColor" :backgroudColor="backgroudColor"></status-nav>
		<view class="content" v-if="isLoding">
			<!-- 个人简介 -->
			<view  class="sign-top my-top font24 color-white" :style="{'padding-top':statusHeight+50+'px'}">
				<image src="/static/my-bg.jpg" mode="aspectFill"></image>
				<view class="my-info">
					<view class="my-cover">
						<image :src="userInfo.headimgurl" mode="aspectFill"></image>
					</view>
					<view class="my-txt">
						<view class="font28">{{userInfo.nickname}}</view>
						<view class="font24">{{userInfo.real_name!==''?userInfo.real_name:'审核中'}}</view>
					</view>
				</view>
			</view>
			<!-- 其他信息 -->
			<view class="sign-record my-more">
				<view class="item bg-white" @tap="toMore(item.url)" v-for="(item,index) in myMoreList" :key="index">
					<view class="img">
						<image :src="`/static/icon/icon-my-0${index+1}.png`" :style="{'width':iconWidth[index]+'rpx','height':iconHeight[index]+'rpx'}" mode="aspectFit"></image>
					</view>
					<view class="txt font28">{{item.title}}</view>
					<image src="/static/icon/icon-arrow-03.png" mode="aspectFit"></image>
				</view>
			</view>
		</view>
		<!-- 尾部 -->
		<tabbar :userType="userType" current="2"></tabbar>
	</view>
</template>
<script>
	import tabbar from '@/components/tabbar/tabbar';
	export default {
		components:{
			tabbar
		},
		data() {
			return {
				statusHeight:uni.getSystemInfoSync().statusBarHeight, //状态栏高度
				userType:'worker', //账户类型 工人：worker 负责人：director
				frontColor:'#ffffff', //状态栏文字颜色
				backgroudColor:'none', //导航栏背景
				titleColor:'#ffffff', //导航栏颜色
				userInfo:{}, //用户信息
				myMoreList:[
					{title:'个人资料',url:'/pagesA/information/information'},
					{title:'打卡记录',url:'/pagesA/signRecord/signRecord'},
					{title:'工资记录',url:'/pagesA/wagesRecord/wagesRecord'},
					{title:'加班记录',url:'/pagesA/overtimeRecord/overtimeRecord'},
					{title:'员工手册',url:'/pagesA/singlePage/singlePage?type=manual'},
					{title:'安全告知',url:'/pagesA/singlePage/singlePage?type=security'},
					{title:'公告',url:'/pagesA/singlePage/singlePage?type=notice'}
				], //更多列表
				iconWidth:[32,30,30,32,31,28,28], //icon宽度
				iconHeight:[32,30,30,32,29,36,30], //icon高度
				isLoding:false, //是否加载完成
			}
		},
		onPageScroll(object){
			if(object.scrollTop >= 5){
				this.frontColor = '#000000';
				this.backgroudColor = '#ffffff';
				this.titleColor = '#3333333';
				// 改变状态栏
				this.changeStatusNav();
			}
			if(object.scrollTop <= 0){
				this.frontColor = '#ffffff';
				this.backgroudColor = 'none';
				this.titleColor = '#ffffff';
				// 改变状态栏
				this.changeStatusNav();
			}
		},
		onLoad() {
			// 改变状态栏
			this.changeStatusNav();
			// 获取用户信息
			this.getUserInfo();
		},
		methods: {
			// 改变状态栏
			changeStatusNav(){
				wx.setNavigationBarColor({
				  frontColor: this.frontColor,
				  backgroundColor: 'none',
				})
			},
			// 获取用户信息
			getUserInfo(){
				this.$requst.post('/api/v1/user/info').then(res=>{
					if(res.code==0){
						console.log(res,'用户信息');
						this.userInfo = res.data;
						this.isLoding = true;
					}
				})
			},
			//跳转页面
			toMore(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>
<style scoped>
	
</style>