135 lines
3.7 KiB
JavaScript
135 lines
3.7 KiB
JavaScript
/*
|
|
* Author: 黎永顺
|
|
* Description: 总览
|
|
* Date: 2022-04-20 20:49:23
|
|
* LastEditTime: 2022-05-09 15:07:56
|
|
*/
|
|
import React, { Component } from "react";
|
|
import { Button, Icon, Spin, Tooltip } from "antd";
|
|
import { inject, observer } from "mobx-react";
|
|
import { WeaTable } from "ecCom";
|
|
import "./index.less";
|
|
|
|
@inject("standingBookStore")
|
|
@observer
|
|
export default class OverViewIndex extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
selectedRowKeys: [],
|
|
current: 1,
|
|
pageSize: 10,
|
|
tableData: {
|
|
list: [],
|
|
columns: [],
|
|
total: 0
|
|
}
|
|
};
|
|
}
|
|
|
|
componentDidMount() {
|
|
const { billMonth, paymentOrganization } = this.props;
|
|
this.getOverViewList({ billMonth, paymentOrganization });
|
|
}
|
|
|
|
getOverViewList = (payload = {}) => {
|
|
const { getOverViewList } = this.props.standingBookStore;
|
|
getOverViewList({ ...payload, current: 1 }).then(
|
|
({ list, columns = [], total }) => {
|
|
columns = _.map(
|
|
_.filter(columns, (it) => it.dataIndex !== "id"),
|
|
(it) => {
|
|
// if (it.dataIndex === "employeeId") {
|
|
// it = {
|
|
// ...it,
|
|
// width: 150,
|
|
// fixed: 'left'
|
|
// }
|
|
// }
|
|
return {
|
|
...it,
|
|
title: (
|
|
<span dangerouslySetInnerHTML={{ __html: it.title }}></span>
|
|
)
|
|
};
|
|
}
|
|
);
|
|
this.setState({
|
|
tableData: {
|
|
list,
|
|
columns,
|
|
total
|
|
}
|
|
});
|
|
}
|
|
);
|
|
};
|
|
handleExport = () => {
|
|
const { billMonth, paymentOrganization } = this.props;
|
|
const url = `${window.location
|
|
.origin}/api/bs/hrmsalary/welfare/overView/export?billMonth=${billMonth}&paymentOrganization=${paymentOrganization}`;
|
|
window.open(url, "_self");
|
|
};
|
|
|
|
render() {
|
|
const { remarks, billMonth, selectedKey, paymentOrganization } = this.props;
|
|
const { selectedRowKeys } = this.state;
|
|
const { loading } = this.props.standingBookStore;
|
|
let { list, columns, total } = this.state.tableData;
|
|
const pagination = {
|
|
total,
|
|
showTotal: (total) => `共 ${total} 条`,
|
|
showSizeChanger: true,
|
|
showQuickJumper: true,
|
|
pageSizeOptions: ["10", "20", "50", "100"],
|
|
onShowSizeChange: (current, pageSize) => {
|
|
this.setState({ current, pageSize });
|
|
this.getOverViewList({
|
|
billMonth, current,
|
|
pageSize, paymentOrganization
|
|
});
|
|
},
|
|
onChange: (current) => {
|
|
this.setState({ current });
|
|
this.getOverViewList({
|
|
billMonth, current,
|
|
pageSize: this.state.pageSize, paymentOrganization
|
|
});
|
|
}
|
|
};
|
|
return (
|
|
<div className="normalWapper">
|
|
<div className="topContent">
|
|
<div className="month">
|
|
<span>
|
|
账单月份
|
|
<Tooltip
|
|
placement="topLeft"
|
|
title="提示：正常缴纳，账单月份即社保福利缴纳月份">
|
|
<Icon type="question-circle"/>
|
|
</Tooltip>
|
|
</span>
|
|
<span>{billMonth}</span>
|
|
</div>
|
|
</div>
|
|
<div className="tabOption">
|
|
<Button type="primary" onClick={this.handleExport}>导出全部</Button>
|
|
</div>
|
|
{/* table */}
|
|
<div>
|
|
<Spin spinning={loading}>
|
|
<WeaTable
|
|
rowKey="id"
|
|
columns={columns}
|
|
dataSource={list}
|
|
loading={loading}
|
|
pagination={pagination}
|
|
scroll={{ x: 1200, y: "calc(100vh - 200px)" }}
|
|
/>
|
|
</Spin>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|