salary-management-front/pc4mobx/hrmSalary/pages/salary/components/taxAgentTable.js

/*
 * Author: 黎永顺
 * name: 个税扣缴义务人列表
 * Description:
 * Date: 2022/11/29
 */
import React, { Component } from "react";
import { WeaLocaleProvider, WeaTable } from "ecCom";
import { Dropdown, Menu } from "antd";
import * as API from "../../../apis/taxAgent";
import "./index.less";

const { getLabel } = WeaLocaleProvider;

class TaxAgentTable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: {
        query: false
      },
      dataSource: [],
      columns: [],
      pageInfo: {
        current: 1,
        pageSize: 10,
        total: 0
      }
    };
  }

  componentDidMount() {
    this.getTaxAgentList();
  }

  getTaxAgentList = () => {
    const { pageInfo, loading } = this.state;
    const { searchValue, onOperate } = this.props;
    const payload = {
      name: searchValue,
      ...pageInfo
    };
    this.setState({ loading: { ...loading, query: true } });
    API.getTaxAgentList(payload).then(({ status, data }) => {
      this.setState({ loading: { ...loading, query: false } });
      if (status) {
        const { pageNum: current, pageSize, total, columns, list: dataSource } = data;
        this.setState({
          pageInfo: { ...pageInfo, current, pageSize, total },
          dataSource,
          columns: _.map(columns, item => {
            if (item.dataIndex === "employeeRange") {
              return {
                ...item,
                render: (text, record) => {
                  return <a href="javaScript:void(0);" onClick={() => onOperate("edit", record.id, 2)}>{text}</a>;
                }
              };
            }
            return {
              ...item,
              render: (text) => {
                return <span className="tdEllipsis" title={text}>{text}</span>;
              }
            };
          })
        });
      }
    }).catch(() => {
      this.setState({ loading: { ...loading, query: false } });
    });
  };

  render() {
    const { dataSource, columns, pageInfo, loading } = this.state;
    const { onOperate, isChief } = this.props;
    const pagination = {
      ...pageInfo,
      showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
      showSizeChanger: true,
      showQuickJumper: true,
      pageSizeOptions: ["10", "20", "50", "100"],
      onShowSizeChange: (current, pageSize) => {
        this.setState({
          pageInfo: { ...pageInfo, current, pageSize }
        }, () => {
          this.getTaxAgentList();
        });
      },
      onChange: current => {
        this.setState({
          pageInfo: { ...pageInfo, current }
        }, () => {
          this.getTaxAgentList();
        });
      }
    };
    return (
      <WeaTable
        dataSource={dataSource}
        pagination={pagination}
        loading={loading.query}
        columns={[
          ...columns,
          {
            title: getLabel(30585, "操作"),
            key: "operation",
            width: 120,
            render: (text, record) =>
              <div className="operationWapper">
                <a href="javaScript:void(0);" style={{ marginRight: 10 }}
                   onClick={() => onOperate("edit", record.id)}>{getLabel(501169, "编辑")}</a>
                {
                  isChief &&
                  <a href="javaScript:void(0);" style={{ marginRight: 10 }}
                     onClick={() => onOperate("delete", record.id)}>{getLabel(535052, "删除")}</a>
                }
                <Dropdown
                  overlay={
                    <Menu>
                      <Menu.Item>
                        <a href="javascript:void(0)"
                           onClick={() => onOperate("log", record.id)}>{getLabel(545781, "操作日志")}</a>
                      </Menu.Item>
                    </Menu>
                  }>
                  <a href="javascript:void(0)"><i className="icon-coms-more"/></a>
                </Dropdown>
              </div>
          }
        ]}
      />
    );
  }
}

export default TaxAgentTable;