contactPerson.jsx 22 KB

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