<template>
	<view>
		<view class="bg theme_bg_bg"></view>
		<view class="top">
			<view class="box list dar3">
				<view class="r hr" @click="navigate('/pages/user/info')">
					<view class="r20"><image :src="user == '' ? '../../static/ls.jpg' : user.head" class="head"></image></view>
					<view class="r50">
						<view class="nickName" v-if="user == ''">登陆/注册</view>
						<view class="nickName" v-else>
							{{ user.nickName }}
							<text class="icon bo">&#xe65a;</text>
						</view>
					</view>
					<view class="clear"></view>
				</view>
				<view class="item hr">
					<button @click="navigate('/pages/order/list')">
						<text class="icon ic">&#xe70b;</text>
						我的订单
						<text class="icon arrow">&#xe65a;</text>
					</button>
				</view>
				<view class="item hr">
					<button open-type="feedback">
						<text class="icon ic">&#xe617;</text>
						意见反馈
						<text class="icon arrow">&#xe65a;</text>
					</button>
				</view>
				<view class="item hr">
					<button open-type="contact">
						<text class="icon ic">&#xe62a;</text>
						客服会话
						<text class="icon arrow">&#xe65a;</text>
					</button>
				</view>
				<view class="item">
					<button open-type="share">
						<text class="icon ic">&#xe637;</text>
						分享到
						<text class="icon arrow">&#xe65a;</text>
					</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			user: this.$getUser()
		};
	},
	onShow() {
		this.user = this.$getUser();
	},
	methods: {
		navigate(url) {
			if (this.$hasLogin()) {
				uni.navigateTo({ url: url });
			} else {
				uni.navigateTo({ url: '/pages/user/login' });
			}
		}
	}
};
</script>

<style lang="scss">
.top {
	padding: 15px;
	margin-top: -50px;
}
.bg {
	height: 70px;
}
.r {
	padding-bottom: 7px;
	.head {
		width: 60px;
		height: 60px;
		border-radius: 50%;
		margin-top: -50px;
		margin-left: 10px;
		border: 3px solid white;
	}
}

.list {
	background-color: white;
	margin-top: 10px;
	box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
	.nickName {
		font-size: 13px;
		color: $dar2;
		padding: 5px;
	}
	.item {
		padding: 7px;
		.ic {
			font-weight: bold;
			font-size: 20px;
			padding-right: 10px;
		}
		.arrow {
			margin-top: 6px;
			font-size: 20px;
		}
	}
}
button {
	text-align: left;
	background-color: white;
	color: #2e2e2e !important;
	font-size: 14px;
}
</style>
