intellectualDesc.jsx 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. import React from 'react';
  2. import { Icon, Modal, Button, Form, message, Input, Spin, Select, DatePicker, Upload } from 'antd';
  3. import { intellectualGetList, catagoryList } from '../../../../dataDic.js';
  4. import { beforeUploadFile, newDownloadFile } from '../../../../tools.js';
  5. import ajax from 'jquery/src/ajax/xhr.js'
  6. import $ from 'jquery/src/ajax';
  7. import moment from 'moment';
  8. const IntellectualDescFrom = Form.create()(React.createClass({
  9. loadData(id, type) {
  10. this.setState({
  11. loading: true
  12. });
  13. $.ajax({
  14. method: "get",
  15. dataType: "json",
  16. crossDomain: false,
  17. url: globalConfig.context + "/api/admin/intellectualDetail",
  18. data: {
  19. id: id != undefined ? id : this.props.data.id,
  20. type: type != undefined ? type : this.props.data.type
  21. }
  22. }).done((data) => {
  23. if (!data.data) {
  24. if (data.error && data.error.length) {
  25. message.warning(data.error[0].message);
  26. };
  27. return;
  28. };
  29. this.setState({
  30. id: data.data.id,
  31. uid: data.data.uid,
  32. pid: data.data.pid,
  33. intellectualPropertyNumber: data.data.intellectualPropertyNumber,
  34. intellectualPropertyName: data.data.intellectualPropertyName,
  35. sortNumber: data.data.sortNumber,
  36. catagory: data.data.catagory,
  37. obtainWay: data.data.obtainWay,
  38. authorizationNumber: data.data.authorizationNumber,
  39. authorizationDate: data.data.authorizationDate,
  40. propertyRightUrl: data.data.propertyRightUrl,
  41. type: data.data.type,
  42. manuscript: data.data.manuscript,
  43. propertyRightDownloadFileName: data.data.propertyRightDownloadFileName,
  44. authorizationDateFormattedDate: data.data.authorizationDateFormattedDate
  45. });
  46. }).always(function () {
  47. this.setState({
  48. loading: false
  49. });
  50. }.bind(this));
  51. },
  52. getInitialState() {
  53. return {
  54. loading: false,
  55. intellectualGetOption: [],
  56. catagoryOption: []
  57. };
  58. },
  59. componentWillMount() {
  60. let _me = this;
  61. intellectualGetList.map(function (item) {
  62. _me.state.intellectualGetOption.push(
  63. <Select.Option value={item.value} key={item.key}>{item.key}</Select.Option>
  64. )
  65. });
  66. catagoryList.map(function (item) {
  67. _me.state.catagoryOption.push(
  68. <Select.Option value={item.value} key={item.key}>{item.key}</Select.Option>
  69. )
  70. });
  71. this.loadData();
  72. },
  73. handleSubmit(e) {
  74. e.preventDefault();
  75. this.props.form.validateFields((err, values) => {
  76. if (!err) {
  77. this.props.spinState(true);
  78. $.ajax({
  79. method: "POST",
  80. dataType: "json",
  81. crossDomain: false,
  82. url: globalConfig.context + "/api/admin/intellectual",
  83. data: {
  84. id: this.props.data.id,
  85. uid: this.props.uid,
  86. intellectualPropertyNumber: values.intellectualPropertyNumber,
  87. intellectualPropertyName: values.intellectualPropertyName,
  88. catagory: values.catagory,
  89. obtainWay: values.obtainWay,
  90. sortNumber: values.sortNumber,
  91. authorizationNumber: values.authorizationNumber,
  92. authorizationDateFormattedDate: values.authorizationDate._i || this.state.authorizationDateFormattedDate,
  93. propertyRightUrl: this.state.propertyRightUrl
  94. }
  95. }).done(function (data) {
  96. if (!data.error.length) {
  97. message.success('保存成功!');
  98. } else {
  99. message.warning(data.error[0].message);
  100. }
  101. }.bind(this)).always(function () {
  102. this.props.spinState(false);
  103. this.props.clickOk();
  104. this.props.form.resetFields();
  105. }.bind(this));
  106. }
  107. });
  108. },
  109. componentWillReceiveProps(nextProps) {
  110. if (!this.props.visible && nextProps.visible) {
  111. this.loadData(nextProps.data.id, nextProps.data.type);
  112. this.props.form.resetFields();
  113. };
  114. },
  115. render() {
  116. const FormItem = Form.Item;
  117. const { getFieldDecorator } = this.props.form;
  118. const formItemLayout = {
  119. labelCol: { span: 6 },
  120. wrapperCol: { span: 12 },
  121. };
  122. const _me = this;
  123. const theData = this.state;
  124. return (
  125. <Form horizontal onSubmit={this.handleSubmit}>
  126. <FormItem
  127. {...formItemLayout}
  128. label="知识产权编号"
  129. >
  130. {getFieldDecorator('intellectualPropertyNumber', {
  131. rules: [{ required: true, message: '请输入,知识产权编号不能为空!' }],
  132. initialValue: theData.intellectualPropertyNumber
  133. })(
  134. <Input placeholder="请输入知识产权编号" />
  135. )}
  136. </FormItem>
  137. <FormItem
  138. {...formItemLayout}
  139. label="知识产权名称"
  140. >
  141. {getFieldDecorator('intellectualPropertyName', {
  142. rules: [{ required: true, message: '请输入,知识产权名称不能为空!' }],
  143. initialValue: theData.intellectualPropertyName
  144. })(
  145. <Input placeholder="请输入知识产权名称" />
  146. )}
  147. </FormItem>
  148. <FormItem
  149. {...formItemLayout}
  150. label="排序号"
  151. >
  152. {getFieldDecorator('sortNumber', {
  153. rules: [{ required: true, message: '请输入,排序号不能为空!' }],
  154. initialValue: theData.sortNumber
  155. })(
  156. <Input placeholder="请输入排序号" />
  157. )}
  158. </FormItem>
  159. <FormItem
  160. {...formItemLayout}
  161. label="知识产权类型"
  162. >
  163. {getFieldDecorator('catagory', {
  164. rules: [{ required: true, message: '请选择,知识产权类型不能为空!' }],
  165. initialValue: theData.catagory
  166. })(
  167. <Select placeholder="请选择知识产权类型" style={{ width: 200 }}
  168. onChange={(e) => { this.state.catagory = e; }}>
  169. {this.state.catagoryOption}
  170. </Select>
  171. )}
  172. </FormItem>
  173. <FormItem
  174. {...formItemLayout}
  175. label="获得方式"
  176. >
  177. {getFieldDecorator('obtainWay', {
  178. rules: [{ required: true, message: '请选择,获得方式不能为空!' }],
  179. initialValue: theData.obtainWay
  180. })(
  181. <Select placeholder="请选择获得方式" style={{ width: 200 }}
  182. onChange={(e) => { this.state.obtainWay = e; }}>
  183. {this.state.intellectualGetOption}
  184. </Select>
  185. )}
  186. </FormItem>
  187. <FormItem
  188. {...formItemLayout}
  189. label="授权号"
  190. >
  191. {getFieldDecorator('authorizationNumber', {
  192. rules: [{ required: true, message: '请输入,授权号不能为空!' }],
  193. initialValue: theData.authorizationNumber
  194. })(
  195. <Input placeholder="请输入授权号" />
  196. )}
  197. </FormItem>
  198. <FormItem
  199. {...formItemLayout}
  200. label="授权日期"
  201. >
  202. {getFieldDecorator('authorizationDate', {
  203. rules: [{ type: 'object', required: true, message: '请选择,授权日期不能为空!' }],
  204. initialValue: !theData.authorizationDateFormattedDate ? null : moment(theData.authorizationDateFormattedDate, 'YYYY/MM/DD')
  205. })(
  206. <DatePicker style={{ width: 200 }}
  207. onChange={(data, dataString) => { this.state.authorizationDateFormattedDate = dataString }} />
  208. )}
  209. </FormItem>
  210. <div className="hrSituation-roster">
  211. <Upload
  212. name="ratepay"
  213. action={globalConfig.context + "/api/admin/uploadPropertyRight"}
  214. data={{ 'sign': 'property_right', 'uid': this.props.uid }}
  215. beforeUpload={beforeUploadFile}
  216. showUploadList={false}
  217. onChange={(info) => {
  218. if (info.file.status !== 'uploading') {
  219. console.log(info.file, info.fileList);
  220. }
  221. if (info.file.status === 'done') {
  222. if (!info.file.response.error.length) {
  223. message.success(`${info.file.name} 文件上传成功!`);
  224. } else {
  225. message.warning(info.file.response.error[0].message);
  226. return;
  227. };
  228. this.state.propertyRightUrl = info.file.response.data;
  229. } else if (info.file.status === 'error') {
  230. message.error(`${info.file.name} 文件上传失败。`);
  231. }
  232. }}
  233. >
  234. <Button><Icon type="upload" /> 上传知识产权证书 </Button>
  235. </Upload>
  236. <p style={{ margin: '10px 0' }}>{theData.propertyRightUrl ? <a onClick={newDownloadFile.bind(null, this.props.data.id, 'property_right', '/api/admin/downloadPropertyRight')}>{theData.propertyRightDownloadFileName}</a> : <span><Icon type="exclamation-circle" style={{ color: '#ffbf00', marginRight: '6px' }} />未上传知识产权证书!</span>}</p>
  237. {theData.type != 0 ? <p style={{ margin: '10px 0' }}>
  238. {theData.manuscript ? <a onClick={newDownloadFile.bind(null, this.props.data.id, 'manuscript', '/api/admin/downloadManuscript', this.props.data.type)}>稿件下载</a> : <span><Icon type="exclamation-circle" style={{ color: '#ffbf00', marginRight: '6px' }} />未上传稿件!</span>}
  239. </p> : <span></span>}
  240. </div>
  241. <FormItem>
  242. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  243. <Button type="ghost" style={{ marginLeft: '20px' }} onClick={this.props.closeModal}>取消</Button>
  244. </FormItem>
  245. </Form >
  246. );
  247. },
  248. }));
  249. const intellectualDesc = React.createClass({
  250. getInitialState() {
  251. return {
  252. visible: false,
  253. loading: false
  254. };
  255. },
  256. componentWillReceiveProps(nextProps) {
  257. this.state.visible = nextProps.showDesc
  258. },
  259. showModal() {
  260. this.setState({
  261. visible: true,
  262. });
  263. },
  264. handleOk() {
  265. this.setState({
  266. visible: false,
  267. });
  268. this.props.closeDesc(false, true);
  269. },
  270. handleCancel(e) {
  271. this.setState({
  272. visible: false,
  273. });
  274. this.props.closeDesc(false);
  275. },
  276. spinChange(e) {
  277. this.setState({
  278. loading: e
  279. });
  280. },
  281. render() {
  282. return (
  283. <div className="patent-addNew">
  284. <Spin spinning={this.state.loading} className='spin-box'>
  285. <Modal title="知识产权详情" visible={this.state.visible}
  286. onOk={this.handleOk} onCancel={this.handleCancel}
  287. width='600px'
  288. footer=''
  289. >
  290. <IntellectualDescFrom
  291. uid={this.props.uid}
  292. data={this.props.data}
  293. spinState={this.spinChange}
  294. closeModal={this.handleCancel}
  295. visible={this.state.visible}
  296. clickOk={this.handleOk} />
  297. </Modal>
  298. </Spin>
  299. </div>
  300. );
  301. },
  302. });
  303. export default intellectualDesc;