huiKuan.jsx 35 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212
  1. import React from "react";
  2. import $ from "jquery/src/ajax";
  3. import moment from "moment";
  4. import "./public.less";
  5. import {
  6. Form,
  7. Button,
  8. Input,
  9. Select,
  10. Spin,
  11. Table,
  12. message,
  13. Modal,
  14. Upload,
  15. DatePicker,
  16. Icon,
  17. Tabs,
  18. Popconfirm,
  19. Tag, Tooltip
  20. } from "antd";
  21. import {
  22. getProvinceA,
  23. getInvoiceStatus,
  24. getprovince,
  25. getStatus,
  26. getPeople,
  27. splitUrl,
  28. moneyVerify
  29. } from "@/tools";
  30. import { ChooseList } from "../../../../component/manageCenter/order/orderNew/chooseList";
  31. import "./huiKuan.less"
  32. import LogPopup from "../../../common/logPopup";
  33. import Cascaders from "../../../common/cascaders";
  34. const { RangePicker } = DatePicker;
  35. const FormItem = Form.Item;
  36. const { TextArea } = Input;
  37. const { TabPane } = Tabs;
  38. const HuiKuan = React.createClass({
  39. loadData(pageNo, pageSize) {
  40. this.state.data = [];
  41. this.setState({
  42. loading: true
  43. });
  44. $.ajax({
  45. method: "get",
  46. dataType: "json",
  47. crossDomain: false,
  48. url: globalConfig.context + "/api/admin/receivables/listReceivables",
  49. data: {
  50. pageNo: pageNo || 1,
  51. pageSize: pageSize || this.state.pagination.pageSize,
  52. // 订单状态 判断是否重复
  53. status: this.state.statusSearch,
  54. // 订单编号
  55. orderNo: this.state.orderNoSearch,
  56. // 合同编号
  57. contractNo: this.state.nameSearch,
  58. // 付款方
  59. corporateName: this.state.payFrom,
  60. // 营销员名字
  61. adminName: this.state.adminName,
  62. // 客户名称
  63. nickname: this.state.nickname,
  64. // 订单所属部门id
  65. deps: this.state.orderBranch,
  66. // 管理员部门id
  67. adminDepId: this.state.principalList
  68. },
  69. success: function (data) {
  70. let theArr = [];
  71. if (!data.data || !data.data.pagination.list) {
  72. if (data.error && data.error.length) {
  73. message.warning(data.error[0].message);
  74. }
  75. } else {
  76. for (let i = 0; i < data.data.pagination.list.length; i++) {
  77. let thisdata = data.data.pagination.list[i];
  78. theArr.push({
  79. key: thisdata.id,
  80. status: {
  81. first: thisdata.status,
  82. second: thisdata.inptStatus
  83. },
  84. orderNo: thisdata.orderNo,
  85. contractNo: thisdata.contractNo,
  86. corporateName: thisdata.corporateName,
  87. nickname: thisdata.nickname,
  88. totalAmount: thisdata.totalAmount,
  89. depName: thisdata.depName,
  90. amount: thisdata.amount,
  91. receivablesTimes: thisdata.receivablesTimes,
  92. createTimes: thisdata.createTimes,
  93. remarks: thisdata.remarks,
  94. financialPayNo: thisdata.financialPayNo,
  95. settlementAmount: thisdata.settlementAmount
  96. });
  97. }
  98. }
  99. this.state.pagination.current = data.data.pagination.pageNo;
  100. this.state.pagination.total = data.data.pagination.totalCount;
  101. if (
  102. data.data &&
  103. data.data.pagination.list &&
  104. !data.data.pagination.list.length
  105. ) {
  106. this.state.pagination.current = 0;
  107. this.state.pagination.total = 0;
  108. }
  109. this.setState({
  110. totalPage: data.data.pagination.totalPage,
  111. dataSource: theArr,
  112. pagination: this.state.pagination,
  113. totalHui: data.data.count ? data.data.count.totalAmount : 0,
  114. hui: data.data.count ? data.data.count.amount : 0
  115. });
  116. // console.log(this.state.dataSource);
  117. }.bind(this)
  118. }).always(
  119. function () {
  120. this.setState({
  121. loading: false
  122. });
  123. }.bind(this)
  124. );
  125. },
  126. departmentList() {
  127. this.setState({
  128. loading: true
  129. });
  130. $.ajax({
  131. method: "get",
  132. dataType: "json",
  133. crossDomain: false,
  134. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  135. data: {},
  136. success: function (data) {
  137. let thedata = data.data;
  138. let theArr = [];
  139. if (!thedata) {
  140. if (data.error && data.error.length) {
  141. message.warning(data.error[0].message);
  142. }
  143. } else {
  144. thedata.map(function (item, index) {
  145. theArr.push({
  146. key: index,
  147. name: item.name,
  148. id: item.id
  149. });
  150. });
  151. }
  152. this.setState({
  153. departmentArr: theArr
  154. });
  155. }.bind(this)
  156. }).always(
  157. function () {
  158. this.setState({
  159. loading: false
  160. });
  161. }.bind(this)
  162. );
  163. },
  164. getInitialState() {
  165. return {
  166. mergeModal: false,
  167. visible: false,
  168. selectedRowKeys: [], // Check here to configure the default column
  169. loading: false,
  170. searchMore: true,
  171. assignVisible: false,
  172. releaseDate: [],
  173. totalPage: 0,
  174. boHuivisible: false,
  175. selectedRows: [],
  176. // 弹出层数据
  177. modalData: {},
  178. // userName: "",
  179. contractNo: "",
  180. reason: "",
  181. foo: 0,
  182. // 子组件改变的表格title数组
  183. changeList: undefined,
  184. pagination: {
  185. defaultCurrent: 1,
  186. defaultPageSize: 10,
  187. showQuickJumper: true,
  188. pageSize: 10,
  189. onChange: function (page) {
  190. this.loadData(page);
  191. }.bind(this),
  192. showTotal: function (total) {
  193. return "共" + total + "条数据";
  194. }
  195. },
  196. paginationModal: {
  197. pageSize: 100,
  198. showTotal: function (total) {
  199. return "共" + total + "条数据";
  200. }
  201. },
  202. columns: [
  203. {
  204. title: "合同编号",
  205. dataIndex: "contractNo",
  206. key: "contractNo",
  207. // fixed: "left"
  208. className: "title-table"
  209. },
  210. {
  211. title: "订单编号",
  212. dataIndex: "orderNo",
  213. key: "orderNo",
  214. className: "title-table"
  215. },
  216. {
  217. title: "流水编号",
  218. dataIndex: "financialPayNo",
  219. key: "financialPayNo",
  220. className: "title-table"
  221. },
  222. {
  223. title: "客户名称",
  224. dataIndex: "nickname",
  225. key: "nickname",
  226. className: "title-table",
  227. width: 150,
  228. render: (text) => {
  229. return (
  230. <Tooltip title={text}>
  231. <div style={{
  232. maxWidth: '150px',
  233. overflow: 'hidden',
  234. textOverflow: "ellipsis",
  235. whiteSpace: 'nowrap',
  236. }}>{text}</div>
  237. </Tooltip>
  238. )
  239. },
  240. },
  241. {
  242. title: "付款方",
  243. dataIndex: "corporateName",
  244. key: "corporateName",
  245. className: "title-table"
  246. },
  247. {
  248. title: "合同额(万元)",
  249. dataIndex: "totalAmount",
  250. key: "totalAmount",
  251. className: "title-table"
  252. },
  253. {
  254. title: "已收款(万元)",
  255. dataIndex: "settlementAmount",
  256. key: "settlementAmount",
  257. className: "title-table"
  258. },
  259. {
  260. title: "本次回款(万元)",
  261. dataIndex: "amount",
  262. key: "amount",
  263. className: "title-table"
  264. },
  265. {
  266. title: "回款时间",
  267. dataIndex: "receivablesTimes",
  268. key: "receivablesTimes",
  269. className: "title-table"
  270. },
  271. {
  272. title: "状态",
  273. dataIndex: "status",
  274. key: "status",
  275. className: "title-table",
  276. render: status => {
  277. let str = "";
  278. let color = "";
  279. let str2 = "";
  280. let color2 = "";
  281. if (status.first == 0) {
  282. color = "#87d068";
  283. str = "正常"
  284. if (status.second == 1) {
  285. str = "内容缺失"
  286. color = "#000";
  287. } else if (status.second == 2) {
  288. str = "订单异常"
  289. color = "#000";
  290. } else if (status.second == 3) {
  291. str = "名称不一致"
  292. color = "#000";
  293. }
  294. } else if (status.first == 1) {
  295. str = "重复";
  296. color = "#f50";
  297. if (status.second == 1) {
  298. str2 = "内容缺失";
  299. color2 = "#000";
  300. } else if (status.second == 2) {
  301. str2 = "订单异常";
  302. color2 = "#000";
  303. } else if (status.second == 3) {
  304. str2 = "名称不一致";
  305. color2 = "#000";
  306. }
  307. } else {
  308. color = "#000";
  309. if (status.first == 2) {
  310. str = "订单异常";
  311. } else if (status.first == 3) {
  312. str = "金额异常";
  313. } else if (status.first == 4) {
  314. str = "名称异常";
  315. } else if (status.first == 5) {
  316. str = "已收款";
  317. } else if (status.first == 6) {
  318. str = "变更锁定";
  319. }
  320. }
  321. return (
  322. <div>
  323. <Tag color={color}>{str}</Tag>
  324. <Tag color={color2} style={{ display: status.first == 1 && status.second != 0 ? "inline-blcok" : "none" }}>{str2}</Tag>
  325. </div>
  326. );
  327. }
  328. },
  329. {
  330. title: "批量导入时间",
  331. dataIndex: "createTimes",
  332. key: "createTimes",
  333. className: "title-table"
  334. },
  335. {
  336. title: "备注",
  337. dataIndex: "remarks",
  338. key: "remarks",
  339. className: "title-table"
  340. }
  341. ],
  342. columnsDate: [
  343. {
  344. title: "编号",
  345. dataIndex: "id",
  346. key: "id"
  347. },
  348. {
  349. title: "订单编号",
  350. dataIndex: "orderno",
  351. key: "orderno"
  352. },
  353. {
  354. title: "开票金额(万元)",
  355. dataIndex: "amount",
  356. key: "amount"
  357. },
  358. {
  359. title: "申请时间",
  360. dataIndex: "createTime",
  361. key: "createTime"
  362. },
  363. {
  364. title: "开票状态",
  365. dataIndex: "status",
  366. key: "status",
  367. render: (text, record) => {
  368. return <div>{getInvoiceStatus(text, record)} <LogPopup id={record.id} /></div>;
  369. },
  370. }
  371. ],
  372. dataSource: [],
  373. upLoadFlag: false,
  374. upLoad: {
  375. name: "file",
  376. action: globalConfig.context + "/api/admin/receivables/import",
  377. headers: {
  378. authorization: "authorization-text"
  379. },
  380. onChange: info => {
  381. if (info.file.status == "done") {
  382. if (info.file.response.data == 1) {
  383. message.success("导入成功!");
  384. this.loadData();
  385. } else {
  386. message.warning(info.file.response.error[0].message);
  387. }
  388. }
  389. }
  390. }
  391. };
  392. },
  393. search() {
  394. this.setState({
  395. selectedRowKeys: []
  396. })
  397. this.loadData();
  398. },
  399. componentWillMount() {
  400. this.loadData();
  401. this.departmentList();
  402. // $("#rcDialogTitle0").on("click", function() {
  403. // alert(123);
  404. // console.log(123);
  405. // });
  406. },
  407. reset() {
  408. this.state.nameSearch = "";
  409. this.state.releaseDate = [];
  410. this.state.orderNoSearch = "";
  411. this.state.adminName = "";
  412. this.state.departmenttList = [];
  413. this.state.nickname = "";
  414. this.state.principalList = [];
  415. this.state.payFrom = "";
  416. this.state.statusSearch = [];
  417. this.state.orderBranch = undefined;
  418. this.state.statusSearch = [];
  419. this.Cascaders.empty();
  420. this.loadData();
  421. },
  422. changeList(arr) {
  423. const newArr = [];
  424. this.state.columns.forEach(item => {
  425. arr.forEach(val => {
  426. if (val === item.title) {
  427. newArr.push(item);
  428. }
  429. });
  430. });
  431. this.setState({
  432. changeList: newArr
  433. });
  434. },
  435. onSelectChange(selectedRowKeys) {
  436. // console.log("selectedRowKeys changed: ", selectedRowKeys);
  437. this.setState({ selectedRowKeys });
  438. },
  439. showModal() {
  440. this.setState({
  441. visible: true,
  442. choose: true
  443. });
  444. this.state.dataSource.forEach((item) => {
  445. if (item.key == this.state.selectedRowKeys[0]) {
  446. this.setState({
  447. modalData: JSON.parse(JSON.stringify(item))
  448. })
  449. // console.log(this.state.modalData);
  450. }
  451. })
  452. },
  453. tableRowClick(record) {
  454. this.setState({
  455. visible: true,
  456. choose: true
  457. });
  458. this.setState({
  459. modalData: JSON.parse(JSON.stringify(record))
  460. });
  461. },
  462. handleOk() {
  463. if (moneyVerify(this.state.modalData.amount)) return
  464. this.setState({ loading: true });
  465. if (!this.state.choose) {
  466. $.ajax({
  467. method: "POST",
  468. dataType: "json",
  469. crossDomain: false,
  470. url: globalConfig.context + "/api/admin/receivables/addReceivables",
  471. data: {
  472. orderNo: this.state.modalData.orderNo,
  473. amount: this.state.modalData.amount,
  474. receivablesTimes: this.state.modalData.receivablesTimes,
  475. // totalAmount: this.state.modalData.totalAmount,
  476. // contractNo: this.state.modalData.contractNo,
  477. // nickname: this.state.modalData.nickname,
  478. remarks: this.state.modalData.remarks,
  479. corporateName: this.state.modalData.corporateName,
  480. financialPayNo: this.state.modalData.financialPayNo
  481. },
  482. success: function (data) {
  483. if (data.error && data.error.length) {
  484. message.warning(data.error[0].message);
  485. } else {
  486. // console.log("成功", data);
  487. message.success("添加成功!")
  488. this.loadData();
  489. this.state.selectedRowKeys = [];
  490. this.setState({
  491. selectedRowKeys: this.state.selectedRowKeys
  492. });
  493. this.setState({ loading: false, visible: false });
  494. }
  495. }.bind(this)
  496. }).always(
  497. function () {
  498. this.setState({
  499. loading: false
  500. });
  501. }.bind(this)
  502. );
  503. } else {
  504. $.ajax({
  505. method: "POST",
  506. dataType: "json",
  507. crossDomain: false,
  508. url: globalConfig.context + "/api/admin/receivables/updateReceivables",
  509. data: {
  510. orderNo: this.state.modalData.orderNo,
  511. amount: this.state.modalData.amount,
  512. receivablesTimes: this.state.modalData.receivablesTimes,
  513. // totalAmount: this.state.modalData.totalAmount,
  514. // contractNo: this.state.modalData.contractNo,
  515. // nickname: this.state.modalData.nickname,
  516. corporateName: this.state.modalData.corporateName,
  517. financialPayNo: this.state.modalData.financialPayNo,
  518. remarks: this.state.modalData.remarks,
  519. id: this.state.modalData.key
  520. },
  521. success: function (data) {
  522. if (data.error && data.error.length) {
  523. message.warning(data.error[0].message);
  524. } else {
  525. // console.log("成功",data);
  526. message.success("修改成功!")
  527. this.loadData()
  528. this.state.selectedRowKeys = [];
  529. this.setState({
  530. selectedRowKeys: this.state.selectedRowKeys
  531. });
  532. this.setState({ loading: false, visible: false });
  533. }
  534. }.bind(this)
  535. }).always(
  536. function () {
  537. this.setState({
  538. loading: false
  539. });
  540. }.bind(this)
  541. );
  542. }
  543. // this.setState({ loading: false, visible: false });
  544. },
  545. handleCancel() {
  546. // this.loadData()
  547. this.setState({ visible: false });
  548. },
  549. callback(key) {
  550. // console.log(key);
  551. },
  552. delChecked() {
  553. // console.log("被删除列表",this.state.selectedRowKeys);
  554. let ids = this.state.selectedRowKeys.join(",")
  555. $.ajax({
  556. method: "POST",
  557. dataType: "json",
  558. crossDomain: false,
  559. url: globalConfig.context + "/api/admin/receivables/deleteReceivables",
  560. data: {
  561. ids,
  562. type: 0
  563. },
  564. success: function (data) {
  565. if (data.error && data.error.length) {
  566. message.warning(data.error[0].message);
  567. }
  568. message.success("删除成功!")
  569. }.bind(this)
  570. }).always(
  571. function () {
  572. this.loadData()
  573. this.state.selectedRowKeys = [];
  574. this.setState({
  575. selectedRowKeys: this.state.selectedRowKeys
  576. });
  577. }.bind(this)
  578. );
  579. // this.loadData()
  580. },
  581. delAllChecked() {
  582. // console.log("删除全部");
  583. $.ajax({
  584. method: "POST",
  585. dataType: "json",
  586. crossDomain: false,
  587. url: globalConfig.context + "/api/admin/receivables/deleteReceivables",
  588. data: {
  589. type: 1
  590. },
  591. success: function (data) {
  592. if (data.error && data.error.length) {
  593. message.warning(data.error[0].message);
  594. }
  595. message.success("删除全部成功!")
  596. }.bind(this)
  597. }).always(
  598. function () {
  599. this.loadData();
  600. this.state.selectedRowKeys = [];
  601. this.setState({
  602. selectedRowKeys: this.state.selectedRowKeys
  603. });
  604. }.bind(this)
  605. );
  606. // this.loadData()
  607. // console.log("aaa", $(".ant-modal-content"));
  608. },
  609. mergeAll() {
  610. // console.log("合并全部");
  611. this.setState({
  612. confirmLoading: true
  613. })
  614. $.ajax({
  615. method: "POST",
  616. dataType: "json",
  617. crossDomain: false,
  618. url: globalConfig.context + "/api/admin/receivables/batchImport",
  619. data: {},
  620. success: function (data) {
  621. if (data.error && data.error.length) {
  622. message.warning(data.error[0].message);
  623. } else {
  624. message.success("合并成功!请在收款列表中,查看已收款情况。");
  625. this.setState({
  626. mergeModal: false
  627. });
  628. }
  629. }.bind(this)
  630. }).always(
  631. function () {
  632. this.loadData();
  633. this.state.pagination.pageSize = 10
  634. this.state.selectedRowKeys = []
  635. this.setState({
  636. selectedRowKeys: this.state.selectedRowKeys,
  637. pagination: this.state.pagination,
  638. mergeModal: false,
  639. confirmLoading: false,
  640. })
  641. // window.location.reload();
  642. }.bind(this)
  643. );
  644. // message.success("合并成功!请在收款列表中,查看已收款情况。");
  645. },
  646. addModal() {
  647. this.state.modalData = {}
  648. this.setState({
  649. modalData: this.state.modalData,
  650. visible: true,
  651. choose: false
  652. })
  653. },
  654. download() {
  655. window.location.href =
  656. globalConfig.context +
  657. "/api/admin/receivables/downloadTemplate?" +
  658. "sign=receivbles_template";
  659. },
  660. // daoHui() {
  661. // window.location.href =
  662. // globalConfig.context +
  663. // "/api/admin/receivables/exportReceivables"
  664. // },
  665. render() {
  666. const formItemLayout = {
  667. labelCol: { span: 8 },
  668. wrapperCol: { span: 14 }
  669. };
  670. var departmentArr = this.state.departmentArr || [];
  671. const { loading, selectedRowKeys, visible } = this.state;
  672. const rowSelection = {
  673. selectedRowKeys,
  674. onChange: this.onSelectChange,
  675. hideDefaultSelections: true
  676. };
  677. var departmentArr = this.state.departmentArr || [];
  678. return (
  679. <div className="user-content" style={{ position: "relative" }}>
  680. <div className="content-title" style={{ marginBottom: 10 }}>
  681. <span style={{ fontWeight: 900, fontSize: 16 }}>批量回款</span>
  682. </div>
  683. <Tabs defaultActiveKey="1" onChange={this.callback} className="test">
  684. <TabPane tab="搜索" key="1">
  685. <div className="user-search" style={{ marginLeft: 10 }}>
  686. <Input
  687. placeholder="合同编号"
  688. value={this.state.nameSearch}
  689. onChange={e => {
  690. this.setState({ nameSearch: e.target.value });
  691. }}
  692. />
  693. <Input
  694. placeholder="订单编号"
  695. value={this.state.orderNoSearch}
  696. onChange={e => {
  697. this.setState({ orderNoSearch: e.target.value });
  698. }}
  699. />
  700. <Input
  701. placeholder="客户名称"
  702. value={this.state.nickname}
  703. onChange={e => {
  704. this.setState({ nickname: e.target.value });
  705. }}
  706. />
  707. <Select
  708. placeholder="状态"
  709. style={{ width: 150, marginRight: 10 }}
  710. value={this.state.statusSearch}
  711. onChange={e => {
  712. this.setState({ statusSearch: e });
  713. // console.log("状态", e);
  714. }}
  715. >
  716. <Select.Option key={0}>正常</Select.Option>
  717. <Select.Option key={1}>重复</Select.Option>
  718. <Select.Option key={2}>异常</Select.Option>
  719. </Select>
  720. <Input
  721. placeholder="订单负责人"
  722. value={this.state.adminName}
  723. onChange={e => {
  724. this.setState({ adminName: e.target.value });
  725. }}
  726. />
  727. <Cascaders
  728. ref={node => this.Cascaders = node}
  729. placeholder="订单所属部门"
  730. id="id"
  731. name="name"
  732. children="list"
  733. height={28}
  734. onSel={(e) => {
  735. this.setState({
  736. orderBranch: JSON.stringify(e),
  737. })
  738. }}
  739. />
  740. {/* <Select
  741. placeholder="订单所属部门"
  742. style={{ width: 150, marginRight: 10 }}
  743. value={this.state.orderBranch}
  744. onChange={e => {
  745. this.setState({ orderBranch: e });
  746. }}
  747. >
  748. {departmentArr.map(function (item) {
  749. return (
  750. <Select.Option key={item.id}>{item.name}</Select.Option>
  751. );
  752. })}
  753. </Select> */}
  754. <Select
  755. placeholder="负责人所属部门"
  756. style={{ width: 150, marginRight: 10 }}
  757. value={this.state.principalList}
  758. onChange={e => {
  759. this.setState({ principalList: e });
  760. }}
  761. >
  762. {departmentArr.map(function (item) {
  763. return (
  764. <Select.Option key={item.id}>{item.name}</Select.Option>
  765. );
  766. })}
  767. </Select>
  768. <Input
  769. placeholder="付款方"
  770. value={this.state.payFrom}
  771. onChange={e => {
  772. this.setState({ payFrom: e.target.value });
  773. }}
  774. />
  775. <Button
  776. type="primary"
  777. onClick={this.search}
  778. style={{ marginLeft: 10 }}
  779. >
  780. 搜索
  781. </Button>
  782. <Button onClick={this.reset}>重置</Button>
  783. </div>
  784. </TabPane>
  785. <TabPane tab="更改表格显示数据" key="2">
  786. <div style={{ marginLeft: 10 }}>
  787. <ChooseList
  788. columns={this.state.columns}
  789. changeFn={this.changeList}
  790. changeList={this.state.changeList}
  791. top={55}
  792. margin={11}
  793. display={"inline-block"}
  794. style={{ marginBottom: 17 }}
  795. />
  796. </div>
  797. </TabPane>
  798. <TabPane tab="操作" key="3">
  799. <div
  800. class={123}
  801. style={{
  802. position: "relative",
  803. top: 10,
  804. left: 10,
  805. // zIndex: 99,
  806. // left: 400,
  807. // transform: "translateX(-50%)",
  808. display: "inline-block",
  809. width: 122,
  810. height: 28,
  811. overflow: "hidden"
  812. }}
  813. >
  814. <Upload {...this.state.upLoad}>
  815. <Button
  816. type="primary"
  817. disabled={this.state.dataSource.length != 0 || this.props.look}
  818. >
  819. <Icon type="upload" />
  820. 导入回款列表
  821. </Button>
  822. </Upload>
  823. </div>
  824. <Button
  825. type="primary"
  826. style={{ marginBottom: 11, marginLeft: 25 }}
  827. onClick={this.download}
  828. >
  829. 下载回款列表模板
  830. </Button>
  831. {/* <Button
  832. type="primary"
  833. style={{ marginBottom: 20, marginLeft: 15 }}
  834. onClick={this.daoHui}
  835. >
  836. 导出回款列表
  837. </Button> */}
  838. <Button
  839. type="primary"
  840. style={{ marginBottom: 11, marginLeft: 15 }}
  841. disabled={this.state.selectedRowKeys.length == 1 ? false : true}
  842. onClick={this.showModal}
  843. >
  844. 修改单条数据
  845. </Button>
  846. <Button
  847. type="primary"
  848. style={{ marginBottom: 11, marginLeft: 15 }}
  849. onClick={this.addModal}
  850. >
  851. 添加单条数据
  852. </Button>
  853. <Popconfirm
  854. placement="top"
  855. title={"您确定要删除选中项的回款信息吗?删除后,不可以恢复!"}
  856. onConfirm={this.delChecked}
  857. okText="确定"
  858. cancelText="取消"
  859. >
  860. <Button
  861. primary
  862. type="danger"
  863. style={{ marginBottom: 11, marginLeft: 15 }}
  864. disabled={this.state.selectedRowKeys.length > 0 ? false : true}
  865. >
  866. 删除选中项
  867. </Button>
  868. </Popconfirm>
  869. <Popconfirm
  870. placement="top"
  871. title={"您确定要删除全部的回款信息吗?删除后,不可以恢复!"}
  872. onConfirm={this.delAllChecked}
  873. okText="确定"
  874. cancelText="取消"
  875. >
  876. <Button
  877. type="danger"
  878. style={{ marginBottom: 11, marginLeft: 15 }}
  879. disabled={this.state.dataSource.length == 0}
  880. >
  881. 删除全部
  882. </Button>
  883. </Popconfirm>
  884. <Button
  885. type="danger"
  886. style={{ marginBottom: 11, marginLeft: 15 }}
  887. disabled={this.state.dataSource.length == 0 || this.props.look}
  888. onClick={e => {
  889. this.loadData(1, 100);
  890. this.setState({
  891. mergeModal: true
  892. });
  893. }}
  894. >
  895. 确认合并回款
  896. </Button>
  897. <Button
  898. type="danger"
  899. style={{ marginBottom: 11, marginLeft: 15 }}
  900. disabled={this.state.dataSource.length == 0}
  901. onClick={e => {
  902. this.setState({
  903. selectedRowKeys: []
  904. });
  905. }}
  906. >
  907. 重置选项
  908. </Button>
  909. </TabPane>
  910. </Tabs>
  911. <div className="patent-table" style={{ position: "relative" }}>
  912. <Spin spinning={this.state.loading}>
  913. <Table
  914. columns={
  915. this.state.changeList == undefined
  916. ? this.state.columns
  917. : this.state.changeList
  918. }
  919. scroll={{ x: "max-content" }}
  920. dataSource={this.state.dataSource}
  921. pagination={this.state.pagination}
  922. rowSelection={rowSelection}
  923. onRowDoubleClick={this.tableRowClick.bind(this)}
  924. bordered
  925. size="small"
  926. />
  927. </Spin>
  928. <p
  929. style={{ display: "inline-block", fontSize: "14px", color: "red" }}
  930. >
  931. {
  932. <span style={{ marginRight: 10 }}>
  933. {`回款金额总计(万元):${this.state.hui ? this.state.hui : "0"}`}
  934. </span>
  935. }
  936. {
  937. <span>
  938. {`合同额总计(万元):${this.state.totalHui ? this.state.totalHui : "0"
  939. }`}
  940. </span>
  941. }
  942. </p>
  943. </div>
  944. <Modal
  945. width={500}
  946. visible={visible}
  947. title="收款记录"
  948. onOk={this.handleOk}
  949. onCancel={this.handleCancel}
  950. footer={[
  951. <Button key="back" onClick={this.handleCancel}>
  952. 取消
  953. </Button>,
  954. <Button
  955. key="submit"
  956. type="primary"
  957. loading={loading}
  958. disabled={this.props.look}
  959. onClick={this.handleOk}
  960. >
  961. 保存
  962. </Button>
  963. ]}
  964. >
  965. <p
  966. style={{
  967. marginBottom: 10,
  968. display: this.state.choose ? "block" : "none"
  969. }}
  970. >
  971. 合同编号:
  972. <Input
  973. style={{
  974. width: "auto"
  975. }}
  976. disabled={this.state.choose}
  977. value={this.state.modalData.contractNo}
  978. onChange={e => {
  979. let val = e.target.value;
  980. this.state.modalData.contractNo = val;
  981. this.setState({ modalData: this.state.modalData });
  982. }}
  983. />
  984. </p>
  985. <p style={{ marginBottom: 10 }}>
  986. 订单编号:
  987. <Input
  988. style={{ width: "auto" }}
  989. value={this.state.modalData.orderNo}
  990. onChange={e => {
  991. let val = e.target.value;
  992. this.state.modalData.orderNo = val;
  993. this.setState({ modalData: this.state.modalData });
  994. }}
  995. />
  996. </p>
  997. <p style={{ marginBottom: 10 }}>
  998. 流水编号:
  999. <Input
  1000. style={{ width: "auto" }}
  1001. value={this.state.modalData.financialPayNo}
  1002. onChange={e => {
  1003. let val = e.target.value;
  1004. this.state.modalData.financialPayNo = val;
  1005. this.setState({ modalData: this.state.modalData });
  1006. }}
  1007. />
  1008. </p>
  1009. <p style={{ marginBottom: 10 }}>
  1010. 付款方:
  1011. <Input
  1012. style={{ width: "auto" }}
  1013. value={this.state.modalData.corporateName}
  1014. onChange={e => {
  1015. let val = e.target.value;
  1016. this.state.modalData.corporateName = val;
  1017. this.setState({ modalData: this.state.modalData });
  1018. }}
  1019. />
  1020. </p>
  1021. <p
  1022. style={{
  1023. marginBottom: 10,
  1024. display: this.state.choose ? "block" : "none"
  1025. }}
  1026. >
  1027. 客户名称:
  1028. <Input
  1029. style={{
  1030. width: "auto"
  1031. }}
  1032. disabled={this.state.choose}
  1033. value={this.state.modalData.nickname}
  1034. onChange={e => {
  1035. let val = e.target.value;
  1036. this.state.modalData.nickname = val;
  1037. this.setState({ modalData: this.state.modalData });
  1038. }}
  1039. />
  1040. </p>
  1041. <p
  1042. style={{
  1043. marginBottom: 10,
  1044. display: this.state.choose ? "block" : "none"
  1045. }}
  1046. >
  1047. 合同额(万元):
  1048. <Input
  1049. style={{
  1050. width: "auto",
  1051. display: this.state.choose ? "inline-block" : "none"
  1052. }}
  1053. disabled={this.state.choose}
  1054. value={this.state.modalData.totalAmount}
  1055. onChange={e => {
  1056. let val = e.target.value;
  1057. this.state.modalData.totalAmount = val;
  1058. this.setState({ modalData: this.state.modalData });
  1059. }}
  1060. />
  1061. </p>
  1062. <p style={{ marginBottom: 10 }}>
  1063. 本次回款(万元):
  1064. <Input
  1065. style={{ width: "auto" }}
  1066. value={this.state.modalData.amount}
  1067. onChange={e => {
  1068. let val = e.target.value;
  1069. this.state.modalData.amount = val;
  1070. this.setState({ modalData: this.state.modalData });
  1071. }}
  1072. />
  1073. </p>
  1074. <p style={{ marginBottom: 10 }}>
  1075. 回款时间:
  1076. <DatePicker
  1077. showTime
  1078. placeholder="选择回款时间"
  1079. value={
  1080. this.state.modalData.receivablesTimes
  1081. ? moment(this.state.modalData.receivablesTimes, "YYYY-MM-DD")
  1082. : ""
  1083. }
  1084. onChange={(v, e) => {
  1085. this.state.modalData.receivablesTimes = e;
  1086. console.log(e);
  1087. this.setState({ modalData: this.state.modalData });
  1088. }}
  1089. onOk={() => { }}
  1090. />
  1091. </p>
  1092. <p
  1093. style={{
  1094. marginBottom: 10,
  1095. display: this.state.choose ? "block" : "none"
  1096. }}
  1097. >
  1098. 批量导入时间:
  1099. <Input
  1100. style={{ width: "auto" }}
  1101. value={this.state.modalData.createTimes}
  1102. disabled
  1103. onChange={e => {
  1104. let val = e.target.value;
  1105. this.state.modalData.createTimes = val;
  1106. this.setState({ modalData: this.state.modalData });
  1107. }}
  1108. />
  1109. </p>
  1110. <p style={{ marginBottom: 10 }}>
  1111. <span style={{ display: "inline-block", marginBottom: 20 }}>
  1112. 备注:
  1113. </span>
  1114. <TextArea
  1115. style={{ width: "70%" }}
  1116. value={this.state.modalData.remarks}
  1117. onChange={e => {
  1118. this.state.modalData.remarks = e.target.value;
  1119. // console.log(e);
  1120. this.setState({ modalData: this.state.modalData });
  1121. }}
  1122. placeholder="请输入备注信息"
  1123. autosize={{ minRows: 3, maxRows: 5 }}
  1124. />
  1125. </p>
  1126. </Modal>
  1127. <Modal
  1128. title="确认合并列表"
  1129. visible={this.state.mergeModal}
  1130. width={1300}
  1131. onOk={this.mergeAll}
  1132. confirmLoading={this.state.confirmLoading}
  1133. onCancel={() => {
  1134. this.setState({
  1135. mergeModal: false
  1136. });
  1137. }}
  1138. >
  1139. <div className="patent-table" style={{ position: "relative" }}>
  1140. <Spin spinning={this.state.loading}>
  1141. <Table
  1142. columns={this.state.columns}
  1143. scroll={{ x: "max-content" }}
  1144. dataSource={this.state.dataSource}
  1145. bordered
  1146. size="small"
  1147. pagination={this.state.paginationModal}
  1148. />
  1149. </Spin>
  1150. <p
  1151. style={{
  1152. display: "inline-block",
  1153. fontSize: "14px",
  1154. color: "red"
  1155. }}
  1156. >
  1157. {
  1158. <span style={{ marginRight: 10 }}>
  1159. {`回款金额总计(万元):${this.state.hui ? this.state.hui : "0"
  1160. }`}
  1161. </span>
  1162. }
  1163. {
  1164. <span>
  1165. {`合同额总计(万元):${this.state.totalHui ? this.state.totalHui : "0"
  1166. }`}
  1167. </span>
  1168. }
  1169. </p>
  1170. </div>
  1171. </Modal>
  1172. </div>
  1173. );
  1174. }
  1175. });
  1176. export default HuiKuan;