<template>
	<view v-if="isShowPage">
		<view class="con">
			<view class="tits ddflex">团队简介<image src="../static/images/pl_ico.png" class="edit" @click="jumpUrl('/office/createTeam/index?id='+teamInfo.id)" v-if="teamInfo.isCreate == 1"></image></view>
			<view class="bri">
				{{teamInfo.description}}
			</view>
			<view class="leader ddflex" @click="jumpUrl('/topics/home/home?userId='+teamInfo.teamUserDTO.id)">
				<view class="fflex ddflex">
					<image :src="teamInfo.teamUserDTO.avatar?teamInfo.teamUserDTO.avatar:'../../static/images/userimg.png'" mode="aspectFill"></image>
					<view>{{teamInfo.teamUserDTO.realName?teamInfo.teamUserDTO.realName:teamInfo.teamUserDTO.nickName}}</view>
					<text>队长</text>
				</view>
				<view :class="'gz-btn'+(isFollow?' ed':'')" @click.stop="followUser(teamInfo.teamUserDTO.id)" v-if="teamInfo.isCreate != 1">{{isFollow ? '已关注':'关注'}}</view>
			</view>
			<view class="tits">团队成员</view>
			<view class="list" v-if="pageList.length>0">
				<view class="li ddflex" v-for="(item,index) in pageList" :key="index" @click="jumpUrl('/topics/home/home?userId='+item.uid)">
					<image :src="item.avatar?item.avatar:'../../static/images/userimg.png'" mode="aspectFill"></image>
					<view class="fflex tover">{{item.nickName}}</view>
					<view :class="'gz-btn'+(item.isFollow?' ed':'')" @click.stop="followUser(item.uid,index)" v-if="item.uid != userInfo.id">{{item.isFollow == 1 ? '已关注':'关注'}}</view>
					<view class="gz-btn" @click.stop="removeUser(item,index)" v-if="teamInfo.isCreate == 1">移出</view>
				</view>
			</view>
			<view class="nodata" v-else>
				<image :src="picUrlss + 'empty_yq.png'"></image>
				<text>暂无团队成员</text>
			</view>
		</view>
	</view>
</template>

<script>
const app = getApp();
const api = require('../../utils/api.js');
const req = require('../../utils/request.js');
export default {
	data() {
		return {
			picUrlss: req.public.picUrls,
			isShowPage: false,
			opt: {},
			teamInfo: {},
			form: {
				page: 1,
				limit: 10
			},
			isLoad: true,
			pageList: [],
			isFollow: false,
			userInfo: {}
		};
	},
	onLoad(options) {
		this.opt = options;
		this.getPageList();
	},
	onShow() {
		this.userInfo = req.getStorage('userInfo')
		this.getTeamInfo();
	},
	onReachBottom() {
		this.form.page++
		this.getPageList();
	},
	methods: {
		getTeamInfo(){
			req.getRequest(api.user_team_info+this.opt.id,{},data=>{
				this.teamInfo = data;
				uni.setNavigationBarTitle({
					title: data.title
				})
				this.isShowPage = true;
				if(data.isCreate != 1) this.getBehavior();
			})
		},
		getPageList(){
			if (!this.isLoad) return false;
			this.isLoad = false;
			let form = this.form;
			form.userGroupId = this.opt.id;
			req.getRequest(api.user_team_users,form,data=>{
				if (data.list && data.list.length >= 10) this.isLoad = true;
				if (this.form.page > 1) data.list = this.pageList.concat(data.list);
				this.pageList = data.list;
			})
		},
		getBehavior(){
			let params = {
				behavior: 1,
				type: 11,
				bindId: this.teamInfo.teamUserDTO.id
			}
			req.getBehavior(params,suc=>{
				this.isFollow = suc
			})
		},
		followUser(id,index){
			let params = {
				behavior: 1,
				type: 11,
				bindId: id
			}
			req.saveBehavior(params,suc=>{
				console.log('index==',index)
				if((index == '' || index == undefined) && index != 0){
					console.log('this.isFollow==',this.isFollow)
					if(this.isFollow){
						this.isFollow = false
						req.msg('已取消关注')
					}else{
						req.msg('已关注')
						this.isFollow = true
					}
				}else{
					if(this.pageList[index].isFollow){
						req.msg('已取消关注');
						this.pageList[index].isFollow = false;
					}else{
						req.msg('已关注');
						this.pageList[index].isFollow = true;
					}
				}
			})
		},
		removeUser(item,index){
			console.log('====77',item.id)
			req.msgConfirm('确定将该成员移出团队吗？',suc=>{
				req.postRequest(api.user_team_remove,{uid: item.uid,id: item.id,userGroupId: this.teamInfo.id},suc=>{
					req.msg('已移出')
					this.pageList.splice(index,1);
				})
			})
		},
		jumpUrl(url){
			uni.navigateTo({
				url: url
			})
		}
	}
};
</script>

<style>
@import './index.css';
</style>
