huiKuan.jsx 35 KB

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