<template>
	<view class="page">
		<navbar title="推广明细" leftClick @leftClick="$utils.navigateBack" />
		<view class="top">
			<view class="top-text">
				<view>{{ total }}</view>
				<view>直推人数</view>
			</view>
		</view>
		<view class="cell">
			<view class="cell-top">推广明细</view>
			<view class="cell-box" 
			:key="index"
			v-for="(item,index) in list">
				<uv-cell-group>
					<uv-cell 
					:title="item.nickName" 
					:label="item.createTime" 
					:center="true">
						<template #value>
							<text style="font-weight: 600; font-size: 28rpx;">
								{{ vipType[item.isPay] }}
							</text>
						</template>
					</uv-cell>
				</uv-cell-group>
			</view>
		</view>
	</view>
</template>

<script>
	import mixinsList from '@/mixins/list.js'
	export default {
		mixins : [mixinsList],
		data() {
			return {
				mixinsListApi : 'getFansPageList',
				vipType : ['普通会员', '黄金会员', '渠道商'],
			}
		},
		onLoad(e) {},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.page {
		background-color: #F3F3F3;
		height: 100vh;

		.top {
			display: flex;
			height: 400rpx;
			justify-content: center;
			align-items: center;
			color: #474747;

			.top-text {
				text-align: center;

				view:nth-child(1) {
					font-size: 78rpx;
					font-weight: 600;
				}

				view:nth-child(2) {
					font-size: 28rpx;
				}
			}
		}

		.cell {
			margin: 20rpx;
			background-color: #FFFFFF;
			border-radius: 16rpx;


			.cell-top {
				padding: 40rpx 34rpx;
				color: #474747;
				font-size: 34rpx;
				font-weight: 600;
			}
		}
	}
</style>