pressList.jsx 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949
  1. import React from "react";
  2. import {
  3. Button,
  4. Input,
  5. Select,
  6. Spin,
  7. Table,
  8. message,
  9. DatePicker,
  10. Form,
  11. Modal,
  12. Tabs,
  13. Tooltip,
  14. Tag,
  15. } from "antd";
  16. import $ from "jquery/src/ajax";
  17. import moment from "moment";
  18. import {
  19. getLiquidationStatus,
  20. getjiedian,
  21. getNewOrderStatus,
  22. getProjectStatus,
  23. } from "@/tools.js";
  24. import "./customer.less";
  25. import { ChooseList } from "./chooseList";
  26. import { getProjectName } from "../../../tools";
  27. import { salesList } from "@/dataDic.js"
  28. import DepartmentList from "../../../common/departmentList";
  29. import OrderDesc from "../../financialManage/orderDetail/orderDesc";
  30. const IntentionCustomer = Form.create()(
  31. React.createClass({
  32. loadData(pageNo) {
  33. this.setState({
  34. visitModul: false,
  35. loading: true,
  36. ispage: pageNo,
  37. modalVisible: false,
  38. });
  39. $.ajax({
  40. method: "get",
  41. dataType: "json",
  42. crossDomain: false,
  43. url: globalConfig.context + "/api/admin/newOrder/dunOrderNewList",
  44. data: {
  45. pageNo: pageNo || 1,
  46. pageSize: this.state.pagination.pageSize,
  47. name: this.state.customerName, //名称
  48. orderNo: this.state.orderNo, //订单编号
  49. contractNo: this.state.contractNo,
  50. depId: this.state.departmenttSearch, //订单部门
  51. adminName: this.state.adminName, //责任人名称
  52. starTime: this.state.releaseDate[0], //开始时间
  53. endTime: this.state.releaseDate[1], //结束时间
  54. newStatus: this.state.newStatus,
  55. amountStatus: this.state.amountStatus,//签单金额
  56. approval: this.state.approval,//是否特批
  57. memberType: this.state.memberType,//会员
  58. },
  59. success: function (data) {
  60. let theArr = [];
  61. if (data.error.length || data.data.list == "") {
  62. if (data.error && data.error.length) {
  63. message.warning(data.error[0].message);
  64. }
  65. } else {
  66. for (let i = 0; i < data.data.list.length; i++) {
  67. let thisdata = data.data.list[i];
  68. theArr.push({
  69. key: i + 1,
  70. id: thisdata.id, //ID
  71. contractNo: thisdata.contractNo,
  72. orderNo: thisdata.orderNo, //订单编号
  73. totalAmount: thisdata.totalAmount, //签单金额
  74. settlementAmount: thisdata.settlementAmount, //已收款
  75. accountsReceivable: thisdata.accountsReceivable, //应收款
  76. uncollectedAmount: thisdata.uncollectedAmount, //应收款
  77. appropriationRatio: thisdata.appropriationRatio, //拨款比例
  78. orderStatus: thisdata.orderStatus, //订单状态
  79. projectStatus: thisdata.projectStatus, //项目状态
  80. liquidationStatus: thisdata.liquidationStatus, //结算状态
  81. signDate: thisdata.signDate, //签单时间
  82. userName: thisdata.userName, //客户名称
  83. salesmanName: thisdata.salesmanName, //营销员名称
  84. dunSubject: thisdata.dunSubject, //催收科目
  85. startDate: thisdata.startDate, //催收启动时间
  86. depName: thisdata.depName, //部门名称
  87. dunStatus: thisdata.dunStatus == 0 ? "未触发" : "已触发",
  88. commodityName: thisdata.commodityName,
  89. approval: thisdata.approval, //特批状态
  90. memberType: thisdata.memberType, //会员状态
  91. });
  92. }
  93. this.state.pagination.total = data.data.totalCount;
  94. this.state.pagination.current = data.data.pageNo;
  95. }
  96. if (data.data && data.data.list && !data.data.list.length) {
  97. this.state.pagination.total = 0;
  98. }
  99. this.setState({
  100. dataSource: theArr,
  101. pageNo: pageNo,
  102. pagination: this.state.pagination,
  103. selectedRowKeys: [],
  104. });
  105. }.bind(this),
  106. }).always(
  107. function () {
  108. this.setState({
  109. loading: false,
  110. });
  111. }.bind(this)
  112. );
  113. },
  114. loadDatas(dunId) {
  115. this.setState({
  116. loading: true,
  117. });
  118. $.ajax({
  119. method: "get",
  120. dataType: "json",
  121. crossDomain: false,
  122. url: globalConfig.context + "/api/admin/newOrder/selectDunLogList",
  123. data: {
  124. dunId: dunId,
  125. },
  126. success: function (data) {
  127. let theArr = [];
  128. if (data.error.length || data.data == "") {
  129. if (data.error && data.error.length) {
  130. message.warning(data.error[0].message);
  131. }
  132. } else {
  133. for (let i = 0; i < data.data.length; i++) {
  134. let thisdata = data.data[i];
  135. theArr.push({
  136. key: i,
  137. id: thisdata.id, //ID
  138. dunId: thisdata.dunId, //催款ID
  139. dumBy: thisdata.dumBy, //催款人
  140. dumTime: thisdata.dumDate, //催款时间
  141. remarks: thisdata.remarks, //备注
  142. });
  143. }
  144. }
  145. this.setState({
  146. dataSources: theArr,
  147. });
  148. }.bind(this),
  149. }).always(
  150. function () {
  151. this.setState({
  152. loading: false,
  153. });
  154. }.bind(this)
  155. );
  156. },
  157. getInitialState() {
  158. return {
  159. showDesc: false,
  160. newStatus: 1,
  161. page: 1,
  162. releaseDate: [],
  163. selectedRowKeys: [],
  164. orgCodeUrl: [],
  165. paginations: false,
  166. pagination: {
  167. defaultCurrent: 1,
  168. defaultPageSize: 10,
  169. showQuickJumper: true,
  170. pageSize: 10,
  171. onChange: function (page) {
  172. this.loadData(page);
  173. }.bind(this),
  174. showTotal: function (total) {
  175. return "共" + total + "条数据";
  176. },
  177. },
  178. columns: [
  179. {
  180. title: "合同编号",
  181. dataIndex: "contractNo",
  182. key: "contractNo",
  183. render: (text, record) => {
  184. return (
  185. <Tooltip
  186. title={
  187. <Button
  188. type="primary"
  189. onClick={(e) => {
  190. e.stopPropagation();
  191. let input = document.getElementById("copyText");
  192. input.value = text;
  193. input.select();
  194. document.execCommand("copy");
  195. message.success("复制成功");
  196. }}
  197. >
  198. 复制
  199. </Button>
  200. }
  201. >
  202. <div>
  203. {text}
  204. <div style={{ display: "flex" }}>
  205. {/* <OrderItemStatus deleteSign={record.deleteSign} /> */}
  206. {
  207. record.approval == 1
  208. ? <Tag color="#faa755">特批待审</Tag> :
  209. record.approval == 2 && <Tag color="#ff0000">特批通过</Tag>
  210. }
  211. </div>
  212. </div>
  213. </Tooltip>
  214. );
  215. },
  216. },
  217. {
  218. title: "订单编号",
  219. dataIndex: "orderNo",
  220. key: "orderNo",
  221. render: (text, record) => {
  222. return (
  223. <Tooltip
  224. title={
  225. <Button
  226. type="primary"
  227. onClick={(e) => {
  228. e.stopPropagation();
  229. let input = document.getElementById("copyText");
  230. input.value = text;
  231. input.select();
  232. document.execCommand("copy");
  233. message.success("复制成功");
  234. }}
  235. >
  236. 复制
  237. </Button>
  238. }
  239. >
  240. <div>
  241. {text}
  242. <div>
  243. {record.totalAmount >= 10 && <Tag color="#ef7207">大客户</Tag>}
  244. {record.memberType == 1 && <Tag color="rgb(22, 155, 213)">会员</Tag>}
  245. </div>
  246. </div>
  247. </Tooltip>
  248. );
  249. },
  250. },
  251. {
  252. title: "客户名称",
  253. dataIndex: "userName",
  254. key: "userName",
  255. width: 150,
  256. render: (text) => {
  257. return (
  258. <Tooltip title={text}>
  259. <div
  260. style={{
  261. maxWidth: "150px",
  262. overflow: "hidden",
  263. textOverflow: "ellipsis",
  264. whiteSpace: "nowrap",
  265. }}
  266. >
  267. {text}
  268. </div>
  269. </Tooltip>
  270. );
  271. },
  272. },
  273. {
  274. title: "订单负责人",
  275. dataIndex: "salesmanName",
  276. key: "salesmanName",
  277. },
  278. {
  279. title: "订单部门",
  280. dataIndex: "depName",
  281. key: "depName",
  282. },
  283. {
  284. title: "订单状态",
  285. dataIndex: "orderStatus",
  286. key: "orderStatus",
  287. render: (text) => {
  288. return getNewOrderStatus(text);
  289. },
  290. },
  291. {
  292. title: "项目名称",
  293. dataIndex: "commodityName",
  294. key: "commodityName",
  295. },
  296. {
  297. title: "项目状态",
  298. dataIndex: "projectStatus",
  299. key: "projectStatus",
  300. render: (text) => {
  301. return getProjectName(text);
  302. },
  303. },
  304. {
  305. title: "签单金额(万元)",
  306. dataIndex: "totalAmount",
  307. key: "totalAmount",
  308. },
  309. {
  310. title: "已收款(万元)",
  311. dataIndex: "settlementAmount",
  312. key: "settlementAmount",
  313. },
  314. {
  315. title: "未收款(万元)",
  316. dataIndex: "uncollectedAmount",
  317. key: "uncollectedAmount",
  318. },
  319. {
  320. title: "拨款比例",
  321. dataIndex: "appropriationRatio",
  322. key: "appropriationRatio",
  323. },
  324. {
  325. title: "结算状态",
  326. dataIndex: "liquidationStatus",
  327. key: "liquidationStatus",
  328. render: (text) => {
  329. return getLiquidationStatus(text);
  330. },
  331. },
  332. {
  333. title: "催收科目",
  334. dataIndex: "dunSubject",
  335. key: "dunSubject",
  336. // render: text => {
  337. // return getjiedian(text);
  338. // }
  339. },
  340. {
  341. title: "应收款(万元)",
  342. dataIndex: "accountsReceivable",
  343. key: "accountsReceivable",
  344. },
  345. {
  346. title: "催款状态",
  347. dataIndex: "dunStatus",
  348. key: "dunStatus",
  349. },
  350. {
  351. title: "催款启动日期",
  352. dataIndex: "startDate",
  353. key: "startDate",
  354. },
  355. {
  356. title: "签单时间",
  357. dataIndex: "signDate",
  358. key: "signDate",
  359. },
  360. {
  361. title: "催收操作",
  362. dataIndex: "abc",
  363. key: "abc",
  364. render: (text, record) => {
  365. return (
  366. <div>
  367. <Button
  368. onClick={(e) => {
  369. e.stopPropagation(),
  370. this.visit(record);
  371. }}
  372. type="primary"
  373. >
  374. 添加催款记录
  375. </Button>
  376. <Button
  377. style={{ marginLeft: 5 }}
  378. onClick={(e) => {
  379. e.stopPropagation(),
  380. this.setState({
  381. visibles: true,
  382. });
  383. }}
  384. type="primary"
  385. >
  386. 查看催款记录
  387. </Button>
  388. </div>
  389. );
  390. },
  391. },
  392. ],
  393. data: [],
  394. dataSource: [],
  395. columnsX: [
  396. {
  397. title: "催款人",
  398. dataIndex: "dumBy",
  399. key: "dumBy",
  400. },
  401. {
  402. title: "催款时间",
  403. dataIndex: "dumTime",
  404. key: "dumTime",
  405. },
  406. {
  407. title: "催款情况",
  408. dataIndex: "remarks",
  409. key: "remarks",
  410. },
  411. ],
  412. dataSources: [],
  413. };
  414. },
  415. //页面加载函数
  416. componentWillMount() {
  417. this.loadData();
  418. },
  419. //进入新增拜访记录
  420. visit(record) {
  421. this.setState({
  422. visible: true,
  423. dunId: record.id,
  424. });
  425. },
  426. // 整行点击
  427. tableRowClick(record) {
  428. this.state.RowData = record;
  429. this.setState({
  430. showDesc: true,
  431. });
  432. },
  433. //新增催款记录
  434. examOk() {
  435. $.ajax({
  436. method: "post",
  437. dataType: "json",
  438. crossDomain: false,
  439. url: globalConfig.context + "/api/admin/newOrder/createDunLog",
  440. data: {
  441. dunId: this.state.dunId,
  442. dumTime: this.state.dumTime,
  443. remarks: this.state.remarks,
  444. },
  445. success: function (data) {
  446. if (data.error.length || data.data.list == "") {
  447. if (data.error && data.error.length) {
  448. message.warning(data.error[0].message);
  449. }
  450. } else {
  451. message.success("新增催款记录成功~");
  452. this.setState({
  453. visible: false,
  454. });
  455. this.loadData();
  456. this.resets();
  457. }
  458. }.bind(this),
  459. }).always(
  460. function () {
  461. this.setState({
  462. loading: false,
  463. });
  464. }.bind(this)
  465. );
  466. },
  467. //关闭输入理由框
  468. noCancel() {
  469. this.setState({
  470. noVisible: false,
  471. });
  472. },
  473. //搜索
  474. search() {
  475. this.setState({
  476. //signBillVisible:false
  477. });
  478. this.loadData();
  479. },
  480. //重置
  481. reset() {
  482. this.setState({
  483. signBillVisible: false,
  484. });
  485. this.state.orderNo = "";
  486. this.state.contractNo = "";
  487. this.state.customerName = "";
  488. this.state.adminName = "";
  489. this.state.departmenttSearch = undefined;
  490. this.state.releaseDate[0] = undefined;
  491. this.state.releaseDate[1] = undefined;
  492. this.state.amountStatus = undefined;
  493. this.state.approval = undefined;
  494. this.state.memberType = undefined;
  495. this.loadData();
  496. },
  497. resets() {
  498. this.state.orderNo = "";
  499. this.state.contractNo = "";
  500. this.state.customerName = "";
  501. this.state.adminName = "";
  502. this.state.departmenttSearch = undefined;
  503. this.state.releaseDate[0] = undefined;
  504. this.state.releaseDate[1] = undefined;
  505. this.state.amountStatus = undefined;
  506. this.state.approval = undefined;
  507. this.state.memberType = undefined;
  508. },
  509. getOrgCodeUrl(e) {
  510. this.setState({ orgCodeUrl: e });
  511. },
  512. //关闭详情
  513. visitCancel() {
  514. this.setState({
  515. visible: false,
  516. });
  517. this.resets();
  518. },
  519. visitOk() {
  520. this.setState({
  521. visible: false,
  522. });
  523. this.resets();
  524. },
  525. //关闭详情
  526. visitCancels() {
  527. this.setState({
  528. visibles: false,
  529. });
  530. this.resets();
  531. },
  532. // 关闭订单详情
  533. closeDesc(e, s) {
  534. this.state.showDesc = e;
  535. if (s) {
  536. this.loadData(this.state.page);
  537. }
  538. },
  539. //导出
  540. exportExec() {
  541. message.config({
  542. duration: 20,
  543. });
  544. let loading = message.loading("下载中...");
  545. this.setState({
  546. exportPendingLoading: true,
  547. });
  548. let data = {
  549. pageSize: 9999999,
  550. name: this.state.customerName, //名称
  551. orderNo: this.state.orderNo, //订单编号
  552. contractNo: this.state.contractNo,
  553. depId: this.state.departmenttSearch, //订单部门
  554. adminName: this.state.adminName, //责任人名称
  555. starTime: this.state.releaseDate[0], //开始时间
  556. endTime: this.state.releaseDate[1], //结束时间
  557. newStatus: this.state.newStatus,
  558. amountStatus: this.state.amountStatus,//签单金额
  559. approval: this.state.approval,//是否特批
  560. memberType: this.state.memberType,//会员
  561. };
  562. $.ajax({
  563. method: "get",
  564. dataType: "json",
  565. crossDomain: false,
  566. url: "/api/admin/newOrder/exportOrderDunData",
  567. data,
  568. success: function (data) {
  569. if (data.error.length === 0) {
  570. this.download(data.data);
  571. } else {
  572. message.warning(data.error[0].message);
  573. }
  574. }.bind(this),
  575. }).always(
  576. function () {
  577. loading();
  578. this.setState({
  579. exportPendingLoading: false,
  580. });
  581. }.bind(this)
  582. );
  583. },
  584. // 下载
  585. download(fileName) {
  586. window.location.href =
  587. globalConfig.context + "/open/download?fileName=" + fileName;
  588. },
  589. visitOks() {
  590. this.setState({
  591. visibles: false,
  592. });
  593. this.resets();
  594. },
  595. changeList(arr) {
  596. const newArr = [];
  597. this.state.columns.forEach((item) => {
  598. arr.forEach((val) => {
  599. if (val === item.title) {
  600. newArr.push(item);
  601. }
  602. });
  603. });
  604. this.setState({
  605. changeList: newArr,
  606. });
  607. },
  608. render() {
  609. const formItemLayout = {
  610. labelCol: { span: 8 },
  611. wrapperCol: { span: 14 },
  612. };
  613. const FormItem = Form.Item;
  614. const { RangePicker } = DatePicker;
  615. const rowSelection = {
  616. selectedRowKeys: this.state.selectedRowKeys,
  617. onChange: (selectedRowKeys, selectedRows) => {
  618. this.setState({
  619. modalVisible: false,
  620. selectedRows: selectedRows.slice(-1),
  621. selectedRowKeys: selectedRowKeys.slice(-1),
  622. });
  623. },
  624. onSelect: (recordt) => {
  625. this.setState({
  626. modalVisible: false,
  627. recordt: recordt.id,
  628. });
  629. },
  630. };
  631. const { TabPane } = Tabs;
  632. return (
  633. <div className="user-content">
  634. <div className="content-title" style={{ marginBottom: 10 }}>
  635. <span style={{ fontWeight: 900, fontSize: 16 }}>催款节点统计</span>
  636. </div>
  637. <div className="user-search">
  638. <Tabs
  639. defaultActiveKey="1"
  640. onChange={this.callback}
  641. className="test"
  642. >
  643. <TabPane tab="导出催款列表" key="2">
  644. <Button
  645. type="primary"
  646. onClick={this.exportExec}
  647. style={{
  648. float: "left",
  649. marginTop: 10,
  650. marginBottom: 10,
  651. marginLeft: 10,
  652. marginRight: 10,
  653. }}
  654. >
  655. 导出催款列表
  656. </Button>
  657. </TabPane>
  658. <TabPane tab="搜索" key="1">
  659. <Input
  660. placeholder="客户名称"
  661. style={{
  662. width: 170,
  663. marginBottom: 10,
  664. marginRight: 15,
  665. marginLeft: 15,
  666. }}
  667. value={this.state.customerName}
  668. onChange={(e) => {
  669. this.setState({ customerName: e.target.value });
  670. }}
  671. />
  672. <Input
  673. placeholder="营销员名称"
  674. style={{
  675. width: 170,
  676. marginBottom: 10,
  677. marginRight: 15,
  678. }}
  679. value={this.state.adminName}
  680. onChange={(e) => {
  681. this.setState({ adminName: e.target.value });
  682. }}
  683. />
  684. <Input
  685. placeholder="订单编号"
  686. style={{
  687. width: 170,
  688. marginBottom: 10,
  689. marginRight: 15,
  690. }}
  691. value={this.state.orderNo}
  692. onChange={(e) => {
  693. this.setState({ orderNo: e.target.value });
  694. }}
  695. />
  696. <Input
  697. placeholder="合同编号"
  698. style={{
  699. width: 170,
  700. marginBottom: 10,
  701. marginRight: 15,
  702. }}
  703. value={this.state.contractNo}
  704. onChange={(e) => {
  705. this.setState({ contractNo: e.target.value });
  706. }}
  707. />
  708. <DepartmentList
  709. value={this.state.departmenttSearch}
  710. onChange={(e) => {
  711. this.setState({ departmenttSearch: e });
  712. }}
  713. />
  714. <Select
  715. placeholder="选择催款节点类型"
  716. style={{ width: 170, marginRight: 15, marginLeft: 5 }}
  717. value={
  718. this.state.newStatus == 0 ? "旧催款节点" : "新催款节点"
  719. }
  720. onChange={(e) => {
  721. this.setState({ newStatus: e });
  722. }}
  723. >
  724. <Select.Option key={0}>{"旧催款节点"}</Select.Option>
  725. <Select.Option key={1}>{"新催款节点"}</Select.Option>
  726. </Select>
  727. <Select
  728. style={{ width: 170, marginRight: 15 }}
  729. placeholder="签单金额"
  730. value={this.state.amountStatus}
  731. onChange={(e) => {
  732. this.setState({
  733. amountStatus: e,
  734. });
  735. }}
  736. >
  737. <Option value="0">10万元以下</Option>
  738. <Option value="1">10~20万元</Option>
  739. <Option value="2">20~30万元</Option>
  740. <Option value="3">30~40万元</Option>
  741. <Option value="4">40万元以上</Option>
  742. </Select>
  743. <Select
  744. style={{ width: 170, marginRight: 15 }}
  745. placeholder="特批状态"
  746. value={this.state.approval}
  747. onChange={(e) => {
  748. this.setState({
  749. approval: e,
  750. });
  751. }}
  752. >
  753. <Option value="0">非特批</Option>
  754. <Option value="1">特批待审</Option>
  755. <Option value="2">特批通过</Option>
  756. <Option value="4">全部特批</Option>
  757. </Select>
  758. <Select
  759. style={{ width: 170, marginRight: 30 }}
  760. placeholder="会员"
  761. value={this.state.memberType}
  762. onChange={(e) => {
  763. this.setState({
  764. memberType: e,
  765. });
  766. }}
  767. >
  768. <Option value="0">否</Option>
  769. <Option value="1">是</Option>
  770. </Select>
  771. <span style={{ marginRight: 15, marginLeft: 15 }}>下单时间 :</span>
  772. <RangePicker
  773. value={[
  774. this.state.releaseDate[0]
  775. ? moment(this.state.releaseDate[0])
  776. : null,
  777. this.state.releaseDate[1]
  778. ? moment(this.state.releaseDate[1])
  779. : null,
  780. ]}
  781. onChange={(data, dataString) => {
  782. this.setState({ releaseDate: dataString });
  783. }}
  784. />
  785. <Button
  786. type="primary"
  787. onClick={this.search}
  788. style={{ marginLeft: 15, marginRight: 15, marginBottom: 10 }}
  789. >
  790. 搜索
  791. </Button>
  792. <Button onClick={this.reset}>重置</Button>
  793. </TabPane>
  794. <TabPane tab="更改表格显示数据" key="3">
  795. <div style={{ marginLeft: 10 }}>
  796. <ChooseList
  797. columns={this.state.columns}
  798. changeFn={this.changeList}
  799. changeList={this.state.changeList}
  800. top={55}
  801. margin={11}
  802. />
  803. </div>
  804. </TabPane>
  805. </Tabs>
  806. </div>
  807. <div className="patent-table">
  808. <Spin spinning={this.state.loading}>
  809. <Table
  810. columns={
  811. this.state.changeList
  812. ? this.state.changeList
  813. : this.state.columns
  814. }
  815. dataSource={this.state.dataSource}
  816. pagination={this.state.pagination}
  817. scroll={{ x: "max-content", y: 0 }}
  818. onRowDoubleClick={this.tableRowClick}
  819. bordered
  820. size="small"
  821. />
  822. </Spin>
  823. <Modal
  824. maskClosable={false}
  825. className="customeDetails"
  826. footer=""
  827. title="新增催款记录"
  828. width="500px"
  829. visible={this.state.visible}
  830. onOk={this.visitOk}
  831. onCancel={this.visitCancel}
  832. >
  833. <Form
  834. layout="horizontal"
  835. onSubmit={this.handleSubmit}
  836. id="demand-form"
  837. style={{ paddingBottom: "40px" }}
  838. >
  839. <Spin spinning={this.state.loading}>
  840. <div className="clearfix">
  841. <div className="clearfix">
  842. <FormItem
  843. className="half-item"
  844. {...formItemLayout}
  845. label="催款时间"
  846. >
  847. <DatePicker
  848. style={{
  849. marginTop: "2px",
  850. width: "240px",
  851. height: "27px",
  852. }}
  853. showTime
  854. format="YYYY-MM-DD"
  855. onOk={() => { }}
  856. value={
  857. this.state.dumTime
  858. ? moment(this.state.dumTime)
  859. : null
  860. }
  861. onChange={(data, dataString) => {
  862. this.setState({ dumTime: dataString });
  863. }}
  864. />
  865. </FormItem>
  866. </div>
  867. <div className="clearfix">
  868. <FormItem
  869. labelCol={{ span: 4 }}
  870. wrapperCol={{ span: 16 }}
  871. label="催款情况"
  872. >
  873. <Input
  874. type="textarea"
  875. placeholder="请输入催款情况"
  876. rows={4}
  877. value={this.state.remarks}
  878. onChange={(e) => {
  879. this.setState({ remarks: e.target.value });
  880. }}
  881. />
  882. </FormItem>
  883. </div>
  884. <div className="clearfix">
  885. <Button
  886. className="cancel"
  887. type="primary"
  888. onClick={this.examOk}
  889. style={{ marginLeft: "50px" }}
  890. htmlType="submit"
  891. >
  892. 添加
  893. </Button>
  894. <Button
  895. className="cancel"
  896. type="ghost"
  897. onClick={this.visitCancel}
  898. style={{ marginLeft: "50px" }}
  899. >
  900. 取消
  901. </Button>
  902. </div>
  903. </div>
  904. </Spin>
  905. </Form>
  906. </Modal>
  907. <Modal
  908. maskClosable={false}
  909. className="customeDetails"
  910. footer=""
  911. title="催款记录查看"
  912. width="500px"
  913. visible={this.state.visibles}
  914. onOk={this.visitOks}
  915. onCancel={this.visitCancels}
  916. >
  917. <div className="user-content">
  918. <div className="patent-table">
  919. <Spin spinning={this.state.loading}>
  920. <Table
  921. columns={this.state.columnsX}
  922. dataSource={this.state.dataSources}
  923. rowSelection={rowSelection}
  924. pagination={this.state.paginations}
  925. />
  926. </Spin>
  927. </div>
  928. </div>
  929. </Modal>
  930. </div>
  931. <textarea id="copyText" style={{ opacity: 0 }} />
  932. {/* 订单详情 */}
  933. <OrderDesc
  934. data={this.state.RowData}
  935. showDesc={this.state.showDesc}
  936. closeDesc={this.closeDesc.bind(this)}
  937. />
  938. </div>
  939. );
  940. },
  941. })
  942. );
  943. export default IntentionCustomer;