<template>
	<view :style="viewColor">
		<view class="title">推荐人数据统计
		   <view><span class="info">昵称: {{ realInfo.nickname }} </span></view>
		   <view>
			   <span class="info">ID: {{realInfo.uid}}</span>
		   </view>		   
			<view>
				<span class="info">手机号: {{realInfo.phone}}</span>
			</view>
		</view>
		<!-- <view class="title">
		   <span style="margin-right:20px;font-size: 12px;">昵称: {{ realInfo.nickname }} </span>
			<span style="margin-right:20px;font-size: 12px;">ID: {{realInfo.uid}}</span>
			<span style="margin-right:20px;font-size: 12px;">手机号: {{realInfo.phone}}</span>
		</view> -->
		<view class="uni-container">
			<uni-table ref="table" :loading="loading" border stripe  emptyText="暂无更多数据">
				<uni-tr>
					<uni-th width="100" align="center">昵称</uni-th>
					<uni-th width="100" align="center">手机号</uni-th>
					<uni-th width="100" align="center">注册时间</uni-th>
					<uni-th width="100" align="center">消费次数</uni-th>
					<uni-th width="100" align="center">社区服务商(S1~S7)</uni-th>
					<!-- <uni-th width="100" align="center">小市场注册人数</uni-th> -->
					<!-- <uni-th width="100" align="center">小市场业绩人数</uni-th> -->
					<!-- <uni-th width="100" align="center">小市场业绩额</uni-th> -->
				</uni-tr>
				<uni-tr v-for="(item, index) in tableData" :key="index">
					<uni-td align="center">{{ item.nickname }}</uni-td>
					<uni-td align="center">{{ item.phone }}</uni-td>
					<uni-td align="center">{{ item.create_time }}</uni-td>
					<uni-td align="center">{{ item.pay_count}}</uni-td>
					<uni-td align="center">{{ item.community_level }}</uni-td>
					<!-- <uni-td align="center">{{item.invites}}</uni-td> -->
					<!-- <uni-td align="center">{{item.referrals}}</uni-td> -->
					<!-- <uni-td align="center">{{item.amount}}</uni-td> -->
				</uni-tr>
			</uni-table>
			<!-- <view class="uni-pagination-box"><uni-pagination show-icon :page-size="pageSize" :current="pageCurrent" :total="total" @change="change" /></view> -->
		</view>
		<home></home>
		<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
	</view>
</template>

<script>
import {  getCheck } from '@/api/user.js';
import parser from "@/components/jyf-parser/jyf-parser";
import { fansStatistics } from '@/api/user.js';
import shareInfo from '@/components/shareInfo';
import home from '@/components/home';
import authorize from '@/components/Authorize';
import { mapGetters } from "vuex";
import { configMap } from "@/utils";
export default {
	components: {
		shareInfo,
		home,
		"jyf-parser": parser,
		authorize,
	},
	data() {
		return {
			isAuto: false, //没有授权的不会自动授权
			isShowAuth: false, //是否隐藏授权
			tableData: [],
			// 每页数据量
			pageSize: 10,
			// 当前页
			pageCurrent: 1,
			realInfo:{},
			// 数据总量
			total: 0,
			loading: false
		}
	},
	computed:{
		...configMap({margin_ico_switch: 0,margin_ico: '',site_name: '',share_pic: ''}, mapGetters(['isLogin','uid','viewColor'])),
	},
	onLoad() {
		this.getCheck();
		this.getData(1)
		// this.getfansStatistics()
	},
	methods: {
		// 分页触发
		change(e) {
			this.$refs.table.clearSelection()
			this.getData(e.current)
		},
		// 获取数据
		getData(pageCurrent) {
			let that = this;
			if (that.isLogin === false) {
				that.$util.Tips({
					title: '未登录'
				});
				setTimeout(() => {
					uni.navigateTo({
						url: '/pages/users/login/index'
					})
				}, 1000); 
			}else{
				that.loading = true
				that.pageCurrent = pageCurrent
				fansStatistics({page:that.pageCurrent,limit:that.pageSize}).then(res => {
						that.tableData = res.data
						// that.total = res.data.count
						that.loading = false
				});
			}
			
		},
		
		getCheck:function(){
			let that = this
			getCheck().then(res =>{
				that.$set(that, 'realInfo', res.data);
				if(that.realInfo.real_name.length == 0 || that.realInfo.card.length == 0 || that.realInfo.age.length == 0 || that.realInfo.spread_phone.length == 0){
					that.$util.Tips({
						title: '请补全身份信息',
						icon: 'error'
					});
					setTimeout(function(){
						uni.reLaunch({
							url: '/pages/users/user_modify_mes/index'
						});
					},500)
				}
			})
		},
	}
}
</script>

<style>
/* #ifndef H5 */
/* page {
	padding-top: 85px;
} */
/* #endif */
.uni-group {
	display: flex;
	align-items: center;
}

 .title {
		margin-bottom: 30rpx;
		font-size: 32rpx;
		color: #282828;
		margin: 4px 0;
		background-color: #fff;
		padding: 16px 14px 6px 14px;
	}
	.info {
		margin-right:20px; 
		font-size: 12px;
		color: #606266;
	}
</style>
