demandOrder.jsx 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634
  1. import React from 'react';
  2. import { Icon, Button, Input, InputNumber, Select, Spin, Table, message, Modal, Row, Col, DatePicker } from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. import moment from 'moment';
  6. import './techDemand.less';
  7. import { orderStatusList } from '../../dataDic.js';
  8. import { befoFile, getSearchUrl, getOrderStatus, companySearch } from '../../tools.js';
  9. import BatchImport from './batchImport';
  10. const DemandDetail = React.createClass({
  11. getInitialState() {
  12. return {
  13. visible: false,
  14. loading: false,
  15. columns: [
  16. {
  17. title: '状态',
  18. dataIndex: 'status',
  19. key: 'status',
  20. render: text => { return getOrderStatus(text) }
  21. }, {
  22. title: '操作时间',
  23. dataIndex: 'recordTimeFormattedDate',
  24. key: 'recordTimeFormattedDate',
  25. }, {
  26. title: '管理员',
  27. dataIndex: 'operator',
  28. key: 'operator',
  29. }, {
  30. title: '备注',
  31. dataIndex: 'comment',
  32. key: 'comment',
  33. }
  34. ],
  35. dataSource: [],
  36. };
  37. },
  38. loadLogs(id) {
  39. this.setState({
  40. loading: true
  41. });
  42. $.ajax({
  43. method: "get",
  44. dataType: "json",
  45. crossDomain: false,
  46. url: globalConfig.context + "/api/admin/portal/order/demandOrderLog",
  47. data: {
  48. demandOrderId: id
  49. },
  50. success: function (data) {
  51. let theArr = [];
  52. if (!data.data) {
  53. if (data.error && data.error.length) {
  54. message.warning(data.error[0].message);
  55. };
  56. } else {
  57. for (let i = 0; i < data.data.length; i++) {
  58. let thisdata = data.data[i];
  59. theArr.push({
  60. key: i,
  61. recordTime: thisdata.recordTime,
  62. status: thisdata.status,
  63. comment: thisdata.comment,
  64. operator: thisdata.operator,
  65. recordTimeFormattedDate: thisdata.recordTimeFormattedDate
  66. });
  67. };
  68. };
  69. this.setState({
  70. dataSource: theArr
  71. });
  72. }.bind(this),
  73. }).always(function () {
  74. this.setState({
  75. loading: false
  76. });
  77. }.bind(this));
  78. },
  79. handleSubmit(e) {
  80. //keyword长度判断
  81. if (this.state.orderStatus || this.state.comment || this.state.recordTime) {
  82. if (this.state.orderStatus && this.state.comment && this.state.recordTime) {
  83. } else {
  84. message.warning('请填写完整的状态流转记录!');
  85. return;
  86. };
  87. };
  88. this.setState({
  89. loading: true
  90. });
  91. $.ajax({
  92. method: "POST",
  93. dataType: "json",
  94. crossDomain: false,
  95. url: globalConfig.context + '/api/admin/portal/order/updateDemandOrder',
  96. data: {
  97. id: this.props.data.id,
  98. demandId: this.props.data.demandId,
  99. enclosureUrl: this.props.data.enclosureUrl,
  100. status: this.state.orderStatus || this.props.data.status,
  101. recordTimeFormattedDate: this.state.recordTime ? this.state.recordTime.format("YYYY-MM-DD HH:mm:ss") : undefined,
  102. comment: this.state.comment,
  103. intentionMoney: this.state.intentionMoney * 10000,
  104. contractMoney: this.state.contractMoney * 10000,
  105. commission: this.state.commission * 10000,
  106. serviceMoney: this.state.serviceMoney * 10000,
  107. }
  108. }).done(function (data) {
  109. this.setState({
  110. loading: false
  111. });
  112. if (!data.error.length) {
  113. message.success('保存成功!');
  114. this.handleOk();
  115. } else {
  116. message.warning(data.error[0].message);
  117. };
  118. }.bind(this));
  119. },
  120. handleCancel(e) {
  121. this.setState({
  122. visible: false,
  123. });
  124. this.props.closeDesc(false);
  125. },
  126. handleOk(e) {
  127. this.setState({
  128. visible: false,
  129. });
  130. this.props.closeDesc(false, true);
  131. },
  132. componentWillReceiveProps(nextProps) {
  133. if (!this.state.visible && nextProps.showDesc && nextProps.data) {
  134. this.loadLogs(nextProps.data.id);
  135. this.state.intentionMoney = nextProps.data.intentionMoney;
  136. this.state.contractMoney = nextProps.data.contractMoney;
  137. this.state.commission = nextProps.data.commission;
  138. this.state.serviceMoney = nextProps.data.serviceMoney;
  139. this.state.orderStatus = undefined;
  140. this.state.comment = undefined;
  141. this.state.recordTime = undefined;
  142. };
  143. this.state.visible = nextProps.showDesc;
  144. },
  145. render() {
  146. let theData = this.props.data;
  147. if (theData) {
  148. return (
  149. <div className="patent-desc">
  150. <Modal maskClosable={false} visible={this.state.visible}
  151. onOk={this.checkPatentProcess} onCancel={this.handleCancel}
  152. width='800px'
  153. footer={null}
  154. title="订单详情"
  155. className="demand-order-content">
  156. <Spin spinning={this.state.loading}>
  157. <Row>
  158. <Col span={2}>订单编号:</Col>
  159. <Col span={10}>{theData.serialNumber}</Col>
  160. <Col span={2}>订单状态:</Col>
  161. <Col span={10}>{getOrderStatus(theData.status)}</Col>
  162. </Row>
  163. <Row>
  164. <Col span={2}>需求编号:</Col>
  165. <Col span={10}>{theData.demandSerialNumber}</Col>
  166. <Col span={2}>需求名称:</Col>
  167. <Col span={10}>{theData.name}</Col>
  168. </Row>
  169. <Row>
  170. <Col span={2}>需求状态:</Col>
  171. <Col span={10}>{(() => {
  172. if (theData.deletedSign == 1) {
  173. return "已删除"
  174. } else if (theData.auditStatus != 3) {
  175. return "已下架"
  176. } else {
  177. return "正常"
  178. }
  179. })()}</Col>
  180. <Col span={2}>雇主名称:</Col>
  181. <Col span={10}>{theData.theName}</Col>
  182. </Row>
  183. <Row>
  184. <Col span={2}>相关附件:</Col>
  185. <Col span={10}>
  186. {theData.enclosureUrl ?
  187. <span className="download-file">
  188. <a onClick={() => { window.open(globalConfig.context + '/api/admin/portal/order/downloadDemandOrder?id=' + theData.id) }}>科技需求订单文件</a>
  189. </span>
  190. : <span><Icon type="exclamation-circle" style={{ color: '#ffbf00', marginRight: '6px' }} />未上传!</span>}
  191. </Col>
  192. <Col span={2}>接单时间:</Col>
  193. <Col span={10}>{theData.createTimeFormattedDate}</Col>
  194. </Row>
  195. <Row>
  196. <Col span={2}>意向金:</Col>
  197. <Col span={10}>
  198. <InputNumber
  199. value={this.state.intentionMoney}
  200. onChange={(e) => { this.setState({ intentionMoney: Math.round(e * 10000) / 10000 }) }} />
  201. <span> 万元</span>
  202. </Col>
  203. <Col span={2}>合同金:</Col>
  204. <Col span={10}>
  205. <InputNumber
  206. value={this.state.contractMoney}
  207. onChange={(e) => { this.setState({ contractMoney: Math.round(e * 10000) / 10000 }) }} />
  208. <span> 万元</span>
  209. </Col>
  210. </Row>
  211. <Row>
  212. <Col span={2}>佣金:</Col>
  213. <Col span={10}>
  214. <InputNumber
  215. value={this.state.commission}
  216. onChange={(e) => { this.setState({ commission: Math.round(e * 10000) / 10000 }) }} />
  217. <span> 万元</span>
  218. </Col>
  219. <Col span={2}>服务金:</Col>
  220. <Col span={10}>
  221. <InputNumber
  222. value={this.state.serviceMoney}
  223. onChange={(e) => { this.setState({ serviceMoney: Math.round(e * 10000) / 10000 }) }} />
  224. <span> 万元</span>
  225. </Col>
  226. </Row>
  227. <p>订单状态流转记录</p>
  228. <Table columns={this.state.columns}
  229. dataSource={this.state.dataSource}
  230. pagination={false} />
  231. <Row style={{ marginTop: '20px' }}>
  232. <Col span={2}>状态:</Col>
  233. <Col span={10}>
  234. <Select style={{ width: 160 }}
  235. value={this.state.orderStatus}
  236. onChange={(e) => { this.setState({ orderStatus: e }); }}>
  237. {(() => {
  238. let theArr = [];
  239. orderStatusList.map(function (item, i) {
  240. if (i < 6) {
  241. theArr.push(<Select.Option key={item.value}>{item.key}</Select.Option>)
  242. };
  243. });
  244. theArr.push(<Select.Option key="999">关闭</Select.Option>)
  245. return theArr;
  246. })()}
  247. </Select>
  248. </Col>
  249. <Col span={2}>时间:</Col>
  250. <Col span={10}>
  251. <DatePicker
  252. value={this.state.recordTime || null}
  253. onChange={(e) => { this.setState({ recordTime: e }); }} />
  254. </Col>
  255. </Row>
  256. <Row>
  257. <Col span={2}>备注:</Col>
  258. <Col span={20}>
  259. <Input value={this.state.comment} onChange={(e) => { this.setState({ comment: e.target.value }); }} />
  260. </Col>
  261. </Row>
  262. <Row>
  263. <Col span={2}></Col>
  264. <Col span={20}>
  265. <Button style={{ marginRight: '20px' }} type="primary" onClick={this.handleSubmit}>保存</Button>
  266. <Button className="set-submit" type="ghost" onClick={this.handleCancel}>取消</Button>
  267. </Col>
  268. </Row>
  269. </Spin>
  270. </Modal>
  271. </div>
  272. );
  273. } else {
  274. return <div></div>
  275. }
  276. },
  277. });
  278. const DemandOrderList = React.createClass({
  279. loadData(pageNo, apiUrl) {
  280. this.setState({
  281. loading: true
  282. });
  283. $.ajax({
  284. method: "get",
  285. dataType: "json",
  286. crossDomain: false,
  287. url: globalConfig.context + (apiUrl || this.props['data-listApiUrl']),
  288. data: {
  289. pageNo: pageNo || 1,
  290. pageSize: this.state.pagination.pageSize,
  291. uid: this.state.uid,
  292. username: this.state.username,
  293. unitName: this.state.unitName
  294. },
  295. success: function (data) {
  296. let theArr = [];
  297. if (!data.data && !data.data.list) {
  298. if (data.error && data.error.length) {
  299. message.warning(data.error[0].message);
  300. };
  301. } else {
  302. for (let i = 0; i < data.data.list.length; i++) {
  303. let thisdata = data.data.list[i];
  304. theArr.push({
  305. key: i,
  306. id: thisdata.id, //线索单/意向单ID
  307. serialNumber: thisdata.serialNumber, //线索单/意向单编号
  308. demandId: thisdata.demandId, //科技需求ID
  309. createTime: thisdata.createTime,
  310. enclosureUrl: thisdata.enclosureUrl,
  311. status: thisdata.status, //线索单/意向单状态
  312. intentionMoney: thisdata.intentionMoney / 10000, //意向金
  313. contractMoney: thisdata.contractMoney / 10000, //合同金
  314. commission: thisdata.commission / 10000, //佣金
  315. serviceMoney: thisdata.serviceMoney / 10000, //服务金
  316. name: thisdata.name, //需求名称,
  317. demandSerialNumber: thisdata.demandSerialNumber, //科技需求编号
  318. deletedSign: thisdata.deletedSign, //科技需求删除标记
  319. auditStatus: thisdata.auditStatus, //科技需求审核状态
  320. theName: thisdata.username || thisdata.unitName, //个人用户名称
  321. uid: thisdata.uid, //个人用户ID
  322. createTimeFormattedDate: thisdata.createTimeFormattedDate, //接单时间
  323. });
  324. };
  325. }
  326. this.state.pagination.current = data.data.pageNo;
  327. this.state.pagination.total = data.data.totalCount;
  328. this.setState({
  329. dataSource: theArr,
  330. pagination: this.state.pagination
  331. });
  332. }.bind(this),
  333. }).always(function () {
  334. this.setState({
  335. loading: false
  336. });
  337. }.bind(this));
  338. },
  339. getInitialState() {
  340. return {
  341. selectedRowKeys: [],
  342. selectedRows: [],
  343. loading: false,
  344. pagination: {
  345. defaultCurrent: 1,
  346. defaultPageSize: 10,
  347. showQuickJumper: true,
  348. pageSize: 10,
  349. onChange: function (page) {
  350. this.loadData(page);
  351. }.bind(this),
  352. showTotal: function (total) {
  353. return '共' + total + '条数据';
  354. }
  355. },
  356. columns: [
  357. {
  358. title: '编号',
  359. dataIndex: 'serialNumber',
  360. key: 'serialNumber',
  361. }, {
  362. title: '需求名称',
  363. dataIndex: 'name',
  364. key: 'name',
  365. }, {
  366. title: '需求编号',
  367. dataIndex: 'demandSerialNumber',
  368. key: 'demandSerialNumber',
  369. }, {
  370. title: '雇主编号',
  371. dataIndex: 'theName',
  372. key: 'theName',
  373. }, {
  374. title: '订单状态',
  375. dataIndex: 'auditStatus',
  376. key: 'auditStatus',
  377. render: (text, record) => {
  378. if (record.deletedSign == 1) {
  379. return "已删除"
  380. } else if (record.auditStatus != 3) {
  381. return "已下架"
  382. } else {
  383. return "正常"
  384. }
  385. }
  386. }, {
  387. title: '流程状态',
  388. dataIndex: 'status',
  389. key: 'status',
  390. render: (text, record) => { return getOrderStatus(text); }
  391. }, {
  392. title: '意向金(万元)',
  393. dataIndex: 'intentionMoney',
  394. key: 'intentionMoney',
  395. }, {
  396. title: '合同金(万元)',
  397. dataIndex: 'contractMoney',
  398. key: 'contractMoney',
  399. }, {
  400. title: '佣金(万元)',
  401. dataIndex: 'commission',
  402. key: 'commission',
  403. }, {
  404. title: '服务金(万元)',
  405. dataIndex: 'serviceMoney',
  406. key: 'serviceMoney',
  407. }, {
  408. title: '接单时间',
  409. dataIndex: 'createTimeFormattedDate',
  410. key: 'createTimeFormattedDate',
  411. }
  412. ],
  413. dataSource: [],
  414. };
  415. },
  416. getCompanyList() {
  417. this.setState({
  418. loading: true
  419. });
  420. $.ajax({
  421. method: "get",
  422. dataType: "json",
  423. crossDomain: false,
  424. url: globalConfig.context + "/api/admin/demand/unitNames",
  425. success: function (data) {
  426. let theArr = [];
  427. if (!data.data) {
  428. if (data.error && data.error.length) {
  429. message.warning(data.error[0].message);
  430. };
  431. } else {
  432. data.data.map(function (item) {
  433. theArr.push(
  434. <Select.Option value={item.uid} key={item.uid}>{item.unitName}</Select.Option>
  435. )
  436. });
  437. };
  438. this.setState({
  439. companyOption: theArr
  440. });
  441. }.bind(this),
  442. }).always(function () {
  443. this.setState({
  444. loading: false
  445. });
  446. }.bind(this));
  447. },
  448. getUserList() {
  449. this.setState({
  450. loading: true
  451. });
  452. $.ajax({
  453. method: "get",
  454. dataType: "json",
  455. crossDomain: false,
  456. url: globalConfig.context + "/api/admin/demand/userNames",
  457. success: function (data) {
  458. let theArr = [];
  459. if (!data.data) {
  460. if (data.error && data.error.length) {
  461. message.warning(data.error[0].message);
  462. };
  463. } else {
  464. data.data.map(function (item) {
  465. theArr.push(
  466. <Select.Option value={item.uid} key={item.uid}>{item.username}</Select.Option>
  467. )
  468. });
  469. };
  470. this.setState({
  471. userOption: theArr
  472. });
  473. }.bind(this),
  474. }).always(function () {
  475. this.setState({
  476. loading: false
  477. });
  478. }.bind(this));
  479. },
  480. componentWillMount() {
  481. let theArr = [], typeArr = [];
  482. orderStatusList.map(function (item) {
  483. theArr.push(
  484. <Select.Option value={item.value} key={item.key}>{item.key}</Select.Option>
  485. )
  486. });
  487. this.state.demandTypeOption = typeArr;
  488. this.state.orderStatusOption = theArr;
  489. // if (window.location.search) {
  490. // let theObj = getSearchUrl(window.location.search);
  491. // if (theObj.rid) {
  492. // theObj.id = theObj.rid;
  493. // if (theObj.rid != 'null') {
  494. // this.tableRowClick(theObj);
  495. // };
  496. // };
  497. // };
  498. this.loadData();
  499. this.getCompanyList();
  500. this.getUserList();
  501. },
  502. componentWillReceiveProps(nextProps) {
  503. if (this.props['data-listApiUrl'] != nextProps['data-listApiUrl']) {
  504. this.loadData(null, nextProps['data-listApiUrl']);
  505. this.state.selectedRowKeys = [];
  506. this.state.selectedRows = [];
  507. };
  508. },
  509. tableRowClick(record, index) {
  510. this.state.RowData = record;
  511. this.setState({
  512. showDesc: true
  513. });
  514. },
  515. delectRow() {
  516. let deletedIds = [];
  517. for (let idx = 0; idx < this.state.selectedRows.length; idx++) {
  518. let rowItem = this.state.selectedRows[idx];
  519. if (rowItem.id) {
  520. deletedIds.push(rowItem.id)
  521. };
  522. };
  523. this.setState({
  524. selectedRowKeys: [],
  525. loading: deletedIds.length > 0
  526. });
  527. $.ajax({
  528. method: "POST",
  529. dataType: "json",
  530. crossDomain: false,
  531. url: globalConfig.context + "/api/admin/demand/delete",
  532. data: {
  533. ids: deletedIds
  534. }
  535. }).done(function (data) {
  536. if (!data.error.length) {
  537. message.success('删除成功!');
  538. this.setState({
  539. loading: false,
  540. });
  541. } else {
  542. message.warning(data.error[0].message);
  543. };
  544. this.loadData();
  545. }.bind(this));
  546. },
  547. addClick() {
  548. this.state.RowData = {};
  549. this.setState({
  550. showDesc: true
  551. });
  552. },
  553. closeDesc(e, s) {
  554. this.state.showDesc = e;
  555. if (s) {
  556. this.loadData();
  557. };
  558. },
  559. search() {
  560. this.loadData();
  561. },
  562. reset() {
  563. this.state.uid = undefined;
  564. this.state.username = undefined;
  565. this.state.unitName = undefined;
  566. this.state.status = undefined;
  567. this.loadData();
  568. },
  569. render() {
  570. const rowSelection = {
  571. selectedRowKeys: this.state.selectedRowKeys,
  572. onChange: (selectedRowKeys, selectedRows) => {
  573. this.setState({
  574. selectedRows: selectedRows.splice(-1),
  575. selectedRowKeys: selectedRowKeys.splice(-1)
  576. });
  577. }
  578. };
  579. const hasSelected = this.state.selectedRowKeys.length > 0;
  580. return (
  581. <div className="user-content" >
  582. <div className="content-title">
  583. {this.props['data-listApiUrl'].indexOf('org') == -1 ? <span>个人需求订单管理</span> : <span>组织需求订单管理</span>}
  584. </div>
  585. <div className="user-search">
  586. <Select placeholder="选择状态" style={{ width: 160 }}
  587. value={this.state.status}
  588. onChange={(e) => { this.setState({ status: e }) }}>
  589. {this.state.orderStatusOption}
  590. </Select>
  591. {this.props['data-listApiUrl'].indexOf('org') == -1 ? <Select placeholder="选择用户名" style={{ width: 260 }}
  592. value={this.state.username}
  593. notFoundContent="未获取到用户列表"
  594. showSearch
  595. filterOption={companySearch}
  596. onChange={(e) => { this.setState({ username: e }) }}>
  597. {this.state.userOption}
  598. </Select> :
  599. <Select placeholder="选择用户名" style={{ width: 260 }}
  600. value={this.state.unitName}
  601. notFoundContent="未获取到用户列表"
  602. showSearch
  603. filterOption={companySearch}
  604. onChange={(e) => { this.setState({ unitName: e }) }}>
  605. {this.state.companyOption}
  606. </Select>}
  607. <Button type="primary" onClick={this.search}>搜索</Button>
  608. <Button onClick={this.reset}>重置</Button>
  609. </div>
  610. <div className="patent-table">
  611. <Spin spinning={this.state.loading}>
  612. <Table columns={this.state.columns}
  613. dataSource={this.state.dataSource}
  614. //rowSelection={rowSelection}
  615. pagination={this.state.pagination}
  616. onRowClick={this.tableRowClick} />
  617. </Spin>
  618. </div>
  619. <DemandDetail
  620. data={this.state.RowData}
  621. showDesc={this.state.showDesc}
  622. closeDesc={this.closeDesc} />
  623. </div >
  624. );
  625. }
  626. });
  627. export default DemandOrderList;
  628. // <Button style={{ background: "#3fcf9e", border: "none", color: "#fff" }}
  629. // disabled={!hasSelected}
  630. // onClick={this.delectRow}>删除<Icon type="minus" /></Button>