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;