<style lang="scss" scoped>
.my-ctn{
	width: 100%;
	height: 100%;
	padding: $paddingTB $paddingLR;
	:not(not) {
		box-sizing: border-box;
	}
	
	.header{
		width: 100%;
		height: 260rpx;
		border-radius: 16rpx;
		box-shadow: $box-shadow;
		background-color: #fff;
		margin-top: 20rpx;
		position: relative;
		&-userinfo{
			text-align: center;
			padding-top: 110rpx;
			&-name{
				font-size: 28rpx;
				font-size: $uni-font-size-lg;
				color: #000000;
				padding-top: 10rpx;
			}
			&-company{
				font-size: $uni-font-size-sm;
				color: #aaa;
				padding-top: 10rpx;
			}
		}
		&-userinfo-avatar{
			padding: 15rpx;
			background-color: #fff;
			width: 130rpx;
			height: 130rpx;
			border-radius: 50%;
			margin: 0 auto;
			position: absolute;
			left: 50%;
			top: -20rpx;
			transform: translateX(-50%);
		}
	}
	.function{
		box-shadow: $box-shadow;
		border-radius: $uni-border-radius-lg;
		margin-top: 50rpx;
		padding: 20rpx;
		&-top{
			display: flex;
			border-top: 1px solid #ddd;
			&:first-child{
				border-top: none
			}
			&-box{
				flex: 1;
				text-align: center;
				padding: 40rpx 0;
				&:first-child{
					border-right: 1px solid #ddd;
				}
			}
		}
	}
}
</style>
<template>
	<view class="my-ctn">
		<headerBg></headerBg>
		<view class="header">
			<view class="header-userinfo" v-if="userInfo">
				<view class="header-userinfo-avatar">
					<template v-if="userInfo.avatar.length > 0">
						<u-image width="100rpx" height="100rpx" :src="getUrl(userInfo.avatar)" shape="circle"></u-image>
					</template>
					<template v-else>
						<u-image width="100rpx" height="100rpx" src="/static/images/my/headImg.png" shape="circle"></u-image>
					</template>
				</view>
				<view class="header-userinfo-name">{{userInfo && userInfo.nickName || userInfo.userName}}</view>
				<view class="header-userinfo-company">{{tenantInfo && tenantInfo.tenantName || ""}}</view>
			</view>
		</view>
		<view class="function">
			<view class="function-top">
				<view class="function-top-box" @click="goRouterFn('../tabBar/my/newAlarmRemind')">
					<view class="function-top-box-icon pb10">
						<tui-icon name="baojingjilu" size="80" ></tui-icon>
					</view>
					<view class="function-top-box-text">新报警提醒</view>
				</view>
				<view class="function-top-box" @click="goRouterFn('../tabBar/my/maintenanceRecord')">
					<view class="function-top-box-icon pb10">
						<tui-icon name="weibaojilu" size="80"></tui-icon>
					</view>
					<view class="function-top-box-text">维保记录</view>
				</view>
			</view>
			<view class="function-top">
				<view class="function-top-box" @click="goRouterFn('../tabBar/my/projectServe')">
					<view class="function-top-box-icon pb10">
						<tui-icon name="muluxiangmu" size="80"></tui-icon>
					</view>
					<view class="function-top-box-text">工程服务</view>
				</view>
				<view class="function-top-box" @click="goRouterFn('../tabBar/my/onlineServe')">
					<view class="function-top-box-icon pb10">
						<tui-icon name="zixun" size="80" ></tui-icon>
					</view>
					<view class="function-top-box-text">在线服务</view>
				</view>
			</view>
			<view class="function-top">
				<view class="function-top-box" @click="goRouterFn('../tabBar/my/help')">
					<view class="function-top-box-icon pb10">
						<tui-icon name="bangzhu" size="80"></tui-icon>
					</view>
					<view class="function-top-box-text">帮助</view>
				</view>
				<view class="function-top-box" @click="goRouterFn('../tabBar/my/setup')">
					<view class="function-top-box-icon pb10">
						<tui-icon name="shezhi" size="80"></tui-icon>
					</view>
					<view class="function-top-box-text">设置</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
import headerBg from "@/components/headerBg/headerBg.vue"
export default {
	data() {
		return {
			avatar: 'https://cdn.uviewui.com/uview/example/fade.jpg',
			userInfo: null,
			tenantInfo:null,
			tabbar:[
				{
					"pagePath": "/pages/tabBar/home",
					"text": "首页",
					"iconPath": "/static/images/toolbar/home.png",
					"selectedIconPath": "/static/images/toolbar/act-home.png"
				},{
					"pagePath": "/pages/tabBar/project",
					"text": "项目",
					"iconPath": "/static/images/toolbar/project.png",
					"selectedIconPath": "/static/images/toolbar/act-project.png"
				},{
					"pagePath": "/pages/tabBar/alarm",
					"text": "报警",
					"iconPath": "/static/images/toolbar/alarm.png",
					"selectedIconPath": "/static/images/toolbar/act-alarm.png"
				},{
					"pagePath": "/pages/tabBar/my",
					"text": "我的",
					"iconPath": "/static/images/toolbar/my.png",
					"selectedIconPath": "/static/images/toolbar/act-my.png"
			}]
		}
	},
	components:{headerBg},
	created() {
		this.getUserInfoFn();
	},
	methods: {
		getUserInfoFn(){
			// let userToken = uni.getStorageSync("userToken");
			let userType = uni.getStorageSync("userType");
			// let getUserInfoUrl = userType === "企业用户"?"/system/personal/profile":"/system/user/profile";
			let getUserInfoUrl = "/system/user/profile";
			
			this.$get(getUserInfoUrl).then((res)=>{
				console.log(res,"res");
				if(!res.data) return;
				this.userInfo = res.data;
				this.tenantInfo = res.data.tenant;
				uni.setStorageSync("tenantInfo",res.data.tenant)
				uni.setStorageSync("userInfo",this.userInfo)
			})
		},
		goRouterFn(url){
			console.log(url,"url");
			uni.navigateTo({
				url:url
			})
		},
		getUrl(url) {
			if(url.indexOf('http') > 0){
				return url;
			}else {
				return this.$config.baseUrl + url;
			}
		}
	}
}
</script>


