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

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,
                        expert:thisdata.expert,
                        consultantType:thisdata.consultantType,
                        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
        })
        this.loadDataService(current)
    }
    jump(item){
        let url='';
        if(item.consultantType=='4'){
            url = globalConfig.context+`/portal/service/safeguardingDetail?id=${item.id}`;
        }else{
            switch(item.expert){
                case 1:
                    url = globalConfig.context+`/portal/subscriberDetail.html?uid=${item.id}&type=0`;
                    break;
                case 2:
                    url = globalConfig.context+`/portal/adviser/adviserDetail?id=${item.id}`;
                    break;
                default:return;
            }
        }
        window.open(url);
    }
	render() {
        const dataList =this.state.dataList || [];
		return <div className="user-content">
            <div className="title" >
                我的关注
            </div>
            <div>
                <p style={{fontSize:16,marginBottom:15}}>智者,您困惑中的指明灯</p>
            </div> 
            <div className="imgList">
                <Spin spinning={this.state.loading}>
                    {dataList.length?<Row>
                        {dataList.map((item,index)=>{
                            return<Col span={5} key={index} onClick={(e)=>{this.jump(item)}}>
                                    <div className="img">
                                        <div className="imgHeader">
                                            <div className={item.expert=='1'?"popImgBj":'adviserInit'}>
                                                 {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:'佚名'}<span>{item.expert==1?' - (专家)':' - ('+getAdviserType(item.consultantType)+')'}</span></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={(e,pageSize)=>{this.onShowSizeChange(e,pageSize)}}/>:''}
            </div>
        </div>
	}
}

export default Collection;