salary-management-front/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/fieldMangComp.js

/*
 * Author: 黎永顺
 * name:字段管理
 * Description:
 * Date: 2023/2/24
 */
import React, { Component } from "react";
import { WeaCheckbox, WeaLocaleProvider, WeaTable } from "ecCom";
import { Col, Dropdown, Menu, message, Row } from "antd";
import AttendanceCustomFieldsModal from "./attendanceCustomFieldsModal";
import { getAttendanceFieldList, updateAttendanceFieldStatus } from "../../../../apis/attendance";
import TipLabel from "../../../../components/TipLabel";
import { fieldsColumns } from "../columns";

const getLabel = WeaLocaleProvider.getLabel;

class FieldMangComp extends Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: {
        query: false
      },
      dataSource: [{}],
      columns: fieldsColumns,
      pageInfo: {
        current: 1,
        pageSize: 10,
        total: 0
      },
      addPayload: {
        visible: false,
        title: getLabel(543381, "新建考勤自定义字段")
      }
    };
  }

  componentDidMount() {
    this.getAttendanceFieldList();
  }

  getAttendanceFieldList = (extraPayload = {}) => {
    const { loading, pageInfo } = this.state;
    const module = { ...pageInfo, ...extraPayload };
    this.setState({ loading: { ...loading, query: true } });
    getAttendanceFieldList(module).then(({ status, data }) => {
      this.setState({ loading: { ...loading, query: false } });
      if (status) {
        const { pageInfo: pageInfoData } = data;
        const { list: dataSource, columns, pageNum: current, pageSize, total } = pageInfoData;
        this.setState({
          pageInfo: { ...pageInfo, current, pageSize, total },
          dataSource, columns
        });
      }
    }).catch(() => this.setState({ loading: { ...loading, query: false } }));
  };
  handleTriggerAttendFileds = () => {
    const { addPayload } = this.state;
    this.setState({ addPayload: { ...addPayload, visible: !addPayload.visible } });
  };
  handleAttendanceFieldSwitch = ({ id }, enableStatus) => {
    const payload = { id, enableStatus: enableStatus === "1" };
    updateAttendanceFieldStatus(payload).then(({ status, errormsg }) => {
      if (status) {
        message.success(getLabel(30700, "操作成功"));
        this.getAttendanceFieldList();
      } else {
        message.error(errormsg || getLabel(30651, "操作失败"));
      }
    });
  };
  getColumns = () => {
    const { columns } = this.state;
    const { showOperateBtn } = this.props;
    return [..._.map(_.filter(columns, item => !!item.display), child => ({
      ...child,
      render: (text, record) => {
        switch (child.dataIndex) {
          case "enableStatus":
            return (
              <WeaCheckbox
                value={text} display="switch" disabled={!showOperateBtn}
                onChange={value => this.handleAttendanceFieldSwitch(record, value)}
              />
            );
          default:
            return <div dangerouslySetInnerHTML={{ __html: text }}/>;
        }
      }
    })), {
      dataIndex: "options",
      title: getLabel(30585, "操作"),
      width: 120,
      render: (_, record) => (
        <Dropdown
          overlay={
            <Menu>
              <Menu.Item>
                <a href="javascript:void(0);"
                   onClick={() => this.props.onFilterLog("log", record.id)}>{getLabel(545781, "操作日志")}</a>
              </Menu.Item>
            </Menu>
          }>
          <a href="javascript:void(0)"><i className="icon-coms-more"/></a>
        </Dropdown>)
    }];
  };

  render() {
    const { dataSource, pageInfo, loading, addPayload } = this.state;
    const { fieldName } = this.props;
    const pagination = {
      ...pageInfo,
      showTotal: total => `${getLabel(83698, "共")} ${total} ${getLabel(18256, "条")}`,
      showQuickJumper: true,
      showSizeChanger: true,
      pageSizeOptions: ["10", "20", "50", "100"],
      onShowSizeChange: (current, pageSize) => {
        this.setState({
          pageInfo: { ...pageInfo, current, pageSize }
        }, () => this.getAttendanceFieldList({ fieldName }));
      },
      onChange: current => {
        this.setState({
          pageInfo: { ...pageInfo, current }
        }, () => this.getAttendanceFieldList({ fieldName }));
      }
    };
    return (
      <Row gutter={20}>
        <Col xs={24} sm={24} md={16} lg={18}>
          <WeaTable
            columns={this.getColumns()}
            dataSource={dataSource}
            pagination={pagination}
            loading={loading.query}
          />
          <AttendanceCustomFieldsModal
            {...addPayload} onCancel={this.handleTriggerAttendFileds}
            onRefresh={this.getAttendanceFieldList}
          />
        </Col>
        <Col xs={24} sm={24} md={8} lg={6}>
          <TipLabel
            tipList={[
              `1、${getLabel(543382, "考勤字段包含自定义字段和考勤模块的统计字段，所有字段不可重名；")}`,
              `2、${getLabel(543383, "停用自定义字段将影响其参与计算的账套核算；")}`
            ]}
          />
        </Col>
      </Row>
    );
  }
}

export default FieldMangComp;