addIntention.jsx 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840
  1. import React from 'react';
  2. import { Modal, message, Spin, Input, Select, Button, Form, Col, Cascader, Tag, Tooltip, AutoComplete, Icon } from 'antd';
  3. import $ from 'jquery/src/ajax';
  4. import { areaSelect } from '@/NewDicProvinceList';
  5. import { socialAttribute, customerSource } from '@/dataDic.js';
  6. import TextArea from "antd/es/input/TextArea";
  7. const confirm = Modal.confirm;
  8. const AchievementDetailForm = Form.create()(React.createClass({
  9. getInitialState() {
  10. return {
  11. loading: false,
  12. data: {},
  13. detailApi: '',
  14. businessScope: [],
  15. inputVisible: false,
  16. cooperationProjects: [],
  17. selectCooperationProjects: []
  18. };
  19. },
  20. handleSubmit(e) {
  21. // if (/.*[\u4e00-\u9fa5]+.*$/.test(this.state.content)) {
  22. // } else {
  23. // message.error("请填写正确的姓名,且至少包含一个汉字");
  24. // return;
  25. // }
  26. e.preventDefault();
  27. this.props.form.validateFields((err, values) => {
  28. let re = new RegExp("^[\u4e00-\u9fa5]");
  29. if (!re.test(values.name)) {
  30. message.warning('公司名称必须以汉字开头!')
  31. return
  32. }
  33. if (!re.test(values.name.charAt(values.name.length - 1))) {
  34. message.warning('公司名称必须以汉字结尾!')
  35. return
  36. }
  37. if (values.name.length > 64) {
  38. message.warning('公司名称字数不超过64个!')
  39. return false;
  40. };
  41. let regu = /[`~!#$%^&*'_[\]+=<>?:"{}|~!#¥%……&*=-@-!{}|/《》?:“”【】、;;‘’,,.。、\s+]/g;
  42. if (regu.test(values.name)) {
  43. message.warning('公司名称不能存在特殊符号或空格!')
  44. return false;
  45. }
  46. if (!/^[A-Z0-9]{15}$|^[A-Z0-9]{17}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/.test(values.orgCode)) {
  47. message.warning('请输入正确的统一社会信用代码!')
  48. return
  49. }
  50. if (/.*[\u4e00-\u9fa5]+.*$/.test(values.content)) {
  51. } else {
  52. message.error("请填写正确的联系人,且至少包含一个汉字");
  53. return false;
  54. };
  55. if (/.*[\u4e00-\u9fa5]+.*$/.test(values.position)) {
  56. } else {
  57. message.error("请填写正确的职位,且至少包含一个汉字");
  58. return false;
  59. };
  60. if (!values.ProvinceCity[1]) {
  61. message.warning('请选择地区');
  62. return false;
  63. };
  64. if (values.content.length > 32) {
  65. message.warning('联系人字数不超过32个')
  66. return false;
  67. };
  68. if (values.length > 13) {
  69. message.warning('电话号码字数不超过13个')
  70. return false;
  71. };
  72. if (this.state.businessScope.length === 0) {
  73. message.warning('请选择主营产品')
  74. return false;
  75. }
  76. if (this.state.selectCooperationProjects.length === 0) {
  77. message.warning('请选择意向合作项目')
  78. return false;
  79. }
  80. if (!this.state.level && this.state.level != 0) {
  81. message.warning('请选择客户类型')
  82. return false;
  83. }
  84. if (!this.state.nature && this.state.nature != 0) {
  85. message.warning('请选择客户性质')
  86. return false;
  87. }
  88. if (this.state.nature == 0 && !this.state.natureOther) {
  89. message.warning('其他说明不能为空')
  90. return false;
  91. }
  92. let arr = [];
  93. for (let i of this.state.selectCooperationProjects) {
  94. arr.push(i.label)
  95. }
  96. if (!err) {
  97. this.setState({
  98. loading: true
  99. });
  100. $.ajax({
  101. method: "POST",
  102. dataType: "json",
  103. crossDomain: false,
  104. url: globalConfig.context + '/api/admin/customer/addCustomer',
  105. data: {
  106. name: values.name,
  107. orgCode: values.orgCode,
  108. contacts: values.content,
  109. contactMobile: values.telnum,
  110. societyTag: '0', //社会属性默认为 社会企业
  111. //source:values.customerSource,
  112. province: (values.ProvinceCity)[0],//省
  113. city: (values.ProvinceCity)[1],//市
  114. area: (values.ProvinceCity)[2],//区
  115. type: '1',
  116. intendedProject: arr.join(','),
  117. businessScope: this.state.businessScope.join(','),
  118. position: values.position,
  119. level: this.state.level,
  120. nature: this.state.nature,
  121. natureOther: this.state.natureOther,
  122. }
  123. }).done(function (data) {
  124. this.setState({
  125. loading: false
  126. });
  127. if (!data.error.length) {
  128. message.success('保存成功!');
  129. this.setState({
  130. verification: false
  131. })
  132. this.props.handleOk();
  133. } else {
  134. message.warning(data.error[0].message);
  135. }
  136. }.bind(this));
  137. }
  138. });
  139. },
  140. componentWillMount() {
  141. this.state.name = '';
  142. this.state.content = '';
  143. this.state.position = '';
  144. this.state.telnum = '';
  145. // this.state.societyTagt='0';
  146. this.state.customerSource = '0';
  147. this.state.inputValue = '';
  148. this.state.businessScope = [];
  149. this.state.inputVisible = false;
  150. this.state.cooperationProjects = [];
  151. this.state.selectCooperationProjects = [];
  152. },
  153. componentWillReceiveProps(nextProps) {
  154. if (!this.props.visible && nextProps.visible) {
  155. this.state.name = '';
  156. this.state.content = '';
  157. this.state.position = '';
  158. this.state.telnum = '';
  159. this.state.inputValue = '';
  160. this.state.businessScope = [];
  161. this.state.inputVisible = false;
  162. this.state.cooperationProjects = [];
  163. this.state.selectCooperationProjects = [];
  164. // this.state.societyTagt='0';
  165. this.props.form.resetFields();
  166. };
  167. },
  168. handleClose(removedTag) {
  169. let businessScope = this.state.businessScope.filter(tag => { return tag !== removedTag });
  170. this.setState({ businessScope });
  171. },
  172. handleCloseCooperation(removedTag) {
  173. let selectCooperationProjects = this.state.selectCooperationProjects.filter(tag => { return tag.value !== removedTag.value });
  174. this.setState({ selectCooperationProjects });
  175. },
  176. showInput() {
  177. let str = this.state.businessScope.join('/')
  178. this.setState({
  179. inputVisible: true,
  180. inputValue: str
  181. });
  182. },
  183. handleInputConfirm() {
  184. let inputValue = this.state.inputValue;
  185. let arr = inputValue.split('/');
  186. let lv = true;
  187. for (let i of arr) {
  188. if (!i.replace(/\s+/g, '')) {
  189. message.warning("请填写关键词且不为空");
  190. return;
  191. }
  192. if (i.length > 16) {
  193. message.warning('单个标签字数不能超过16个字符')
  194. lv = false;
  195. return;
  196. }
  197. }
  198. if (lv) {
  199. arr = Array.from(new Set(arr));
  200. arr = arr.filter(v => v);
  201. this.setState({
  202. businessScope: arr,
  203. inputVisible: false,
  204. inputValue: '',
  205. });
  206. }
  207. },
  208. //加载(自动补全)
  209. supervisor(value) {
  210. $.ajax({
  211. method: "get",
  212. dataType: "json",
  213. crossDomain: false,
  214. url: globalConfig.context + '/api/admin/order/getBusinessProjectByName',
  215. data: {
  216. businessName: value
  217. },
  218. success: function (data) {
  219. let thedata = data.data;
  220. if (data.error.length === 0) {
  221. this.setState({
  222. cooperationProjects: thedata,
  223. });
  224. } else {
  225. message.warning(data.error[0].message);
  226. }
  227. }.bind(this),
  228. }).always(
  229. function () {
  230. }.bind(this)
  231. );
  232. },
  233. onSelect(value) {
  234. let arr = this.state.cooperationProjects.filter(v => v.id === value);
  235. let arr1 = this.state.selectCooperationProjects.filter(v => v.value === value);
  236. if (arr.length > 0) {
  237. if (arr1.length > 0) {
  238. message.warning('选项已存在');
  239. } else {
  240. this.state.selectCooperationProjects.push({
  241. label: arr[0].bname,
  242. value: arr[0].id,
  243. })
  244. this.setState({
  245. selectCooperationProjects: this.state.selectCooperationProjects
  246. })
  247. }
  248. }
  249. },
  250. checkUserName() {
  251. this.setState({
  252. verification: false
  253. })
  254. let yzName = this.props.form.getFieldValue('name')
  255. if (!yzName) {
  256. message.warning('请输入公司名称');
  257. return;
  258. }
  259. let re = new RegExp("^[\u4e00-\u9fa5]");
  260. if (!re.test(yzName)) {
  261. message.warning('公司名称必须以汉字开头!')
  262. return
  263. }
  264. if (!re.test(yzName.charAt(yzName.length - 1))) {
  265. message.warning('公司名称必须以汉字结尾!')
  266. return
  267. }
  268. if (yzName.length > 64) {
  269. message.warning('公司名称字数不超过64个!')
  270. return;
  271. };
  272. let regu = /[`~!#$%^&*'_[\]+=<>?:"{}|~!#¥%……&*=-@-!{}|/《》?:“”【】、;;‘’,,.。、\s+]/g;
  273. if (regu.test(yzName)) {
  274. message.warning('公司名称不能存在特殊符号或空格!')
  275. return false;
  276. }
  277. $.ajax({
  278. method: "get",
  279. dataType: "json",
  280. crossDomain: false,
  281. url: globalConfig.context + '/api/admin/customer/checkUserName',
  282. data: {
  283. userName: this.props.form.getFieldValue('name')
  284. },
  285. success: function (data) {
  286. if (data.error.length === 0) {
  287. if (!data.data) {
  288. this.setState({
  289. verification: true
  290. })
  291. } else {
  292. Modal.info({
  293. title: '提醒',
  294. content: (
  295. <div>
  296. <p>企业客户已存在!请在“客户管理-企业客户-企业客户查询”输入企业全称查询所属人信息</p>
  297. </div>
  298. ),
  299. });
  300. this.setState({
  301. verification: false
  302. })
  303. }
  304. } else {
  305. message.warning(data.error[0].message);
  306. }
  307. }.bind(this),
  308. }).always(
  309. function () {
  310. }.bind(this)
  311. );
  312. },
  313. render() {
  314. const theData = this.state.data || {};
  315. const { getFieldDecorator } = this.props.form;
  316. const FormItem = Form.Item
  317. const formItemLayout = {
  318. labelCol: { span: 6 },
  319. wrapperCol: { span: 14 },
  320. };
  321. return (
  322. <div>
  323. <Form layout="horizontal" onSubmit={this.handleSubmit} id="demand-form">
  324. <Spin spinning={this.state.loading}>
  325. <div>
  326. <Col style={{ color: 'red', marginBottom: '10px' }} span={12} offset={6}>注意:请录入真实有效的客户信息</Col>
  327. <div className="clearfix">
  328. <FormItem className="mid-item"
  329. {...formItemLayout}
  330. label="公司名称" >
  331. {getFieldDecorator('name', {
  332. rules: [{ required: true, message: '此项为必填项!' }],
  333. initialValue: this.state.name
  334. })(
  335. <span style={{ display: 'flex', alignItems: 'center', position: 'relative' }}>
  336. <Input placeholder="公司名称" />
  337. {this.state.verification && <Icon type="check-circle" style={{
  338. fontSize: 16,
  339. color: '#30e031',
  340. position: 'absolute',
  341. right: '80px',
  342. }} />}
  343. <Button onClick={this.checkUserName} type="primary" style={{ marginLeft: '10px' }}>验证</Button>
  344. </span>
  345. )}
  346. </FormItem>
  347. </div>
  348. <div className="clearfix">
  349. <FormItem
  350. {...formItemLayout}
  351. label="统一社会信用代码"
  352. >
  353. {getFieldDecorator('orgCode', {
  354. rules: [{ required: true, message: '此项为必填项!' }],
  355. initialValue: this.state.orgCode
  356. })(
  357. <Input placeholder="统一社会信用代码" />
  358. )}
  359. </FormItem>
  360. </div>
  361. <Col style={{ color: 'red', marginBottom: '10px' }} span={12} offset={6}>如,科德集团则填写91430105670766451M</Col>
  362. <div className="clearfix">
  363. <FormItem
  364. {...formItemLayout}
  365. label="省-市-区"
  366. >
  367. {getFieldDecorator('ProvinceCity', {
  368. rules: [{ required: true, message: '此项为必填项!' }],
  369. initialValue: this.state.ProvinceCity
  370. })(
  371. <Cascader options={areaSelect()} placeholder="选择城市" />
  372. )}
  373. </FormItem>
  374. </div>
  375. <div className="clearfix">
  376. <FormItem className="mid-item"
  377. {...formItemLayout}
  378. label="联系人" >
  379. {getFieldDecorator('content', {
  380. rules: [{ required: true, message: '此项为必填项!' }],
  381. initialValue: this.state.content
  382. })(
  383. <Input placeholder="联系人姓名" />
  384. )}
  385. </FormItem>
  386. </div>
  387. <div className="clearfix">
  388. <FormItem className="mid-item"
  389. {...formItemLayout}
  390. label="职位" >
  391. {getFieldDecorator('position', {
  392. rules: [{ required: true, message: '此项为必填项!' }],
  393. initialValue: this.state.position
  394. })(
  395. <Input placeholder="联系人职位" />
  396. )}
  397. </FormItem>
  398. </div>
  399. <div className="clearfix">
  400. <FormItem className="mid-item"
  401. {...formItemLayout}
  402. label="联系电话" >
  403. {getFieldDecorator('telnum', {
  404. rules: [{ required: true, message: '此项为必填项!' }],
  405. initialValue: this.state.telnum
  406. })(
  407. <Input placeholder="请填写手机号,仅填座机号时,请后续补充手机号" />
  408. )}
  409. </FormItem>
  410. </div>
  411. <div className="clearfix">
  412. <FormItem className="mid-item"
  413. {...formItemLayout}
  414. required
  415. label="主营产品" >
  416. <div>
  417. {this.state.businessScope.map((tag, index) => {
  418. const isLongTag = tag.length > 20;
  419. const tagElem = (
  420. <Tag closable key={tag} afterClose={() => this.handleClose(tag)}>
  421. {isLongTag ? `${tag.slice(0, 20)}...` : tag}
  422. </Tag>
  423. );
  424. return isLongTag ? <Tooltip title={tag} key={tag}>{tagElem}</Tooltip> : tagElem;
  425. })}
  426. {
  427. !this.state.inputVisible &&
  428. <Button
  429. size="small"
  430. type="primary"
  431. onClick={this.showInput}>
  432. + 新增主营产品
  433. </Button>
  434. }
  435. </div>
  436. {this.state.inputVisible && (<div>
  437. <TextArea
  438. style={{ width: '300px', height: '100px' }}
  439. value={this.state.inputValue}
  440. onChange={(e) => {
  441. this.setState({
  442. inputValue: e.target.value
  443. })
  444. }} />
  445. <div style={{ color: '#f00' }}>提示:请用 / 符号隔开关键字</div>
  446. <div>
  447. <Button
  448. size="small"
  449. type="primary"
  450. onClick={this.handleInputConfirm}>
  451. 确定
  452. </Button>
  453. <Button
  454. size="small"
  455. style={{ marginLeft: '5px' }}
  456. onClick={() => {
  457. this.setState({
  458. inputVisible: false,
  459. inputValue: ''
  460. })
  461. }}>
  462. 取消
  463. </Button>
  464. </div>
  465. </div>)}
  466. </FormItem>
  467. </div>
  468. <div className="clearfix">
  469. <FormItem
  470. className="mid-item"
  471. {...formItemLayout}
  472. required
  473. label="意向合作项目" >
  474. <div>
  475. <div style={{ paddingBottom: this.state.selectCooperationProjects.length === 0 ? 0 : '10px' }}>
  476. {this.state.selectCooperationProjects.map((tag, index) => {
  477. const isLongTag = tag.label.length > 20;
  478. const tagElem = (
  479. <Tag closable key={tag.label} afterClose={() => this.handleCloseCooperation(tag)}>
  480. {isLongTag ? `${tag.label.slice(0, 20)}...` : tag.label}
  481. </Tag>
  482. );
  483. return isLongTag ? <Tooltip title={tag.label} key={tag.label}>{tagElem}</Tooltip> : tagElem;
  484. })}
  485. </div>
  486. <div>
  487. <AutoComplete
  488. style={{ width: 200 }}
  489. onSearch={this.supervisor}
  490. onSelect={this.onSelect}
  491. placeholder="请输入关键字"
  492. >
  493. {
  494. this.state.cooperationProjects.map(function (item) {
  495. return <Select.Option key={item.id} value={item.id}>{item.bname}</Select.Option>
  496. })
  497. }
  498. </AutoComplete>
  499. </div>
  500. </div>
  501. </FormItem>
  502. </div>
  503. <div className="clearfix">
  504. <FormItem
  505. className="mid-item"
  506. {...formItemLayout}
  507. required
  508. label="客户类型" >
  509. <Select
  510. placeholder="请选择客户类型"
  511. value={this.state.level}
  512. onChange={(e) => {
  513. this.setState({ level: e });
  514. }}
  515. >
  516. <Option value={0}>一般客户(一年以上预签)</Option>
  517. <Option value={1}>意向客户(半年内预签)</Option>
  518. <Option value={2}>重点客户(一个月内预签)</Option>
  519. </Select>
  520. </FormItem>
  521. </div>
  522. <div className="clearfix">
  523. <FormItem
  524. className="mid-item"
  525. {...formItemLayout}
  526. required
  527. label="客户性质" >
  528. <Select
  529. placeholder="请选择客户性质"
  530. value={this.state.nature}
  531. onChange={(e) => {
  532. this.setState({ nature: e });
  533. }}
  534. >
  535. <Option value={1}>政府机构</Option>
  536. <Option value={2}>科研院所</Option>
  537. <Option value={3}>高等院校</Option>
  538. <Option value={4}>国有企业</Option>
  539. <Option value={5}>民营企业</Option>
  540. <Option value={6}>社会团体</Option>
  541. <Option value={0}>其他(请注明)</Option>
  542. </Select>
  543. </FormItem>
  544. </div>
  545. {
  546. this.state.nature == 0 &&
  547. <div className="clearfix">
  548. <FormItem
  549. className="mid-item"
  550. {...formItemLayout}
  551. required
  552. label="其他说明" >
  553. <Input
  554. placeholder="其他说明"
  555. value={this.state.natureOther}
  556. onChange={e => {
  557. this.setState({
  558. natureOther: e.target.value
  559. })
  560. }}
  561. />
  562. </FormItem>
  563. </div>
  564. }
  565. {/*<div className="clearfix">*/}
  566. {/* <FormItem className="mid-item"*/}
  567. {/* {...formItemLayout}*/}
  568. {/* label="社会属性"*/}
  569. {/* >*/}
  570. {/* {getFieldDecorator('societyTagt', {*/}
  571. {/* rules: [{ required: true, message: '此项为必填项!' }],*/}
  572. {/* initialValue: this.state.societyTagt*/}
  573. {/* })(*/}
  574. {/* <Select placeholder="客户社会属性">*/}
  575. {/* {*/}
  576. {/* socialAttribute.map(function (item) {*/}
  577. {/* return <Select.Option key={item.value} >{item.key}</Select.Option>*/}
  578. {/* })*/}
  579. {/* }*/}
  580. {/* </Select>*/}
  581. {/* )}*/}
  582. {/* </FormItem>*/}
  583. {/*</div>*/}
  584. </div>
  585. <FormItem wrapperCol={{ span: 12, offset: 6 }}>
  586. <Button type="primary" htmlType="submit" style={{ marginRight: '50px' }}>保存</Button>
  587. <Button type="ghost" onClick={this.props.closeDesc}>取消</Button>
  588. </FormItem>
  589. </Spin>
  590. </Form >
  591. </div>
  592. )
  593. }
  594. }));
  595. const AddPerson = Form.create()(React.createClass({
  596. getInitialState() {
  597. return {
  598. loading: false,
  599. data: {},
  600. detailApi: ''
  601. };
  602. },
  603. handleSubmit(e) {
  604. e.preventDefault();
  605. this.props.form.validateFields((err, values) => {
  606. if (values.companyNamet.length > 64) {
  607. message.warning('联系人字数不超过64个')
  608. return false;
  609. };
  610. if (!values.ProvinceCity[1]) {
  611. message.warning('请选择地区');
  612. return false;
  613. };
  614. if (values.telnums.length > 13) {
  615. message.warning('电话号码字数不超过13个')
  616. return false;
  617. };
  618. if (!err) {
  619. this.setState({
  620. loading: true
  621. });
  622. $.ajax({
  623. method: "POST",
  624. dataType: "json",
  625. crossDomain: false,
  626. url: globalConfig.context + '/api/admin/customer/addCustomer',
  627. data: {
  628. contacts: values.companyNamet,
  629. societyTag: values.societyTagt,
  630. name: values.companyNamet,
  631. contactMobile: values.telnums,
  632. source: values.customerSource,
  633. province: (values.ProvinceCity)[0],//省
  634. city: (values.ProvinceCity)[1],//市
  635. area: (values.ProvinceCity)[2],//区
  636. type: '0'
  637. }
  638. }).done(function (data) {
  639. this.setState({
  640. loading: false
  641. });
  642. if (!data.error.length) {
  643. message.success('保存成功!');
  644. this.props.handleOk();
  645. } else {
  646. message.warning(data.error[0].message);
  647. }
  648. }.bind(this));
  649. }
  650. });
  651. },
  652. componentWillMount() {
  653. this.state.companyNamet = '';
  654. this.state.telnum = '';
  655. this.state.societyTagt = '0';
  656. this.state.customerSource = '0';
  657. },
  658. componentWillReceiveProps(nextProps) {
  659. if (!this.props.visible && nextProps.visible) {
  660. this.state.companyNamet = '';
  661. this.state.telnum = '';
  662. this.state.societyTagt = '0';
  663. this.state.customerSource = '0';
  664. this.props.form.resetFields();
  665. };
  666. },
  667. render() {
  668. const theData = this.state.data || {};
  669. const { getFieldDecorator } = this.props.form;
  670. const FormItem = Form.Item
  671. const formItemLayout = {
  672. labelCol: { span: 6 },
  673. wrapperCol: { span: 14 },
  674. };
  675. return (
  676. <div>
  677. <Form layout="horizontal" onSubmit={this.handleSubmit} id="demand-form">
  678. <Spin spinning={this.state.loading}>
  679. <Col style={{ color: 'red', marginBottom: '10px' }} span={12} offset={6}>注意:请录入真实有效的客户信息</Col>
  680. <div className="clearfix">
  681. <FormItem className="mid-item"
  682. {...formItemLayout}
  683. label="客户姓名" >
  684. {getFieldDecorator('companyNamet', {
  685. rules: [{ required: true, message: '此项为必填项!' }],
  686. initialValue: this.state.companyNamet
  687. })(
  688. <Input placeholder="客户姓名" />
  689. )}
  690. </FormItem>
  691. </div>
  692. <div className="clearfix">
  693. <FormItem
  694. {...formItemLayout}
  695. label="省-市-区"
  696. >
  697. {getFieldDecorator('ProvinceCity', {
  698. rules: [{ required: true, message: '此项为必填项!' }],
  699. initialValue: this.state.ProvinceCity
  700. })(
  701. <Cascader options={areaSelect()} placeholder="选择城市" />
  702. )}
  703. </FormItem>
  704. </div>
  705. <div className="clearfix">
  706. <FormItem className="mid-item"
  707. {...formItemLayout}
  708. label="联系电话" >
  709. {getFieldDecorator('telnums', {
  710. rules: [{ required: true, message: '此项为必填项!' }],
  711. initialValue: this.state.telnums
  712. })(
  713. <Input placeholder="联系电话" />
  714. )}
  715. </FormItem>
  716. </div>
  717. <div className="clearfix">
  718. <FormItem className="mid-item"
  719. {...formItemLayout}
  720. label="社会属性"
  721. >
  722. {getFieldDecorator('societyTagt', {
  723. rules: [{ required: true, message: '此项为必填项!' }],
  724. initialValue: this.state.societyTagt
  725. })(
  726. <Select placeholder="客户社会属性">
  727. {
  728. socialAttribute.map(function (item) {
  729. return <Select.Option key={item.value} >{item.key}</Select.Option>
  730. })
  731. }
  732. </Select>
  733. )}
  734. </FormItem>
  735. </div>
  736. <div className="clearfix">
  737. <FormItem className="mid-item"
  738. {...formItemLayout}
  739. label="客户来源"
  740. >
  741. {getFieldDecorator('customerSource', {
  742. rules: [{ required: true, message: '此项为必填项!' }],
  743. initialValue: this.state.customerSource
  744. })(
  745. <Select placeholder="客户来源">
  746. {
  747. customerSource.map(function (item) {
  748. return <Select.Option key={item.value} >{item.key}</Select.Option>
  749. })
  750. }
  751. </Select>
  752. )}
  753. </FormItem>
  754. </div>
  755. <FormItem wrapperCol={{ span: 12, offset: 6 }}>
  756. <Button style={{ marginRight: '50px' }} type="primary" htmlType="submit">保存</Button>
  757. <Button type="ghost" onClick={this.props.closeDesc}>取消</Button>
  758. </FormItem>
  759. </Spin>
  760. </Form >
  761. </div>
  762. )
  763. }
  764. }));
  765. const AddIntention = React.createClass({
  766. getInitialState() {
  767. return {
  768. visible: false,
  769. tabsKey: 1,
  770. loading: false,
  771. dataSource: [],
  772. };
  773. },
  774. handleCancel(e) {
  775. this.setState({
  776. visible: false,
  777. });
  778. this.props.closeDesc(false);
  779. },
  780. handleOk(e) {
  781. this.setState({
  782. visible: false,
  783. });
  784. this.props.closeDesc(false, true);
  785. },
  786. componentWillReceiveProps(nextProps) {
  787. if (!this.state.visible && nextProps.showDesc) {
  788. this.state.tabsKey = "1";
  789. };
  790. this.state.visible = nextProps.showDesc;
  791. },
  792. render() {
  793. return (
  794. <div className="patent-desc">
  795. {
  796. this.state.visible &&
  797. <Modal maskClosable={false} visible={this.state.visible}
  798. onOk={this.checkPatentProcess} onCancel={this.handleCancel}
  799. width='600px'
  800. title='新建客户'
  801. footer=''
  802. className="admin-desc-content">
  803. <Spin spinning={this.state.loading}>
  804. {this.props.api.indexOf('Personal') < 0 ? <AchievementDetailForm
  805. data={this.props.data}
  806. newmodal={this.props.newmodal}
  807. closeDesc={this.handleCancel}
  808. visible={this.state.visible}
  809. handleOk={this.handleOk} /> : <AddPerson
  810. data={this.props.data}
  811. newmodal={this.props.newmodal}
  812. closeDesc={this.handleCancel}
  813. visible={this.state.visible}
  814. handleOk={this.handleOk}
  815. />}
  816. </Spin>
  817. </Modal>
  818. }
  819. </div>
  820. );
  821. },
  822. });
  823. export default Form.create({})(AddIntention);