contactPerson.jsx 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748
  1. import React from "react";
  2. import {
  3. Table,
  4. Button,
  5. Spin,
  6. message,
  7. Popconfirm,
  8. Alert,
  9. Modal,
  10. Input,
  11. InputNumber,
  12. Radio,
  13. } from "antd";
  14. import $ from "jquery/src/ajax";
  15. import EnterpriseNameChange from '../../../../../../../component/common/enterpriseNameChange';
  16. import AddContact from "../../../signCustomer/followDetail/addContact";
  17. const RadioGroup = Radio.Group;
  18. const { TextArea } = Input;
  19. const ContactPerson = React.createClass({
  20. getInitialState() {
  21. return {
  22. upType: 0,
  23. visible: false,
  24. upData: {},
  25. detail: {},
  26. major: 0,
  27. loading: false,
  28. addcontactModul: false,
  29. enterpriseName: '',
  30. ContactsLists: [
  31. {
  32. title: "姓名",
  33. dataIndex: "name",
  34. key: "name",
  35. render: (text, record, index) => {
  36. if (record.id) return <div>{text}</div>
  37. }
  38. },
  39. {
  40. title: "联系人部门",
  41. dataIndex: "department",
  42. key: "department",
  43. render: (text, record, index) => {
  44. if (record.id) return <div>{text}</div>
  45. }
  46. },
  47. {
  48. title: "联系人职务",
  49. dataIndex: "position",
  50. key: "position",
  51. render: (text, record, index) => {
  52. if (record.id) return <div>{text}</div>
  53. }
  54. },
  55. {
  56. title: "主要联系人",
  57. dataIndex: "major",
  58. width: 100,
  59. key: "major",
  60. render: text => {
  61. return text == 1 ? "是" : "否";
  62. }
  63. },
  64. {
  65. title: "地区",
  66. dataIndex: "cityName",
  67. key: "cityName",
  68. render: (text, record, index) => {
  69. if (record.id) return <div>{text}</div>
  70. }
  71. },
  72. {
  73. title: "手机号码",
  74. dataIndex: "mobile",
  75. key: "mobile",
  76. render: (text, record, index) => {
  77. if (record.id) return <div>{text}</div>
  78. }
  79. },
  80. {
  81. title: "座机",
  82. dataIndex: "fixedTel",
  83. key: "fixedTel",
  84. render: (text, record, index) => {
  85. if (record.id) return <div>{text}</div>
  86. }
  87. },
  88. {
  89. title: "微信",
  90. dataIndex: "wechat",
  91. key: "wechat",
  92. render: (text, record, index) => {
  93. if (record.id) return <div>{text}</div>
  94. }
  95. },
  96. {
  97. title: "联系人QQ",
  98. dataIndex: "qq",
  99. key: "qq",
  100. render: (text, record, index) => {
  101. if (record.id) return <div>{text}</div>
  102. }
  103. },
  104. {
  105. title: "电子邮箱",
  106. dataIndex: "email",
  107. key: "email",
  108. render: (text, record, index) => {
  109. if (record.id) return <div>{text}</div>
  110. }
  111. },
  112. {
  113. title: "更新时间",
  114. dataIndex: "createTimes",
  115. key: "createTimes",
  116. render: (text, record, index) => {
  117. if (record.id) return <div>{text}</div>
  118. }
  119. },
  120. {
  121. title: "跟进人",
  122. dataIndex: "aname",
  123. key: "aname",
  124. render: (text, record, index) => {
  125. if (record.id) return <div>{text}</div>
  126. }
  127. },
  128. {
  129. title: "操作",
  130. dataIndex: "dels",
  131. key: "dels",
  132. render: (text, record, index) => {
  133. return (
  134. !this.props.isCustomerAdmin && <div>
  135. {adminData.isSuperAdmin || !record.id ? (
  136. <Popconfirm
  137. title="是否删除?"
  138. onConfirm={e => {
  139. this.confirmDelet(record);
  140. }}
  141. okText="删除"
  142. cancelText="不删除"
  143. >
  144. <Button
  145. style={{
  146. marginRight: "10px",
  147. color: "#ffffff",
  148. background: "#f00",
  149. border: "none"
  150. }}
  151. >
  152. 删除
  153. </Button>
  154. </Popconfirm>
  155. ) : (
  156. ""
  157. )}
  158. {record.major != 1 ? (
  159. <Button
  160. style={{
  161. marginRight: "10px",
  162. color: "#ffffff",
  163. background: "green",
  164. border: "none"
  165. }}
  166. onClick={e => {
  167. e.stopPropagation(), this.mainContact(record);
  168. }}
  169. >
  170. 设为主要联系人
  171. </Button>
  172. ) : (
  173. ""
  174. )}
  175. </div>
  176. );
  177. }
  178. }
  179. ]
  180. };
  181. },
  182. //tab2删除
  183. confirmDelet(e) {
  184. this.setState({
  185. loading: true
  186. });
  187. if (e.id) {
  188. $.ajax({
  189. method: "get",
  190. dataType: "json",
  191. crossDomain: false,
  192. url: globalConfig.context + "/api/admin/customer/deleteOneContact",
  193. data: {
  194. ocbId: e.id //删除的ID
  195. }
  196. }).done(
  197. function (data) {
  198. if (!data.error.length) {
  199. message.success("删除成功!");
  200. this.setState({
  201. loading: false
  202. });
  203. } else {
  204. message.warning(data.error[0].message);
  205. }
  206. this.contactLists();
  207. }.bind(this)
  208. );
  209. } else {
  210. this.contactLists();
  211. }
  212. },
  213. //选择主要联系人
  214. mainContact(record) {
  215. this.setState({
  216. loading: true
  217. });
  218. $.ajax({
  219. method: "get",
  220. dataType: "json",
  221. crossDomain: false,
  222. url: globalConfig.context + "/api/admin/customer/updateMainContact",
  223. data: {
  224. uid: this.props.data.id,
  225. ocbId: record.id
  226. }
  227. }).done(function (data) {
  228. if (!data.error.length) {
  229. message.success('设为主要联系人成功!');
  230. this.setState({
  231. loading: false,
  232. });
  233. } else {
  234. message.warning(data.error[0].message);
  235. };
  236. this.contactLists();
  237. }.bind(this));
  238. this.state.contactList.forEach(item => {
  239. item.major = 0;
  240. });
  241. record.major = 1;
  242. // console.log(record);
  243. this.setState({
  244. contactList: this.state.contactList
  245. });
  246. },
  247. //tab2获取联系人详情
  248. contactLists(ids) {
  249. this.setState({
  250. loading: true
  251. });
  252. $.ajax({
  253. method: "get",
  254. dataType: "json",
  255. crossDomain: false,
  256. url: globalConfig.context + "/api/admin/customer/findCustomerContacts",
  257. data: {
  258. uid: ids || this.props.data.id //名称1
  259. },
  260. success: function (data) {
  261. let theArr = [];
  262. if (data.error.length || data.data.list == "") {
  263. if (data.error && data.error.length) {
  264. message.warning(data.error[0].message);
  265. }
  266. } else {
  267. for (let i = 0; i < data.data.length; i++) {
  268. let thisdata = data.data[i];
  269. theArr.push({
  270. key: i,
  271. id: thisdata.id,
  272. name: thisdata.name,
  273. mobile: thisdata.mobile,
  274. email: thisdata.email,
  275. qq: thisdata.qq,
  276. wechat: thisdata.wechat,
  277. department: thisdata.department,
  278. position: thisdata.position,
  279. major: thisdata.major,
  280. createTimes: thisdata.createTimes,
  281. fixedTel: thisdata.fixedTel,
  282. aname: thisdata.aname,
  283. cityName: (thisdata.provinceName || '') + (thisdata.cityName || '') + (thisdata.areaName || '')
  284. });
  285. }
  286. }
  287. this.setState({
  288. contactList: theArr
  289. });
  290. }.bind(this)
  291. }).always(
  292. function () {
  293. this.setState({
  294. loading: false
  295. });
  296. }.bind(this)
  297. );
  298. },
  299. //新增
  300. //tab2新增联系人
  301. addcontact() {
  302. this.setState({
  303. addcontactModul: true
  304. });
  305. },
  306. componentWillMount() {
  307. this.contactLists(this.props.data.id);
  308. this.queryByUid(this.props.data.id)
  309. },
  310. detailsModal() {
  311. this.props.closeDetail(false, false);
  312. },
  313. componentWillReceiveProps(nextProps) {
  314. if (nextProps.data.id && nextProps.contactState) {
  315. this.contactLists(nextProps.data.id);
  316. }
  317. },
  318. // 查询企业信息
  319. queryByUid() {
  320. this.setState({
  321. loading: true
  322. });
  323. $.ajax({
  324. method: "get",
  325. dataType: "json",
  326. crossDomain: false,
  327. url: globalConfig.context + "/api/admin/userArchives/queryByUid",
  328. data: {
  329. id: this.props.data.id,
  330. },
  331. success: function (data) {
  332. if (data.error.length || data.data.list == "") {
  333. if (data.error && data.error.length) {
  334. message.warning(data.error[0].message);
  335. }
  336. } else {
  337. this.setState({
  338. detail: data.data
  339. })
  340. }
  341. }.bind(this)
  342. }).always(
  343. function () {
  344. this.setState({
  345. loading: false
  346. });
  347. }.bind(this)
  348. );
  349. },
  350. // 修改
  351. update() {
  352. const { upData } = this.state
  353. $.ajax({
  354. method: "post",
  355. dataType: "json",
  356. crossDomain: false,
  357. url: globalConfig.context + "/api/admin/userArchives/update",
  358. data: upData,
  359. success: function (data) {
  360. if (data.error.length || data.data.list == "") {
  361. if (data.error && data.error.length) {
  362. message.warning(data.error[0].message);
  363. }
  364. } else {
  365. message.success("修改成功!")
  366. this.queryByUid()
  367. this.setState({
  368. visible: false
  369. })
  370. }
  371. }.bind(this)
  372. }).always(
  373. function () {
  374. this.setState({
  375. loading: false
  376. });
  377. }.bind(this)
  378. );
  379. },
  380. onUpCancel() {
  381. this.setState({
  382. visible: false
  383. })
  384. },
  385. render() {
  386. const { detail, upType, upData } = this.state
  387. return (
  388. <div>
  389. <div className="clearfix">
  390. <Alert message="注:已保存信息不可修改,可新增正确的信息并设置为主要联系人" banner />
  391. <span
  392. style={{
  393. fontSize: 14,
  394. fontWeight: "bold",
  395. marginTop: 20,
  396. display: "inline-block",
  397. }}
  398. >
  399. 公司名称:{this.state.enterpriseName ? this.state.enterpriseName : this.props.name}
  400. <EnterpriseNameChange
  401. type={this.props.isCustomerAdmin ? 'journal' : 'modify'}
  402. changeOtherInfor
  403. style={{ marginLeft: '20px' }}
  404. enterpriseId={this.props.data.uid}
  405. enterpriseName={this.props.name}
  406. data={this.props.data}
  407. onCancel={this.props.onCancel}
  408. onChangeSuccess={(value) => {
  409. this.setState({
  410. enterpriseName: value
  411. })
  412. }} />
  413. </span>
  414. {!this.props.isCustomerAdmin ? <Button
  415. className="ContactsList"
  416. type="primary"
  417. onClick={this.addcontact}
  418. >
  419. 新增联系人
  420. </Button> : null}
  421. </div>
  422. <div className="clearfix">
  423. <Spin spinning={this.state.loading}>
  424. <Table
  425. pagination={false}
  426. columns={this.state.ContactsLists}
  427. dataSource={this.state.contactList}
  428. />
  429. </Spin>
  430. </div>
  431. <div style={{
  432. fontSize: 14,
  433. marginTop: 20,
  434. }}>
  435. <div style={{ fontWeight: "bold", marginBottom: 5, color: "#58A3FF" }}>企业情况及前期准备工作</div>
  436. <div style={{ fontWeight: "bold", marginTop: 10 }}>
  437. 1.知识产权情况&nbsp;&nbsp;
  438. {
  439. !this.props.isCustomerAdmin &&
  440. <Button
  441. type="primary"
  442. onClick={() => {
  443. this.setState({
  444. visible: true,
  445. upType: 1,
  446. upData: {
  447. uid: this.props.data.id,
  448. id: detail.id || undefined,
  449. inventionPatentCount: detail.inventionPatentCount,
  450. utilityModelCount: detail.utilityModelCount,
  451. appearancePatentCount: detail.appearancePatentCount,
  452. softwareWorksCount: detail.softwareWorksCount,
  453. standard: detail.standard,
  454. otherCount: detail.otherCount,
  455. }
  456. })
  457. }}
  458. >
  459. 修改
  460. </Button>
  461. }
  462. </div>
  463. <div style={{ fontSize: 12, }}>
  464. 专利总数&nbsp;{detail.patentCount || 0}&nbsp;&nbsp;&nbsp;&nbsp;
  465. 发明专利&nbsp;{detail.inventionPatentCount || 0}&nbsp;&nbsp;&nbsp;&nbsp;
  466. 实用新型&nbsp;{detail.utilityModelCount || 0}&nbsp;&nbsp;&nbsp;&nbsp;
  467. 外观专利&nbsp;{detail.appearancePatentCount || 0}&nbsp;&nbsp;&nbsp;&nbsp;
  468. 软著&nbsp;{detail.softwareWorksCount || 0}&nbsp;&nbsp;&nbsp;&nbsp;
  469. 标准&nbsp;{detail.standard == 1 ? '有' : '无'}&nbsp;&nbsp;&nbsp;&nbsp;
  470. 其他&nbsp;{detail.otherCount || 0}&nbsp;&nbsp;&nbsp;&nbsp;
  471. </div>
  472. <div style={{ fontWeight: "bold", marginTop: 10 }}>
  473. 2.财务数据<span style={{ color: "red" }}>(包括营收、税收、资产、研发费用等)</span>&nbsp;&nbsp;
  474. {
  475. !this.props.isCustomerAdmin &&
  476. <Button
  477. type="primary"
  478. onClick={() => {
  479. this.setState({
  480. visible: true,
  481. upType: 2,
  482. upData: {
  483. uid: this.props.data.id,
  484. id: detail.id || undefined,
  485. financialData: detail.financialData,
  486. }
  487. })
  488. }}
  489. >
  490. 修改
  491. </Button>
  492. }
  493. </div>
  494. <div style={{ fontSize: 12, }}>{detail.financialData || "无"}</div>
  495. <div style={{ fontWeight: "bold", marginTop: 10 }}>
  496. 3.前期沟通<span style={{ color: "red" }}>(客户的难处、需求)</span>&nbsp;&nbsp;
  497. {
  498. !this.props.isCustomerAdmin &&
  499. <Button
  500. type="primary"
  501. onClick={() => {
  502. this.setState({
  503. visible: true,
  504. upType: 3,
  505. upData: {
  506. uid: this.props.data.id,
  507. id: detail.id || undefined,
  508. earlyCommunication: detail.earlyCommunication,
  509. }
  510. })
  511. }}
  512. >
  513. 修改
  514. </Button>
  515. }
  516. </div>
  517. <div style={{ fontSize: 12, }}>{detail.earlyCommunication || "无"}</div>
  518. <div style={{ fontWeight: "bold", marginTop: 10 }}>
  519. 4.面谈思路及目的&nbsp;&nbsp;
  520. {
  521. !this.props.isCustomerAdmin &&
  522. <Button
  523. type="primary"
  524. onClick={() => {
  525. this.setState({
  526. visible: true,
  527. upType: 4,
  528. upData: {
  529. uid: this.props.data.id,
  530. id: detail.id || undefined,
  531. interviewIdeas: detail.interviewIdeas,
  532. }
  533. })
  534. }}
  535. >
  536. 修改
  537. </Button>
  538. }
  539. </div>
  540. <div style={{ fontSize: 12, }}>{detail.interviewIdeas || "无"}</div>
  541. </div>
  542. {/* 新增联系人 */}
  543. <AddContact
  544. addcontactModul={this.state.addcontactModul}
  545. uids={this.props.data.id}
  546. closeFollow={() => {
  547. this.setState({
  548. addcontactModul: false
  549. }, () => {
  550. this.contactLists()
  551. })
  552. }}
  553. />
  554. <Modal
  555. footer={null}
  556. maskClosable={false}
  557. width="400px"
  558. title='信息修改'
  559. visible={this.state.visible}
  560. onCancel={this.onUpCancel}
  561. >
  562. <div>
  563. {
  564. upType == 1 &&
  565. <div>
  566. <div className='enterpriseNameItem'>
  567. <div className='enterpriseNameTitle'>发明专利:</div>
  568. <div className='enterpriseNameValue'>
  569. <InputNumber
  570. value={upData.inventionPatentCount || 0}
  571. onChange={e => {
  572. this.setState({
  573. upData: Object.assign(upData, {
  574. inventionPatentCount: e,
  575. }),
  576. })
  577. }}
  578. />
  579. </div>
  580. </div>
  581. <div className='enterpriseNameItem'>
  582. <div className='enterpriseNameTitle'>实用新型:</div>
  583. <div className='enterpriseNameValue'>
  584. <InputNumber
  585. value={upData.utilityModelCount || 0}
  586. onChange={e => {
  587. this.setState({
  588. upData: Object.assign(upData, {
  589. utilityModelCount: e,
  590. }),
  591. })
  592. }}
  593. />
  594. </div>
  595. </div>
  596. <div className='enterpriseNameItem'>
  597. <div className='enterpriseNameTitle'>外观专利:</div>
  598. <div className='enterpriseNameValue'>
  599. <InputNumber
  600. value={upData.appearancePatentCount || 0}
  601. onChange={e => {
  602. this.setState({
  603. upData: Object.assign(upData, {
  604. appearancePatentCount: e,
  605. }),
  606. })
  607. }}
  608. />
  609. </div>
  610. </div>
  611. <div className='enterpriseNameItem'>
  612. <div className='enterpriseNameTitle'>软著:</div>
  613. <div className='enterpriseNameValue'>
  614. <InputNumber
  615. value={upData.softwareWorksCount || 0}
  616. onChange={e => {
  617. this.setState({
  618. upData: Object.assign(upData, {
  619. softwareWorksCount: e,
  620. }),
  621. })
  622. }}
  623. />
  624. </div>
  625. </div>
  626. <div className='enterpriseNameItem'>
  627. <div className='enterpriseNameTitle'>标准:</div>
  628. <div className='enterpriseNameValue'>
  629. <RadioGroup onChange={e => {
  630. console.log(e)
  631. this.setState({
  632. upData: Object.assign(upData, {
  633. standard: e.target.value,
  634. }),
  635. })
  636. }} value={upData.standard}>
  637. <Radio value={1}>有</Radio>
  638. <Radio value={0}>无</Radio>
  639. </RadioGroup>
  640. </div>
  641. </div>
  642. <div className='enterpriseNameItem'>
  643. <div className='enterpriseNameTitle'>其他:</div>
  644. <div className='enterpriseNameValue'>
  645. <InputNumber
  646. value={upData.otherCount || 0}
  647. onChange={e => {
  648. this.setState({
  649. upData: Object.assign(upData, {
  650. otherCount: e,
  651. }),
  652. })
  653. }}
  654. />
  655. </div>
  656. </div>
  657. </div>
  658. }
  659. {
  660. upType == 2 &&
  661. <div>
  662. <div className='enterpriseNameItem'>
  663. <div className='enterpriseNameTitle'>财务数据:</div>
  664. <div className='enterpriseNameValue'>
  665. <TextArea
  666. style={{ width: "250px" }}
  667. rows={4}
  668. value={upData.financialData}
  669. onChange={e => {
  670. this.setState({
  671. upData: Object.assign(upData, {
  672. financialData: e.target.value,
  673. }),
  674. })
  675. }}
  676. />
  677. </div>
  678. </div>
  679. </div>
  680. }
  681. {
  682. upType == 3 &&
  683. <div>
  684. <div className='enterpriseNameItem'>
  685. <div className='enterpriseNameTitle'>前期沟通:</div>
  686. <div className='enterpriseNameValue'>
  687. <TextArea
  688. style={{ width: "250px" }}
  689. rows={4}
  690. value={upData.earlyCommunication}
  691. onChange={e => {
  692. this.setState({
  693. upData: Object.assign(upData, {
  694. earlyCommunication: e.target.value,
  695. }),
  696. })
  697. }}
  698. />
  699. </div>
  700. </div>
  701. </div>
  702. }
  703. {
  704. upType == 4 &&
  705. <div>
  706. <div className='enterpriseNameItem'>
  707. <div className='enterpriseNameTitle'>面谈思路及目的:</div>
  708. <div className='enterpriseNameValue'>
  709. <TextArea
  710. style={{ width: "250px" }}
  711. rows={4}
  712. value={upData.interviewIdeas}
  713. onChange={e => {
  714. this.setState({
  715. upData: Object.assign(upData, {
  716. interviewIdeas: e.target.value,
  717. }),
  718. })
  719. }}
  720. />
  721. </div>
  722. </div>
  723. </div>
  724. }
  725. <div>
  726. <Button type='primary'
  727. onClick={this.update}
  728. >
  729. 确定修改
  730. </Button>
  731. </div>
  732. </div>
  733. </Modal>
  734. </div>
  735. );
  736. }
  737. });
  738. export default ContactPerson;