patentAdd.jsx 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239
  1. import React from 'react';
  2. import { Icon, Modal, Button, Form, Upload, message, Input, Spin, Checkbox } from 'antd';
  3. import { beforeUploadFile, downloadFile } from '../../tools.js';
  4. import './patent.less';
  5. import ajax from 'jquery/src/ajax/xhr.js'
  6. import $ from 'jquery/src/ajax';
  7. const PatentAddFrom = Form.create()(React.createClass({
  8. getInitialState() {
  9. return {
  10. loading: false,
  11. firstCheck: 0,
  12. secondCheck: 0,
  13. thirdCheck: 0
  14. };
  15. },
  16. handleSubmit(e) {
  17. e.preventDefault();
  18. if (!this.state.patentProryStatementUrl) {
  19. message.warning('未上传代理委托书!');
  20. return;
  21. };
  22. this.props.form.validateFields((err, values) => {
  23. if (!err) {
  24. this.props.spinState(true);
  25. $.ajax({
  26. method: "POST",
  27. dataType: "json",
  28. crossDomain: false,
  29. url: globalConfig.context + "/techservice/patent/clientApplyPatent",
  30. data: {
  31. 'firstInventorIdNumber': values.firstInventorID,
  32. 'firstInventorName': values.firstInventorName,
  33. 'patentDes': values.intro,
  34. 'secondInventorName': values.secondInventorName,
  35. 'thirdInventorName': values.thirdInventorName,
  36. 'firstInventorIsPublish': this.state.firstCheck,
  37. 'secondInventorIsPublish': this.state.secondCheck,
  38. 'thirdInventorIsPublish': this.state.thirdCheck,
  39. 'patentProryStatementUrl': this.state.patentProryStatementUrl
  40. }
  41. }).done(function (data) {
  42. if (!data.error.length) {
  43. message.success('保存成功!');
  44. } else {
  45. message.warning(data.error[0].message);
  46. }
  47. }.bind(this)).always(function () {
  48. this.props.spinState(false);
  49. this.props.clickOk();
  50. this.props.form.resetFields();
  51. }.bind(this));
  52. }
  53. });
  54. },
  55. firstInventorCheck(e) {
  56. if (e.target.checked == true) {
  57. this.state.firstCheck = 1;
  58. } else if (e.target.checked == false) {
  59. this.state.firstCheck = 0;
  60. }
  61. },
  62. secondInventorCheck(e) {
  63. if (e.target.checked == true) {
  64. this.state.secondCheck = 1;
  65. } else if (e.target.checked == false) {
  66. this.state.secondCheck = 0;
  67. };
  68. },
  69. thirdInventorCheck(e) {
  70. if (e.target.checked == true) {
  71. this.state.thirdCheck = 1;
  72. } else if (e.target.checked == false) {
  73. this.state.thirdCheck = 0;
  74. };
  75. },
  76. avatarUrl(e) {
  77. this.state.avatarUrl = e;
  78. },
  79. checkIdcardnum(rule, value, callback) {
  80. if (!/(^\d{15}$)|(^\d{17}(\d|X)$)/.test(value)) {
  81. callback('请输入正确的身份证号!');
  82. } else {
  83. callback();
  84. }
  85. },
  86. render() {
  87. const FormItem = Form.Item;
  88. const { getFieldDecorator } = this.props.form;
  89. const formItemLayout = {
  90. labelCol: { span: 3 },
  91. wrapperCol: { span: 16 },
  92. };
  93. const _me = this;
  94. return (
  95. <Form horizontal onSubmit={this.handleSubmit} className="patent-form">
  96. <FormItem
  97. labelCol={{ span: 24 }}
  98. wrapperCol={{ span: 24 }}
  99. label="专利简要描述"
  100. >
  101. {getFieldDecorator('intro', {
  102. initialValue: this.state.intro || null
  103. })(
  104. <Input type="textarea"
  105. placeholder="多行输入"
  106. rows={6} />
  107. )}
  108. </FormItem>
  109. <p>第一发明人</p>
  110. <FormItem
  111. {...formItemLayout}
  112. label="姓名"
  113. >
  114. {getFieldDecorator('firstInventorName', {
  115. rules: [{ required: true, message: '请输入姓名!' }]
  116. })(
  117. <Input className="mini-input" />
  118. )}
  119. <Checkbox onChange={this.firstInventorCheck}>是否同意专利局公布</Checkbox>
  120. </FormItem>
  121. <FormItem
  122. {...formItemLayout}
  123. label="身份证"
  124. >
  125. {getFieldDecorator('firstInventorID', {
  126. rules: [{ required: true, validator: this.checkIdcardnum, message: '请输入正确的身份证号!' }]
  127. })(
  128. <Input className="mini-input" />
  129. )}
  130. </FormItem>
  131. <p>第二发明人</p>
  132. <FormItem
  133. {...formItemLayout}
  134. label="姓名"
  135. >
  136. {getFieldDecorator('secondInventorName')(
  137. <Input className="mini-input" />
  138. )}
  139. <Checkbox onChange={this.secondInventorCheck}>是否同意专利局公布</Checkbox>
  140. </FormItem>
  141. <p>第三发明人</p>
  142. <FormItem
  143. {...formItemLayout}
  144. label="姓名"
  145. >
  146. {getFieldDecorator('thirdInventorName')(
  147. <Input className="mini-input" />
  148. )}
  149. <Checkbox onChange={this.thirdInventorCheck}>是否同意专利局公布</Checkbox>
  150. </FormItem>
  151. <div className="hrSituation-roster">
  152. <Upload
  153. name="ratepay"
  154. action={globalConfig.context + "/techservice/cognizance/upload"}
  155. data={{ 'sign': 'patent_prory_statement' }}
  156. beforeUpload={beforeUploadFile}
  157. showUploadList={false}
  158. onChange={(info) => {
  159. if (info.file.status !== 'uploading') {
  160. console.log(info.file, info.fileList);
  161. }
  162. if (info.file.status === 'done') {
  163. if (!info.file.response.error.length) {
  164. message.success(`${info.file.name} 文件上传成功!`);
  165. } else {
  166. message.warning(info.file.response.error[0].message);
  167. return;
  168. };
  169. this.state.patentProryStatementUrl = info.file.response.data;
  170. } else if (info.file.status === 'error') {
  171. message.error(`${info.file.name} 文件上传失败。`);
  172. }
  173. }}
  174. >
  175. <Button><Icon type="upload" /> 上传专利代理委托书 </Button>
  176. </Upload>
  177. <p style={{paddingLeft:'10px',marginTop:'10px'}}>
  178. <a onClick={() => { window.open(globalConfig.context + "/open/downloadTemplateFile?sign=patent_prory_statement") }}>专利代理委托书模板下载</a>
  179. </p>
  180. </div>
  181. <FormItem style={{ marginTop: '20px' }}>
  182. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  183. <Button type="ghost" style={{ marginLeft: '20px' }} onClick={this.props.closeModal}>取消</Button>
  184. </FormItem>
  185. </Form >
  186. );
  187. },
  188. }));
  189. const PatentAdd = React.createClass({
  190. getInitialState() {
  191. return {
  192. visible: false,
  193. loading: false
  194. };
  195. },
  196. showModal() {
  197. this.setState({
  198. visible: true,
  199. });
  200. },
  201. handleOk() {
  202. this.setState({
  203. visible: false,
  204. });
  205. this.props.closeDesc(false, true);
  206. },
  207. handleCancel(e) {
  208. this.setState({
  209. visible: false,
  210. });
  211. this.props.closeDesc(false);
  212. },
  213. spinChange(e) {
  214. this.setState({
  215. loading: e
  216. });
  217. },
  218. render() {
  219. return (
  220. <div className="patent-addNew">
  221. <Button disabled={this.props.ButtonDisabled} className="patent-addNew" type="primary" onClick={this.showModal}>申请新专利<Icon type="plus" /></Button>
  222. <Spin spinning={this.state.loading} className='spin-box'>
  223. <Modal title="新专利申请" visible={this.state.visible}
  224. onOk={this.handleOk} onCancel={this.handleCancel}
  225. width='720px'
  226. footer=''
  227. >
  228. <PatentAddFrom spinState={this.spinChange} closeModal={this.handleCancel} clickOk={this.handleOk} />
  229. </Modal>
  230. </Spin>
  231. </div>
  232. );
  233. },
  234. });
  235. export default PatentAdd;