<template>
	<view class="content">
		<empty v-if="list && list.length == 0"></empty>
		<view class="" style="background-color: #fff;">
			<view class="content-box" v-for="item in list">
				<view class="content-box-left">
					<view class="left-img">
						<image :src="item.avatar" mode=""></image>
					</view>
					<view class="right-title">
						<!-- <view class="top">{{ item.nickname }}</view> -->
						<view class="bottom">ID:{{ item.uid }}</view>
						<view class="bottom " style="font-size: 24rpx;">手机号:{{ item.phone }}</view>
					</view>
				</view>
				<!-- <view class="content-box-right">
					<view class="state">{{ item.zt == 0 ? '间推' : '直推' }}</view>
					<view class="box-right">
						参与积分:
						<span>{{ item.price }}</span>
					</view>
				</view> -->
			</view>
		</view>
		
	</view>
</template>

<script>
	import {
		myspread,
		tuiguang
	} from '@/api/user.js';
	import empty from '@/components/empty';
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		components: {
			empty
		},
		data() {
			return {
				list: [],
				key: ''
			}
		},
		computed: {
			...mapState(['wlgsbList']),
		},
		onLoad(opt) {
			this.key = opt.key
		},
		onShow() {
			this.loadData();
		},
		onReachBottom() {

		},
		onReady() {

		},
		methods: {
			...mapMutations(['setSbList']),
			//获取收入支出信息
			async loadData(source) {
				let obj = this
				tuiguang().then(res => {
					console.log(res, 'data');
					obj.setSbList(res.data)
					obj.list = res.data[obj.key]
					console.log(obj.list, 'ddddd')
				});
			},
		}
	}
</script>

<style lang="scss">
	.content-box {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 30rpx 0;
		background-color: #fff;
	
		.content-box-left {
			display: flex;
	
			.left-img {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				overflow: hidden;
				image {
					width: 100%;
					height: 100%;
				}
			}
	
			.right-title {
				margin-left: 15rpx;
				display: flex;
				flex-direction: column;
				justify-content: space-around;
	
				.top {
					font-weight: 500;
					font-size: 30rpx;
				}
	
				.bottom {
					color: #999999;
				}
			}
		}
	
		.content-box-right {
			display: flex;
			flex-direction: column;
			width: 230rpx;
			color: #999999;
			.state {
				color: red;
			}
			span {
				color: red;
				font-size: 28rpx;
			}
		}
	}
</style>
