visitDetail.jsx 9.7 KB

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