import React from 'react'
import ajax from 'jquery/src/ajax/xhr.js';
import $ from 'jquery/src/ajax';
import {Modal,Form,layout,Radio,Button,Input,Spin,Table,Select,Popconfirm,message} from 'antd';
import {intentionalService,newFollow,customerStatus} from '@/dataDic.js';
import {getCompanyIntention,getfllowSituation,getcustomerStatue} from '@/tools.js';
const FormItem =Form.Item;
import AddContact from './followDetail/addContact.jsx';

const FollowDetail = React.createClass({
	getInitialState(){
		return{
			visitModul:false,
			loading:false,
			data:[],
			busModul:false,
			intentionList:[
				{
					title: '业务名称',
					dataIndex: 'businessVarietiesName',
					width:120,
					key: 'businessVarietiesName'
				},
				{
					title: '项目名称',
					dataIndex: 'businessProjectName',
					key:'businessProjectName',
					width:120
				},
				{
					title: '最新进度',
					width:120,
					dataIndex: 'followSituation',
					key: 'followSituation',
					render:text=>{return getfllowSituation(text) }
				}, {
					title: '最新状态',
					width:120,
					dataIndex: 'customerStatus',
					key: 'customerStatus',
					render:text=>{return getcustomerStatue(text) }
				}, {
					title: '跟进说明',
					width:120,
					dataIndex: 'remarks',
					key: 'remarks',
					
				}, {
					title: '操作',
					width:120,
					dataIndex: 'rrr',
					key: 'rrr',
					render: (text, record, index) => {
						return <div>
                          	<Popconfirm title="再次签单?" onConfirm={(e)=>{this.intentionDelet(record,index)}} okText="再次签单" cancelText="取消">
							    <Button style={{marginRight:'10px',color:'#ffffff',background:'#58a3ff',border:'none'}}>签单</Button>
							</Popconfirm>
                        </div>
					}
				}
			],
		}
	},
	//拜访意向服务列表单个删除
	intentionDelet(e, index) {
		this.setState({
				loading:true,
				selectedRowKeys: [],
			});
			$.ajax({
				method: "get",
				dataType: "json",
				crossDomain: false,
				url: globalConfig.context + "/api/admin/customer/againProjectTask",
				data: {
					uid: e.uids,
					projectId:e.businessName,
				}
			}).done(function(data) {
				if(!data.error.length) {
					message.success('签单成功');
					if(this.props.isFlag) {
						this.deletelist(this.props.followData.id)
					}else {
						this.props.loadData();
					}
					this.setState({
						loading: false,
					});
				} else {
					message.warning(data.error[0].message);
				};
				//this.deletelist(this.props.followData.id)
			}.bind(this));
		
	},
	//拜访modul函数
	visitOk(e) {
		this.setState({
			addcontactModul:false,
			visitModul: false
		});
	},
	visitCancel(e) {
		this.setState({
			addcontactModul:false,
			visitModul: false
		});
		this.props.closeDesc(false,false)
	},
	//获取联系人下拉框
	getNewWoman(ids) {
		this.state.data = []
		$.ajax({
			method: "get",
			dataType: "json",
			crossDomain: false,
			url: globalConfig.context + "/api/admin/customer/findCustomerContacts",
			data: {
				uid: ids,
			},
			success: function(data) {
				let theArr = [];
				let thedata = data.data;
				if(!thedata) {
					if(data.error && data.error.length) {
						message.warning(data.error[0].message);
					};
					thedata = {};
				};
				var telNum = [];
				var contactIds = [];
				thedata.map(function(item, index) {
					contactIds.push(thedata[index].id);
					telNum.push(thedata[index].mobile);
				});
				for(let item in data.data) {
					let theData = data.data[item];
					theArr.push(
						<Select.Option value={item} key={theData.name}>{theData.name}</Select.Option>
					);
				};
				this.setState({
					contactsIdArr: thedata,
					telNum: telNum,
					orderStatusOption: theArr,
				});
			}.bind(this),
		}).always(function() {
			this.setState({
				deletId: ids,
				loading: false
			});
		}.bind(this));
	},
	//刷新新增拜访记录刷新
	deletelist(e) {
		this.setState({
			loading:true
		})
		$.ajax({
			method: "get",
			dataType: "json",
			url: globalConfig.context + '/api/admin/customer/toAddFollowOnLock',
			data: {
				uid: e,
			},
			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.userBusinessList[0]!=null) {
					for(let i = 0; i < data.data.userBusinessList.length; i++) {
						let thisdata = data.data.userBusinessList[i];
						if(thisdata!=null){
							listArr.push({
								key:i,
								id:thisdata.businessId,
								businessName:thisdata.businessProjectId,
								businessVarietiesName:thisdata.businessVarietiesName,
								businessProjectName:thisdata.businessProjectName,
								followSituation: thisdata.followSituation==null?undefined : String(thisdata.followSituation),
								customerStatus: thisdata.customerStatus==null?undefined : String(thisdata.customerStatus),
								remarks: thisdata.remarks,
								uid:thisdata.uid,
								uids:data.data.uid
								
							});
						}
					};
				}
				
				this.setState({
					contacts: thedata.contacts,
					uids:data.data.uid,
					uid: thedata.uid,
					data: listArr,
					followTime: thedata.followTime,
					remarks: thedata.remarks,
				});
			}.bind(this),
		}).always(function() {
			this.setState({
				loading: false
			});
		}.bind(this));
	},
	//当选择联系人的列表变化时,则执行
	hundleName(e) {
		let changNub = this.state.telNum[e];
		this.setState({
			nub: this.state.telNum[e],
			lastName: e,
		});
	},
	//点击添加联系人
	newContacts() {
		this.setState({
			busModul:false,
			uids: this.state.uid,
			addcontactModul: true
		});
	},
	//页面刷新
	closeFollow(e, s) {
		this.state.addcontactModul=false;
		this.state.visitModul = true;
		if(s) {
			this.getNewWoman(this.props.followData.id);
			this.deletelist(this.props.followData.id)
		};
	},
	//详情保存
	visitSubmit(e){
		e.preventDefault();
		let GlossoryId=false;
		this.state.data.map(function(item) {
			if(!item.followSituation||!item.customerStatus||!item.businessName) {
				GlossoryId = true
			}
		})
		if(this.state.contactType == undefined) {
			message.warning('请选择拜访方式')
			return false;
		};
		if(this.state.lastName == undefined) {
			message.warning('请选择联系人')
			return false;
		}
		if(this.state.data.length&&GlossoryId) {
			message.warning("项目名称/最新进度/最新状态不能为空!")
			return false;
		};
		this.setState({
			loading: true
		});
		let dataList=this.state.data,
			idsList=[];
		dataList.map((item,index) => {
			idsList.push({
				businessId:item.id||'',
				businessProjectId:item.businessName,
				customerStatus:item.customerStatus,
				followSituation:item.followSituation,
				remarks:item.remarks||''
			})
		});
		let contactsId = '';
		let conts = this.state.lastName;
		contactsId = this.state.contactsIdArr[conts].id;
		//新增
		$.ajax({
			method: "post",
			dataType: "json",
			url:  globalConfig.context + '/api/admin/customer/addFollow',
			data: {
				userBusinessList: JSON.stringify(idsList),
				uid: this.state.uid,
				ocbId: contactsId,
				contactType: this.state.contactType,
				result: this.state.result,
				followTime: this.state.followTime,
			}
		}).done(function(data) {
			this.setState({
				loading: false
			});
			if(!data.error.length) {
				message.success('保存成功!');
				this.props.closeDesc(false,true);
				this.visitCancel();
				this.props.loadData();
			} else {
				message.warning(data.error[0].message);
			}
		}.bind(this));
	},
	componentWillReceiveProps(nextProps) {
        if (nextProps.visitModul && nextProps.followData.id) {
            this.setState({
				result: '',
				contactType: undefined,
				visitModul: true,
				loading: true,
				lastName:undefined,
				nub:'',
				busModul:false,
				addcontactModul:false
			})
			this.getNewWoman(nextProps.followData.id);
			this.deletelist(nextProps.followData.id)
        };
    },
	render() {
		const formItemLayout = {
			labelCol: { span: 8 },
			wrapperCol: { span: 14 },
		};
		return (
      <div>
        <Modal
          className="customeDetails"
          footer=""
          title="客户跟进详情"
          width="1000px"
          visible={this.state.visitModul}
          onOk={this.visitOk}
          onCancel={this.visitCancel}
        >
          <Form
            layout="horizontal"
            id="demand-form"
            onSubmit={this.visitSubmit}
          >
            <Spin spinning={this.state.loading}>
              <div className="clearfix">
                <FormItem
                  labelCol={{ span: 4 }}
                  wrapperCol={{ span: 20 }}
                  label="跟进方式"
                >
                  <Radio.Group
                    value={this.state.contactType}
                    onChange={(e) => {
                      this.setState({ contactType: e.target.value });
                    }}
                  >
                    <Radio value={0}>外出</Radio>
                    <Radio value={1}>电话</Radio>
                    <Radio value={2}>QQ</Radio>
                    <Radio value={3}>微信</Radio>
                    <Radio value={4}>邮箱</Radio>
                  </Radio.Group>
                  <span className="mandatory">*</span>
                </FormItem>
                <div className="clearfix">
                  {this.state.contacts ? (
                    <span></span>
                  ) : (
                    <FormItem
                      className="half-item"
                      {...formItemLayout}
                      label="联系人"
                    >
                      <Select
                        placeholder="选择联系人"
                        style={{ width: 140 }}
                        value={this.state.lastName}
                        onChange={this.hundleName}
                      >
                        {this.state.orderStatusOption}
                      </Select>
                      <span className="mandatory">*</span>
                    </FormItem>
                  )}
                  <FormItem className="half-item" {...formItemLayout}>
                    <Button
                      type="primary"
                      onClick={this.newContacts}
                      style={{ marginLeft: "100px" }}
                    >
                      添加新联系人
                    </Button>
                  </FormItem>
                  <FormItem
                    className="half-item"
                    {...formItemLayout}
                    label="联系电话"
                  >
                    <span>{this.state.nub}</span>
                  </FormItem>
                  <FormItem
                    className="half-item"
                    {...formItemLayout}
                    label="跟进时间"
                  >
                    <span>{this.state.followTime}</span>
                  </FormItem>
                </div>
                <div className="clearfix">
                  <FormItem
                    labelCol={{ span: 4 }}
                    wrapperCol={{ span: 16 }}
                    label="跟进备注"
                  >
                    <span className="mandatory">*</span>
                    <Input
                      type="textarea"
                      rows={4}
                      value={this.state.result}
                      placeholder="请输入客户沟通情况与跟进信息,不少于10字"
                      required="required"
                      onChange={(e) => {
                        this.setState({ result: e.target.value });
                      }}
                    />
                  </FormItem>
                </div>
                <div className="clearfix">
                  <div
                    style={{
                      fontSize: "18px",
                      marginLeft: "100px",
                      marginTop: "15px",
                      marginBottom: "10px",
                    }}
                  >
                    业务意向
                  </div>
                  <div className="clearfix">
                    <Spin spinning={this.state.loading}>
                      <Table
                        pagination={false}
                        columns={this.state.intentionList}
                        dataSource={this.state.data}
                      />
                    </Spin>
                  </div>
                </div>
              </div>
              <FormItem wrapperCol={{ span: 12, offset: 6 }}>
                <Button
                  type="primary"
                  size="large"
                  htmlType="submit"
                  style={{ marginRight: "150px", marginTop: "20px" }}
                >
                  保存
                </Button>
                <Button size="large" onClick={this.visitCancel}>
                  取消
                </Button>
              </FormItem>
            </Spin>
          </Form>
        </Modal>
        <AddContact
          addcontactModul={this.state.addcontactModul}
          uids={this.state.uids}
          closeFollow={this.closeFollow}
        />
      </div>
    );
	}
})
export default FollowDetail;