753 lines
23 KiB
JavaScript
753 lines
23 KiB
JavaScript
import React, { Fragment } from "react";
|
||
import { inject, observer } from "mobx-react";
|
||
import { WeaTableNew } from "comsMobx";
|
||
import { Button, Dropdown, Menu, message, Modal } from "antd";
|
||
import {
|
||
WeaBrowser,
|
||
WeaCheckbox,
|
||
WeaDatePicker,
|
||
WeaError,
|
||
WeaFormItem,
|
||
WeaHelpfulTip,
|
||
WeaInput,
|
||
WeaRightMenu,
|
||
WeaSearchGroup,
|
||
WeaSelect,
|
||
WeaSlideModal,
|
||
WeaTab,
|
||
WeaTop
|
||
} from "ecCom";
|
||
import { renderNoright } from "../../util"; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中
|
||
import ChangeSalaryModal from "./changeSalaryModal";
|
||
import EditAgentModal from "./editAgentModal";
|
||
import SlideModalTitle from "../../components/slideModalTitle";
|
||
import SlideSalaryItem from "./slideSalaryItem";
|
||
import SlideAgent from "./slideAgent";
|
||
import ImportModal from "../../components/importModal";
|
||
import SalaryFileViewSlide from "./saralyFileViewSlide";
|
||
import CustomPaginationTable from "../../components/customPaginationTable";
|
||
import "./index.less";
|
||
|
||
const WeaTableComx = WeaTableNew.WeaTable;
|
||
|
||
@inject("salaryFileStore", "taxAgentStore")
|
||
@observer
|
||
export default class SalaryFile extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
value: "",
|
||
selectedKey: "0",
|
||
changeSalaryVisible: false,
|
||
editAgentVisible: false,
|
||
selectedTab: 0,
|
||
editSlideVisible: false,
|
||
importType: "",
|
||
isInit: false, //是否是初始化导入
|
||
modalVisiable: false,
|
||
step: 0,
|
||
recordSlideVisible: false,
|
||
selectedRowKeys: [],
|
||
showSearchBar: false,
|
||
importResult: {},
|
||
searchValue: "",
|
||
searchItemsValue: {
|
||
username: "",
|
||
departmentIds: "",
|
||
positionIds: "",
|
||
userstatus: "",
|
||
archiveStatus: "EFFICIENT",
|
||
taxAgentId: "",
|
||
subcompanyIds: ""
|
||
},
|
||
noPayDate: "" //最后停薪日期
|
||
};
|
||
this.pageInfo = { current: 1, pageSize: 10 };
|
||
}
|
||
|
||
Input = (value, key) => {
|
||
const { username } = this.state.searchItemsValue;
|
||
return (
|
||
<WeaFormItem
|
||
label={value}
|
||
labelCol={{ span: 6 }}
|
||
wrapperCol={{ span: 18 }}
|
||
>
|
||
<WeaInput value={username} onChange={(val) => this.setState({
|
||
searchItemsValue: {
|
||
...this.state.searchItemsValue,
|
||
[key]: val
|
||
}
|
||
})}/>
|
||
</WeaFormItem>
|
||
);
|
||
};
|
||
Browser = (value, key) => {
|
||
const { positionIds, departmentIds, subcompanyIds } = this.state.searchItemsValue;
|
||
return (
|
||
<WeaFormItem
|
||
label={value}
|
||
labelCol={{ span: 6 }}
|
||
wrapperCol={{ span: 18 }}
|
||
>
|
||
<WeaBrowser
|
||
isSingle={false}
|
||
value={key === "departmentIds" ? departmentIds : key === "subcompanyIds" ? subcompanyIds : positionIds}
|
||
tabs={key === "departmentIds" ? [
|
||
{
|
||
dataParams: null,
|
||
dataURL: null,
|
||
isSearch: false,
|
||
key: "2",
|
||
name: "组织结构",
|
||
selected: false,
|
||
showOrder: 0
|
||
},
|
||
{
|
||
dataParams: { list: "1" },
|
||
dataURL: null,
|
||
isSearch: true,
|
||
key: "1",
|
||
name: "按列表",
|
||
selected: false,
|
||
showOrder: 0
|
||
}
|
||
] : null}
|
||
type={key === "departmentIds" ? 57 : key === "subcompanyIds" ? 164 : 278}
|
||
onChange={(val) => {
|
||
this.setState({ searchItemsValue: { ...this.state.searchItemsValue, [key]: val } });
|
||
}}/>
|
||
</WeaFormItem>
|
||
);
|
||
};
|
||
Select = (value, key) => {
|
||
const { salaryFileStore, taxAgentStore } = this.props;
|
||
const { userstatus, archiveStatus, taxAgentId } = this.state.searchItemsValue;
|
||
const { archiveStatusList, userStatusList } = salaryFileStore;
|
||
const { taxAgentAdminOption } = taxAgentStore;
|
||
return (
|
||
<WeaFormItem
|
||
label={value}
|
||
labelCol={{ span: 6 }}
|
||
wrapperCol={{ span: 18 }}
|
||
>
|
||
<WeaSelect
|
||
value={key === "userstatus" ? userstatus : key === "taxAgentId" ? taxAgentId : archiveStatus}
|
||
options={key === "userstatus" ? userStatusList : key === "taxAgentId" ? [{
|
||
key: "",
|
||
showname: ""
|
||
}, ...taxAgentAdminOption] : archiveStatusList}
|
||
onChange={(val) => this.setState({ searchItemsValue: { ...this.state.searchItemsValue, [key]: val } })}/>
|
||
</WeaFormItem>
|
||
);
|
||
};
|
||
|
||
componentWillMount() {
|
||
const { salaryFileStore: { doInit }, taxAgentStore: { getTaxAgentSelectListAsAdmin } } = this.props;
|
||
doInit({ ...this.state.searchItemsValue });
|
||
getTaxAgentSelectListAsAdmin();
|
||
}
|
||
|
||
// 设置导入步数
|
||
setStep(step) {
|
||
this.setState({ step });
|
||
}
|
||
|
||
// 渲染导入模板附加元素
|
||
renderFormComponent() {
|
||
return (
|
||
<div style={{ display: "inline-block" }}>
|
||
<WeaCheckbox id="importData" content="导出现有数据"/>
|
||
<WeaHelpfulTip
|
||
width={200}
|
||
title="提示：建议先导出现有最新数据，修改后再导入"
|
||
placement="topLeft"
|
||
/>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// 导入预览
|
||
handlePreviewImport(params) {
|
||
const {
|
||
salaryFileStore: { importPreview }
|
||
} = this.props;
|
||
params.importType = this.state.importType;
|
||
importPreview(params);
|
||
}
|
||
|
||
// 导入档案
|
||
handleImportFile(params) {
|
||
const {
|
||
salaryFileStore: { importSalaryArchive }
|
||
} = this.props;
|
||
params.importType = this.state.importType;
|
||
importSalaryArchive(params, this.state.searchItemsValue).then((data) => {
|
||
data.errorData = data.errorNotice;
|
||
this.setState({
|
||
importResult: data
|
||
});
|
||
});
|
||
}
|
||
|
||
// 导入完成按钮操作
|
||
handleImportFinish() {
|
||
this.setState({ modalVisiable: false, step: 0 });
|
||
}
|
||
|
||
// 导出全部
|
||
handleExportAll=()=> {
|
||
let url = `${window.location.origin}/api/bs/hrmsalary/salaryArchive/exportList?ids=`;
|
||
const { searchItemsValue } = this.state;
|
||
const fileds= Object.keys(searchItemsValue);
|
||
_.forEach(fileds, it => {
|
||
url= `${url}&${it}=${searchItemsValue[it]}`
|
||
})
|
||
window.open(url, "_self");
|
||
}
|
||
|
||
// 定制列
|
||
getColumns() {
|
||
const {
|
||
salaryFileStore: { tableStore }
|
||
} = this.props;
|
||
return tableStore.columns
|
||
.filter((item) => item.display == "true")
|
||
.map((item) => {
|
||
item.width = item.oldWidth;
|
||
if (item.dataIndex == "operate") {
|
||
item.render = (text, record) => (
|
||
<a onClick={() => this.handleEdit(record)}>查看</a>
|
||
);
|
||
item.fixed = "right";
|
||
} else if (item.dataIndex == "username") {
|
||
item.fixed = "left";
|
||
}
|
||
return item;
|
||
});
|
||
}
|
||
|
||
// 编辑行
|
||
handleEdit(record) {
|
||
this.setState({ editSlideVisible: true });
|
||
const {
|
||
salaryFileStore: { setCurrentId }
|
||
} = this.props;
|
||
setCurrentId(record.id);
|
||
}
|
||
|
||
// 停薪
|
||
handleNoPay = () => {
|
||
const {
|
||
salaryFileStore: { stopSalary, getTableDatas }
|
||
} = this.props;
|
||
Modal.confirm({
|
||
title: "停薪确认",
|
||
content: <WeaFormItem
|
||
label="最后发薪日期"
|
||
labelCol={{ span: 6 }}
|
||
wrapperCol={{ span: 18 }}
|
||
>
|
||
<WeaDatePicker
|
||
value={this.state.noPayDate}
|
||
viewAttr={3}
|
||
style={{ width: "100%" }}
|
||
onChange={noPayDate => this.setState({ noPayDate })}
|
||
/>
|
||
</WeaFormItem>,
|
||
width: 516,
|
||
onOk: () => {
|
||
if (_.isEmpty(this.state.noPayDate)) {
|
||
message.warning("请选择最后发薪日期")
|
||
return false;
|
||
}
|
||
stopSalary(this.state.noPayDate).then(() => {
|
||
getTableDatas({ ...this.state.searchItemsValue });
|
||
});
|
||
},
|
||
onCancel: () => {
|
||
}
|
||
})
|
||
};
|
||
|
||
// 查看 Slide 头部操作按钮
|
||
renderEditSlideOperate = () => {
|
||
const { taxAgentStore: { showOperateBtn }, salaryFileStore: { salaryIncreaseUrl, currentId } } = this.props;
|
||
const { isShow, url } = salaryIncreaseUrl;
|
||
let arrList = [];
|
||
if (showOperateBtn && isShow === "true") {
|
||
arrList.push(<Button type="primary" onClick={() => {
|
||
window.open(`${url}&salaryArchiveId=${currentId}`);
|
||
}}>发起调薪</Button>);
|
||
}
|
||
if (showOperateBtn) {
|
||
arrList.push(<Button type="primary" onClick={() => {
|
||
this.setState({ changeSalaryVisible: true });
|
||
}}>调薪</Button>);
|
||
arrList.push(<Button type="primary" onClick={this.handleNoPay}>停薪</Button>);
|
||
}
|
||
return arrList;
|
||
};
|
||
|
||
// table选中条目
|
||
onSelectChange = (selectedRowKeys) => {
|
||
this.setState({ selectedRowKeys });
|
||
};
|
||
|
||
// 显示影响搜索面板
|
||
handleShowSearchBar = () => {
|
||
this.setState({
|
||
showSearchBar: !this.state.showSearchBar
|
||
});
|
||
};
|
||
|
||
// 页面跳转
|
||
handlePageChange = (value) => {
|
||
const { salaryFileStore: { getTableDatas, form } } = this.props;
|
||
this.pageInfo.current = value;
|
||
getTableDatas({ ...this.state.searchItemsValue, ...this.pageInfo });
|
||
};
|
||
|
||
handleShowSizeChange(pageInfo) {
|
||
const { salaryFileStore: { getTableDatas, form } } = this.props;
|
||
getTableDatas({ ...this.state.searchItemsValue, ...pageInfo });
|
||
}
|
||
|
||
// 搜索
|
||
handleSearch(value) {
|
||
const {
|
||
salaryFileStore: { getTableDatas, form }
|
||
} = this.props;
|
||
getTableDatas({ username: value });
|
||
}
|
||
|
||
// 初始化导入参数
|
||
handleInitModal() {
|
||
const {
|
||
salaryFileStore: { setPreviewDataSource }
|
||
} = this.props;
|
||
setPreviewDataSource([]);
|
||
this.setState({
|
||
importResult: {}
|
||
});
|
||
}
|
||
|
||
showColumn = () => {
|
||
const { salaryFileStore: { tableStore } } = this.props;
|
||
// console.log("showColumn:", tableStore.setColSetVisible(true));
|
||
tableStore.setColSetVisible(true);
|
||
tableStore.tableColSet(true);
|
||
// console.log("showColumn:");
|
||
};
|
||
|
||
render() {
|
||
const { salaryFileStore, taxAgentStore: { showOperateBtn } } = this.props;
|
||
const {
|
||
loading,
|
||
hasRight,
|
||
form,
|
||
condition,
|
||
tableStore,
|
||
showSearchAd,
|
||
getTableDatas,
|
||
doSearch,
|
||
setShowSearchAd,
|
||
setSalaryIncreaseUrl
|
||
} = salaryFileStore;
|
||
const {
|
||
importType,
|
||
previewColumns,
|
||
previewDataSource,
|
||
dataSource,
|
||
currentId,
|
||
editAgentVisible,
|
||
setEditAgentVisible,
|
||
pageInfo
|
||
} = salaryFileStore;
|
||
|
||
const { selectedTab, step, selectedRowKeys } = this.state;
|
||
if (!hasRight && !loading) {
|
||
// 无权限处理
|
||
return renderNoright();
|
||
}
|
||
|
||
const rightMenu = [
|
||
// 右键菜单
|
||
{
|
||
key: "BTN_COLUMN",
|
||
icon: <i className="icon-coms-Custom"/>,
|
||
content: "显示列定制",
|
||
onClick: this.showColumn
|
||
}
|
||
];
|
||
const collectParams = {
|
||
// 收藏功能配置
|
||
favname: "薪资档案",
|
||
favouritetype: 1,
|
||
objid: 0,
|
||
link: "wui/index.html#/ns_demo03/index",
|
||
importantlevel: 1
|
||
};
|
||
const adBtn = [
|
||
// 高级搜索内部按钮
|
||
<Button type="primary" onClick={() => doSearch(this.state.searchItemsValue)}>
|
||
搜索
|
||
</Button>,
|
||
<Button type="ghost" onClick={() => this.setState({
|
||
searchItemsValue: {
|
||
username: "",
|
||
departmentIds: "",
|
||
positionIds: "",
|
||
userstatus: "",
|
||
archiveStatus: ""
|
||
}
|
||
})}>
|
||
重置
|
||
</Button>,
|
||
<Button type="ghost" onClick={() => setShowSearchAd(false)}>
|
||
取消
|
||
</Button>
|
||
];
|
||
|
||
const topTab = [];
|
||
|
||
const renderSearchOperationItem = () => {
|
||
};
|
||
|
||
const handleMenuClick = (e) => {
|
||
const { key } = e;
|
||
if (key === "init") {
|
||
Modal.confirm({
|
||
title: "信息确认",
|
||
content: `若导入表格中的人员已存在在薪资档案中，初始化导入会将档案中该人员的数据清除再导入，点击确定继续导入`,
|
||
onOk: () => {
|
||
this.setState({ importType: e.key, isInit: true, modalVisiable: true, step: 0 });
|
||
},
|
||
onCancel() {
|
||
}
|
||
});
|
||
} else {
|
||
this.setState({ importType: e.key, isInit: true, modalVisiable: true, step: 0 });
|
||
}
|
||
};
|
||
|
||
const handleMenuClick2 = () => {
|
||
const { electedRowKeys } = this.state;
|
||
if (selectedRowKeys.length == 0) {
|
||
message.warning("未选择条目");
|
||
return;
|
||
}
|
||
// const {
|
||
// salaryFileStore: { exportSalaryArchive }
|
||
// } = this.props;
|
||
// exportSalaryArchive(selectedRowKeys.join(","));
|
||
const url = `${window.location.origin}/api/bs/hrmsalary/salaryArchive/exportList?ids=${selectedRowKeys.join(",")}`;
|
||
window.open(url, "_self");
|
||
};
|
||
|
||
const menu = (
|
||
<Menu onClick={handleMenuClick}>
|
||
{/*暂时去掉调整个税扣缴义务人导入按钮*/}
|
||
{_.filter(importType, it => it.id !== "taxAgentAdjust").map((item) => (
|
||
<Menu.Item key={item.id}>{item.content}</Menu.Item>
|
||
))}
|
||
</Menu>
|
||
);
|
||
|
||
|
||
const menu2 = (
|
||
<Menu onClick={handleMenuClick2}>
|
||
<Menu.Item key="1">导出所选</Menu.Item>
|
||
</Menu>
|
||
);
|
||
|
||
const renderRightOperation = () => {
|
||
return (
|
||
<div
|
||
style={{
|
||
marginTop: 10
|
||
}}
|
||
className="salaryFileTabWrapper">
|
||
{
|
||
showOperateBtn &&
|
||
<Fragment>
|
||
<WeaHelpfulTip
|
||
style={{ marginRight: "10px" }}
|
||
width={300}
|
||
title="导入按钮使用场景说明：<br/>
|
||
1.档案初始化：<br/>
|
||
a.初次使用薪酬模块，全量导入员工的薪资档案数据；<br/>
|
||
b.员工入职，导入新入职的员工的薪资档案数据（若导入表格中的人员已存在在薪资档案中，初始化导入会将档案中该人员的数据清除再导入）；<br/>
|
||
c.返聘人员使用调薪功能调整薪资档案值或使用调整个税扣缴；<br/>
|
||
2.调薪：档案中已存在的人员批量调整薪资项目值（包括返聘人员的情况）；<br/>
|
||
3.调整个税扣缴义务人：档案中已存在的人员批量调整个税扣缴义务人（包括返聘人员的情况）；<br/>"
|
||
placement="topLeft"
|
||
/>
|
||
<Dropdown.Button
|
||
type="primary"
|
||
style={{ marginRight: "10px" }}
|
||
overlay={menu}>
|
||
导入
|
||
</Dropdown.Button>
|
||
<Dropdown.Button
|
||
style={{ marginRight: "10px" }}
|
||
overlay={menu2}
|
||
onClick={() => {
|
||
this.handleExportAll();
|
||
}}>
|
||
导出全部
|
||
</Dropdown.Button>
|
||
</Fragment>
|
||
}
|
||
{/*暂时隐藏*/}
|
||
{/*<Button*/}
|
||
{/* type="default"*/}
|
||
{/* style={{ marginRight: "10px" }}*/}
|
||
{/* onClick={() => {*/}
|
||
{/* this.setState({ recordSlideVisible: true });*/}
|
||
{/* }}>*/}
|
||
{/* 调薪记录*/}
|
||
{/*</Button>*/}
|
||
|
||
{/*<WeaInputSearch*/}
|
||
{/* value={this.state.searchValue}*/}
|
||
{/* onChange={(value) => {*/}
|
||
{/* this.setState({*/}
|
||
{/* searchValue: value*/}
|
||
{/* });*/}
|
||
{/* }}*/}
|
||
{/* onSearch={(value) => {*/}
|
||
{/* this.handleSearch(value);*/}
|
||
{/* }}*/}
|
||
{/*/>*/}
|
||
{/* <Button type="default" onClick={() =>{this.handleShowSearchBar()}}>高级搜索</Button> */}
|
||
</div>
|
||
);
|
||
};
|
||
|
||
const renderSearch = () => {
|
||
const searchItems = [
|
||
{ com: this.Input("姓名", "username") },
|
||
{ com: this.Browser("分部", "subcompanyIds") },
|
||
{ com: this.Browser("部门", "departmentIds") },
|
||
{ com: this.Browser("岗位", "positionIds") },
|
||
{ com: this.Select("人员状态", "userstatus") },
|
||
{ com: this.Select("档案状态", "archiveStatus") },
|
||
{ com: this.Select("个税扣缴义务人", "taxAgentId") }
|
||
];
|
||
return <WeaSearchGroup title={"基本信息"} items={searchItems} showGroup/>;
|
||
};
|
||
|
||
const handleSlideMoreMenuClick = () => {
|
||
};
|
||
|
||
const slideMoreMenu = (
|
||
<Menu onClick={handleSlideMoreMenuClick}>
|
||
<Menu.Item key="1">导出全部</Menu.Item>
|
||
</Menu>
|
||
);
|
||
|
||
const renderCustomOperate = () => {
|
||
return (
|
||
<div style={{ display: "inline-block" }}>
|
||
<Dropdown.Button type="primary" overlay={slideMoreMenu}>
|
||
导出
|
||
</Dropdown.Button>
|
||
<Button type="default">自定义列</Button>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
const rowSelection = {
|
||
selectedRowKeys,
|
||
onChange: this.onSelectChange
|
||
};
|
||
|
||
return (
|
||
<div className="mySalaryBenefitsWrapper">
|
||
<WeaRightMenu
|
||
datas={rightMenu} // 右键菜单
|
||
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
|
||
>
|
||
<WeaTop
|
||
title="薪资档案" // 文字
|
||
icon={<i className="icon-coms-fa"/>} // 左侧图标
|
||
iconBgcolor="#F14A2D" // 左侧图标背景色
|
||
showDropIcon={true} // 是否显示下拉按钮
|
||
dropMenuDatas={rightMenu} // 下拉菜单（和页面的右键菜单相同）
|
||
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
|
||
>
|
||
<WeaTab
|
||
searchType={["base", "advanced"]} // base：基础搜索框 advanced：显示高级搜索按钮
|
||
showSearchAd={showSearchAd} // 是否展开高级搜索面板
|
||
setShowSearchAd={(bool) => setShowSearchAd(bool)} //高级搜索面板受控
|
||
searchsAd={renderSearch()} // 高级搜索内部数据getSearchs(form, toJS(condition), 2)
|
||
buttonsAd={adBtn} // 高级搜索内部按钮
|
||
onSearch={() => doSearch(this.state.searchItemsValue)} // 点搜索按钮时的回调this.handleSearch()
|
||
searchsAdQuick={renderRightOperation()}
|
||
searchsBasePlaceHolder={"请输入姓名"}
|
||
onSearchChange={(v) =>
|
||
this.setState({
|
||
searchItemsValue: {
|
||
...this.state.searchItemsValue,
|
||
username: v
|
||
}
|
||
})} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值form.updateFields({ username: v })
|
||
searchsBaseValue={this.state.searchItemsValue.username} // 外部input搜索值受控: 这里和高级搜索的requestname同步form.getFormParams().username
|
||
/>
|
||
<WeaTableComx
|
||
style={{ display: "none" }}
|
||
comsWeaTableStore={tableStore}
|
||
needScroll={true}
|
||
/>
|
||
|
||
<CustomPaginationTable
|
||
loading={loading}
|
||
className="wea-antd-wrapper"
|
||
rowSelection={rowSelection}
|
||
columns={this.getColumns()}
|
||
dataSource={dataSource}
|
||
total={pageInfo.total}
|
||
current={pageInfo.pageNum}
|
||
pageSize={this.pageInfo.pageSize}
|
||
rowClassName={(record) => record.archiveStatus === "ARCHIVE" ? "archiveRow" : ""}
|
||
scroll={{ x: this.getColumns().length ? this.getColumns().length * 150 : 1200 }}
|
||
onPageChange={(value) => {
|
||
this.handlePageChange(value);
|
||
}}
|
||
onShowSizeChange={(current, pageSize) => {
|
||
this.pageInfo = { current, pageSize };
|
||
this.handleShowSizeChange(this.pageInfo);
|
||
}}
|
||
/>
|
||
</WeaTop>
|
||
</WeaRightMenu>
|
||
|
||
{this.state.modalVisiable && (
|
||
<ImportModal
|
||
init={() => {
|
||
this.handleInitModal();
|
||
}}
|
||
isInit={this.state.isInit}
|
||
params={{}}
|
||
columns={previewColumns}
|
||
step={step}
|
||
setStep={this.setStep.bind(this)}
|
||
slideDataSource={previewDataSource}
|
||
importResult={this.state.importResult}
|
||
onFinish={() => {
|
||
this.handleImportFinish();
|
||
}}
|
||
previewImport={(params) => {
|
||
this.handlePreviewImport(params);
|
||
}}
|
||
importFile={(params) => {
|
||
this.handleImportFile(params);
|
||
}}
|
||
templateLink={
|
||
"/api/bs/hrmsalary/salaryArchive/downloadTemplate?importType=" +
|
||
this.state.importType
|
||
}
|
||
renderFormComponent={() => {
|
||
this.renderFormComponent();
|
||
}}
|
||
visiable={this.state.modalVisiable}
|
||
onCancel={() => {
|
||
this.setState({ modalVisiable: false });
|
||
}}
|
||
/>
|
||
)}
|
||
{this.state.changeSalaryVisible && (
|
||
<ChangeSalaryModal
|
||
currentId={currentId}
|
||
visible={this.state.changeSalaryVisible}
|
||
onCancel={() => {
|
||
this.setState({ changeSalaryVisible: false });
|
||
}}
|
||
/>
|
||
)}
|
||
|
||
{editAgentVisible && (
|
||
<EditAgentModal
|
||
currentId={currentId}
|
||
visible={editAgentVisible}
|
||
onCancel={() => {
|
||
setEditAgentVisible(false);
|
||
}}
|
||
/>
|
||
)}
|
||
|
||
{/* 操作记录 */}
|
||
{this.state.recordSlideVisible && (
|
||
<WeaSlideModal
|
||
visible={this.state.recordSlideVisible}
|
||
top={0}
|
||
width={40}
|
||
height={100}
|
||
direction={"right"}
|
||
measure={"%"}
|
||
title={
|
||
<SlideModalTitle
|
||
subtitle={"操作记录"}
|
||
tabs={[
|
||
{ title: "薪资项目", key: 0 }
|
||
// { title: "个税扣缴义务人", key: 1 },
|
||
]}
|
||
editable={false}
|
||
showOperateBtn={showOperateBtn}
|
||
selectedTab={selectedTab}
|
||
customOperate={() => {
|
||
renderCustomOperate();
|
||
}}
|
||
subItemChange={(item) => {
|
||
this.setState({ selectedTab: item.key });
|
||
}}
|
||
/>
|
||
}
|
||
content={
|
||
<div>
|
||
{selectedTab == 0 && <SlideSalaryItem/>}
|
||
{selectedTab == 1 && <SlideAgent/>}
|
||
</div>
|
||
}
|
||
onClose={() => this.setState({ recordSlideVisible: false })}
|
||
showMask={true}
|
||
closeMaskOnClick={() =>
|
||
this.setState({ recordSlideVisible: false })
|
||
}
|
||
/>
|
||
)}
|
||
|
||
{this.state.editSlideVisible && (
|
||
<WeaSlideModal
|
||
className="slideOuterWrapper"
|
||
visible={this.state.editSlideVisible}
|
||
top={0}
|
||
width={40}
|
||
height={100}
|
||
direction={"right"}
|
||
measure={"%"}
|
||
title={
|
||
<SlideModalTitle
|
||
subtitle={"员工薪资档案"}
|
||
editable={false}
|
||
customOperate={this.renderEditSlideOperate()}
|
||
/>
|
||
}
|
||
content={<SalaryFileViewSlide id={currentId}/>}
|
||
onClose={() => {
|
||
this.setState({ editSlideVisible: false });
|
||
setSalaryIncreaseUrl({});
|
||
}}
|
||
showMask={true}
|
||
closeMaskOnClick={() => {
|
||
setSalaryIncreaseUrl({});
|
||
this.setState({ editSlideVisible: false });
|
||
}}
|
||
/>
|
||
)}
|
||
</div>
|
||
);
|
||
}
|
||
}
|