diff --git a/src/layouts/config.js b/src/layouts/config.js index 7864207..c5e3d2d 100644 --- a/src/layouts/config.js +++ b/src/layouts/config.js @@ -14,6 +14,7 @@ module.exports = { "/commonTable.*": "blank", "/calcTable.*": "blank", "/salaryItemDiagram.*": "blank", + "/salaryItemFlowGraph.*": "blank", "/welfareLedgerTable.*": "blank", "/payrollFilesTable.*": "blank", "/employeeDeclareTable.*": "blank", diff --git a/src/pages/atdTable/components/antdTable-修改适配中江前的源码.tsx b/src/pages/atdTable/components/antdTable-修改适配中江前的源码.tsx new file mode 100644 index 0000000..9c542f6 --- /dev/null +++ b/src/pages/atdTable/components/antdTable-修改适配中江前的源码.tsx @@ -0,0 +1,378 @@ +import React, { FC, useEffect, useState } from "react"; +import { exceptStr, paginationFun } from "@/utils/common"; +import { defaultPage, ILoading, IPage } from "@/common/types/page"; +import { Button, message, Spin, Table, Typography } from "antd"; +import { LockOutlined, UnlockOutlined } from "@ant-design/icons"; +import API from "@/api"; +import styles from "./index.less"; + +const { Text } = Typography; + +interface ITableProps { +} + +const AntdTable: FC = (props) => { + const [selected, setSelected] = useState>([]); //列表选中的数据 + const [tab, setTab] = useState(""); //顶部TAB变量 + const [usertab, setUsertab] = useState(""); //底部TAB变量 + const [pageParams, setPageParams] = useState(defaultPage); //分页变量 + const [loading, setLoading] = useState({}); + const [columns, setColumns] = useState([]); + const [dataSource, setDataSource] = useState([]); + const [sumRow, setSumRow] = useState>({});//薪资核算总计行数据 + const [showSumrow, setShowSumrow] = useState(false);//薪资核算总计行是否隐藏 + useEffect(() => { + window.parent.postMessage( + { + type: "PC", + data: { id: "SA" } + }, + "*" + ); + window.addEventListener("message", receiveMessageFromIndex, false); + return () => { + setSumRow({}); + window.removeEventListener("message", receiveMessageFromIndex, false); + }; + }, []); + + const getPCDataList = (params: any = {}) => { + let { type, listType, hasOperate = true, ...extraParams } = params; + setLoading({ query: true }); + setTab(type); + setUsertab(listType); + API.CalculateService.getPCDataList(extraParams).then(async ({ success, data, errorMsg }) => { + setLoading({ query: false }); + if (success) { + const { data: dataCopy } = data; + if (type === "PC") { + if (listType === "SA") { + const { columns = [], list = [], total, pageSize: size, pageNum } = dataCopy; + setColumns(getUserListColumns(columns)); + setDataSource(list); + setPageParams({ ...pageParams, total, size, pageNum }); + } else if (listType === "MA") { + const { columns = [], list = [], total, pageSize: size, pageNum } = dataCopy; + setColumns(columns); + setDataSource(list); + setPageParams({ ...pageParams, total, size, pageNum }); + } + } else { + const { columns = [], pageInfo = {} } = dataCopy; + const { list = [], total, pageSize: size, pageNum } = pageInfo; + setColumns(getColumns(columns, hasOperate)); + setDataSource(list); + setPageParams({ ...pageParams, total, size, pageNum }); + const confCode: any = await API.CalculateService.getSysconfcode({ code: "OPEN_ACCT_RESULT_SUM" }); + setShowSumrow(confCode.data.status && confCode.data.data === "1"); + if (confCode.data.status && confCode.data.data === "1") { + const sumRowlist: any = await API.CalculateService.getAcctresultsum({ ...extraParams["queryParams"] }); + if (sumRowlist.data.status && !_.isEmpty(sumRowlist.data.data.sumRow)) { + setSumRow(sumRowlist.data.data.sumRow); + } + if (sumRowlist.data.status && _.isNil(sumRowlist.data.data.sumRow)) { + setSumRow({ [new Date().getTime()]: new Date().getTime() }); + } + } + } + } else { + message.error(errorMsg || ""); + } + }); + }; + const getUserListColumns = (acctemployeeListColumns: any) => { + let tmpColumns = [...acctemployeeListColumns, { + key: "cz", + title: "操作", + render: (text: string, record: any) => { + return ( + + ); + } + }]; + tmpColumns = _.map(tmpColumns, (item) => { + if (item.dataIndex === "costCenter") { + return { + ...item, + ellipsis: true, + width: 110, + render: (text: string, r: any) => { + const { costCenter } = r; + return ( + { + window.parent.postMessage( + { + type: "PC", + data: { id: "COSTCENTER", data: costCenter } + }, + "*" + ); + }}>{costCenter.name || ""} + ); + } + }; + } + return { ...item, ellipsis: true }; + }); + return tmpColumns; + }; + //薪资核算页面列表 + const getColumns = (column: any, hasOperate: boolean = true) => { + let tmpColumns = [...column]; + tmpColumns = tmpColumns.filter(item => item.hide == "FALSE").map((item, index) => { + let result = { ...item }; + result.title = + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: item.column } + }, + "*" + ); + }}>{item.text} + { + item.lockStatus && + { + item.lockStatus === "UNLOCK" && { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: item.column, extraId: "LOCK" } + }, + "*" + ); + }} + /> + } + { + item.lockStatus !== "UNLOCK" && { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: item.column, extraId: "UNLOCK" } + }, + "*" + ); + }} + /> + } + + } + ; + result.dataIndex = item.column; + result.oldWidth = result.width; + result.width = "150px"; + result.ellipsis = true; + result.render = (text: string, r: any) => { + if (item.column === "costCenter") { + const { costCenter } = r; + return { + window.parent.postMessage( + { + type: "PR", + data: { id: "COSTCENTER", data: costCenter } + }, + "*" + ); + }}>{!_.isEmpty(costCenter) ? costCenter.name : ""}; + } + return + {text} + { + result.lockStatus === "LOCK" ? : null + } + ; + }; + if (result.children) { + result.width = (result.children.length * 150) + "px"; + result.children.map((child: any) => { + child.title = + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: child.column } + }, + "*" + ); + }}>{child.text} + { + child.lockStatus && + + { + child.lockStatus === "UNLOCK" && + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: child.column, extraId: "LOCK" } + }, + "*" + ); + }} + /> + } + { + child.lockStatus !== "UNLOCK" && + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: child.column, extraId: "UNLOCK" } + }, + "*" + ); + }} + /> + } + + } + ; + child.dataIndex = child.column; + child.width = "150px"; + child.ellipsis = true; + child.render = (text: string) => { + return + {text} + { + child.lockStatus === "LOCK" ? : null + } + ; + }; + }); + } + + if (index < 3) { + result.fixed = "left"; + result.render = (text: string) => { + return {text}; + }; + } + + return result; + }); + hasOperate && tmpColumns.push({ + title: "操作", + key: "cz", + width: "100px", + fixed: "right", + render: (text: string, record: any) => { + return ; + } + }); + return tmpColumns; + }; + const receiveMessageFromIndex = (event: any) => { + setDataSource([]); + const data: any = exceptStr(event.data); + if (!_.isEmpty(data)) { + const { selectedRowKeys, ...extraData } = data; + getPCDataList({ ...extraData, ...pageParams }); + if (selectedRowKeys) setSelected(selectedRowKeys); + } + }; + + const sizeChange = (pageobj: IPage) => { + }; + const onChange = (pageobj: IPage) => { + setPageParams({ ...pageParams, ...pageobj }); + window.parent.postMessage( + { + type: tab, + data: { id: "PAGEINFO", extraId: usertab, data: { ...pageParams, ...pageobj } } + }, + "*" + ); + }; + const rowSelection = { + selectedRowKeys: selected, + onChange: (selectedRowKeys: Array) => { + setSelected(selectedRowKeys); + window.parent.postMessage( + { + type: tab, + data: { id: "BATCHDELETE", extraId: usertab, data: selectedRowKeys } + }, + "*" + ); + } + }; + return { + if (tab !== "PR" || !showSumrow) return; + let totalColumns: any[] = []; + _.forEach(columns, it => { + if (!it.children) { + totalColumns.push(it); + } else { + totalColumns = [...totalColumns, ...it.children]; + } + }); + return ( + + + { + _.isEmpty(sumRow) ? : + _.map([{}, ...totalColumns], (item, index) => { + if (index === 0) { + return 总计; + } + return + {sumRow[item.dataIndex] || "-"} + ; + }) + } + + + ); + }} + />; +}; + +export default AntdTable; diff --git a/src/pages/atdTable/components/antdTable.tsx b/src/pages/atdTable/components/antdTable.tsx index 9c542f6..df2060e 100644 --- a/src/pages/atdTable/components/antdTable.tsx +++ b/src/pages/atdTable/components/antdTable.tsx @@ -58,9 +58,9 @@ const AntdTable: FC = (props) => { setPageParams({ ...pageParams, total, size, pageNum }); } } else { - const { columns = [], pageInfo = {} } = dataCopy; + const { columns = [], columns2 = [], pageInfo = {} } = dataCopy; const { list = [], total, pageSize: size, pageNum } = pageInfo; - setColumns(getColumns(columns, hasOperate)); + setColumns(getColumns(columns2, hasOperate)); setDataSource(list); setPageParams({ ...pageParams, total, size, pageNum }); const confCode: any = await API.CalculateService.getSysconfcode({ code: "OPEN_ACCT_RESULT_SUM" }); @@ -260,6 +260,67 @@ const AntdTable: FC = (props) => { } ; }; + if (child.children) { + child.children.map((grandSon: any) => { + grandSon.title = + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: grandSon.column } + }, + "*" + ); + }}>{grandSon.text} + { + grandSon.lockStatus && + + { + grandSon.lockStatus === "UNLOCK" && + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: grandSon.column, extraId: "LOCK" } + }, + "*" + ); + }} + /> + } + { + grandSon.lockStatus !== "UNLOCK" && + { + window.parent.postMessage( + { + type: "PR", + data: { id: "COLUMNINDEX", data: grandSon.column, extraId: "UNLOCK" } + }, + "*" + ); + }} + /> + } + + } + ; + grandSon.dataIndex = grandSon.column; + grandSon.width = "150px"; + grandSon.ellipsis = true; + grandSon.render = (text: string) => { + return + {text} + { + child.lockStatus === "LOCK" ? : null + } + ; + }; + }); + } }); } @@ -348,10 +409,16 @@ const AntdTable: FC = (props) => { if (tab !== "PR" || !showSumrow) return; let totalColumns: any[] = []; _.forEach(columns, it => { - if (!it.children) { + if (_.isEmpty(it.children)) { totalColumns.push(it); } else { - totalColumns = [...totalColumns, ...it.children]; + _.forEach(it.children, gt => { + if (_.isEmpty(gt.children)) { + totalColumns.push(gt); + } else { + totalColumns = [...totalColumns, ...gt.children]; + } + }); } }); return ( @@ -361,7 +428,8 @@ const AntdTable: FC = (props) => { _.isEmpty(sumRow) ? : _.map([{}, ...totalColumns], (item, index) => { if (index === 0) { - return 总计; + return 总计; } return {sumRow[item.dataIndex] || "-"} diff --git a/src/pages/salaryItemDiagram/index.tsx b/src/pages/salaryItemDiagram/index.tsx index 1f24dc3..a3ae9fb 100644 --- a/src/pages/salaryItemDiagram/index.tsx +++ b/src/pages/salaryItemDiagram/index.tsx @@ -127,7 +127,7 @@ const findChildren: any = (arr: any[], id: string) => { * Params: * Date: 2023/10/26 */ -const extractTree = (data: any[]) => { +export const extractTree = (data: any[]) => { if (!data.length) return []; const list: any[] = []; const getObj = (arr: any[]) => { diff --git a/src/pages/salaryItemFlowGraph/index.less b/src/pages/salaryItemFlowGraph/index.less new file mode 100644 index 0000000..3d6223f --- /dev/null +++ b/src/pages/salaryItemFlowGraph/index.less @@ -0,0 +1,17 @@ +.salaryItemOptWrapper { + :global { + .ant-menu-item-selected { + background: #FFF !important; + color: #333; + } + + .ant-menu-item { + height: 26px !important; + line-height: 26px !important; + } + + .ant-menu-title-content { + font-size: 12px; + } + } +} diff --git a/src/pages/salaryItemFlowGraph/index.tsx b/src/pages/salaryItemFlowGraph/index.tsx new file mode 100644 index 0000000..2941fb0 --- /dev/null +++ b/src/pages/salaryItemFlowGraph/index.tsx @@ -0,0 +1,165 @@ +/* + * Author: 黎永顺 + * name: 中江-薪资账套薪资项目流向图 + * Description: + * Date: 2023/11/14 + */ +import React, { FunctionComponent, useEffect, useMemo, useState } from "react"; +import { Menu } from "antd"; +import { FundFlowGraph } from "@ant-design/graphs"; +import { exceptStr } from "@/utils/common"; +import { extractTree } from "@/pages/salaryItemDiagram"; +import styles from "./index.less"; + +interface OwnProps { +} + +type Props = OwnProps; + +const index: FunctionComponent = (props) => { + const [nodes, setNodes] = useState([]); + const [edges, setEdges] = useState([]); + const [i18n, setI18n] = useState({}); + useEffect(() => { + window.parent.postMessage({ type: "init" }, "*"); + window.addEventListener("message", receiveMessageFromIndex, false); + return () => { + window.removeEventListener("message", receiveMessageFromIndex, false); + }; + }, []); + const openNotification = (data: any) => { + const { formulaId } = data; + window.parent.postMessage({ type: "turn", payload: { id: "VIEW", params: { formulaId } } }, "*"); + }; + const receiveMessageFromIndex = (event: any) => { + const data: any = exceptStr(event.data); + if (!_.isEmpty(data)) { + const { itemsTree, i18n } = data; + setI18n(i18n); + setNodes([{ + id: "0", + salaryItemName: i18n["薪资项目"], + value: { text: i18n["薪资项目"] } + }, ..._.map(extractTree(itemsTree), o => ({ + ...o, + id: o.salaryItemId.toString(), + value: { text: o.salaryItemName.length >= 8 ? o.salaryItemName.slice(0, 8) + "..." : o.salaryItemName } + }))]); + const edges: any = _.map(extractTree(itemsTree), o => ({ + source: o.parentId ? o.parentId.toString() : "0", + target: o.salaryItemId.toString() + })); + setEdges(edges); + } + }; + const config: any = useMemo(() => { + const data = { nodes, edges }; + return { + data, + menuCfg: { + className: styles.salaryItemOptWrapper, + shouldBegin: (evt: any) => { + const { item: { _cfg: { model } } } = evt; + return model.canAddItem || (!_.isNil(model.formulaId) && model.formulaId !== 0); + }, + handleMenuClick: (__: any, evt: any) => { + const { _cfg: { model } } = evt; + const id = __.innerText.indexOf(i18n["添加薪资项目"]) !== -1 ? "ADD" : "EDIT"; + window.parent.postMessage({ + type: "turn", + payload: { + id, params: { + visible: true, id: model?.groupId, dataType: model?.dateType, + formulaId: model?.formulaId, valueType: model?.valueType, + salaryItemId: model?.salaryItemId + } + } + }, "*"); + }, + customContent: (evt: any) => { + const { item: { _cfg: { model } } } = evt; + let items: any = [ + { label: i18n["添加薪资项目"], key: "add" }, + { label: i18n["编辑公式"], key: "edit" } + ]; + (_.isNil(model.formulaId) || model.formulaId === 0) && (items = _.filter(items, o => o.key !== "edit")); + (!model.canAddItem) && (items = _.filter(items, o => o.key !== "add")); + return ( + + ); + } + }, + edgeCfg: { + endArrow: { fill: "#333" }, + style: { stroke: "#333" }, + edgeStateStyles: { + hover: { + stroke: "#1890ff", + lineWidth: 2, + endArrow: { + fill: "#1890ff" + } + } + } + }, + nodeCfg: { + style: (item: any, group: any) => { + const { id, parentId } = item; + let styleObj = {}; + switch (id) { + case "0": + styleObj = { ...styleObj, fill: "rgb(0,154,73)", stroke: "rgb(0,154,73)" }; + break; + default: + styleObj = { ...styleObj, fill: "#FFF", stroke: "#666", radius: [2, 2, 2, 2] }; + if (_.isNil(parentId)) styleObj = { + ...styleObj, fill: "rgb(170,212,179)", + stroke: "#000", radius: [2, 2, 2, 2] + }; + break; + } + + return styleObj; + }, + label: { + style: (item: any) => { + const { id } = item; + return { fontWeight: "bold", fill: id === "0" ? "#FFF" : "#333", fontSize: id === "0" ? 18 : 12 }; + } + } + }, + markerCfg: (cfg: any) => { + const { edges } = data; + return { + position: "right", + show: edges.find((item) => item.source === cfg.id) + }; + }, + layout: { + rankdir: "LR", + nodesep: 5, + ranksep: 20 + }, + tooltipCfg: { + show: true, + shouldBegin: (evt: any) => { + const { item: { _cfg: { model } } } = evt; + return model.salaryItemName.length >= 8; + }, + customContent: (item: any) => (

{item.salaryItemName}

) + }, + onReady: (graph: any) => { + graph.on("node:click", (evt: any) => { + if (_.isEmpty(evt.target.attrs) || JSON.stringify(evt.target.attrs).indexOf("cursor") !== -1) return; + openNotification(evt.item._cfg.model); + }); + graph.on("node:contextmenu", (evt: any) => { + }); + }, + behaviors: ["drag-canvas", "zoom-canvas"] + }; + }, [nodes, edges]); + return ((!_.isEmpty(nodes) && !_.isEmpty(edges)) ? : null); +}; + +export default index;