visitDetail.jsx 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
  1. import React from 'react'
  2. import ajax from 'jquery/src/ajax/xhr.js';
  3. import $ from 'jquery/src/ajax';
  4. import {Modal,Form,layout,Radio,Button,Input,Spin,Table,Select,Popconfirm,message} from 'antd';
  5. import {intentionalService,newFollow,customerStatus} from '@/dataDic.js';
  6. import {getCompanyIntention,getfllowSituation,getcustomerStatue} from '@/tools.js';
  7. const FormItem =Form.Item;
  8. const VisitDetail = React.createClass({
  9. getInitialState(){
  10. return{
  11. visitModul:false,
  12. loading:false,
  13. data:[],
  14. //业务意向列表
  15. intentionList:[
  16. {
  17. title: '业务名称',
  18. dataIndex: 'businessVarietiesName',
  19. width:120,
  20. key: 'businessVarietiesName'
  21. },
  22. {
  23. title: '项目名称',
  24. dataIndex: 'businessProjectName',
  25. key:'businessProjectName',
  26. width:120
  27. },
  28. {
  29. title: '最新进度',
  30. width:120,
  31. dataIndex: 'followSituation',
  32. key: 'followSituation',
  33. render: (text, record, index) => {
  34. return <span>{getfllowSituation(text)}</span>
  35. }
  36. }, {
  37. title: '最新状态',
  38. width:120,
  39. dataIndex: 'customerStatus',
  40. key: 'customerStatus',
  41. render: (text, record, index) => {
  42. return <span>{getcustomerStatue(text)}</span>
  43. }
  44. }, {
  45. title: '跟进说明',
  46. width:120,
  47. dataIndex: 'remarks',
  48. key: 'remarks',
  49. render: (text, record, index) => {
  50. return(
  51. <div>
  52. <span title={text}>{text&&text.length>14?(text.substr(0,14)+'…'):text}</span>
  53. </div>
  54. )
  55. }
  56. }, {
  57. title: '操作',
  58. width:120,
  59. dataIndex: 'rrr',
  60. key: 'rrr',
  61. render: (text, record, index) => {
  62. return <div>
  63. <Popconfirm title="是否删除?" onConfirm={(e)=>{this.intentionDelet(record,index)}} okText="删除" cancelText="不删除">
  64. <Button style={{marginRight:'10px',color:'#ffffff',background:'#f00',border:'none'}}>删除</Button>
  65. </Popconfirm>
  66. </div>
  67. }
  68. }
  69. ],
  70. }
  71. },
  72. //选择子项目
  73. businessFn(record,index){
  74. if(!record.businessGlossoryId){
  75. message.warn('请先选择业务名称!');
  76. return;
  77. }
  78. this.setState({
  79. businessId:record.businessGlossoryId,
  80. busModul:true,
  81. index:index,
  82. addcontactModul:false
  83. })
  84. },
  85. closeBus(data,e,s){
  86. this.state.addcontactModul=e;
  87. this.state.busModul=false;
  88. if(s){
  89. this.state.data[this.state.index].businessName=data;
  90. this.setState({
  91. busModul:false,
  92. data:this.state.data
  93. })
  94. }
  95. },
  96. //进入修改拜访记录
  97. visitModify(e) {
  98. this.setState({
  99. visitModul: true,
  100. loading: true
  101. });
  102. $.ajax({
  103. method: "get",
  104. dataType: "json",
  105. url: globalConfig.context + '/api/admin/customer/toUpdateFollow',
  106. data: {
  107. followId: e,
  108. },
  109. success: function(data) {
  110. let theArr = [];
  111. let thedata = data.data;
  112. if(!thedata) {
  113. if(data.error && data.error.length) {
  114. message.warning(data.error[0].message);
  115. };
  116. thedata = {};
  117. };
  118. for(let i = 0; i < data.data.userBusinessList.length; i++) {
  119. let thisdata = data.data.userBusinessList[i];
  120. theArr.push({
  121. id: thisdata.businessId,
  122. businessName:thisdata.businessProjectId,
  123. businessVarietiesName:thisdata.businessVarietiesName,
  124. businessProjectName:thisdata.businessProjectName,
  125. followSituation: String(thisdata.followSituation),
  126. customerStatus: String(thisdata.customerStatus),
  127. remarks: thisdata.remarks,
  128. });
  129. };
  130. console.log(theArr)
  131. this.setState({
  132. followIds: thedata.followId,
  133. contacts: thedata.contacts,
  134. uid: thedata.uid,
  135. dataBus: theArr,
  136. result: thedata.result,
  137. contactMobile:thedata.contactMobile,
  138. contactType: parseInt(thedata.contactType),
  139. followTime: thedata.followTime,
  140. followSituation: thedata.followSituation,
  141. customerStatus: thedata.customerStatus,
  142. });
  143. }.bind(this),
  144. }).always(function() {
  145. this.setState({
  146. loading: false
  147. });
  148. }.bind(this));
  149. },
  150. //拜访意向服务列表单个删除
  151. intentionDelet(e, index) {
  152. let detId = this.state.followIds;
  153. if(e.id) {
  154. this.setState({
  155. selectedRowKeys: [],
  156. });
  157. $.ajax({
  158. method: "get",
  159. dataType: "json",
  160. crossDomain: false,
  161. url: globalConfig.context + "/api/admin/customer/deleteFollowOneBusiness",
  162. data: {
  163. ufbId: e.id
  164. }
  165. }).done(function(data) {
  166. if(!data.error.length) {
  167. message.success('删除成功');
  168. this.setState({
  169. loading: false,
  170. });
  171. } else {
  172. message.warning(data.error[0].message);
  173. };
  174. this.visitModify(detId);
  175. }.bind(this));
  176. } else {
  177. this.visitModify(detId);
  178. }
  179. },
  180. //拜访modul函数
  181. visitOk(e) {
  182. this.setState({
  183. addcontactModul:false,
  184. visitModul: false
  185. });
  186. },
  187. visitCancel(e) {
  188. this.setState({
  189. addcontactModul:false,
  190. visitModul: false
  191. });
  192. },
  193. //详情保存
  194. visitSubmit(e){
  195. e.preventDefault();
  196. this.setState({
  197. loading: true
  198. });
  199. let contactsId = '';
  200. if(this.state.keys) {
  201. let conts = this.state.lastName;
  202. contactsId = this.state.contactsIdArr[conts].id;
  203. }
  204. //新增
  205. $.ajax({
  206. method: "post",
  207. dataType: "json",
  208. url: globalConfig.context + '/api/admin/customer/updateFollow',
  209. data: {
  210. followId: this.state.followIds,
  211. userBusinessList: JSON.stringify(this.state.data),
  212. uid: this.state.uid,
  213. contactType: this.state.contactType,
  214. result: this.state.result,
  215. followTime: this.state.followTime,
  216. }
  217. }).done(function(data) {
  218. this.setState({
  219. loading: false
  220. });
  221. if(!data.error.length) {
  222. message.success('保存成功!');
  223. this.props.closeDesc(false,true);
  224. this.visitCancel();
  225. } else {
  226. message.warning(data.error[0].message);
  227. }
  228. }.bind(this));
  229. },
  230. componentWillReceiveProps(nextProps) {
  231. if (nextProps.visitModul && nextProps.followData.followId) {
  232. this.setState({
  233. visitModul: true,
  234. loading: true,
  235. })
  236. this.visitModify(nextProps.followData.followId)
  237. };
  238. },
  239. render() {
  240. const formItemLayout = {
  241. labelCol: { span: 8 },
  242. wrapperCol: { span: 14 },
  243. };
  244. return(
  245. <div>
  246. <Modal
  247. className="customeDetails"
  248. footer=''
  249. title="客户跟进详情"
  250. width='1000px'
  251. visible={this.state.visitModul}
  252. onOk={this.visitOk}
  253. onCancel={this.visitCancel}
  254. >
  255. <Form layout="horizontal" id="demand-form" onSubmit={this.visitSubmit}>
  256. <Spin spinning={this.state.loading}>
  257. <div className="clearfix">
  258. <FormItem
  259. labelCol={{ span:4 }}
  260. wrapperCol={{ span: 20 }}
  261. label="拜访方式" >
  262. <Radio.Group value={this.state.contactType} onChange={(e) => {
  263. this.setState({ contactType: e.target.value })
  264. }}>
  265. <Radio value={0}>外出</Radio>
  266. <Radio value={1}>电话</Radio>
  267. <Radio value={2}>QQ</Radio>
  268. <Radio value={3}>微信</Radio>
  269. <Radio value={4}>邮箱</Radio>
  270. </Radio.Group>
  271. </FormItem>
  272. <div className="clearfix">
  273. <FormItem className="half-item"
  274. {...formItemLayout}
  275. label="当前联系人"
  276. >
  277. <span>{this.state.contacts}</span>
  278. </FormItem>
  279. <FormItem className="half-item"
  280. {...formItemLayout}
  281. label="跟进时间"
  282. >
  283. <span>{this.state.followTime}</span>
  284. </FormItem>
  285. <FormItem className="half-item"
  286. {...formItemLayout}
  287. label="联系电话"
  288. >
  289. <span>{this.state.contactMobile}</span>
  290. </FormItem>
  291. </div>
  292. <div className="clearfix">
  293. <FormItem
  294. labelCol={{ span: 4 }}
  295. wrapperCol={{ span: 16 }}
  296. label="跟进备注" >
  297. <Input type="textarea" rows={4} value={this.state.result}
  298. onChange={(e)=>{this.setState({result:e.target.value})}}/>
  299. </FormItem>
  300. </div>
  301. <div className="clearfix">
  302. <div style={{fontSize:'18px',marginLeft:'100px',marginTop:'15px',marginBottom:'10px'}}>业务意向</div>
  303. <div className="clearfix">
  304. <Spin spinning={this.state.loading}>
  305. <Table
  306. rowKey={record => record.id}
  307. pagination={false}
  308. columns={this.state.intentionList}
  309. dataSource={this.state.dataBus}
  310. />
  311. </Spin>
  312. </div>
  313. </div>
  314. </div>
  315. <FormItem wrapperCol={{ span: 12, offset: 6 }}>
  316. <Button type="primary" size="large" htmlType="submit" style={{marginRight:'150px',marginTop:'20px'}}>保存</Button>
  317. <Button size="large" onClick={this.visitCancel}>取消</Button>
  318. </FormItem>
  319. </Spin>
  320. </Form>
  321. </Modal>
  322. </div>
  323. )
  324. }
  325. })
  326. export default VisitDetail;