<template>
	<view>
		<view class="page">
			<view class="w100 h-180 relative">
				<uni-nav-bar left-icon="back" :title="names" :border="false" backgroundColor="transparent" class="fw-b" color="#fff" @clickLeft="$tools.goBack()"></uni-nav-bar>
			</view>
			<view class="w100 rows rowsm rowsa mt-20">
				<view class="rows rowsl rowsm colfff" style="width: 50%;">
					<text class="fs-44 fw-b">{{prams.num||0}}</text>
					<text class="fs-26 mt-10">邀请总人数</text>
				</view>
				<view class="rows rowsl rowsm colfff" style="width: 50%;">
					<text class="fs-44 fw-b">{{prams.money||0}}</text>
					<text class="fs-26 mt-10">分销佣金</text>
				</view>
			</view>
			<view class="w100 rows rowsc mt-30">
				<view class="w-710 p-all-20 rows rowsl rowsm br-24 pl-10 pr-10 bgff">
					<view class="rows rowsm w100 rows rowsa">
						<view :class="index==select?'fs-26 br-20 w-248 h-72 rows rowsm rowsc bg colfff':'fs-26 w-248 h-72 rows rowsm rowsc box br-20 col'" 
						v-for="(item,index) in type" :key="index" @click="onSel(index)">
							{{item.name}}
						</view>
					</view>
					<scroll-view scroll-y="true" style="height: calc(100vh - 500rpx);">
						<view v-if="list.length>0">
							<view class="w-646 h-154 rows rowsm" style="border-bottom: 1rpx solid #ccc;" v-for="(item,index) in list" :key="index">
								<image class="w-80 h-80 br-100 mr-20" :src="$tools.oss(item.avatar)" mode="aspectFill"></image>
								<view class="h-80 rows rowsl rowsb">
									<text class="fs-28 fw-b">{{item.nickname}}</text>
									<text class="fs-24 col666">注册时间：{{$tools.timestampToTime(item.createtime)}}</text>
								</view>
							</view>
						</view>
						<view class="w100 rows rowsc h-600 rowsm" v-else>
							<image class="w-436 h-366" src="/static/other/5.png" mode=""></image>
						</view>
					</scroll-view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type:[{id:1,name:'直属客户'},{id:2,name:'间属客户'}],
				select:0,
				list:[],
				prams:{},
				names:''
			}
		},
		onShow() {
			this.teamList()
		},
		onLoad(e) {
			this.names = e.name
		},
		methods: {
			onSel(index){
				this.select = index
				this.teamList()
			},
			teamList(){
				this.$tools.axiosFromToken("POST","promotion/teamList",{
					type:this.type[this.select].id
				}).then(res => {
					this.list = res.data.list
					this.prams = res.data.info
				})
			}
		}
	}
</script>

<style>
	page{
		background-color: #F7F6FA;
	}
	.page{
		width: 750rpx;
		height: 678rpx;
		background: linear-gradient( 180deg, #E73232 0%, rgba(231,50,50,0.94) 30.45%, rgba(231,50,50,0.91) 53.88%, rgba(231,50,50,0.8) 69.29%, rgba(231,50,50,0.54) 81.67%, rgba(231,50,50,0.26) 90.37%, rgba(231,50,50,0) 100%);
	}
	.box{
		border: 2rpx solid #E73232;
	}
</style>