patentDesc.jsx 4.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. import React from 'react';
  2. import { Icon, Modal, message, Spin, Steps } from 'antd';
  3. import './patent.less';
  4. const PatentDesc = React.createClass({
  5. getInitialState() {
  6. return {
  7. visible: false,
  8. loading: false
  9. };
  10. },
  11. showModal() {
  12. this.setState({
  13. visible: true,
  14. });
  15. },
  16. handleOk() {
  17. this.setState({
  18. visible: false,
  19. });
  20. this.props.closeDesc(false);
  21. },
  22. componentWillReceiveProps(nextProps) {
  23. this.state.visible = nextProps.showDesc
  24. },
  25. handleCancel(e) {
  26. this.setState({
  27. visible: false,
  28. });
  29. this.props.closeDesc(false);
  30. },
  31. render() {
  32. const Step = Steps.Step;
  33. const theData = this.props.data;
  34. if (this.props.data) {
  35. return (
  36. <div className="patent-desc">
  37. <Spin spinning={this.state.loading} className='spin-box'>
  38. <Modal title="专利详情" visible={this.state.visible}
  39. onOk={this.handleOk} onCancel={this.handleCancel}
  40. width='800px'
  41. footer=''
  42. className="patent-desc-content">
  43. <div>
  44. <p className="widthHalf"><span>编号:</span>{theData.number}</p>
  45. <p className="widthHalf"><span>申请号/专利号:</span>{theData.patentNum}</p>
  46. </div>
  47. <div>
  48. <p className="widthHalf"><span>专利名称:</span>{theData.patentName}</p>
  49. <p className="widthHalf"><span>专利类型:</span>{theData.patentType}</p>
  50. </div>
  51. <div>
  52. <p className="widthHalf"><span>专利状态:</span>{theData.patentState}</p>
  53. <p className="widthHalf"><span>专利领域:</span>{theData.patentField}</p>
  54. </div>
  55. <div>
  56. <span>简介:</span>{theData.patentDes}
  57. </div>
  58. <div>
  59. <span>专利相关材料:</span>{theData.number}
  60. </div>
  61. <div>
  62. <span>专利申请日:</span>{theData.number}
  63. </div>
  64. <div>
  65. <span>专利授权日:</span>{theData.number}
  66. </div>
  67. <div>
  68. <span>每年年费缴费截止日:</span>{theData.number}
  69. </div>
  70. <div>
  71. <p>第一发明人:</p>
  72. <p><span>姓名:</span>{theData.firstInventorName}</p>
  73. <p><span>身份证:</span>{theData.firstInventorIdNumber}</p>
  74. </div>
  75. <div style={theData.secondInventorName === '' ? { display: 'none' } : {}}>
  76. <p>第二发明人:</p>
  77. <p><span>姓名:</span>{theData.secondInventorName}</p>
  78. </div>
  79. <div style={theData.thirdInventorName === '' ? { display: 'none' } : {}}>
  80. <p>第三发明人:</p>
  81. <p><span>姓名:</span>{theData.thirdInventorName}</p>
  82. </div>
  83. <Steps direction="vertical" size="small" current={1}>
  84. <Step title="Finished" description="This is a description." />
  85. <Step title="In Progress" description="This is a description." />
  86. <Step title="Waiting" description="This is a description." />
  87. </Steps>
  88. </Modal>
  89. </Spin>
  90. </div>
  91. );
  92. } else {
  93. return <div></div>
  94. }
  95. },
  96. });
  97. export default PatentDesc;