huiKuan.jsx 29 KB

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