salary-management-front/pc4mobx/hrmSalary/components/selectItemsModal/index.js

79 lines
2.3 KiB
JavaScript

/*
* Author: 黎永顺
* Description:
* Date: 2022-05-19 15:18:09
* LastEditTime: 2022-06-29 10:06:13
*/
import React from "react";
import { WeaCheckbox, WeaDialog, WeaInputSearch } from "ecCom";
import { Button } from "antd";
import "./index.less";
export default class SelectItemModal extends React.Component {
constructor(props) {
super(props);
this.state = {
searchValue: ""
};
}
componentWillReceiveProps(nextProps, nextContext) {
if (
nextProps.visible !== this.props.visible &&
!nextProps.visible
) this.setState({ searchValue: "" });
}
render() {
const { searchValue } = this.state;
const {
title, onSearchItemSet, onShowOnlyChecked, children,
onMoreOpts, onSave, ...extra
} = this.props;
const btns = [<Button type="primary" onClick={onSave}>保存</Button>];
const moreBtn = {
datas: [
{
key: "recovery",
content: "恢复默认设置",
icon: <i className="icon-coms-Flow-setting"/>,
onClick: key => onMoreOpts(key)
},
{
key: "setting",
content: "设为默认设置",
icon: <i className="icon-coms-Flow-setting"/>,
onClick: key => onMoreOpts(key)
}
]
};
const titleComp = <div className="setHeaderWrapper">
<span>{title}</span>
<WeaInputSearch value={searchValue} onChange={searchValue => this.setState({ searchValue })}
placeholder="请输入关键字" style={{ width: 200 }}
onSearch={onSearchItemSet}
/>
</div>;
const bottomLeft = <WeaCheckbox content="只显示已选中字段" onChange={onShowOnlyChecked}/>;
return (
<WeaDialog {...extra} hasScroll title={titleComp}
buttons={btns} moreBtn={moreBtn}
initLoadCss className="setWrapper"
bottomLeft={bottomLeft}
style={{
width: 800,
height: 606.6,
minHeight: 200,
minWidth: 380,
maxHeight: "90%",
maxWidth: "90%",
overflow: "hidden",
transform: "translate(0px, 0px)"
}}
>
{children}
</WeaDialog>
);
}
}