import React, { Component } from 'react';
import { Button,Radio ,message,Row,Col, Spin,Pagination} from 'antd';
import axios from 'axios';
import './collection.less';

class Collection extends Component {
	constructor(props) {
		super(props);
		this.state = {
            loading:false,
            current:1,
            nub:'1'
        };
    }
    //服务
    loadDataService(page){
        this.setState({
            loading:true,
        })
        let url = globalConfig.context +  '/api/user/portal/listInterestedInExpert' 
        axios.get(url,{
            params:{
                pageNo:page||1,
                pageSize:8
            }
        })
        .then(data=>{
            let theData=data.data.data,
                theArr = [];
            if (!data.data || !data.data.data.list) {
                if (data.data.error && data.data.error.length) {
                    message.warning(data.data.error[0].message);
                };
            } else {
                for (let i = 0; i < theData.list.length; i++) {
                    let thisdata = theData.list[i];
                    theArr.push({
                        key: i,
                        id: thisdata.uid,
                        name:thisdata.username,
                        introduce:thisdata.introduction&&thisdata.introduction.length>40?thisdata.introduction.substr(0,40)+'...':thisdata.introduction,
                        img: thisdata.headPortraitUrl, //编号
                    });
                };
            };
            this.setState({
                loading:false,
                dataList:theArr,
                total:data.data.data.totalCount
            })
        })
    }
    componentWillMount(){
        this.loadDataService(1)
    }
    tabFun(e){
       this.setState({ nub: e.target.value })
       switch(e.target.value){
           case '1':
                this.loadDataService(1)
                break;
       }
    }
    //分页
    onShowSizeChange(current, pageSize){
        this.setState({
            current:current,
            pageSize:pageSize
        })
    }
    jump(item){
        let url='';
        switch(this.state.nub){
            case '1':
                url = globalConfig.context+`/portal/subscriberDetail.html?uid=${item.id}&type=0`;
            break;
        }
        window.open(url);
    }
	render() {
        const dataList =this.state.dataList || [];
        console.log(dataList)
		return <div className="user-content">
            <div className="title" >
                我的关注
            </div>
            {/* <div>
                <Radio.Group className="btnGroup" value={this.state.nub} onChange={this.tabFun.bind(this)}>
                    <Radio.Button value="1">智者</Radio.Button>
                </Radio.Group>
            </div> */}
            <div className="imgList">
                <Spin spinning={this.state.loading}>
                    {dataList.length?<Row>
                        {dataList.map((item,index)=>{
                            return<Col span={6} key={index} onClick={(e)=>{this.jump(item)}}>
                                    <div className="img">
                                        <div className="imgHeader">
                                            <div className="popImgBj">
                                                 {item.img?<img src={globalConfig.avatarHost+'/upload'+item.img}  alt=""/>:''}
                                            </div>
                                            <div className="divP"><p>{item.introduce}</p></div>
                                        </div>  
                                        <p className="txt">{item.name?item.name:'佚名'}</p>
                                    </div>
                                </Col>
                        })
                        }   
                    </Row>:
                    <Row style={{color:'#333'}}>暂无数据</Row>}
                </Spin>
                {this.state.total?<Pagination className="page" pageSize={8} current={this.state.current} total={this.state.total} onChange={this.onShowSizeChange.bind(this)}/>:''}
            </div>
           
        </div>
	}
}

export default Collection;
