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

91 lines
2.4 KiB
JavaScript

/*
* Author: 黎永顺
* name: 薪资账套
* Description:
* Date: 2022/12/6
*/
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { WeaInputSearch, WeaTop } from "ecCom";
import { Button } from "antd";
import LedgerTable from "./components/ledgerTable";
import LedgerSlide from "./components/ledgerSlide";
import "./index.less";
@inject("taxAgentStore")
@observer
class Index extends Component {
constructor(props) {
super(props);
this.state = {
searchVal: "",
doSearch: false,
slideparams: {
visible: false,
title: "新建账套",
editId: ""
}
};
}
componentDidMount() {
const { taxAgentStore } = this.props;
const { fetchTaxAgentOption } = taxAgentStore;
fetchTaxAgentOption();
}
handleEditLedger = (record) => {
const { slideparams } = this.state;
const { id } = record;
this.setState({ slideparams: { ...slideparams, visible: true, title: "编辑账套", editId: id } });
};
handleResetLedger = () => {
const { slideparams } = this.state;
this.setState({
slideparams: {
...slideparams,
visible: false,
title: "新建账套",
editId: ""
}
});
};
render() {
const { searchVal, doSearch, slideparams } = this.state;
const { taxAgentStore } = this.props;
const { showOperateBtn } = taxAgentStore;
const btns = [
<Button
type="primary"
onClick={() => this.setState({ slideparams: { ...slideparams, visible: true } })}
>新建</Button>,
<WeaInputSearch
value={searchVal} placeholder="请输入薪资账套名称"
onChange={searchVal => this.setState({ searchVal })}
onSearch={() => this.setState({ doSearch: !doSearch })}
/>
];
return (
<WeaTop
title="薪资账套" className="ledgerOuter"
icon={<i className="icon-coms-fa"/>}
iconBgcolor="#F14A2D"
showDropIcon={false}
buttons={showOperateBtn ? btns : btns.slice(-1)}
>
<div className="ledgerWrapper">
<LedgerTable name={searchVal} doSearch={doSearch} onEditLedger={this.handleEditLedger}/>
<LedgerSlide
{...slideparams}
onCancel={this.handleResetLedger}
onRefreshList={() => this.setState({ doSearch: !doSearch })}
/>
</div>
</WeaTop>
);
}
}
export default Index;