contactPerson.jsx 22 KB

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