Merge branch 'master' into feature/2.9.42310.01-薪资项目拓扑图
commit
de2c10c400
@ -0,0 +1,123 @@
|
|||||||
|
.multi_fun_table {
|
||||||
|
background: #fff;
|
||||||
|
|
||||||
|
:global {
|
||||||
|
.ant-btn-link {
|
||||||
|
height: inherit !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-btn-link, .ant-dropdown-trigger {
|
||||||
|
padding: 0;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-btn-link:hover {
|
||||||
|
color: #00a9ff;
|
||||||
|
|
||||||
|
span {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-tbody > tr.ant-table-row:hover > td {
|
||||||
|
background: #e9f7ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anticon-more {
|
||||||
|
font-size: 16px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-spin-container {
|
||||||
|
.ant-pagination {
|
||||||
|
font-size: 12px;
|
||||||
|
align-items: center;
|
||||||
|
margin-right: 8px;
|
||||||
|
|
||||||
|
.ant-pagination-item, .ant-pagination-prev, .ant-pagination-next {
|
||||||
|
min-width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
line-height: 28px;
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
& > button {
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-pagination-item-active {
|
||||||
|
background: var(--ant-primary-color);
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
& > a {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-pagination-options {
|
||||||
|
.ant-select {
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
.ant-select-selector {
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
.ant-select-selection-search-input {
|
||||||
|
height: 26px;
|
||||||
|
line-height: 26px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-select-selection-item {
|
||||||
|
line-height: 26px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-select-item {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-pagination-options-quick-jumper {
|
||||||
|
height: 28px;
|
||||||
|
line-height: 28px;
|
||||||
|
|
||||||
|
& > input {
|
||||||
|
border-radius: 6px;
|
||||||
|
height: 28px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-thead > tr > th {
|
||||||
|
background-color: #f7fbfe;
|
||||||
|
}
|
||||||
|
|
||||||
|
th, td {
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
.ant-form-item {
|
||||||
|
margin-bottom: 0;
|
||||||
|
|
||||||
|
.ant-input-number {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:global {
|
||||||
|
.ant-dropdown-placement-bottomRight {
|
||||||
|
.ant-dropdown-menu {
|
||||||
|
max-height: inherit !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-dropdown-menu-item {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,60 @@
|
|||||||
|
import React, { FC, useEffect, useState } from "react";
|
||||||
|
import { Table } from "antd";
|
||||||
|
import { PaginationData } from "rc-pagination";
|
||||||
|
import { exceptStr, paginationAction } from "@/utils/common";
|
||||||
|
import { renderCols } from "@/pages/unitTable/renderColsOpts";
|
||||||
|
import styles from "./index.less";
|
||||||
|
|
||||||
|
const UnitTable: FC = (props) => {
|
||||||
|
const [unitTableType, setUnitTableType] = useState<string>("");
|
||||||
|
const [columns, setColumns] = useState<Array<any>>([]);
|
||||||
|
const [dataSource, setDataSource] = useState<Array<any>>([]);
|
||||||
|
const [pageInfo, setPageInfo] = useState<Partial<PaginationData>>({});
|
||||||
|
const [i18n, setI18n] = useState<any>({});
|
||||||
|
const [permission, setPermission] = useState<boolean>(false);
|
||||||
|
const [scrollHeight, setScrollHeight] = useState<number | undefined>(undefined);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
window.parent.postMessage({ type: "init" }, "*");
|
||||||
|
window.addEventListener("message", receiveMessageFromIndex, false);
|
||||||
|
return () => {
|
||||||
|
window.removeEventListener("message", receiveMessageFromIndex, false);
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
const receiveMessageFromIndex = (event: any) => {
|
||||||
|
const data: any = exceptStr(event.data);
|
||||||
|
if (!_.isEmpty(data)) {
|
||||||
|
const { columns, dataSource, pageInfo, scrollHeight, i18n, showOperateBtn, unitTableType } = data;
|
||||||
|
setI18n(i18n);
|
||||||
|
setScrollHeight(scrollHeight);
|
||||||
|
setUnitTableType(unitTableType);
|
||||||
|
setColumns(columns);
|
||||||
|
setDataSource(dataSource);
|
||||||
|
setPageInfo(pageInfo);
|
||||||
|
setPermission(showOperateBtn);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const onChange = (current: number, pageSize: number) => {
|
||||||
|
setPageInfo((prevState) => {
|
||||||
|
const { pageSize: size } = prevState;
|
||||||
|
window.parent.postMessage(
|
||||||
|
{
|
||||||
|
type: "turn",
|
||||||
|
payload: { id: "PAGEINFO", params: { ...pageInfo, current: size === pageSize ? current : 1, pageSize } }
|
||||||
|
},
|
||||||
|
"*"
|
||||||
|
);
|
||||||
|
return { ...pageInfo, current: size === pageSize ? current : 1, pageSize };
|
||||||
|
});
|
||||||
|
};
|
||||||
|
return <Table rowKey="id" className={styles.multi_fun_table} dataSource={dataSource} size="middle"
|
||||||
|
columns={renderCols(columns, unitTableType, i18n, permission)}
|
||||||
|
scroll={{ x: 1200, y: `calc(100vh - ${scrollHeight || 109}px)` }}
|
||||||
|
pagination={!_.isNil(pageInfo) ? {
|
||||||
|
...paginationAction(pageInfo, i18n, onChange),
|
||||||
|
size: "default"
|
||||||
|
} : false}
|
||||||
|
/>;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default UnitTable;
|
@ -0,0 +1,147 @@
|
|||||||
|
import React from "react";
|
||||||
|
import { Button, Dropdown, MenuProps, Space, Typography } from "antd";
|
||||||
|
import { MoreOutlined } from "@ant-design/icons";
|
||||||
|
|
||||||
|
const { Text } = Typography;
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Author: 黎永顺
|
||||||
|
* Description:社保福利台账列表项
|
||||||
|
* Params:
|
||||||
|
* Date: 2024/1/23
|
||||||
|
*/
|
||||||
|
export function renderCols(initialState: any[], type: string, i18n?: AnyObject, permission?: boolean) {
|
||||||
|
return React.useMemo(() => {
|
||||||
|
if (type === "welfareRecord") {
|
||||||
|
return [..._.map(_.filter(initialState, o => o.dataIndex !== "id"), g => {
|
||||||
|
let col = { ...g, ellipsis: true, fixed: g.dataIndex === "billMonth", width: 180 };
|
||||||
|
switch (g.dataIndex) {
|
||||||
|
case "billMonth":
|
||||||
|
col = {
|
||||||
|
...col,
|
||||||
|
width: 120,
|
||||||
|
render: (text: string, record: any) => {
|
||||||
|
const { billStatus } = record;
|
||||||
|
return (<Button type="link"
|
||||||
|
onClick={() => postMessageToParent(billStatus === "0" ? "CALC" : "VIEW", record)}>{text}</Button>);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
break;
|
||||||
|
case "billStatus":
|
||||||
|
col = {
|
||||||
|
...col, width: 100, render: (text: string) => (
|
||||||
|
<Text style={{ maxWidth: "100%" }} ellipsis>
|
||||||
|
{text === "1" ? i18n?.["已归档"] : i18n?.["未归档"]}
|
||||||
|
</Text>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
break;
|
||||||
|
case "paymentOrganization":
|
||||||
|
col = { ...col, width: 200 };
|
||||||
|
break;
|
||||||
|
case "socialNum":
|
||||||
|
case "otherNum":
|
||||||
|
case "fundNum":
|
||||||
|
col = { ...col, width: 118 };
|
||||||
|
break;
|
||||||
|
case "remarks":
|
||||||
|
col = { ...col, width: 200 };
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
col = { ...col };
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return col;
|
||||||
|
}), {
|
||||||
|
dataIndex: "operate", title: i18n?.["操作"], width: 185, fixed: "right",
|
||||||
|
render: (__: string, record: any) => {
|
||||||
|
const { billStatus } = record;
|
||||||
|
const items: MenuProps["items"] = [
|
||||||
|
{
|
||||||
|
key: "DeleteList",
|
||||||
|
label: i18n?.["删除"],
|
||||||
|
onClick: () => postMessageToParent("DELRC", record)
|
||||||
|
}
|
||||||
|
];
|
||||||
|
return (
|
||||||
|
<Space>
|
||||||
|
{
|
||||||
|
!permission ?
|
||||||
|
<Button type="link" onClick={() => postMessageToParent("VIEW", record)}>{i18n?.["查看"]}</Button> :
|
||||||
|
<>
|
||||||
|
{
|
||||||
|
billStatus === "0" &&
|
||||||
|
<>
|
||||||
|
<Button type="link"
|
||||||
|
onClick={() => postMessageToParent("CALC", record)}>{i18n?.["核算"]}</Button>
|
||||||
|
<Button type="link"
|
||||||
|
onClick={() => postMessageToParent("FILE", record)}>{i18n?.["归档"]}</Button>
|
||||||
|
<Dropdown menu={{ items }} placement="bottomRight">
|
||||||
|
<Button type="link" icon={<MoreOutlined/>}/>
|
||||||
|
</Dropdown>
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
{
|
||||||
|
billStatus === "1" &&
|
||||||
|
<>
|
||||||
|
<Button type="link"
|
||||||
|
onClick={() => postMessageToParent("VIEW", record)}>{i18n?.["查看"]}</Button>
|
||||||
|
<Button type="link"
|
||||||
|
onClick={() => postMessageToParent("RECALC", record)}>{i18n?.["重新核算"]}</Button>
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
</Space>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}];
|
||||||
|
} else if (type === "bonusplan") {
|
||||||
|
return [..._.map(_.filter(initialState, o => o.dataIndex !== "id"), g => {
|
||||||
|
let col = { ...g, ellipsis: true, fixed: g.dataIndex === "billMonth", width: 180 };
|
||||||
|
switch (g.dataIndex) {
|
||||||
|
case "billMonth":
|
||||||
|
col = {
|
||||||
|
...col,
|
||||||
|
width: 120,
|
||||||
|
render: (text: string, record: any) => {
|
||||||
|
const { billStatus } = record;
|
||||||
|
return (<Button type="link"
|
||||||
|
onClick={() => postMessageToParent(billStatus === "0" ? "CALC" : "VIEW", record)}>{text}</Button>);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
break;
|
||||||
|
case "billStatus":
|
||||||
|
col = {
|
||||||
|
...col, width: 100, render: (text: string) => (
|
||||||
|
<Text style={{ maxWidth: "100%" }} ellipsis>
|
||||||
|
{text === "1" ? i18n?.["已归档"] : i18n?.["未归档"]}
|
||||||
|
</Text>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
break;
|
||||||
|
case "paymentOrganization":
|
||||||
|
col = { ...col, width: 200 };
|
||||||
|
break;
|
||||||
|
case "socialNum":
|
||||||
|
case "otherNum":
|
||||||
|
case "fundNum":
|
||||||
|
col = { ...col, width: 118 };
|
||||||
|
break;
|
||||||
|
case "remarks":
|
||||||
|
col = { ...col, width: 200 };
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
col = { ...col };
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return col;
|
||||||
|
})];
|
||||||
|
}
|
||||||
|
return [];
|
||||||
|
}, [initialState, type, i18n, permission]);
|
||||||
|
}
|
||||||
|
|
||||||
|
const postMessageToParent = (type: string, params: any) => {
|
||||||
|
window.parent.postMessage({ type: "turn", payload: { id: type, params } }, "*");
|
||||||
|
};
|
Loading…
Reference in New Issue