import React from 'react';
import { Spin, Button, Tabs, message, Modal } from 'antd';
import $ from 'jquery/src/ajax';
import { Link } from 'react-router';
import '../content.less';
import './content.less';
import Collection from './collection';
import defaultAvatar from '../../../../image/avatarImg.png'

const Content = React.createClass({
    getInitialState () {
        return {
            loading: false,
            visible: false
        };
    },
    getData () {
        if(this.state.nickname){return;}
        this.setState({
            loading: false
        });
        $.ajax({
            method: "get",
            dataType: "json",
            url: globalConfig.context + "/api/user/homePage"
        }).done(function (data) {
            if (data.error && data.error.length) {
                message.warning(data.error[0].message);
            } else {
                this.setState({
                    achievementNum: data.data.achievementNum,
                    copyrightNum: data.data.copyrightNum,
                    demandNum: data.data.demandNum,
                    gradeName: data.data.gradeName,
                    email: data.data.email,
                    intellectualPropertyNum: data.data.intellectualPropertyNum,
                    logoUrl: data.data.logoUrl,
                    level: data.data.lvl,
                    authentication:data.data.authentication,  //0-专家  1--顾问
                    nickname: data.data.nickname,
                    number: data.data.number,
                    auditStatus: data.data.auditStatus,
                    patentNum: data.data.patentNum,
                    personPortraitUrl: data.data.headPortraitUrl,
                    techProjectNum: data.data.techProjectNum,
                    type: data.data.type,
                    uid: data.data.uid,
                    expert:data.data.expert,
                    visible: (data.data.auditStatus!='0')? false : true
                })
            }
        }.bind(this)).always(function () {
            this.setState({
                loading: false
            });
        }.bind(this));
    },
    jump(){
        window.location.hash='/personal';
    },
    componentWillMount () {
        this.getData();
    },
    render () {
        return (
            <Spin spinning={this.state.loading} className='spin-box'>
                <div className="index-content">
                    <div className="index-userdata clearfix">
                        <p className="acc-title">
                            欢迎,
                            <span>{this.state.nickname}</span>
                        </p>
                        <div className="userdata-img">
                            {this.state.personPortraitUrl || this.state.logoUrl ?
                                <img src={globalConfig.avatarHost + "/upload" + (this.state.type == 0 ? this.state.personPortraitUrl : this.state.logoUrl)} alt="" />
                                : <img src={defaultAvatar} alt="" />}
                        </div>
                        <div className="userdata-content">
                            {(() => {
                                if (this.state.type == '0') {
                                    if(this.state.auditStatus=='2'){
                                       
                                        if(this.state.expert=='2'){
                                            return <p className="userdata-lvl">个人用户(<span style={{color:'#5cb85c'}}>已认证顾问</span>)</p>
                                        }else if(this.state.expert=='1'){
                                            return <p className="userdata-lvl">个人用户(<span style={{color:'#5cb85c'}}>已认证专家</span>)</p>
                                        }
                                    }else{
                                        if(this.state.auditStatus=='1'){
                                            return <p className="userdata-lvl">个人用户(<span style={{color:'#5cb85c'}}>认证审核中</span>)</p>
                                        }else if(this.state.auditStatus=='3'){
                                            return <p className="userdata-lvl">个人用户(<span style={{color:'#f00'}}>认证失败</span>)<Button type="primary" style={{margin:10}} onClick={this.jump}>重新认证</Button></p>
                                        }else{
                                            return <p className="userdata-lvl">个人用户(<span style={{color:'#f00'}}>未认证</span>)<Button type="primary" style={{margin:10}} onClick={this.jump}>去认证</Button></p>
                                        }
                                        
                                    }
                                } else if(this.state.type == '1'){
                                    return <p className="userdata-lvl"><span>企业用户</span></p>
                                }
                            })()}
                            <div>
                                {
                                    (()=>{
                                            if(this.state.type=='0'){
                                                return <p><Link to="/personal">填写完整资料</Link>，有助于提高您的资信</p>
                                            }
                                            if(this.state.type=='1'){
                                                return <p><Link to="/unit">填写完整资料</Link>，有助于提高您的资信</p>
                                            }
                                    })()
                                }
                            </div>
                        </div>
                    </div>
                    <div className="index-activity">
                        <Collection nub={1}/>
                    </div> 
                </div>
                <Modal maskClosable={false}
                    title="认证提示"
                    visible={this.state.visible}
                    onCancel={() => {
                        this.setState({
                            visible: false,
                        });
                    }}
                    width='400px'
                    footer={[]} >
                    <p style={{ textAlign: 'center' }}>
                        <span>您还未进行 ( 专家 / 顾问 ) 认证，请完成认证，为您提供更多服务</span>
                    </p>
                    <div style={{ marginTop: '20px', textAlign: 'center' }}>
                        <Button type="primary" style={{marginRight:15}}><Link to="/personal">专家认证</Link></Button>
                        <Button type="primary"><Link to="/personal">顾问认证</Link></Button>
                    </div>
                </Modal>
            </Spin>
        )
    }
});

export default Content;