salary-management-front/pc4mobx/hrmSalary/pages/datapush/index.js

/*
  *  数据推送
  *
  * @Author:    黎永顺
  * @Date:      2024/11/19
  * @Wechat:
  * @Email:     971387674@qq.com
  * @description:
*/
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { WeaInputSearch, WeaLocaleProvider, WeaReqTop } from "ecCom";
import * as API from "../../apis/datapush";
import DatapushList from "./components/datapushList";
import PushRecord from "./components/pushRecord";
import DatapushDialog from "./components/DPDialog";
import PushDetailDialog from "./components/pushRecord/pushDetailDialog";
import { Button, message, Modal } from "antd";
import cs from "classnames";
import "./index.less";
import CreatePushRecordDialog from "./components/pushRecord/createPushRecordDialog";

const getLabel = WeaLocaleProvider.getLabel;

@inject("taxAgentStore", "baseFormStore")
@observer
class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedKey: "pushRecord", isQuery: false, query: { name: "" }, selectedRowKeys: [],
      loading: { push: false, withdraw: false }, visible: false,
      DPDialog: { visible: false, title: "", detail: {} }, //数据推送弹框
      pushDetailDialog: { visible: false, recordId: "" } //数据推送记录查看推送详情弹框
    };
  }

  handleAdvanceSearch = () => this.setState({ isQuery: !this.state.isQuery });
  handleOperate = (type, detail = {}) => {
    switch (type) {
      case "create":
      case "edit":
        const title = type === "create" ? getLabel(111, "新建") : getLabel(111, "编辑");
        this.setState({ DPDialog: { visible: true, title, detail } });
        break;
      case "del":
        Modal.confirm({
          title: getLabel(111, "信息确认"),
          content: getLabel(111, "确认要删除吗?"),
          onOk: () => {
            API.deletePushSetting({ id: detail }).then(({ status, errormsg }) => {
              if (status) {
                message.success(getLabel(111, "删除成功"));
                this.handleAdvanceSearch();
              } else {
                message.error(errormsg);
              }
            });
          }
        });
        break;
      case "view":
        this.setState({ pushDetailDialog: { visible: true, recordId: detail.id } });
        break;
      case "rowKey":
        this.setState({ selectedRowKeys: detail });
        break;
      case "addRecord":
        this.setState({ visible: true });
        break;
      case "push":
      case "batchpush":
        if (type === "batchpush" && _.isEmpty(this.state.selectedRowKeys)) {
          message.warning(getLabel(111, "请选择数据"));
          return;
        }
        this.pushRecords(type === "push" ? [detail.id] : this.state.selectedRowKeys);
        break;
      case "withdraw":
      case "batchwithdraw":
        if (type === "batchwithdraw" && _.isEmpty(this.state.selectedRowKeys)) {
          message.warning(getLabel(111, "请选择数据"));
          return;
        }
        this.withdrawRecords(type === "withdraw" ? [detail.id] : this.state.selectedRowKeys);
        break;
      default:
        break;
    }
  };
  pushRecords = (ids) => {
    this.setState({ loading: { ...this.state.loading, push: true } });
    API.pushRecords({ ids }).then(({ status, errormsg }) => {
      this.setState({ loading: { ...this.state.loading, push: false } });
      if (status) {
        this.handleAdvanceSearch();
        message.success(getLabel(111, "推送成功！"));
      } else {
        message.error(errormsg);
      }
    });
  };
  withdrawRecords = (ids) => {
    this.setState({ loading: { ...this.state.loading, withdraw: true } });
    API.withdrawRecords({ ids }).then(({ status, errormsg }) => {
      this.setState({ loading: { ...this.state.loading, withdraw: false } });
      if (status) {
        this.handleAdvanceSearch();
        message.success(getLabel(111, "撤回成功！"));
      } else {
        message.error(errormsg);
      }
    });
  };

  render() {
    const { selectedKey, DPDialog, isQuery, query, pushDetailDialog, loading, visible } = this.state;
    const { taxAgentStore: { PageAndOptAuth } } = this.props;
    const showOperateBtn = PageAndOptAuth.opts.includes("admin");
    const tabs = [
      {
        title: getLabel(111, "推送记录"), key: "pushRecord", showDropIcon: false, dropMenuDatas: [],
        buttons: showOperateBtn ? [
          <Button type="primary" onClick={() => this.handleOperate("addRecord")}
                  loading={loading.add}>{getLabel(111, "创建")}</Button>,
          <Button type="primary" onClick={() => this.handleOperate("batchpush")}
                  loading={loading.push}>{getLabel(111, "批量推送")}</Button>,
          <Button type="ghost" loading={loading.withdraw}
                  onClick={() => this.handleOperate("batchwithdraw")}>{getLabel(111, "批量撤回")}</Button>,
          <WeaInputSearch style={{ top: -3 }} value={query.name} onSearch={this.handleAdvanceSearch}
                          onChange={v => this.setState({ query: { ...query, name: v } })}/>
        ] : [<WeaInputSearch style={{ top: -3 }} value={query.name} onSearch={this.handleAdvanceSearch}
                             onChange={v => this.setState({ query: { ...query, name: v } })}/>],
        children: <PushRecord isQuery={isQuery} query={query} onChange={this.handleOperate}/>
      },
      {
        title: getLabel(111, "数据推送"), key: "datapush", showDropIcon: false, dropMenuDatas: [],
        buttons: showOperateBtn ? [
          <Button type="primary" onClick={() => this.handleOperate("create")}>{getLabel(111, "新建")}</Button>,
          <WeaInputSearch style={{ top: -3 }} value={query.name} onSearch={this.handleAdvanceSearch}
                          onChange={v => this.setState({ query: { ...query, name: v } })}/>
        ] : [<WeaInputSearch style={{ top: -3 }} value={query.name} onSearch={this.handleAdvanceSearch}
                             onChange={v => this.setState({ query: { ...query, name: v } })}/>],
        children: <DatapushList isQuery={isQuery} query={query} onChange={this.handleOperate}/>
      }
    ];
    return (
      <WeaReqTop
        title={getLabel(111, "数据推送")} icon={<i className="icon-coms-fa"/>} selectedKey={selectedKey}
        iconBgcolor="#F14A2D" tabDatas={tabs}
        className={cs("datapush_wrapper", { "reqZindex0": pushDetailDialog.visible })}
        buttonSpace={10} buttons={_.find(tabs, o => selectedKey === o.key).buttons}
        onChange={selectedKey => this.setState({
          selectedKey, pushDetailDialog: { ...pushDetailDialog, visible: false },
          DPDialog: { ...DPDialog, visible: false }
        })}
        showDropIcon={_.find(tabs, o => selectedKey === o.key).showDropIcon} onDropMenuClick={this.handleOperate}
        dropMenuDatas={_.find(tabs, o => selectedKey === o.key).dropMenuDatas}
      >
        {_.find(tabs, o => selectedKey === o.key).children}
        {/*数据推送框*/}
        <DatapushDialog {...DPDialog} onClose={() => this.setState({ DPDialog: { ...DPDialog, visible: false } })}
                        onSearch={this.handleAdvanceSearch}/>
        {/*推送记录查看详情*/}
        <PushDetailDialog {...pushDetailDialog} onClose={() => this.setState({
          pushDetailDialog: { ...pushDetailDialog, visible: false }
        })}/>
        <CreatePushRecordDialog visible={visible} onSuccess={this.handleAdvanceSearch}
                                onCancel={(callback) => this.setState({ visible: false }, () => callback && callback())}/>
      </WeaReqTop>
    );
  }
}

export default Index;