fanyunAi/pages/user/commission/team.vue

<!-- 分享记录 -->
<template>
	<view class="">
		<view style="color: #000000;">
			<tn-nav-bar backgroundColor="#ffffff" :bottomShadow="false">我的团队</tn-nav-bar>
			<!-- <view :style="{height: tobheight+'px'}"></view> -->
		</view>
		<z-paging ref="paging" refresher-complete-delay="200" v-model="jobList" @query="queryList">
			<view slot="top" class="z_tabs" :style="{ marginTop: tobheight + 'px' }"></view>
			<view class="page_box">
				<!-- 标题栏 -->
				<view class="head_box">
					<view class="nav-box">
						<!-- 标题栏 -->
						<!-- <shopro-navbar back-icon-color="#fff" :background="{}" :backTextStyle="{ color: '#fff', fontSize: '40rpx', fontWeight: '500' }" backText="分享记录"></shopro-navbar> -->
					</view>
					<!-- 分类tab -->
					<view class="tab-box u-flex">
						<view class="tab-item u-flex-1" v-if="setting.level > index" v-for="(tab, index) in tabsList"
							:key="tab.value" @tap="onTab(index)">
							<view class="u-flex">
								<text class="tab-title"
									:class="{ 'title-active': tabCurrent === index }">{{ index+1 }}级团队</text>

								<text v-if="tabCurrent == index">({{total}}人)</text>

							</view>

							<text class="underline" :class="{ 'underline-active': tabCurrent === index }"></text>
						</view>
					</view>
				</view>

				<view class="content_box">
					<view class="log-list u-flex" v-for="(item,index) in jobList" :key="index">
						<view class="log-avatar-wrap">
							<u-avatar :src="item.avatar" size="30"></u-avatar>
							<!-- <image class="log-avatar" :src="item.avatar" mode=""></image> -->
						</view>
						<view class="item-right">
							<view class="name">{{ item.nickname?item.nickname+'('+item.id_number+')':'未注册用户'}}</view>

							<view class="item-bottom u-flex u-row-between">
								<view class="time">{{ item.create_time }}</view>
								<view class="from-text">来自链接分享</view>
							</view>
							<view class="teamerDetail">
								<view class="item">
									<view class="num">
										{{item.question_count}}
									</view>
									<view class="txt">
										问答次数
									</view>
								</view>
								<view class="item">
									<view class="num">
										{{item.gallery_count}}
									</view>
									<view class="txt">
										绘图次数
									</view>
								</view>
								<view class="item">
									<view class="num">
										{{item.digit_count}}
									</view>
									<view class="txt">
										数字人次数
									</view>
								</view>
								<view class="item">
									<view class="num">
										{{Number(item.payTotal).toFixed(2) }}
									</view>
									<view class="txt">
										充值金额
									</view>
								</view>
							</view>
						</view>
					</view>

					<!-- <scroll-view scroll-y="true" @scrolltolower="loadMore" class="scroll-box"> -->
					<!-- 分享记录列表 -->
					<!-- <view class="log-list u-flex" v-for="item in shareLogList" :key="item.userinfo.id">
					<view class="log-avatar-wrap"><image class="log-avatar" :src="item.userinfo.avatar" mode=""></image></view>

					<view class="item-right">
						<view class="name">{{ item.userinfo.nickname }}</view> -->
					<!-- <view class="content u-flex">
							<view class="content-img-wrap" v-if="item.type_data"><image class="content-img" :src="item.type_data.image" mode=""></image></view>

							<view class="content-text">{{ item.msg }}</view>
						</view> -->
					<!-- <view class="item-bottom u-flex u-row-between">
							<view class="time">{{ item.create_time }}</view>
							<view class="from-text">来自链接分享</view>
						</view>
					</view>
				</view> -->
					<!-- 缺省页 -->
					<!-- <shopro-empty v-if="isEmpty" :image="$IMG_URL + '/imgs/empty/no_data.png'" tipText="暂无数据"></shopro-empty> -->
					<!-- 更多 -->
					<!-- <u-loadmore v-if="shareLogList.length" height="0rpx" :status="loadStatus" icon-type="flower" color="#ccc" />
			</scroll-view> -->
				</view>

				<view class="foot_box"></view>
			</view>
		</z-paging>
		<wike-loading-page :isLoading="isLoading"></wike-loading-page>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	export default {
		data() {
			return {
				jobList: [],
				isLoading: true,
				shareLogList: [], //分享记录
				tabCurrent: 0, //默认
				tabsList: [
					// {
					// 	name: '全部',
					// 	value: 'all'
					// },
					// {
					// 	name: '名片',
					// 	value: 'index'
					// },
					// {
					// 	name: '商品',
					// 	value: 'goods'
					// },
					// {
					// 	name: '拼团',
					// 	value: 'groupon'
					// }
					{
						name: '一级团队',
						value: 'first'
					},
					{
						name: '二级团队',
						value: 'second'
					},
					{
						name: '三级团队',
						value: 'third'
					}
				],
				typeObj: {
					index: '名片',
					goods: '商品',
					groupon: '拼团',
					link: '链接'
				},
				loadStatus: 'loadmore', //loadmore-加载前的状态，loading-加载中的状态，nomore-没有更多的状态
				currentPage: 1,
				lastPage: 1,
				level: 1,
				isEmpty: false,
				tobheight: 45,
				platform: this.$platform.get(),
				setting: {},
				total: 0
			};
		},
		computed: {
			...mapGetters(['appInfo', 'userInfo'])
		},
		onLoad() {
			const that = this;
			if (this.platform == 'wxMiniProgram') {
				var menumtop = uni.getMenuButtonBoundingClientRect().top - uni.getSystemInfoSync().statusBarHeight;
				var paddingtop = uni.getSystemInfoSync().statusBarHeight + menumtop;
				this.tobheight = menumtop + paddingtop + uni.getMenuButtonBoundingClientRect().height;
			}
			this.getSetting();
		},
		// onPullDownRefresh() {
		// 	this.currentPage = 1;
		// 	this.lastPage = 1;
		// 	this.shareLogList = [];
		// 	this.getShareLog();
		// },
		methods: {
			queryList(pageNo, pageSize) {
				//这里的pageNo和pageSize会自动计算好，直接传给服务器即可
				const params = {
					page: pageNo,
					limit: pageSize,
					level: this.level
				};
				this.$http('commission.teamList', params).then(res => {
					if (res.code == 0) {

						this.total = res.data.total

						this.$refs.paging.complete(res.data.data);
						this.isLoading = false;
					}
				});
			},
			getSetting() {
				this.$http('conf.getGroupConf', {
					group: 'system.commission'
				}).then(res => {
					if (res.code == 0) {
						uni.setNavigationBarTitle({
							title: this.appInfo.site_name
						});
						this.setting = res.data
					}
				});
			},
			// 切换分类
			onTab(index) {
				this.tabCurrent = index;
				this.level = index + 1;
				// this.shareLogList = [];
				// this.getShareLog();
				// if (this.tabCurrent !== type) {
				// 	this.tabCurrent = type;
				// this.currentPage = 1;
				// this.lastPage = 1;
				// 	this.shareLogList = [];
				// 	this.getShareLog();
				// }
				this.jobList = [];
				this.$refs.paging.reload(true);
			},

			// 分享记录数据
			// getShareLog() {
			// 	let that = this;
			// 	that.loadStatus = 'loading';
			// 	that.$http('commission.teamList', {
			// 		level: that.level,
			// 		page: that.currentPage
			// 	}).then(res => {
			// 		uni.stopPullDownRefresh();
			// 		if (res.code === 0) {
			// 			that.shareLogList = [...that.shareLogList, ...res.data.data];
			// 			that.lastPage = res.data.last_page;
			// 			that.isEmpty = !that.shareLogList.length;
			// 			that.loadStatus = that.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
			// 		}
			// 	});
			// },

			// 加载更多
			// loadMore() {
			// 	if (this.currentPage < this.lastPage) {
			// 		this.currentPage += 1;
			// 		this.getShareLog();
			// 	}
			// }
		}
	};
</script>

<style lang="scss" scoped>
	@import './team.scss';
</style>