patentAdd.jsx 8.9 KB

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