order.jsx 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607
  1. import React, { Component } from "react";
  2. import {
  3. Button,
  4. Form,
  5. Input,
  6. message,
  7. Spin,
  8. Select,
  9. Tabs,
  10. Table,
  11. Modal,
  12. } from "antd";
  13. import $ from "jquery/src/ajax";
  14. import { ChooseList } from "../../../manageCenter/order/orderNew/chooseList";
  15. import AddOrders from "../orderNew/addorders";
  16. import {
  17. getProcessStatus,
  18. getLiquidationStatus,
  19. getNewOrderStatus,
  20. ShowModal,
  21. } from "@/tools.js";
  22. const { TabPane } = Tabs;
  23. const FormItem = Form.Item;
  24. const Option = Select.Option;
  25. class OrderList extends Component {
  26. constructor(props) {
  27. super(props);
  28. this.state = {
  29. onelist: [
  30. {
  31. value: "0",
  32. label: "首付待付请",
  33. },
  34. {
  35. value: "1",
  36. label: "尾款待付清",
  37. },
  38. {
  39. value: "2",
  40. label: "已付请",
  41. },
  42. ],
  43. twolist: [
  44. {
  45. value: "0",
  46. label: "非特批",
  47. },
  48. {
  49. value: "1",
  50. label: "特批",
  51. },
  52. ],
  53. threelist: [
  54. {
  55. value: "0",
  56. label: "10万元以下",
  57. },
  58. {
  59. value: "1",
  60. label: "10万~20万",
  61. },
  62. {
  63. value: "2",
  64. label: "20万~30万",
  65. },
  66. {
  67. value: "3",
  68. label: "30万~40万",
  69. },
  70. {
  71. value: "4",
  72. label: "40万以上",
  73. },
  74. ],
  75. columns: [
  76. {
  77. title: "合同编号",
  78. dataIndex: "contractNo",
  79. key: "contractNo",
  80. },
  81. {
  82. title: "订单编号",
  83. dataIndex: "orderNo",
  84. key: "orderNo",
  85. },
  86. {
  87. title: "客户名称",
  88. dataIndex: "userName",
  89. key: "userName",
  90. },
  91. {
  92. title: "订单部门",
  93. dataIndex: "depName",
  94. key: "depName",
  95. },
  96. {
  97. title: "下单时间",
  98. dataIndex: "createDate",
  99. key: "createDate",
  100. },
  101. {
  102. title: "合同签订时间",
  103. dataIndex: "signDate",
  104. key: "signDate",
  105. },
  106. {
  107. title: "流程状态",
  108. dataIndex: "processStatus",
  109. key: "processStatus",
  110. render: (text, record) =>
  111. <span >
  112. {getProcessStatus(text)}
  113. </span>
  114. },
  115. {
  116. title: "签单金额(万元)",
  117. dataIndex: "totalAmount",
  118. key: "totalAmount",
  119. render: (text, record) =>
  120. <span >
  121. {text}
  122. </span>
  123. },
  124. {
  125. title: "开单金额(万元)",
  126. dataIndex: "invoiceAmount",
  127. key: "invoiceAmount",
  128. render: (text, record) =>
  129. <span >
  130. {text}
  131. </span>
  132. },
  133. {
  134. title: "已收款(万元)",
  135. dataIndex: "settlementAmount",
  136. key: "settlementAmount",
  137. render: (text, record) =>
  138. <span >
  139. {text}
  140. </span>
  141. },
  142. {
  143. title: "结算状态",
  144. dataIndex: "liquidationStatus",
  145. key: "liquidationStatus",
  146. render: (text, record) =>
  147. <span >
  148. {getLiquidationStatus(text)}
  149. </span>
  150. },
  151. {
  152. title: "是否特批",
  153. dataIndex: "approval",
  154. key: "approval",
  155. render: (text, record) =>
  156. <span >
  157. {["非特批", "特批"][text]}
  158. </span>
  159. },
  160. {
  161. title: "订单状态",
  162. dataIndex: "orderStatus",
  163. key: "orderStatus",
  164. render: (text, record) =>
  165. <span >
  166. {getNewOrderStatus(text)}
  167. </span>
  168. },
  169. ],
  170. pagination: {
  171. defaultCurrent: 1,
  172. defaultPageSize: 10,
  173. showQuickJumper: true,
  174. pageSize: 10,
  175. onChange: function (page) {
  176. this.loadData(page);
  177. }.bind(this),
  178. showTotal: function (total) {
  179. return "共" + total + "条数据";
  180. },
  181. },
  182. loading: false,
  183. changeList: undefined,
  184. searchValues: {},
  185. dataSource: [],
  186. details: false,
  187. };
  188. }
  189. changeList(arr) {
  190. const newArr = [];
  191. this.state.columns.forEach((item) => {
  192. arr.forEach((val) => {
  193. if (val === item.title) {
  194. newArr.push(item);
  195. }
  196. });
  197. });
  198. this.setState({
  199. changeList: newArr,
  200. });
  201. }
  202. // 重置
  203. resetAll() {
  204. this.setState(
  205. {
  206. searchValues: JSON.parse(JSON.stringify({})),
  207. selectedRowKeys: [],
  208. },
  209. () => {
  210. this.loadData();
  211. }
  212. );
  213. }
  214. // 列表接口
  215. loadData(pageNo) {
  216. const { searchValues, pagination } = this.state;
  217. this.setState({
  218. loading: true,
  219. });
  220. let prs = this.props.data;
  221. prs.pageNo = pageNo || 1;
  222. prs.pageSize = pagination.pageSize;
  223. let datas = Object.assign(searchValues, prs);
  224. $.ajax({
  225. method: "get",
  226. dataType: "json",
  227. crossDomain: false,
  228. url: globalConfig.context + "/api/admin/newOrder/statistics/orderList",
  229. data: datas,
  230. success: function (data) {
  231. ShowModal(this);
  232. this.setState({
  233. loading: false,
  234. });
  235. if (data.error && data.error.length === 0) {
  236. if (data.data.list) {
  237. pagination.current = data.data.pageNo;
  238. pagination.total = data.data.totalCount;
  239. if (data.data && data.data.list && !data.data.list.length) {
  240. pagination.current = 0;
  241. pagination.total = 0;
  242. }
  243. this.setState({
  244. dataSource: data.data.list,
  245. pagination: this.state.pagination,
  246. pageNo: data.data.pageNo,
  247. });
  248. } else {
  249. this.setState({
  250. dataSource: data.data,
  251. pagination: false,
  252. });
  253. }
  254. } else {
  255. message.warning(data.error[0].message);
  256. }
  257. }.bind(this),
  258. }).always(
  259. function () {
  260. this.setState({
  261. loading: false,
  262. });
  263. }.bind(this)
  264. );
  265. }
  266. //订单详情
  267. xiangqing(orderNos) {
  268. $.ajax({
  269. method: "get",
  270. dataType: "json",
  271. crossDomain: false,
  272. url: globalConfig.context + "/api/admin/newOrder/getOrderNewDetail",
  273. data: {
  274. orderNo: orderNos
  275. },
  276. success: function (data) {
  277. if (data.error.length || data.data.list == "") {
  278. if (data.error && data.error.length) {
  279. message.warning(data.error[0].message);
  280. }
  281. } else {
  282. let thisdata = data.data;
  283. this.setState(
  284. {
  285. orderUid: thisdata.uid,
  286. userName: thisdata.userName,
  287. primaryOrderNo: thisdata.primaryOrder,
  288. additionalOrder: thisdata.additionalOrder,
  289. contractNo: thisdata.contractNo,
  290. // arrears: thisdata.arrears,
  291. orderData: thisdata,
  292. isAddition: thisdata.additionalOrder ? true : false,
  293. deleteSign: thisdata.deleteSign,
  294. },
  295. // () => {
  296. // if (this.state.orderData.deleteSign !== 3) {
  297. // this.xiangmu(this.state.orderNo);
  298. // this.jiedian(this.state.orderNo);
  299. // this.jiedianNew(this.state.orderNo);
  300. // }
  301. // }
  302. );
  303. }
  304. }.bind(this)
  305. });
  306. }
  307. createTabs(orderNos) {
  308. $.ajax({
  309. url: globalConfig.context + "/api/admin/orderChange/getOrderChange",
  310. method: "get",
  311. data: {
  312. orderNo: orderNos
  313. },
  314. success: (data) => {
  315. if (data.error && data.error.length) {
  316. message.warning(data.error[0].message)
  317. } else {
  318. this.setState({
  319. tabList: data.data
  320. })
  321. }
  322. }
  323. });
  324. }
  325. //整行点击
  326. tableRowClick(record) {
  327. this.xiangqing(record.orderNo)
  328. this.createTabs(record.orderNo)
  329. this.setState(
  330. {
  331. details: true,
  332. // type: record.type,
  333. // status: record.status,
  334. buttonStatus: true,
  335. // orderStatus: record.orderStatus,
  336. // id: record.id,
  337. // processStateText: record.processStateText,
  338. // orderNo: record.orderNo
  339. },
  340. // () => {
  341. // ;
  342. // // this.createTabs()
  343. // }
  344. );
  345. }
  346. // 获取原订单编号
  347. getPrimaryOrder(value) {
  348. this.setState({
  349. primaryOrder: value
  350. });
  351. }
  352. getAdditionalOrder(value) {
  353. this.setState({
  354. additionalOrder: value
  355. });
  356. }
  357. jiedianNew(orderNos) {
  358. $.ajax({
  359. method: "get",
  360. dataType: "json",
  361. crossDomain: false,
  362. url:
  363. globalConfig.context + "/api/admin/newOrderDun/selectListNewOrderDun",
  364. data: {
  365. orderNo: orderNos
  366. },
  367. success: function (data) {
  368. if (data.error && data.error.length) {
  369. message.warning(data.error[0].message);
  370. } else {
  371. let theArr = [];
  372. let thisData = [];
  373. let arr = data.data || [];
  374. let totalCui = 0;
  375. for (let i = 0; i < arr.length; i++) {
  376. thisData = arr[i];
  377. totalCui += +thisData.money;
  378. theArr.push({
  379. key: i,
  380. dunSubject: thisData.dunSubject
  381. ? thisData.dunSubject.toString()
  382. : "", //催款科目
  383. id: thisData.id, //节点Id
  384. money: thisData.money, //催款金额
  385. // orderNo: record ? record.orderNo : this.props.datauser.orderNo,
  386. commodityName: thisData.commodityName,
  387. projectType: thisData.projectType,
  388. dunTypeName: thisData.dunTypeName,
  389. status: thisData.status,
  390. waitDay: thisData.waitDay,
  391. effectiveCount: thisData.effectiveCount,
  392. startDate: thisData.startDate,
  393. dunType: thisData.dunType,
  394. appropriationRatio: thisData.appropriationRatio,
  395. customizeName: thisData.customizeName,
  396. customizeTimes: thisData.customizeTimes,
  397. tid: thisData.tid,
  398. });
  399. }
  400. if (!totalCui) {
  401. totalCui = 0;
  402. }
  403. totalCui = (Math.round(totalCui * 1000000) / 1000000).toFixed(6);
  404. this.setState({
  405. contactListNew: theArr,
  406. totalCui
  407. });
  408. }
  409. }.bind(this)
  410. }).always(
  411. function () {
  412. this.setState({
  413. loading: false
  414. });
  415. }.bind(this)
  416. );
  417. }
  418. closeDesc(e, s) {
  419. // this.state.activeKey = "a";
  420. // this.state.userDetaile = false;
  421. // this.state.signBillVisible = false;
  422. this.state.details = e;
  423. if (s) {
  424. this.loadData(this.state.pageNo);
  425. }
  426. }
  427. componentWillMount() {
  428. this.loadData();
  429. }
  430. render() {
  431. const { searchValues, onelist, twolist, threelist, columns, changeList, details } = this.state;
  432. return (
  433. <div className="user-content signatureStatistics">
  434. <Tabs defaultActiveKey="1">
  435. <TabPane tab="搜索" key="1">
  436. <div style={{ paddingTop: 10 }}>
  437. <Form layout="inline">
  438. <FormItem>
  439. <Input
  440. placeholder="请输入订单编号"
  441. value={searchValues["orderNo"]}
  442. onChange={(e) => {
  443. searchValues["orderNo"] = e.target.value
  444. this.setState({
  445. searchValues: searchValues,
  446. });
  447. }}
  448. />
  449. </FormItem>
  450. <FormItem>
  451. <Input
  452. placeholder="请输入客户姓名"
  453. value={searchValues["name"]}
  454. onChange={(e) => {
  455. searchValues["name"] = e.target.value
  456. this.setState({
  457. searchValues: searchValues,
  458. });
  459. }}
  460. />
  461. </FormItem>
  462. <FormItem>
  463. <Input
  464. placeholder="请输入合同编号"
  465. value={searchValues["contractNo"]}
  466. onChange={(e) => {
  467. searchValues["contractNo"] = e.target.value
  468. this.setState({
  469. searchValues: searchValues,
  470. });
  471. }}
  472. />
  473. </FormItem>
  474. <FormItem>
  475. <Select
  476. placeholder={"请选择结算状态"}
  477. style={{ width: 150 }}
  478. value={searchValues["liquidationStatus"]
  479. ? searchValues["liquidationStatus"]
  480. : undefined}
  481. onChange={(e) => {
  482. searchValues["liquidationStatus"] = e
  483. this.setState({
  484. searchValues: searchValues,
  485. });
  486. }}
  487. >
  488. {onelist.map((it, ins) => (
  489. <Option key={it.value}>{it.label}</Option>
  490. ))}
  491. </Select>
  492. </FormItem>
  493. <FormItem>
  494. <Select
  495. placeholder={"请选择特批状态"}
  496. style={{ width: 150 }}
  497. value={searchValues["approval"]
  498. ? searchValues["approval"]
  499. : undefined}
  500. onChange={(e) => {
  501. searchValues["approval"] = e
  502. this.setState({
  503. searchValues: searchValues,
  504. });
  505. }}
  506. >
  507. {twolist.map((it, ins) => (
  508. <Option key={it.value}>{it.label}</Option>
  509. ))}
  510. </Select>
  511. </FormItem>
  512. <FormItem>
  513. <Select
  514. placeholder={"请选择签单金额"}
  515. style={{ width: 150 }}
  516. value={searchValues["amountStatus"]
  517. ? searchValues["amountStatus"]
  518. : undefined}
  519. onChange={(e) => {
  520. searchValues["amountStatus"] = e
  521. this.setState({
  522. searchValues: searchValues,
  523. });
  524. }}
  525. >
  526. {threelist.map((it, ins) => (
  527. <Option key={it.value}>{it.label}</Option>
  528. ))}
  529. </Select>
  530. </FormItem>
  531. <Button
  532. type="primary"
  533. onClick={() => { this.loadData() }}
  534. style={{ marginRight: "10px" }}
  535. >
  536. 搜索
  537. </Button>
  538. <Button
  539. onClick={() => { this.resetAll() }}
  540. style={{ marginRight: "10px" }}
  541. >
  542. 重置
  543. </Button>
  544. </Form>
  545. </div>
  546. </TabPane>
  547. <TabPane tab="更改表格显示数据" key="2">
  548. <div style={{ marginLeft: 10 }}>
  549. <ChooseList
  550. columns={columns}
  551. changeFn={this.changeList.bind(this)}
  552. changeList={changeList}
  553. top={55}
  554. margin={11}
  555. />
  556. </div>
  557. </TabPane>
  558. </Tabs>
  559. <div className="patent-table">
  560. <Spin spinning={this.state.loading}>
  561. <Table
  562. bordered
  563. size="middle"
  564. columns={changeList ? changeList : columns}
  565. dataSource={this.state.dataSource}
  566. pagination={this.state.pagination}
  567. onRowClick={this.tableRowClick.bind(this)}
  568. />
  569. </Spin>
  570. </div>
  571. {
  572. details &&
  573. <Modal
  574. footer={null}
  575. width="900px"
  576. title="订单详情"
  577. visible={details}
  578. onCancel={() => {
  579. this.setState({
  580. details: false
  581. })
  582. }}
  583. >
  584. <AddOrders
  585. orderUid={this.state.orderUid}
  586. processStatus={0}
  587. data={this.state.orderData.orderNo}
  588. mark={this.state.buttonStatus}
  589. getPrimaryOrder={this.getPrimaryOrder}
  590. totalCui={this.state.totalCui}
  591. closeDesc={this.closeDesc}
  592. getAdditionalOrder={this.getAdditionalOrder}
  593. deleteSign={this.state.orderData.deleteSign}
  594. />
  595. </Modal>
  596. }
  597. </div>
  598. );
  599. }
  600. }
  601. export default OrderList;