import React from 'react'
import ajax from 'jquery/src/ajax/xhr.js';
import $ from 'jquery/src/ajax';
import { Radio, Form, Modal, message, layout, Spin, Button,Tag } from 'antd';

const BusName = React.createClass({
	loadData(ids) {
		this.setState({
			loading: true
		})
		$.ajax({
			method: "post",
			dataType: "json",
			url: globalConfig.context + '/api/admin/ProjectSize/listProject',
			data: {
				pageNo: 1,
				pageSize: 100,
				cid: ids,
			},
			success: function(data) {
				let listArr = [];
				let thedata = data.data;
				if(!thedata) {
					if(data.error && data.error.length) {
						message.warning(data.error[0].message);
					};
					thedata = {};
				};
				if(data.data && data.data.list) {
					for(let i = 0; i < data.data.list.length; i++) {
						let thisdata = data.data.list[i];
						listArr.push({
							id: thisdata.id,
							name: thisdata.bname,
						});
					};
				}
				this.setState({
					projectData: listArr,
				});
			}.bind(this),
		}).always(function() {
			this.setState({
				loading: false
			});
		}.bind(this));
	},
	getLockedProject(ids) {
		this.setState({
			loading: true
		})
		$.ajax({
			method: "get",
			dataType: "json",
			url: globalConfig.context + '/api/admin/customer/getLockedProject',
			data: {
				uid: ids
			},
			success: function(data) {
				let theData = data.data,
					businessProjectName = [];
				if(!theData) {
					if(data.err && data.err.length) {
						message.warning(data.error[0].message);
					}
				} else {
					theData.map(item => {
						businessProjectName.push(item.businessProjectName)
					})
					this.setState({
						businessData: businessProjectName
					})
				}
			}.bind(this)
		}).always(function() {
			this.setState({
				loading: false
			})
		}.bind(this));
	},
	getInitialState() {
		return {
			busModul: false
		}
	},
	visitCancel() {
		this.setState({
			busModul: false
		})
		this.props.closeBus(null, false, false)
	},
	selFn() {
		if(!this.state.contactType) {
			message.warning('未选定项目!')
			return false;
		};
		this.setState({
			busModul: false
		});
		let idData = {};
		idData.id = this.state.contactType;
		this.state.projectData.map(item => {
			if(this.state.contactType == item.id) {
				idData.name = item.name
			}
		})
		this.props.closeBus(idData, false, true);
	},
	componentWillReceiveProps(nextProps) {
		if(nextProps.busModul) {
			this.setState({
				busModul: true,
				loading: false
			})
			this.getLockedProject(nextProps.mid);
			this.loadData(nextProps.businessId);
		};
	},
	render() {
		const formItemLayout = {
			labelCol: {
				span: 4
			},
			wrapperCol: {
				span: 18
			},
		};
		const projectData = this.state.projectData || [];
		const businessData = this.state.businessData ||[]
		return(
			<Modal	
			      className="customeDetails"
			      footer=''
		          title="项目名称"
		          width='600px'
		          visible={this.state.busModul}
		          onOk={this.visitCancel}
				  onCancel={this.visitCancel}							          							          
		        >	
			        <Form layout="horizontal" id="demand-form" >
		    			<Spin spinning={this.state.loading}>
		    			   	<div className="clearfix">
		    			   		<Form.Item 
		                            {...formItemLayout}
		                            label="已签单业务" >
		    			   			{
		    			   				businessData.map((item,index)=>{
		    			   					console.log(item)
		    			   					return <Tag key={index} color='#2db7f5'>{item}</Tag>
		    			   				})
		    			   			}
		    			   			<span>{}</span>
				           		</Form.Item>
		    			   		<Form.Item 
		                            {...formItemLayout}
		                            label="项目名称" >
		    			   			<Radio.Group value={this.state.contactType} onChange={(e) => {
									        this.setState({ contactType: e.target.value }) 
					                    }}>
											{
												projectData.map((item,index)=>{
													return <Radio key={index} value={item.id}>{item.name}</Radio>
												})
											}
					                </Radio.Group>
				           		</Form.Item>
				           		<Form.Item wrapperCol={{ span: 12, offset: 4 }}>
		    			   			<Button onClick={this.selFn} type='primary'>选定</Button>
		    			   			<Button onClick={this.visitCancel} style={{marginLeft:'40px'}}>取消</Button>
				           		</Form.Item>
				            </div>
				        </Spin>
					</Form>
			</Modal>
		)
	}
})
export default BusName;