<template>
	<!-- #ifdef APP -->
	<scroll-view style="flex:1">
	<!-- #endif -->
		<view class="top">
			<image class="top-image" src="https://mzyun.tech/assets/img/avatar.png" mode=""></image>
			<view class="top-middle">
				<text class="top-nickname">超级美少女</text>
				<text class="top-username">133****7896</text>
			</view>
			<view class="top-toolbar flex-x">
				<easy-icon name="service-o" size="20"></easy-icon>
				<easy-icon name="setting-o" size="20"></easy-icon>

			</view>

		</view>
		<!-- <view class="flex-x">
			<easy-grid :column-num="5">
				<easy-grid-item icon="pending-payment" text="待付款" />
				<easy-grid-item icon="balance-pay" text="待发货" />
				<easy-grid-item icon="logistics" text="待收货" />
				<easy-grid-item icon="chat-o" text="待评价" />
				<easy-grid-item icon="after-sale" text="退款/售后" />
			</easy-grid>
		</view> -->
		<easy-card title="订单管理" value="全部" link="/pages/templates/order">
			<easy-grid :column-num="5">
				<easy-grid-item icon="pending-payment" text="待付款" />
				<easy-grid-item icon="balance-pay" text="待发货" />
				<easy-grid-item icon="logistics" text="待收货" />
				<easy-grid-item icon="chat-o" text="待评价" />
				<easy-grid-item icon="after-sale" text="退款/售后" />
			</easy-grid>
		</easy-card>
		<easy-cell title="我的钱包" value="您的会员还有9天到期" icon="paid" icon-color="#f00" :is-link="true" />
		<easy-cell title="地址管理" value="修改地址看这里" icon="location" icon-color="#0f0" :is-link="true"  />
		<easy-cell title="分享" value="邀请好友获199元优惠券" icon="share" icon-color="#00f" :is-link="true" />
		<easy-cell title="晒单" value="晒单抽大奖" icon="comment" icon-color="purple" :is-link="true" />
		<easy-cell title="我的收藏" value="好物都在这里" icon="like" icon-color="orange" :is-link="true" />
		<easy-cell title="设置" value="改昵称改密码" icon="setting" icon-color="#f00" :is-link="true" />
	<!-- #ifdef APP -->
	</scroll-view>
	<!-- #endif -->
</template>

<script>
	export default {
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss">
	.top {
		background: linear-gradient(to bottom right, #ffc397, #ffffff);
		padding: 20px;
		display: flex;
		flex-direction: row;

		.top-image {
			width: 60px;
			height: 60px;
			border-radius: 50px;
			margin: 0 10px;
		}

		.top-middle {
			flex: 1;
			.top-nickname {	
				font-weight: bold;
			}
			.top-username {
				
			}
		}

		

		.top-toolbar {
			width: 50px;
		}
	}

	.flex-x {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}
</style>