<template>
	<view class="content">
		<!-- <view class="userHead dfsb">
			<view class="uHeader dffd">
				<text class="uinfoPho">直推人数</text>
				<text>{{ teamNum.parent_num || 0 }}</text>
			</view>
			<view class="uHeader dffd">
				<text class="uinfoPho">团队人数</text>
				<text>{{ teamNum.team_num || 0 }}</text>
			</view>
		</view>
		<view class="teamTab dfsa">
			<text @tap="change(1)" :class="tabsel == 1 ? 'tabli' : ''">直推</text>
			<text @tap="change(2)" :class="tabsel == 2 ? 'tabli' : ''">团队</text>
		</view> -->
		<view class="userCenter">
			<view class="order">
				<view v-for="(item, ind) in teamList" :key="ind" class="ordtype dfsb">
					<image :src=" item.avatar" />
					<view class="dffd">
						<text class="name">
							{{ item.nickname }}
							<text class="textgrey">{{ item.phone }}</text> 
						</text>
						<view class="bot dfsb">
							<text class="time">{{ item.create_time }}</text>
						</view>
					</view>
					<!-- <text>{{item.level}}</text> -->
				</view>
				<view v-if="teamList.length < 1" class="moredata"><u-empty text="还没有队友哦" mode="list"></u-empty></view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			tabsel: 1,
			status: 'loadmore',
			teamNum: {},
			teamList: [
				// {
				// 	username: '好设计师',
				// 	create_time: '2020-09-18',
				// 	level: 1
				// }
			],
			page: 1,
			pagenum: 10
		};
	},
	onLoad() {
		this.onload();
	},
	onReachBottom() {
		if (this.status == 'nomore') return;
		this.status = 'loading';
		this.page = ++this.page;
		this.onload();
	},
	methods: { 
		onload() {
			this.$api
				.request('user/getTeamList', {
					page: this.page,
					limit: this.pagenum
				})
				.then(data => {
					if (data.code == 200) {
						this.teamList = data.data; 
						this.status = 'loadmore';
						if (data.data.length < this.pagenum) {
							this.status = 'nomore';
						}
					} else {
						this.$api.toast(data.msg);
						setTimeout(res => {
							uni.navigateBack({
								delta: 1
							});
						}, 1000);
					}
				}) 
		}
	}
};
</script>
<style lang="scss">
.content {
	min-height: 100vh;
	background-color: #f5f5f5;
	.teamTab {
		background-color: #fff;
		justify-content: center;
		margin-top: 20rpx;
		padding: 32rpx 20rpx 0;
		text {
			margin: 0 40rpx;
			font-size: 36rpx;
			color: #666666;
		}
		.tabli {
			width: 96rpx;
			text-align: center;
			height: 48rpx;
			line-height: 48rpx;
			border-radius: 30rpx;
			border: 1px solid #ae7a58;
			color: #ae7a58;
			font-size: 28rpx;
		}
	} 
	.userCenter {
		// margin-top: 20rpx;
		.order {
			background-color: #fff;
			.ordtype {
				padding: 30rpx;
				border-bottom: 1px solid #f7f7f7;
				&:nth-last-of-type(1) {
					border-bottom: 0;
				}
				image {
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
				}
				.dffd {
					margin: 0 20rpx;
					flex: 1;
					.name {
						font-size: 34rpx;
						font-family: PingFangSC-Semibold, PingFang SC;
						font-weight: 600;
						color: rgba(51, 51, 51, 1);
						line-height: 50rpx;
						margin-bottom: 5rpx;
						.fontbase {
							margin-left: 15rpx;
							font-size: 30rpx;
							color: #999;
						}
					}
				}
				.bot {
					width: 100%;
				}
				.time {
					color: #999;
					line-height: 30rpx;
				}
			}
		}
	}
}
</style>
