pressList.jsx 30 KB

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