contractDetail.jsx 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777
  1. import React from 'react';
  2. import { Icon, Modal, message, Spin, Input, Select, DatePicker, Button, Table, Form, Upload } from 'antd';
  3. import './contract.less';
  4. import ajax from 'jquery/src/ajax/xhr.js';
  5. import $ from 'jquery/src/ajax';
  6. import moment from 'moment';
  7. import { copyrightStateList } from '../../../dataDic.js';
  8. import { companySearch, getContractState, getCopyrightState, getPatentType, getPatentState, getCognizanceState, getTechnologyState } from '../../../tools.js';
  9. const ContractDetailForm = Form.create()(React.createClass({
  10. getInitialState() {
  11. return {
  12. visible: false,
  13. loading: false,
  14. stateOption: [],
  15. stateTable: [],
  16. contactsOption: [],
  17. stateColumns: [
  18. {
  19. title: '申请状态',
  20. dataIndex: 'status',
  21. key: 'status',
  22. render: (text) => { return getContractState(text) }
  23. }, {
  24. title: '处理时间',
  25. dataIndex: 'recordTimeFormattedDate',
  26. key: 'recordTimeFormattedDate',
  27. }, {
  28. title: '负责人',
  29. dataIndex: 'principal',
  30. key: 'principal',
  31. }, {
  32. title: '操作人',
  33. dataIndex: 'operator',
  34. key: 'operator',
  35. }, {
  36. title: '备注',
  37. dataIndex: 'comment',
  38. key: 'comment',
  39. }
  40. ],
  41. patentColumns: [
  42. {
  43. title: '专利名称',
  44. dataIndex: 'patentName',
  45. key: 'patentName',
  46. width: 200
  47. }, {
  48. title: '专利编号',
  49. dataIndex: 'patentNumber',
  50. key: 'patentNumber',
  51. width: 200
  52. }, {
  53. title: '专利状态',
  54. dataIndex: 'patentState',
  55. key: 'patentState',
  56. render: text => { return getPatentState(text) },
  57. width: 120
  58. }, {
  59. title: '专利类型',
  60. dataIndex: 'patentCatagory',
  61. key: 'patentCatagory',
  62. render: text => { return getPatentType(text) },
  63. width: 160
  64. }, {
  65. title: '当前操作人',
  66. dataIndex: 'principal',
  67. key: 'principal',
  68. width: 200
  69. }
  70. ],
  71. copyrightColumns: [
  72. {
  73. title: '软著名称',
  74. dataIndex: 'copyrightName',
  75. key: 'copyrightName',
  76. width: 200
  77. }, {
  78. title: '软著编号',
  79. dataIndex: 'serialNumber',
  80. key: 'serialNumber',
  81. width: 200
  82. }, {
  83. title: '软著状态',
  84. dataIndex: 'status',
  85. key: 'status',
  86. render: (text) => { return getCopyrightState(text) },
  87. width: 120
  88. }, {
  89. title: '加急天数',
  90. dataIndex: 'inUrgent',
  91. key: 'inUrgent',
  92. render: (text) => {
  93. switch (text) {
  94. case 0:
  95. return '不加急(45个工作日)';
  96. case 3:
  97. return '3个工作日';
  98. case 5:
  99. return '5个工作日';
  100. case 10:
  101. return '6-10个工作日';
  102. case 15:
  103. return '11-15个工作日';
  104. case 20:
  105. return '16-20个工作日';
  106. case 25:
  107. return '21-25个工作日';
  108. case 30:
  109. return '26-30个工作日';
  110. case 35:
  111. return '31-35个工作日';
  112. }
  113. },
  114. width: 220
  115. }, {
  116. title: '当前操作人',
  117. dataIndex: 'principal',
  118. key: 'principal'
  119. }
  120. ],
  121. highTechColumns: [
  122. {
  123. title: '申请年份',
  124. dataIndex: 'year',
  125. key: 'year',
  126. width: 200
  127. }, {
  128. title: '申请状态',
  129. dataIndex: 'state',
  130. key: 'state',
  131. render: (text) => { return getCognizanceState(text) },
  132. width: 200
  133. }, {
  134. title: '证书编号',
  135. dataIndex: 'certificateNumber',
  136. key: 'certificateNumber',
  137. width: 260
  138. }, {
  139. title: '当前操作人',
  140. dataIndex: 'techPrincipal',
  141. key: 'techPrincipal',
  142. width: 200
  143. }
  144. ],
  145. techProjectColumns: [
  146. {
  147. title: '项目名称',
  148. dataIndex: 'projectName',
  149. key: 'projectName',
  150. width: 260
  151. }, {
  152. title: '项目类型',
  153. dataIndex: 'projectCatagory',
  154. key: 'projectCatagory',
  155. width: 200
  156. }, {
  157. title: '项目状态',
  158. dataIndex: 'state',
  159. key: 'state',
  160. render: text => { return getTechnologyState(text) },
  161. width: 120
  162. }, {
  163. title: '技术领域',
  164. dataIndex: 'techField',
  165. key: 'techField',
  166. width: 200
  167. }, {
  168. title: '当前操作人',
  169. dataIndex: 'principle',
  170. key: 'principle',
  171. width: 200
  172. }
  173. ]
  174. };
  175. },
  176. componentWillMount() {
  177. this.loadData();
  178. this.getContactsList();
  179. this.loadColumnsData();
  180. },
  181. getContactsList(uid) {
  182. $.ajax({
  183. method: "get",
  184. dataType: "json",
  185. crossDomain: false,
  186. url: globalConfig.context + "/api/admin/getContacts",
  187. data: {
  188. uid: uid || this.props.data.uid
  189. },
  190. success: function (data) {
  191. if (!data.data) {
  192. if (data.error && data.error.length) {
  193. message.warning(data.error[0].message);
  194. return;
  195. };
  196. };
  197. this.setState({
  198. contactsList: data.data
  199. });
  200. }.bind(this),
  201. });
  202. },
  203. loadData(id) {
  204. this.setState({
  205. loading: true
  206. });
  207. $.when($.ajax({
  208. method: "get",
  209. dataType: "json",
  210. crossDomain: false,
  211. cache: false,
  212. url: globalConfig.context + "/api/admin/contract/log",
  213. data: {
  214. cid: id || this.props.data.id
  215. }
  216. }), $.ajax({
  217. method: "get",
  218. dataType: "json",
  219. crossDomain: false,
  220. cache: false,
  221. url: globalConfig.context + "/api/admin/contract/detail",
  222. data: {
  223. id: id || this.props.data.id
  224. }
  225. })).done((data1, data2) => {
  226. let _me = this;
  227. //状态流转table
  228. this.state.stateTable = [];
  229. if (data1[0].error && data1[0].error.length) {
  230. message.warning(data1[0].error[0].message);
  231. } else {
  232. data1[0].data.map(function (item, i) {
  233. _me.state.stateTable.push({
  234. key: i,
  235. recordTimeFormattedDate: item.recordTimeFormattedDate,
  236. status: item.status,
  237. principal: item.principal,
  238. operator: item.operator,
  239. comment: item.comment
  240. });
  241. });
  242. };
  243. //获取详细数据
  244. if (!data2[0].data) {
  245. if (data2[0].error && data2[0].error.length) {
  246. message.warning(data2[0].error[0].message);
  247. };
  248. } else {
  249. let detailData = data2[0].data;
  250. this.setState({
  251. data: detailData
  252. });
  253. };
  254. }).always(function () {
  255. this.setState({
  256. loading: false
  257. });
  258. }.bind(this));
  259. },
  260. loadColumnsData(id) {
  261. this.setState({
  262. loading: true
  263. });
  264. $.when($.ajax({
  265. method: "get",
  266. dataType: "json",
  267. crossDomain: false,
  268. cache: false,
  269. url: globalConfig.context + "/api/admin/contract/techProject",
  270. data: {
  271. contractId: id || this.props.data.id
  272. }
  273. }), $.ajax({
  274. method: "get",
  275. dataType: "json",
  276. crossDomain: false,
  277. cache: false,
  278. url: globalConfig.context + "/api/admin/contract/cognizance",
  279. data: {
  280. contractId: id || this.props.data.id
  281. }
  282. }), $.ajax({
  283. method: "get",
  284. dataType: "json",
  285. crossDomain: false,
  286. cache: false,
  287. url: globalConfig.context + "/api/admin/contract/copyright",
  288. data: {
  289. contractId: id || this.props.data.id
  290. }
  291. }), $.ajax({
  292. method: "get",
  293. dataType: "json",
  294. crossDomain: false,
  295. cache: false,
  296. url: globalConfig.context + "/api/admin/contract/patent",
  297. data: {
  298. contractId: id || this.props.data.id
  299. }
  300. })).done((data1, data2, data3, data4) => {
  301. let patentArr = [], techProjectArr = [], cognizanceArr = [], copyrightArr = [];
  302. if (!data1[0].data) {
  303. if (data1[0].error && data1[0].error.length) {
  304. message.warning(data1[0].error[0].message)
  305. };
  306. } else {
  307. data1[0].data.map(function (item, i) {
  308. techProjectArr.push({
  309. "key": i,
  310. "id": item.id, //科技项目ID
  311. "uid": item.uid, //用户ID
  312. "contractId": item.contractId, //合同ID
  313. "projectName": item.projectName, //项目名称
  314. "projectCatagory": item.projectCatagory, //项目类型
  315. "state": item.state, //状态
  316. "techField": item.techField, //领域
  317. "principle": item.principle, //当前负责人(技术员)
  318. "tableType": "techProject"
  319. });
  320. });
  321. };
  322. if (!data2[0].data) {
  323. if (data2[0].error && data2[0].error.length) {
  324. message.warning(data2[0].error[0].message)
  325. };
  326. } else {
  327. data2[0].data.map(function (item, i) {
  328. cognizanceArr.push({
  329. "key": i,
  330. "id": item.id, //科技项目ID
  331. "uid": item.uid, //用户ID
  332. "contractId": item.contractId, //合同ID
  333. "year": item.year,
  334. "serialNumber": item.serialNumber,
  335. "state": item.state, //状态
  336. "certificateNumber": item.certificateNumber,
  337. "techPrincipal": item.techPrincipal, //当前负责人(技术员)
  338. "tableType": "cognizance"
  339. });
  340. });
  341. };
  342. if (!data3[0].data) {
  343. if (data3[0].error && data3[0].error.length) {
  344. message.warning(data3[0].error[0].message)
  345. };
  346. } else {
  347. data3[0].data.map(function (item, i) {
  348. copyrightArr.push({
  349. "key": i,
  350. "id": item.id, //科技项目ID
  351. "uid": item.uid, //用户ID
  352. "contractId": item.contractId, //合同ID
  353. "copyrightName": item.copyrightName, //项目名称
  354. "serialNumber": item.serialNumber,
  355. "state": item.state, //状态
  356. "inUrgent": item.inUrgent, //加急天数
  357. "principal": item.principal, //当前负责人(技术员)
  358. "tableType": "copyright"
  359. });
  360. });
  361. };
  362. if (!data4[0].data) {
  363. if (data4[0].error && data4[0].error.length) {
  364. message.warning(data4[0].error[0].message)
  365. };
  366. } else {
  367. data4[0].data.map(function (item, i) {
  368. patentArr.push({
  369. "key": i,
  370. "id": item.id, //科技项目ID
  371. "uid": item.uid, //用户ID
  372. "contractId": item.contractId, //合同ID
  373. "patentName": item.patentName, //项目名称
  374. "patentNumber": item.patentNumber, //专利号
  375. "serialNumber": item.serialNumber, //编号
  376. "patentState": item.patentState, //状态
  377. "patentCatagory": item.patentCatagory, //专利类别
  378. "principal": item.principal, //当前负责人(技术员)
  379. "tableType": "patent"
  380. });
  381. });
  382. };
  383. this.setState({
  384. patentTableData: patentArr,
  385. copyrightTableData: copyrightArr,
  386. highTechTableData: cognizanceArr,
  387. techProjectTableData: techProjectArr
  388. });
  389. }).always(function () {
  390. this.setState({
  391. loading: false
  392. });
  393. }.bind(this));
  394. },
  395. foundHighTech() {
  396. $.ajax({
  397. method: "post",
  398. dataType: "json",
  399. crossDomain: false,
  400. url: globalConfig.context + "/api/admin/contract/createCognizance",
  401. data: {
  402. id: this.props.data.id
  403. },
  404. success: function (data) {
  405. if (!data.data) {
  406. if (data.error && data.error.length) {
  407. message.warning(data.error[0].message);
  408. return;
  409. };
  410. };
  411. this.loadData();
  412. this.loadColumnsData();
  413. }.bind(this),
  414. });
  415. },
  416. foundPatent() {
  417. $.ajax({
  418. method: "post",
  419. dataType: "json",
  420. crossDomain: false,
  421. url: globalConfig.context + "/api/admin/contract/createPatent",
  422. data: {
  423. id: this.props.data.id
  424. },
  425. success: function (data) {
  426. if (!data.data) {
  427. if (data.error && data.error.length) {
  428. message.warning(data.error[0].message);
  429. return;
  430. };
  431. };
  432. this.loadData();
  433. this.loadColumnsData();
  434. }.bind(this),
  435. });
  436. },
  437. foundCopyright() {
  438. $.ajax({
  439. method: "post",
  440. dataType: "json",
  441. crossDomain: false,
  442. url: globalConfig.context + "/api/admin/contract/createCopyright",
  443. data: {
  444. id: this.props.data.id
  445. },
  446. success: function (data) {
  447. if (!data.data) {
  448. if (data.error && data.error.length) {
  449. message.warning(data.error[0].message);
  450. return;
  451. };
  452. };
  453. this.loadData();
  454. this.loadColumnsData();
  455. }.bind(this),
  456. });
  457. },
  458. foundTechProject() {
  459. $.ajax({
  460. method: "post",
  461. dataType: "json",
  462. crossDomain: false,
  463. url: globalConfig.context + "/api/admin/contract/createTechProject",
  464. data: {
  465. id: this.props.data.id
  466. },
  467. success: function (data) {
  468. if (!data.data) {
  469. if (data.error && data.error.length) {
  470. message.warning(data.error[0].message);
  471. return;
  472. };
  473. };
  474. this.loadData();
  475. this.loadColumnsData();
  476. }.bind(this),
  477. });
  478. },
  479. componentWillReceiveProps(nextProps) {
  480. if (!this.props.visible && nextProps.visible) {
  481. this.loadData(nextProps.data.id);
  482. this.loadColumnsData(nextProps.data.id);
  483. this.getContactsList(nextProps.data.uid);
  484. };
  485. },
  486. handleSubmit(e) {
  487. e.preventDefault();
  488. this.props.form.validateFields((err, values) => {
  489. if (values.status || values.principals || values.recordTime || values.comment) {
  490. if (!values.status || !values.principals || !values.recordTime) {
  491. message.warning("请填写完整的状态流转信息!");
  492. return;
  493. };
  494. };
  495. if (!err) {
  496. this.props.spinState(true);
  497. $.ajax({
  498. method: "POST",
  499. dataType: "json",
  500. crossDomain: false,
  501. url: globalConfig.context + "/api/admin/contract/circulation",
  502. data: {
  503. "cid": this.props.data.id,
  504. "comment": values.comment,
  505. "status": values.status,
  506. "recordTimeFormattedDate":values.recordTime.format("YYYY-MM-DD HH:mm:ss"),
  507. "principals": values.principals //流转分发人
  508. }
  509. }).done(function (data) {
  510. if (!data.error.length) {
  511. message.success('保存成功!');
  512. this.props.clickOk();
  513. this.props.form.resetFields();
  514. this.props.spinState(false);
  515. } else {
  516. message.warning(data.error[0].message);
  517. this.props.spinState(false);
  518. }
  519. }.bind(this));
  520. }
  521. });
  522. },
  523. tableRowClick(record, index) {
  524. switch (record.tableType) {
  525. case 'patent':
  526. window.open(globalConfig.context + "/admin/servicesManage/patent.html?contractId=" + record.contractId + "#comprehensive");
  527. break;
  528. case 'copyright':
  529. window.open(globalConfig.context + "/admin/servicesManage/copyright.html?contractId=" + record.contractId + "#copyright");
  530. break;
  531. case 'cognizance':
  532. window.open(globalConfig.context + "/admin/servicesManage/highTech.html?contractId=" + record.contractId + "#highTechApply");
  533. break;
  534. case 'techProject':
  535. window.open(globalConfig.context + "/admin/servicesManage/technology.html?contractId=" + record.contractId + "#applyManage");
  536. break;
  537. };
  538. },
  539. render() {
  540. const FormItem = Form.Item;
  541. const { getFieldDecorator } = this.props.form;
  542. const theData = this.state.data || {};
  543. const formItemLayout = {
  544. labelCol: { span: 6 },
  545. wrapperCol: { span: 18 },
  546. };
  547. const _me = this;
  548. return (
  549. <Form onSubmit={this.handleSubmit} id="CopyrightDesc-form">
  550. <div className="clearfix">
  551. <FormItem className="half-item"
  552. {...formItemLayout}
  553. label="合同编号" >
  554. {getFieldDecorator('serialNumber')(
  555. <span>{theData.serialNumber}</span>
  556. )}
  557. </FormItem>
  558. <FormItem className="half-item"
  559. {...formItemLayout}
  560. label="公司名称" >
  561. {getFieldDecorator('unitName')(
  562. <span>{theData.unitName}</span>
  563. )}
  564. </FormItem>
  565. <FormItem className="half-item"
  566. {...formItemLayout}
  567. label="组织机构代码" >
  568. {getFieldDecorator('orgCode')(
  569. <span>{theData.orgCode}</span>
  570. )}
  571. </FormItem>
  572. <FormItem className="half-item"
  573. {...formItemLayout}
  574. label="公司地址" >
  575. {getFieldDecorator('address')(
  576. <span>{theData.address}</span>
  577. )}
  578. </FormItem>
  579. <FormItem className="half-item"
  580. {...formItemLayout}
  581. label="联系人" >
  582. <span>{this.state.contactsList ? this.state.contactsList[theData.contacts] : ''}</span>
  583. </FormItem>
  584. </div>
  585. <p style={{ fontSize: '14px', color: '#333' }}>状态流转记录: </p>
  586. <Table style={{ margin: '10px 0', background: "#eee" }}
  587. pagination={false}
  588. dataSource={this.state.stateTable}
  589. columns={this.state.stateColumns} />
  590. <div className="clearfix" style={{ padding: '0 4px', paddingTop: '20px', marginBottom: '10px', background: '#eee' }}>
  591. <FormItem className="half-item"
  592. {...formItemLayout}
  593. label="状态流转"
  594. >
  595. {getFieldDecorator('status')(
  596. <Select
  597. style={{ width: 200 }}
  598. placeholder="选择一个状态">
  599. {this.props.statusOption}
  600. </Select>
  601. )}
  602. </FormItem>
  603. <FormItem className="half-item"
  604. {...formItemLayout}
  605. label="处理时间"
  606. >
  607. {getFieldDecorator('recordTime')(
  608. <DatePicker />
  609. )}
  610. </FormItem>
  611. <FormItem className="half-item"
  612. {...formItemLayout}
  613. label="负责人"
  614. >
  615. {getFieldDecorator('principals')(
  616. <Select
  617. placeholder="请选择审核人"
  618. notFoundContent="未找到"
  619. style={{ width: 260 }}
  620. showSearch
  621. multiple
  622. filterOption={companySearch} >
  623. {this.props.authorOption}
  624. </Select>
  625. )}
  626. </FormItem>
  627. <FormItem className="half-item"
  628. {...formItemLayout}
  629. label="备注">
  630. {getFieldDecorator('comment')(
  631. <Input />
  632. )}
  633. </FormItem>
  634. </div>
  635. {theData.cognizanceYear ? <div>
  636. <div className="clearfix">
  637. <FormItem className="half-item"
  638. {...formItemLayout}
  639. label="高企申请">
  640. {getFieldDecorator('cognizanceYear', {
  641. initialValue: theData.cognizanceYear
  642. })(
  643. <span>{theData.cognizanceYear} 年</span>
  644. )}
  645. </FormItem>
  646. {theData.cognizanceStatus == 0 ? <Button onClick={this.foundHighTech}>创建申请</Button> : <span></span>}
  647. </div>
  648. <Table className="contract-Table" size="small" scroll={{ y: 240 }}
  649. columns={this.state.highTechColumns}
  650. dataSource={this.state.highTechTableData}
  651. pagination={false}
  652. onRowClick={this.tableRowClick} />
  653. </div> : <div></div>}
  654. {theData.patentNum ? <div>
  655. <div className="clearfix">
  656. <FormItem className="half-item"
  657. {...formItemLayout}
  658. label="专利申请">
  659. {getFieldDecorator('patentNum', {
  660. initialValue: theData.patentNum
  661. })(
  662. <span>{theData.patentNum} 条</span>
  663. )}
  664. </FormItem>
  665. {theData.patentStatus == 0 ? <Button onClick={this.foundPatent}>创建申请</Button> : <span></span>}
  666. </div>
  667. <Table className="contract-Table" size="small" scroll={{ y: 240 }}
  668. columns={this.state.patentColumns}
  669. dataSource={this.state.patentTableData}
  670. pagination={false}
  671. onRowClick={this.tableRowClick} />
  672. </div> : <div></div>}
  673. {theData.copyrightNum ? <div>
  674. <div className="clearfix">
  675. <FormItem className="half-item"
  676. {...formItemLayout}
  677. label="软著申请">
  678. {getFieldDecorator('copyrightNum', {
  679. initialValue: theData.copyrightNum
  680. })(
  681. <span>{theData.copyrightNum} 条</span>
  682. )}
  683. </FormItem>
  684. {theData.copyrightStatus == 0 ? <Button onClick={this.foundCopyright}>创建申请</Button> : <span></span>}
  685. </div>
  686. <Table className="contract-Table" size="small" scroll={{ y: 240 }}
  687. columns={this.state.copyrightColumns}
  688. dataSource={this.state.copyrightTableData}
  689. pagination={false}
  690. onRowClick={this.tableRowClick} />
  691. </div> : <div></div>}
  692. {theData.techProjectNum ? <div>
  693. <div className="clearfix">
  694. <FormItem className="half-item"
  695. {...formItemLayout}
  696. label=" 科技项目申请">
  697. {getFieldDecorator('techProjectNum', {
  698. initialValue: theData.techProjectNum
  699. })(
  700. <span>{theData.techProjectNum} 条</span>
  701. )}
  702. </FormItem>
  703. {theData.techProjectStatus == 0 ? <Button onClick={this.foundTechProject}>创建申请</Button> : <span></span>}
  704. </div>
  705. <Table className="contract-Table" size="small" scroll={{ y: 240 }}
  706. columns={this.state.techProjectColumns}
  707. dataSource={this.state.techProjectTableData}
  708. pagination={false}
  709. onRowClick={this.tableRowClick} />
  710. </div> : <div></div>}
  711. <FormItem style={{ marginTop: '20px' }}>
  712. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  713. <Button type="ghost" style={{ marginLeft: '20px' }} onClick={this.props.closeModal}>取消</Button>
  714. </FormItem>
  715. </Form>
  716. );
  717. }
  718. }));
  719. const ContractDetail = React.createClass({
  720. getInitialState() {
  721. return {
  722. visible: false,
  723. loading: false
  724. };
  725. },
  726. componentWillReceiveProps(nextProps) {
  727. this.state.visible = nextProps.showDesc
  728. },
  729. showModal() {
  730. this.setState({
  731. visible: true,
  732. });
  733. },
  734. handleOk() {
  735. this.setState({
  736. visible: false,
  737. });
  738. this.props.closeDesc(false, true);
  739. },
  740. handleCancel(e) {
  741. this.setState({
  742. visible: false,
  743. });
  744. this.props.closeDesc(false);
  745. },
  746. spinChange(e) {
  747. this.setState({
  748. loading: e
  749. });
  750. },
  751. render() {
  752. return (
  753. <div className="patent-addNew">
  754. <Spin spinning={this.state.loading} className='spin-box'>
  755. <Modal title="合同详情" visible={this.state.visible}
  756. onOk={this.handleOk} onCancel={this.handleCancel}
  757. width='1000px'
  758. footer=''
  759. >
  760. <ContractDetailForm
  761. visible={this.state.visible}
  762. authorOption={this.props.authorOption}
  763. statusOption={this.props.statusOption}
  764. data={this.props.data}
  765. spinState={this.spinChange}
  766. closeModal={this.handleCancel}
  767. clickOk={this.handleOk} />
  768. </Modal>
  769. </Spin>
  770. </div>
  771. );
  772. }
  773. });
  774. export default ContractDetail;