comPatentChange.jsx 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363
  1. import React from 'react';
  2. import { Icon, Modal, message, Spin, Input, Select, DatePicker, Button, Row, Col, Table, Form } from 'antd';
  3. import './comprehensive.less';
  4. import ajax from 'jquery/src/ajax/xhr.js';
  5. import $ from 'jquery/src/ajax';
  6. import { copyrightStateList } from '../../../dataDic.js';
  7. import { getCopyrightState, getTime } from '../../../tools.js';
  8. const CopyrightDescForm = Form.create()(React.createClass({
  9. getInitialState() {
  10. return {
  11. visible: false,
  12. loading: false,
  13. stateOption: [],
  14. contactsOption: [],
  15. stateColumns: [{
  16. title: '申请状态',
  17. dataIndex: 'state',
  18. key: 'state',
  19. render: (text) => { return getCopyrightState(text) }
  20. }, {
  21. title: '处理时间',
  22. dataIndex: 'recordTimeFormattedDate',
  23. key: 'recordTimeFormattedDate',
  24. }, {
  25. title: '负责人',
  26. dataIndex: 'principal',
  27. key: 'principal',
  28. }, {
  29. title: '操作人',
  30. dataIndex: 'operator',
  31. key: 'operator',
  32. }, {
  33. title: '备注',
  34. dataIndex: 'comment',
  35. key: 'comment',
  36. }]
  37. };
  38. },
  39. componentWillMount() {
  40. let _me = this;
  41. copyrightStateList.map(function (item) {
  42. _me.state.stateOption.push(
  43. <Select.Option value={item.value} key={item.key}>{item.key}</Select.Option>
  44. )
  45. });
  46. },
  47. loadData(uid, cid, year) {
  48. this.setState({
  49. loading: true
  50. });
  51. $.when($.ajax({
  52. method: "post",
  53. dataType: "json",
  54. crossDomain: false,
  55. url: globalConfig.context + "/api/admin/cognizanceLog",
  56. data: {
  57. pid: this.state.xid
  58. }
  59. }), $.ajax({
  60. method: "get",
  61. dataType: "json",
  62. crossDomain: false,
  63. url: globalConfig.context + "/api/admin/getContacts"
  64. }), $.ajax({
  65. method: "get",
  66. dataType: "json",
  67. crossDomain: false,
  68. url: globalConfig.context + "/api/admin/getContacts",
  69. })).done((data1, data2, data3) => {
  70. //状态流转table
  71. if (data1[0].error.length) {
  72. message.warning(data1[0].error[0].message);
  73. return;
  74. };
  75. let _me = this;
  76. this.state.stateTable = [];
  77. data1[0].data.map(function (item) {
  78. this.state.stateTable.push({
  79. key: i,
  80. recordTimeFormattedDate: item.recordTimeFormattedDate,
  81. state: item.state,
  82. principal: item.principal,
  83. operator: item.operator,
  84. comment: item.comment
  85. });
  86. });
  87. //获取联系人
  88. if (data2[0].error.length) {
  89. message.warning(data2[0].error[0].message);
  90. return;
  91. };
  92. this.state.contactsOption = [];
  93. for (let item in data2[0].data) {
  94. let theData = data2[0].data[item];
  95. contactsOption.push(
  96. <Select.Option value={item} key={theData}>{theData}</Select.Option>
  97. );
  98. };
  99. //获取详细数据
  100. if (data3[0].error.length || !data3[0].data) {
  101. return;
  102. };
  103. let thisdata = data3[0].data;
  104. this.setState({
  105. });
  106. }).always(function () {
  107. this.setState({
  108. loading: false
  109. });
  110. }.bind(this));
  111. },
  112. componentWillReceiveProps(nextProps) {
  113. if (!this.state.visible && nextProps.showDesc) {
  114. this.loadData();
  115. };
  116. this.state.visible = nextProps.showDesc;
  117. },
  118. handleSubmit(e) {
  119. e.preventDefault();
  120. this.props.form.validateFields((err, values) => {
  121. if (values.state || values.principal || values.recordTime || values.comment) {
  122. if (!values.state && !values.principal && !values.recordTime) {
  123. message.warning("请填写完整的状态流转信息!");
  124. return;
  125. };
  126. };
  127. if (!err) {
  128. this.props.spinState(true);
  129. $.ajax({
  130. method: "POST",
  131. dataType: "json",
  132. crossDomain: false,
  133. url: globalConfig.context + "/api/admin/disposeCognizanceDetail",
  134. data: {
  135. id: this.props.data.cid,
  136. uid: this.props.data.uid,
  137. technicalField1: values.technicalField[0],
  138. technicalField2: values.technicalField[1],
  139. technicalField3: values.technicalField[2],
  140. basicResearchCost: values.basicResearchCost,
  141. contacts: values.contacts,
  142. accident: values.accident,
  143. certificateNumber: values.certificateNumber,
  144. recordTimeFormattedDate: values.recordTime ? values.recordTime.format("YYYY-MM-DD") : undefined,
  145. state: values.state,
  146. principal: values.principal,
  147. comment: values.comment,
  148. }
  149. }).done(function (data) {
  150. if (!data.error.length) {
  151. message.success('保存成功!');
  152. this.props.clickOk();
  153. this.props.form.resetFields();
  154. this.state.targetKeys = [];
  155. this.state.selectedKeys = [];
  156. this.props.spinState(false);
  157. } else {
  158. message.warning(data.error[0].message);
  159. this.props.spinState(false);
  160. }
  161. }.bind(this));
  162. }
  163. });
  164. },
  165. render() {
  166. const FormItem = Form.Item;
  167. const { getFieldDecorator } = this.props.form;
  168. //const theData = this.state.data;
  169. const theData = {};
  170. const formItemLayout = {
  171. labelCol: { span: 6 },
  172. wrapperCol: { span: 12 },
  173. };
  174. const _me = this;
  175. return (
  176. <Form onSubmit={this.handleSubmit} id="CopyrightDesc-form">
  177. <Row className="express-desc-row">
  178. <Col span={4}>公司名称</Col>
  179. <Col span={4}>{theData.nuitName}</Col>
  180. <Col span={4}>公司组织机构代码</Col>
  181. <Col span={4}>{theData.unitNumber}</Col>
  182. </Row>
  183. <Row className="express-desc-row">
  184. <Col span={4}>公司地址</Col>
  185. <Col span={4}>{theData.address}</Col>
  186. <Col span={4}>联系人</Col>
  187. <Col span={4}>
  188. {getFieldDecorator('contacts', {
  189. rules: [{ required: true, message: '此项为必填项!' }],
  190. initialValue: theData.contacts
  191. })(
  192. <Select
  193. style={{ display: 'inline-block', width: '200px' }}
  194. placeholder='选择一个联系人'>
  195. {this.state.contactsOption}
  196. </Select>
  197. )}
  198. </Col>
  199. </Row>
  200. <Row className="express-desc-row">
  201. <Col span={4}>编号</Col>
  202. <Col span={4}>xxxxxx</Col>
  203. <Col span={4}>外包公司</Col>
  204. <Col span={4}>
  205. {getFieldDecorator('contacts', {
  206. initialValue: theData.contacts
  207. })(
  208. <Input placeholder="请输入外包公司" />
  209. )}
  210. </Col>
  211. </Row>
  212. <Row className="express-desc-row">
  213. <Col span={3}>派单详情</Col>
  214. <Col span={16}>
  215. {getFieldDecorator('contacts', {
  216. initialValue: theData.contacts
  217. })(
  218. <Input type="textarea"
  219. placeholder="多行输入"
  220. rows={6} />
  221. )}
  222. </Col>
  223. </Row>
  224. <Row className="express-desc-row">
  225. <Col span={3}>备注</Col>
  226. <Col span={16}>
  227. {getFieldDecorator('contacts', {
  228. initialValue: theData.contacts
  229. })(
  230. <Input type="textarea"
  231. placeholder="多行输入"
  232. rows={6} />
  233. )}
  234. </Col>
  235. </Row>
  236. <Row className="express-desc-row">
  237. <Col span={3}>软著名称</Col>
  238. <Col span={6}>
  239. {getFieldDecorator('contacts', {
  240. initialValue: theData.contacts
  241. })(
  242. <Input placeholder="请输入软著名称" />
  243. )}
  244. </Col>
  245. </Row>
  246. <Row className="express-desc-row">
  247. <Col span={3}>下证时间(预计)</Col>
  248. <Col span={6}>
  249. {getFieldDecorator('contacts', {
  250. initialValue: theData.contacts
  251. })(
  252. <DatePicker />
  253. )}
  254. </Col>
  255. </Row>
  256. <p>状态流转记录: </p>
  257. <Table style={{ margin: '10px 0' }}
  258. pagination={false}
  259. dataSource={this.state.stateTable}
  260. columns={this.state.stateColumns} />
  261. <div className="clearfix">
  262. <FormItem className="third-item"
  263. {...formItemLayout}
  264. label="状态流转"
  265. >
  266. {getFieldDecorator('state')(
  267. <Select placeholder="选择一个状态">{this.state.stateOption}</Select>
  268. )}
  269. </FormItem>
  270. <FormItem className="third-item"
  271. labelCol={{ span: 6 }}
  272. wrapperCol={{ span: 12 }}
  273. label="处理时间"
  274. >
  275. {getFieldDecorator('recordTime')(
  276. <DatePicker />
  277. )}
  278. </FormItem>
  279. <FormItem className="third-item"
  280. {...formItemLayout}
  281. label="负责人"
  282. >
  283. {getFieldDecorator('principal')(
  284. <Select placeholder="选择负责人">{this.props.authorOption}</Select>
  285. )}
  286. </FormItem>
  287. </div>
  288. <FormItem
  289. labelCol={{ span: 2 }}
  290. wrapperCol={{ span: 12 }}
  291. label="备注"
  292. >
  293. {getFieldDecorator('comment')(
  294. <Input />
  295. )}
  296. </FormItem>
  297. <FormItem style={{ marginTop: '20px' }}>
  298. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  299. <Button type="ghost" style={{ marginLeft: '20px' }} onClick={this.props.closeModal}>取消</Button>
  300. </FormItem>
  301. </Form>
  302. );
  303. }
  304. }));
  305. const CopyrightDesc = React.createClass({
  306. getInitialState() {
  307. return {
  308. visible: false,
  309. loading: false
  310. };
  311. },
  312. componentWillReceiveProps(nextProps) {
  313. this.state.visible = nextProps.showDesc
  314. },
  315. showModal() {
  316. this.setState({
  317. visible: true,
  318. });
  319. },
  320. handleOk() {
  321. this.setState({
  322. visible: false,
  323. });
  324. this.props.closeDesc(false, true);
  325. },
  326. handleCancel(e) {
  327. this.setState({
  328. visible: false,
  329. });
  330. this.props.closeDesc(false);
  331. },
  332. spinChange(e) {
  333. this.setState({
  334. loading: e
  335. });
  336. },
  337. render() {
  338. return (
  339. <div className="patent-addNew">
  340. <Spin spinning={this.state.loading} className='spin-box'>
  341. <Modal title="软著详情" visible={this.state.visible}
  342. onOk={this.handleOk} onCancel={this.handleCancel}
  343. width='800px'
  344. footer=''
  345. >
  346. <CopyrightDescForm
  347. visible={this.state.visible}
  348. authorOption={this.props.authorOption}
  349. data={this.props.data}
  350. spinState={this.spinChange}
  351. closeModal={this.handleCancel}
  352. clickOk={this.handleOk} />
  353. </Modal>
  354. </Spin>
  355. </div>
  356. );
  357. }
  358. });
  359. export default CopyrightDesc;