import React from 'react';
import {Modal,Tabs  } from 'antd';
const TabPane = Tabs.TabPane;
import Basic from './detail/basic.jsx';
import ajax from 'jquery/src/ajax/xhr.js';
import $ from 'jquery/src/ajax';
import ContactPerson from './detail/contactPerson.jsx';  //联系人
import Account from './detail/account.jsx';  //账户信息
import Visit from './detail/visit.jsx'; 
import Business from './detail/business.jsx';
import BasicPerson from './detail/basicPerson.jsx';

const IntentionDetail = React.createClass({
	getInitialState(){
		return{
			modalVisible:false,
			switchState:false,
			contactData:[],
			contactState:true,
			IntentionState:false,
			businessState:false,
			visitState:false,
			accountState:false,
			basicState:false
		}
	},
	detailsModal(){
		this.setState({
			basicState:false,
			modalVisible:false
		})
		this.props.closeDesc(false,false)
	},
	//详情tab切换数据处理
	callback(e) {
		if(e == '1') {
			this.setState({
				IntentionState:true,
				contactState:false,
				accountState:false,
				visitState:false,
				businessState:false,
				basicState:true
			})
		}
		if(e == '2') {
			this.setState({
				IntentionState:false,
				contactState:true,
				accountState:false,
				visitState:false,
				businessState:false,
				basicState:false
			})
		}
		if(e == '3') {
			this.setState({
				IntentionState:false,
				contactState:false,
				accountState:true,
				visitState:false,
				businessState:false,
				basicState:false
			})
		}
		if(e == '4') {
			this.setState({
				IntentionState:false,
				contactState:false,
				accountState:false,
				visitState:true,
				businessState:false,
				basicState:false
			})
		}
		if(e == '5') {
			this.setState({
				IntentionState:false,
				contactState:false,
				accountState:false,
				visitState:false,
				businessState:true,
				basicState:false
			})
		}
		this.setState({
			callnub: e,
		})
	},
	//取消函数
	closeDetail(e,s){
		this.setState({
			basicState:false,
			modalVisible:e,
		})
		if(s){
			this.props.closeDesc(false,true)
		}
	},
	componentWillReceiveProps(nextProps) {
		if(nextProps.modalVisible && nextProps.IntentionData.id) {
			this.setState({
				modalVisible:true,
				callnub:(this.props.detailApi.indexOf('Organization'))>0?"2":'1',
			})
		};
		this.setState({
			basicState:nextProps.basicState,
			contactState:nextProps.contactState,
		})
	},
	render(){
		return(
			<div>
				 <Modal	
				      className="customeDetails"				      
			          title="意向客户详情"
			          width='1300px'
			          visible={this.state.modalVisible}
			          onOk={this.detailsModal}
			          onCancel={this.detailsModal}
			          footer=''
			        >				    
					     <Tabs onChange={this.callback} activeKey={this.state.callnub}>
						    {this.props.detailApi.indexOf('Organization')>0?"":
						    <TabPane tab="基本信息" key="1">
						        <BasicPerson 
						        	detailApi={this.props.detailApi}
						        	closeDetail={this.closeDetail}
						        	data={this.props.IntentionData}
						        	IntentionState={this.state.IntentionState}
						        	basicState={this.state.basicState}
						        />
						       
							</TabPane>}
						    <TabPane tab="联系人信息" key="2">
						        <ContactPerson 
							        closeDetail={this.closeDetail}
							        data={this.props.IntentionData}
							        contactState={this.state.contactState}
							    />
						    </TabPane>
						    <TabPane tab="账户信息" key="3">
					    		<Account 
					    			 closeDetail={this.closeDetail}
							         data={this.props.IntentionData}
							         accountState={this.state.accountState}
					    		/>
						    </TabPane>
							<TabPane tab="客户跟进" key="4">
							    <Visit
						     		categoryArr={this.props.categoryArr}
						     		closeDetail={this.closeDetail}
							        data={this.props.IntentionData}
							        visitState={this.state.visitState}
							     />
							</TabPane>						
							<TabPane tab="业务意向" key="5">
							    <Business 
							    	closeDetail={this.closeDetail}
								    data={this.props.IntentionData}
								    businessState={this.state.businessState}
							    />
							</TabPane>
						</Tabs>
    			</Modal>
			</div>
		)
	}
})
export default IntentionDetail;
