| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434 | import React, { Component } from 'react';import $ from "jquery/src/ajax";import {  Spin,  Table,  message,  Tooltip, Tabs, Button, Modal} from "antd";import { ShowModal, getProjectStatus } from "@/tools";import FilterColumn from './filterColumn';import DetailsModal from './detailsModal/index';import OrderPaymentModal from './component/orderPaymentModal';import './index.less';import CheckProject from "../../../components/checkProject";import PayRecord from "../../../components/checkProject/payRecord";import { ChooseList } from "../../../order/orderNew/chooseList";import { getProjectName } from "../../../../tools";const { TabPane } = Tabs;class PayApplyReject extends Component {  constructor(props) {    super(props);    this.state = {      loading: true,      columns: [        {          title: "支付编号",          dataIndex: "key",          key: "key",        },        {          title: "项目编号",          dataIndex: "tid",          key: "tid",        },        {          title: "项目名称",          dataIndex: "pname",          key: "pname",        },        {          title: "项目状态",          dataIndex: "projectStatus",          key: "projectStatus",          render: (text) => {            return getProjectName(text);          },        },        {          title: "分类名称",          dataIndex: "cname",          key: "cname",        },        {          title: "合同编号",          dataIndex: "contractNo",          key: "contractNo",        },        {          title: "订单编号",          dataIndex: "orderNo",          key: "orderNo",        },        {          title: "客户名称",          dataIndex: "userName",          key: "userName",          width: 150,          render: (text) => {            return (              <Tooltip title={text}>                <div                // style={{                //   maxWidth: '150px',                //   overflow: 'hidden',                //   textOverflow: "ellipsis",                //   whiteSpace: 'nowrap',                // }}                >{text}</div>              </Tooltip>            )          },        },        {          title: "部门名称",          dataIndex: "depName",          key: "depName",          render: (text) => {            return (              <Tooltip placement="bottom" title={text && text.length > 9 ? text : ''}>                {text && text.length > 9 ? text.substr(0, 9) + "..." : text}              </Tooltip>            )          },        },        // {        //     title: "实际总付款",        //     dataIndex: "costAmount",        //     key: "costAmount",        // },        {          title: "付款类型",          dataIndex: "chooseType",          key: "chooseType",          render: (text) => {            return text == 0 ? '第三方成本' :              text == 1 ? '催款节点' : '官费';          },        },        {          title: "本次申请金额",          dataIndex: "applicationAmount",          key: "applicationAmount",          render: (text) => {            return isNaN(parseFloat(text)) ? text : parseFloat(text);          }        },        {          title: "已支付",          dataIndex: "paymentAmount",          key: "paymentAmount",          render: (text) => {            return isNaN(parseFloat(text)) ? text : parseFloat(text);          },        },        {          title: "供应商",          dataIndex: "companyName",          key: "companyName",        },        {          title: "申请人",          dataIndex: "aname",          key: "aname",        },        {          title: "财务名称",          dataIndex: "financeName",          key: "financeName",        },        {          title: "状态",          dataIndex: "status",          key: "status",          render: (text) => {            return text === 0 ? '审核' :              text === 1 ? '待支付' :                text === 2 ? '驳回' :                  text === 3 ? '已支付' :                    text === 4 ? '已取消' : '';          },        },        {          title: "创建时间",          dataIndex: "createTime",          key: "createTime",        },        {          title: '操作',          dataIndex: 'action',          key: 'action',          render: (text, record) => {            return (              <div style={{                display: 'flex',                alignItems: 'center',              }}>                <Button type="primary" size="small" onClick={(e) => {                  e.stopPropagation();                  this.setState({                    payRecordVisible: true,                    orderPaymentsId: record.id,                    tid: record.tid,                    projectType: record.projectType,                  })                }}>                  {                    record.status === 0 ? '待审核' :                      record.status === 1 ? '待支付' :                        record.status === 2 ? '查看详情' : '查看详情'                  }                </Button>                <Button                  type="primary"                  style={{                    marginLeft: "10px",                    background: "orangered",                    border: "none"                  }}                  size="small"                  onClick={(e) => {                    e.stopPropagation();                    this.setState({                      paymentVisible: true,                      tid: record.tid,                      projectType: record.projectType,                    })                  }}>                  付款记录                </Button>              </div>            )          }        }      ],      dataSource: [],      selectedRowKeys: [],      pagination: {        defaultCurrent: 1,        defaultPageSize: 10,        showQuickJumper: true,        pageSize: 10,        onChange: function (page) {          this.loadData(page, this.state.searchInfor);        }.bind(this),        showTotal: function (total) {          return "共" + total + "条数据";        },      },      page: 1,      selectInfor: {},      visible: false,      paymentVisible: false,      tid: 0,      projectType: 0,      payRecordVisible: false,      orderPaymentsId: 0,    }    this.changeList = this.changeList.bind(this);  }  componentDidMount() {    this.loadData()  }  loadData(pageNo, data = {}) {    this.setState({      loading: true,    });    data.pageNo = pageNo || 1;    data.pageSize = this.state.pagination.pageSize;    data.status = 2;   //驳回状态    data.permissionsGrade = 3;    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/company/selectPaymentList",      data: data,      success: function (data) {        ShowModal(this);        let theArr = [];        if (data.error.length || data.data.list == "") {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          }        } else {          this.setState({            page: data.data.pageNo          });          for (let i = 0; i < data.data.list.length; i++) {            let thisdata = data.data.list[i];            let obj = thisdata;            obj.key = thisdata.id;            theArr.push(obj);          }          this.state.pagination.total = data.data.totalCount;        }        if (data.data && data.data.list && !data.data.list.length) {          this.state.pagination.total = 0;        }        this.setState({          dataSource: theArr,          pageNo: pageNo,          pagination: this.state.pagination,        });      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  }  tableRowClick(record) {    this.setState({      visible: true,      selectInfor: record,    })  }  changeList(arr) {    const newArr = [];    this.state.columns.forEach(item => {      arr.forEach(val => {        if (val === item.title) {          newArr.push(item);        }      });    });    this.setState({      changeList: newArr    });  }  render() {    return (      <div className="user-content">        <div className="content-title" style={{ marginBottom: 10 }}>          <span style={{ fontWeight: 900, fontSize: 16 }}>付款驳回列表</span>        </div>        <Tabs defaultActiveKey="1" onChange={this.callback} className="test">          <TabPane tab="搜索" key="1">            <div style={{ paddingTop: '10px' }}>              <FilterColumn                {...this.props}                onSearch={(data) => {                  this.setState({                    searchInfor: data                  });                  this.loadData(1, data);                }}                onResetSearch={() => {                  this.setState({                    searchInfor: {}                  });                  this.loadData();                }}              />            </div>          </TabPane>          <TabPane tab="更改表格显示数据" key="2">            <div style={{ marginLeft: 10 }}>              <ChooseList                columns={this.state.columns}                changeFn={this.changeList}                changeList={this.state.changeList}                top={55}                margin={11}              />            </div>          </TabPane>        </Tabs>        <div className="patent-table">          <Spin spinning={this.state.loading}>            <Table              columns={                this.state.changeList                  ? this.state.changeList                  : this.state.columns              }              dataSource={this.state.dataSource}              pagination={this.state.pagination}              onRowClick={(record) => {                this.tableRowClick(record)              }}              style={{                cursor: 'pointer',              }}              scroll={{ x: "max-content", y: 0 }}              bordered              size="small"            />          </Spin>        </div>        {          this.state.visible ?            <DetailsModal              tid={this.state.selectInfor.tid}              orderNo={this.state.selectInfor.orderNo}              projectType={this.state.selectInfor.projectType}              projectStatus={this.state.selectInfor.projectStatus}              taskName={this.state.selectInfor.pname}              taskID={this.state.selectInfor.tid}              visible={this.state.visible}              refreshList={() => {                this.loadData(this.state.page, this.state.searchInfor);              }}              visitCancel={() => {                this.setState({                  visible: false                })                this.loadData(this.state.page, this.state.searchInfor);              }} /> : <div />        }        {this.state.paymentVisible ?          <OrderPaymentModal            tid={this.state.tid}            visible={this.state.paymentVisible}            projectType={this.state.projectType}            onCancer={() => {              this.setState({                paymentVisible: false,                tid: 0,                projectType: 0,              });              this.loadData(this.state.page, this.state.searchInfor);            }}            onSuccess={() => {              this.setState({                paymentVisible: false,                tid: 0,                projectType: 0,              });              this.loadData(this.state.page, this.state.searchInfor);            }} /> :          <div />        }        {this.state.payRecordVisible ? <PayRecord          {...this.props}          payId={this.state.orderPaymentsId}          visible={this.state.payRecordVisible}          tid={this.state.tid}          projectType={this.state.projectType}          changeVisible={() => {            this.loadData(this.state.page, this.state.searchInfor);            this.setState({              payRecordVisible: false,              orderPaymentsId: 0,              tid: 0,              projectType: 0,            })          }}        /> : <div />}      </div>    );  }}export default PayApplyReject
 |