From 90470c3a5784d3e5ff51cb04e26088b778149ca6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=8E=E6=B0=B8=E9=A1=BA?= <971387674@qq.com> Date: Fri, 11 Oct 2024 17:06:54 +0800 Subject: [PATCH] =?UTF-8?q?feature/2.15.2.2409.01-=E8=96=AA=E9=85=AC?= =?UTF-8?q?=E7=BB=9F=E8=AE=A1=E8=96=AA=E8=B5=84=E6=98=8E=E7=BB=86=E9=BB=98?= =?UTF-8?q?=E8=AE=A4=E6=98=BE=E7=A4=BA=E5=88=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/AssociativeSearchSingle.js | 26 ++ .../components/associativeSearchMult.js | 165 ++++++++++ .../components/associativeTreeMult.js | 84 +++++ .../components/customBrowserDialog.js | 299 ++++++++++++++++++ .../components/customBrowserMutiLeft.js | 81 +++++ .../components/customBrowserMutiRight.js | 91 ++++++ .../components/customBrowserOperation.js | 64 ++++ .../components/customTransferDialog.js | 226 +++++++++++++ .../components/CustomBrowser/index.js | 136 ++++++++ .../components/CustomBrowser/index.less | 72 +++++ .../components/salaryDetails.js | 28 +- .../pages/analysisOfSalaryStatistics/index.js | 12 +- pc4mobx/hrmSalary/stores/taxAgent.js | 10 + 13 files changed, 1283 insertions(+), 11 deletions(-) create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/AssociativeSearchSingle.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/associativeSearchMult.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/associativeTreeMult.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserDialog.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiLeft.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiRight.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserOperation.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/components/customTransferDialog.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/index.js create mode 100644 pc4mobx/hrmSalary/components/CustomBrowser/index.less diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/AssociativeSearchSingle.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/AssociativeSearchSingle.js new file mode 100644 index 00000000..6e6f9555 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/AssociativeSearchSingle.js @@ -0,0 +1,26 @@ +/* + * 自定义浏览框组件 + * 单选 + * @Author: 黎永顺 + * @Date: 2024/9/3 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; +import AssociativeSearchMult from "./associativeSearchMult"; + +const getLabel = WeaLocaleProvider.getLabel; + +class AssociativeSearchSingle extends Component { + + + render() { + return ( + + ); + } +} + +export default AssociativeSearchSingle; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/associativeSearchMult.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/associativeSearchMult.js new file mode 100644 index 00000000..3f1dbc54 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/associativeSearchMult.js @@ -0,0 +1,165 @@ +/* + * 自定义浏览框组件 + * 多选 + * @Author: 黎永顺 + * @Date: 2024/8/29 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; +import { Button, Icon, Select } from "antd"; +import { postFetch } from "../../../util/request"; +import classNames from "classnames"; + +const getLabel = WeaLocaleProvider.getLabel; +const Option = Select.Option; + +class AssociativeSearchMult extends Component { + constructor(props) { + super(props); + this.state = { + loading: false, data: [], activeKey: "", dropdownWidth: 200 + }; + this.selectedData = {}; + } + + componentDidMount() { + const { dropdownWidth } = this.state; + const w = $(this.refs.searchWrapperMui).outerWidth(); + if (dropdownWidth < w) { + this.setState({ dropdownWidth: w }); + } + } + + handleSearch = (value) => { + this.setState({ loading: true }); + this.getData(value); + }; + getData = (name = "") => { + const { browserConditionParam } = this.props; + const { + completeURL, filterByName, searchParamsKey, convertDatasource, dataParams = {} + } = browserConditionParam; + if (_.trim(name)) { + let payload = { ...dataParams }; + searchParamsKey && (payload = { ...payload, [searchParamsKey]: name, current: 1, pageSize: 9999 }); + postFetch(completeURL, payload).then(({ status, data }) => { + this.setState({ loading: false }); + if (status && data.list) { + this.setState({ + data: convertDatasource ? convertDatasource(data.list) : data.list, + activeKey: this.getActiveKey(convertDatasource ? convertDatasource(data.list) : data.list) + }); + } else { + this.setState({ + data: filterByName ? _.filter(_.map(data, o => ({ + ...o, id: String(o.id), name: o.name + })), k => k.name.indexOf(name) !== -1) : _.map(data, o => ({ ...o, id: String(o.id), name: o.name })), + activeKey: this.getActiveKey(data) + }); + } + }); + } else { + this.setState({ data: [], loading: false, activeKey: "" }); + } + }; + getActiveKey = (data) => { + const { selectedValues = [] } = this.props; + let v = ""; + if (data && data.length > 0) { + let target = data.filter((d) => selectedValues.indexOf(d.id) === -1); + if (!_.isEmpty(target)) v = String(target[0].id); + } + return v; + }; + getItemById = (id) => { + const { data } = this.state, { datas } = this.props; + if (datas[id]) return datas[id]; + if (!_.isEmpty(data)) { + for (let i = 0; i < data.length; i++) { + if (id === data[i].id) return data[i]; + } + } + }; + handleChange = (values) => { + this.selectedData = {}; + values.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + this.props.onChange && this.props.onChange(values, this.selectedData); + this.setState({ activeKey: "" }); + }; + handleBlur = () => this.setState({ data: [], activeKey: "" }); + handleClick = (e) => { + e && e.preventDefault(); + const { datas, selectedValues } = this.props; + if (this.props.clickCallback) this.props.clickCallback(selectedValues, datas); + }; + isReadOnly = () => { + const { viewAttr } = this.props; + return viewAttr === 1 || viewAttr === "1"; + }; + + render() { + const { data, dropdownWidth } = this.state; + const { viewAttr, selectedValues, datas, isSingle, browserConditionParam = {} } = this.props; + const clsname = classNames({ + "required": (viewAttr === 3 || viewAttr === "3") && _.isEmpty(selectedValues), + "mr12": viewAttr === "3" && _.isEmpty(selectedValues), + "wea-associative-single": (isSingle || browserConditionParam.isSingle), + "wea-associative-search-mult": !(isSingle || browserConditionParam.isSingle) + }); + if (this.isReadOnly()) { + let arr = []; + selectedValues && selectedValues.map(v => { + let item = datas[v].name; + if (_.isString(item)) { + arr.push({item}); + } else { + arr.push( ); + } + }); + return ( + {arr} + ); + } + let options = data.map(d => ); + selectedValues && selectedValues.map((v) => { + v && options.unshift(); + }); + const select = ; + return ( +
+ {select} + +
+
+
+ ); + } +} + +export default AssociativeSearchMult; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/associativeTreeMult.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/associativeTreeMult.js new file mode 100644 index 00000000..f7e975c3 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/associativeTreeMult.js @@ -0,0 +1,84 @@ +/* + * 自定义组件 + * 下拉树选择框 + * @Author: 黎永顺 + * @Date: 2024/9/24 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; +import { TreeSelect } from "antd"; +import classNames from "classnames"; + +const getLabel = WeaLocaleProvider.getLabel; + +class AssociativeTreeMult extends Component { + constructor(props) { + super(props); + this.state = { + data: [] + }; + this.selectedData = {}; + } + + componentDidMount() { + const { treeData } = this.props; + this.setState({ data: this.filterTree(treeData) }); + } + + handleChange = (values) => { + this.selectedData = {}; + values.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + this.props.onChange && this.props.onChange(values, this.selectedData); + }; + getItemById = (id) => { + const { data } = this.state, { datas } = this.props; + if (datas[id]) return datas[id]; + if (!_.isEmpty(data)) { + for (let i = 0; i < data.length; i++) { + if (id === data[i].id) return data[i]; + } + } + }; + filterTree = (nodes) => { + const selectableNodes = []; + const recurse = (nodes) => { + nodes.forEach((node) => { + if (node.selectable) selectableNodes.push(node); + if (node.children) recurse(node.children); + }); + }; + recurse(nodes); + return selectableNodes; + }; + + render() { + const { viewAttr, selectedValues, datas, isSingle, treeData } = this.props; + const clsname = classNames({ + "required": (viewAttr === 3 || viewAttr === "3") && _.isEmpty(selectedValues) + }); + const tProps = { + treeData, + multiple: true, + allowClear: false, + treeCheckable: true, + style: { width: "100%" }, + treeDefaultExpandAll: true, + value: selectedValues, + onChange: this.handleChange, + dropdownMatchSelectWidth: true, + dropdownStyle: { minWidth: 200, maxHeight: 280, overflowY: "auto" }, + getPopupContainer: (triggerNode) => triggerNode.parentNode + }; + return ( + + ); + } +} + +export default AssociativeTreeMult; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserDialog.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserDialog.js new file mode 100644 index 00000000..4cb5a125 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserDialog.js @@ -0,0 +1,299 @@ +/* + * 自定义浏览框组件 + * 弹框选择 + * @Author: 黎永顺 + * @Date: 2024/8/30 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaDialog, WeaInputSearch, WeaLocaleProvider, WeaNewScroll, WeaTable, WeaTransfer } from "ecCom"; +import { Button, Col, Row, Spin } from "antd"; +import CustomBrowserMutiLeft from "./customBrowserMutiLeft"; +import CustomBrowserMutiRight from "./customBrowserMutiRight"; +import CustomBrowserOperation from "./customBrowserOperation"; +import { postFetch } from "../../../util/request"; + +const WeaTransferList = WeaTransfer.list; +const getLabel = WeaLocaleProvider.getLabel; + +class CustomBrowserDialog extends Component { + constructor(props) { + super(props); + this.state = { + loading: false, listDatas: [], pageInfo: { current: 1, pageSize: 10, total: 0 }, selectedRowKeys: [], + query: { [props.searchParamsKey]: "" }, singleFilterVal: "", + leftListSelectedKeys: [], // 左侧table选择的keys + leftListSelectedData: [], // 左侧table选择的数据 + rightCheckedKeys: [], //右侧选择的keys + rightDatas: [] // 右侧展示的数据 + }; + this.selectedData = {}; + } + + componentWillReceiveProps(nextProps, nextContext) { + if (nextProps.visible !== this.props.visible && nextProps.visible) { + this.getData(); + this.setState({ + selectedRowKeys: nextProps.selectedValues, + leftListSelectedData: _.values(nextProps.datas), rightDatas: _.values(nextProps.datas) + }); + } else { + this.setState({ + pageInfo: { current: 1, pageSize: 10, total: 0 }, query: { [this.props.searchParamsKey]: "" }, + rightDatas: [], rightCheckedKeys: [], leftListSelectedData: [], leftListSelectedKeys: [] + }); + this.selectedData = {}; + } + } + + getData = () => { + const { pageInfo, query } = this.state; + const { dialogType, completeURL, convertDatasource, dataParams = {} } = this.props; + let payload = { ...dataParams, ...query }; + dialogType === "table" && (payload = { ...pageInfo, ...payload, ...query }); + this.setState({ loading: true }); + postFetch(completeURL, payload).then(({ status, data }) => { + this.setState({ loading: false }); + if (status && data.list) { + const { pageNum: current, pageSize, total } = data; + this.setState({ + listDatas: convertDatasource ? convertDatasource(data.list) : data.list, + pageInfo: { ...pageInfo, current, pageSize, total } + }); + } else { + this.setState({ listDatas: _.map(data, o => ({ ...o, id: String(o.id) })) }); + } + }); + }; + handleRowClick = record => { + if (!this.props.isSingle) return; + const values = [record.id]; + const selectedData = { [record["id"]]: record }; + this.props.onCancel(); + this.props.onChange && this.props.onChange(values, selectedData); + }; + handleClear = () => { + this.props.onCancel(); + this.props.onChange && this.props.onChange([], {}); + }; + handleOk = () => { + const { selectedRowKeys, rightDatas } = this.state, { dialogType } = this.props; + const convertSelectedRowKeys = dialogType !== "table" ? rightDatas.map((v) => v.id) : selectedRowKeys; + convertSelectedRowKeys.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + this.props.onChange && this.props.onChange(convertSelectedRowKeys, this.selectedData); + this.props.onCancel && this.props.onCancel(); + }; + getItemById = (id) => { + const { listDatas } = this.state; + if (this.selectedData[id]) return this.selectedData[id]; + if (!_.isEmpty(listDatas)) { + for (let i = 0; i < listDatas.length; i++) { + if (String(id) === String(listDatas[i].id)) return listDatas[i]; + } + } + }; + onLeftListCheck = (keys, datas) => { + const { leftListSelectedData } = this.state; + let targets = leftListSelectedData.concat(datas); + targets = _.uniqBy(targets, "id"); + targets = targets.filter((t) => keys.indexOf(t["id"]) > -1); + this.setState({ leftListSelectedKeys: keys, leftListSelectedData: targets }); + }; + onleftDoubleClick = (data) => { + const { rightDatas } = this.state; + this.setState({ + rightDatas: rightDatas.concat(data), + rightCheckedKeys: [], + leftListSelectedData: [], + leftListSelectedKeys: [] + }); + }; + onRightDoubleClick = (key) => { + const { rightDatas } = this.state; + const newRightDatas = rightDatas.filter(item => String(item.id) !== key); + this.setState({ rightDatas: newRightDatas, rightCheckedKeys: [] }); + }; + moveTo = (direction) => { + const { rightDatas, rightCheckedKeys, listDatas, leftListSelectedData } = this.state; + if (direction === "right") { + this.setState({ + rightDatas: rightDatas.concat(leftListSelectedData), + leftListSelectedData: [], + leftListSelectedKeys: [] + }); + } else if (direction === "left") { + this.setState({ + rightDatas: rightDatas.filter(item => !rightCheckedKeys.some(checkedKey => String(item.id) === checkedKey)), + rightCheckedKeys: [] + }); + } else if (direction === "allToLeft") { + this.setState({ rightDatas: [], rightCheckedKeys: [] }); + } else if (direction === "allToRight") { + if (this.leftListAllActive()) { + this.setState({ + rightDatas: rightDatas.concat(listDatas), + rightCheckedKeys: [], + leftListSelectedData: [], + leftListSelectedKeys: [] + }); + } + } + }; + leftListAllActive = () => { + const { rightDatas, listDatas } = this.state; + let bool = true; + if (_.isEmpty(listDatas)) bool = false; + if (!_.isEmpty(listDatas) && !_.isEmpty(rightDatas)) { + bool = listDatas.filter((l) => !rightDatas.some(r => l.id === r.id)).length !== 0; + } + return bool; + }; + renderTitle = () => { + const { dialogType, searchParamsKey, isSingle } = this.props, { + query, pageInfo, selectedRowKeys, singleFilterVal + } = this.state; + return (
+ {getLabel(111, "数据选择")} + { + dialogType === "table" ? + this.setState({ query: { ...query, [searchParamsKey]: value } })} + onSearch={() => { + this.setState({ pageInfo: { ...pageInfo, current: 1 } }, () => { + this.getData(); + selectedRowKeys.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + }); + }}/> : isSingle ? + this.setState({ singleFilterVal })}/> : +
+ } +
); + }; + + render() { + const { + loading, listDatas, pageInfo, selectedRowKeys, query, leftListSelectedKeys, rightDatas, rightCheckedKeys, + singleFilterVal + } = this.state; + const { dialogType, tableProps: { rowKey, columns }, isSingle, searchParamsKey } = this.props; + const sheight = this.dialog ? this.dialog.state.height - 116 : 260; + const buttons = [ + , + , + ]; + let rightActive = false, leftActive = false, rightAllActive = false; + if (leftListSelectedKeys && leftListSelectedKeys.length > 0) rightActive = true; + if (rightCheckedKeys && rightCheckedKeys.length > 0) leftActive = true; + if (rightDatas && rightDatas.length > 0) rightAllActive = true; + let dom = +
+ { + !isSingle ? +
+ + + this.setState({ query: { ...query, [searchParamsKey]: value } })} + /> + + +
+ + + +
+
+
+ this.moveTo("right")} + moveToLeft={() => this.moveTo("left")} + moveAllToRight={() => this.moveTo("allToRight")} + moveAllToLeft={() => this.moveTo("allToLeft")} + /> +
+
+ this.setState({ rightCheckedKeys })} + onDoubleClick={this.onRightDoubleClick} + /> +
+ : + this.handleRowClick(_.find(listDatas, item => item.id === id))} + data={listDatas.filter((item) => item.name.indexOf(_.trim(singleFilterVal)) > -1)}/> + } +
+ ; + if (dialogType === "table") { + const pagination = { + ...pageInfo, + showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`, + showQuickJumper: true, + showSizeChanger: true, + pageSizeOptions: ["10", "20", "50", "100"], + onShowSizeChange: (current, pageSize) => { + this.setState({ + pageInfo: { ...pageInfo, current, pageSize } + }, () => { + this.getData(); + selectedRowKeys.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + }); + }, + onChange: current => { + this.setState({ pageInfo: { ...pageInfo, current } }, () => { + this.getData(); + selectedRowKeys.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + }); + } + }; + const rowSelection = { + selectedRowKeys, + onChange: selectedRowKeys => this.setState({ selectedRowKeys }) + }; + dom =
+ +
; + } + dialogType === "table" && isSingle && buttons.splice(0, 1); + return ( + this.dialog = dom} title={this.renderTitle()} + className="custom_browser_dialog" draggable={false} style={{ + width: 784, height: 460, minHeight: 200, minWidth: 380, + maxHeight: "90%", maxWidth: "90%", overflow: "hidden", transform: "translate(0px, 0px)" + }} buttons={buttons}>{dom} + ); + } +} + +export default CustomBrowserDialog; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiLeft.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiLeft.js new file mode 100644 index 00000000..94343950 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiLeft.js @@ -0,0 +1,81 @@ +/* + * 自定义浏览框组件 + * 选择框左边 + * @Author: 黎永顺 + * @Date: 2024/8/30 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; + +const getLabel = WeaLocaleProvider.getLabel; + +let timeout = null; + +class CustomBrowserMutiLeft extends Component { + constructor(props) { + super(props); + this.dataObj = {}; + } + + onClick = (data) => { + clearTimeout(timeout); + timeout = setTimeout(() => { + let { selectedKeys } = this.props; + let keys = selectedKeys ? [...selectedKeys] : []; + let datas = []; + if (keys.indexOf(data.id) > -1) { + keys = keys.filter((k) => k !== data.id); + } else { + keys.push(data.id); + } + keys.forEach((k) => this.dataObj[k] && datas.push(this.dataObj[k])); + this.props.onClick && this.props.onClick(keys, datas); + }, 200); + }; + onDoubleClick = (data) => { + clearTimeout(timeout); + this.props.onDoubleClick && this.props.onDoubleClick([data]); + }; + cls = (item) => { + const { selectedKeys, filterData } = this.props; + let cls = []; + if (selectedKeys && selectedKeys.indexOf(item.id) > -1) { + cls.push("selected"); + } + if (filterData && filterData.filter((d) => d.id === item.id).length > 0) { + cls.push("hide"); + } + return cls.join(" "); + }; + + render() { + const { datas, selectedKeys } = this.props; + const list = datas.map(item => { + this.dataObj[item.id] = item; + return
  • this.onClick(item)} + onDoubleClick={() => this.onDoubleClick(item)}> +
    {item.name}
    +
    + +
    • ; + }); + return ( +
    +
      + {list} +
    + { + list.length === 0 && +
    + {getLabel(111, "没有可显示的数据")} +
    + } +
    + ); + } +} + +export default CustomBrowserMutiLeft; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiRight.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiRight.js new file mode 100644 index 00000000..ed56dd09 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserMutiRight.js @@ -0,0 +1,91 @@ +/* + * 自定义浏览框组件 + * 选择框右边 + * @Author: 黎永顺 + * @Date: 2024/8/30 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaInputSearch, WeaLocaleProvider, WeaNewScroll } from "ecCom"; +import { Tree } from "antd"; + +const getLabel = WeaLocaleProvider.getLabel; +const TreeNode = Tree.TreeNode; + +let timeout = null; + +class CustomBrowserMutiRight extends Component { + constructor(props) { + super(props); + this.state = { + key: "" + }; + this.nodeIds = []; + this.nodeObj = {}; + } + + generateTreeNodes = () => { + const { data } = this.props, { key } = this.state; + const treeNodes = []; + let showData = [...data]; + if (_.trim(key)) { + showData = showData.filter((item) => { + return item.name.indexOf(_.trim(key)) > -1; + }); + } + showData = _.uniqBy(showData, "id"); + this.nodeIds = []; + this.nodeObj = {}; + showData.map((item) => { + let title = ( +
    +
    +
    + {item.name} +
    +
    +
    +
    + ); + treeNodes.push(); + this.nodeIds.push(item["id"]); + this.nodeObj[item["id"]] = item; + }); + return treeNodes; + }; + handleSearchChange = (v) => this.setState({ key: v }); + checkHandler = (v) => { + clearTimeout(timeout); + timeout = setTimeout(() => { + this.props.checkedCb && this.props.checkedCb(v); + }, 200); + }; + onDoubleClick = (key) => { + clearTimeout(timeout); + this.props.onDoubleClick && this.props.onDoubleClick(key); + }; + + render() { + const { height, checkedKeys } = this.props; + return ( +
    + +
    + + + {this.generateTreeNodes()} + + +
    +
    + ); + } +} + +export default CustomBrowserMutiRight; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserOperation.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserOperation.js new file mode 100644 index 00000000..ab56ef02 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/customBrowserOperation.js @@ -0,0 +1,64 @@ +/* + * 自定义浏览框组件 + * 弹框操作栏 + * @Author: 黎永顺 + * @Date: 2024/8/30 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; +import { Button } from "antd"; + +const getLabel = WeaLocaleProvider.getLabel; + +class CustomBrowserOperation extends Component { + render() { + const { + moveToLeft, + moveToRight, + leftArrowText, + rightArrowText, + leftActive, + rightActive, + className, + leftAllActive, + moveAllToLeft, + rightAllActive, + moveAllToRight + } = this.props; + + const moveToLeftButton = ( + + ); + const moveToRightButton = ( + + ); + + const moveAllToLeftButton = ( + + ); + const moveAllToRightButton = ( + + ); + return ( +
    + {moveToLeftButton} + {moveToRightButton} + {moveAllToLeftButton} + {moveAllToRightButton} +
    + ); + } +} + +export default CustomBrowserOperation; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/components/customTransferDialog.js b/pc4mobx/hrmSalary/components/CustomBrowser/components/customTransferDialog.js new file mode 100644 index 00000000..25ed3916 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/components/customTransferDialog.js @@ -0,0 +1,226 @@ +/* + * 自定义穿梭框组件 + * 弹框选择 + * @Author: 黎永顺 + * @Date: 2024/8/30 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaDialog, WeaInputSearch, WeaLocaleProvider, WeaNewScroll } from "ecCom"; +import { Button, Col, Row, Spin } from "antd"; +import CustomBrowserMutiLeft from "./customBrowserMutiLeft"; +import CustomBrowserMutiRight from "./customBrowserMutiRight"; +import CustomBrowserOperation from "./customBrowserOperation"; +import { postFetch } from "../../../util/request"; +import "../index.less"; + +const getLabel = WeaLocaleProvider.getLabel; + +class CustomTransferDialog extends Component { + constructor(props) { + super(props); + this.state = { + loading: false, listDatas: [], pageInfo: { current: 1, pageSize: 10, total: 0 }, selectedRowKeys: [], + query: { [props.searchParamsKey]: "" }, singleFilterVal: "", + leftListSelectedKeys: [], // 左侧table选择的keys + leftListSelectedData: [], // 左侧table选择的数据 + rightCheckedKeys: [], //右侧选择的keys + rightDatas: [] // 右侧展示的数据 + }; + this.selectedData = {}; + } + + componentWillReceiveProps(nextProps, nextContext) { + if (nextProps.visible !== this.props.visible && nextProps.visible) { + this.getData(true); + if (nextProps.datas) { + this.setState({ + leftListSelectedData: _.values(nextProps.datas), rightDatas: _.values(nextProps.datas) + }); + } + } else { + this.setState({ + pageInfo: { current: 1, pageSize: 10, total: 0 }, query: { [this.props.searchParamsKey]: "" }, + rightDatas: [], rightCheckedKeys: [], leftListSelectedData: [], leftListSelectedKeys: [] + }); + this.selectedData = {}; + } + } + + getData = (init = false) => { + const { pageInfo, query } = this.state; + const { completeURL, convertDatasource, dataParams = {} } = this.props; + let payload = { ...dataParams, ...query }; + this.setState({ loading: true }); + postFetch(completeURL, payload).then(({ status, data }) => { + this.setState({ loading: false }); + if (status && data.list) { + const { pageNum: current, pageSize, total } = data; + this.setState({ + listDatas: convertDatasource ? convertDatasource(data.list) : data.list, + pageInfo: { ...pageInfo, current, pageSize, total } + }); + } else { + console.log(64, data); + this.setState({ + listDatas: convertDatasource ? convertDatasource(data) : [], + leftListSelectedData: init ? _.values(nextProps.datas) : [], + rightDatas: init ? _.values(nextProps.datas) : [] + }); + } + }); + }; + handleOk = () => { + const { selectedRowKeys, rightDatas } = this.state, { dialogType } = this.props; + const convertSelectedRowKeys = dialogType !== "table" ? rightDatas.map((v) => v.id) : selectedRowKeys; + convertSelectedRowKeys.forEach((v) => { + let item = this.getItemById(v); + if (item) this.selectedData[v] = item; + }); + this.props.onChange && this.props.onChange(convertSelectedRowKeys, this.selectedData); + this.props.onCancel && this.props.onCancel(); + }; + getItemById = (id) => { + const { listDatas } = this.state; + if (this.selectedData[id]) return this.selectedData[id]; + if (!_.isEmpty(listDatas)) { + for (let i = 0; i < listDatas.length; i++) { + if (String(id) === String(listDatas[i].id)) return listDatas[i]; + } + } + }; + onLeftListCheck = (keys, datas) => { + const { leftListSelectedData } = this.state; + let targets = leftListSelectedData.concat(datas); + targets = _.uniqBy(targets, "id"); + targets = targets.filter((t) => keys.indexOf(t["id"]) > -1); + this.setState({ leftListSelectedKeys: keys, leftListSelectedData: targets }); + }; + onleftDoubleClick = (data) => { + const { rightDatas } = this.state; + this.setState({ + rightDatas: rightDatas.concat(data), + rightCheckedKeys: [], + leftListSelectedData: [], + leftListSelectedKeys: [] + }); + }; + onRightDoubleClick = (key) => { + const { rightDatas } = this.state; + const newRightDatas = rightDatas.filter(item => String(item.id) !== key); + this.setState({ rightDatas: newRightDatas, rightCheckedKeys: [] }); + }; + moveTo = (direction) => { + const { rightDatas, rightCheckedKeys, listDatas, leftListSelectedData } = this.state; + if (direction === "right") { + this.setState({ + rightDatas: rightDatas.concat(leftListSelectedData), + leftListSelectedData: [], + leftListSelectedKeys: [] + }); + } else if (direction === "left") { + this.setState({ + rightDatas: rightDatas.filter(item => !rightCheckedKeys.some(checkedKey => String(item.id) === checkedKey)), + rightCheckedKeys: [] + }); + } else if (direction === "allToLeft") { + this.setState({ rightDatas: [], rightCheckedKeys: [] }); + } else if (direction === "allToRight") { + if (this.leftListAllActive()) { + this.setState({ + rightDatas: rightDatas.concat(listDatas), + rightCheckedKeys: [], + leftListSelectedData: [], + leftListSelectedKeys: [] + }); + } + } + }; + leftListAllActive = () => { + const { rightDatas, listDatas } = this.state; + let bool = true; + if (_.isEmpty(listDatas)) bool = false; + if (!_.isEmpty(listDatas) && !_.isEmpty(rightDatas)) { + bool = listDatas.filter((l) => !rightDatas.some(r => l.id === r.id)).length !== 0; + } + return bool; + }; + renderTitle = () => { + return (
    + {getLabel(111, "数据选择")} +
    +
    ); + }; + + render() { + const { + loading, listDatas, query, leftListSelectedKeys, rightDatas, rightCheckedKeys, + singleFilterVal + } = this.state; + const { dialogType, isSingle, searchParamsKey } = this.props; + const buttons = [ + , + ]; + let rightActive = false, leftActive = false, rightAllActive = false; + if (leftListSelectedKeys && leftListSelectedKeys.length > 0) rightActive = true; + if (rightCheckedKeys && rightCheckedKeys.length > 0) leftActive = true; + if (rightDatas && rightDatas.length > 0) rightAllActive = true; + let dom = +
    +
    + + + this.setState({ query: { ...query, [searchParamsKey]: value } })} + /> + + +
    + + + +
    +
    +
    + this.moveTo("right")} + moveToLeft={() => this.moveTo("left")} + moveAllToRight={() => this.moveTo("allToRight")} + moveAllToLeft={() => this.moveTo("allToLeft")} + /> +
    +
    + this.setState({ rightCheckedKeys })} + onDoubleClick={this.onRightDoubleClick} + /> +
    +
    +     ; + return ( + this.dialog = dom} title={this.renderTitle()} + className="custom_browser_dialog" draggable={false} style={{ + width: 784, height: 460, minHeight: 200, minWidth: 380, + maxHeight: "90%", maxWidth: "90%", overflow: "hidden", transform: "translate(0px, 0px)" + }} buttons={buttons}>{dom} + ); + } +} + +export default CustomTransferDialog; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/index.js b/pc4mobx/hrmSalary/components/CustomBrowser/index.js new file mode 100644 index 00000000..f77d566d --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/index.js @@ -0,0 +1,136 @@ +/* + * 自定义浏览框组件 + * + * @Author: 黎永顺 + * @Date: 2024/8/29 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider, WeaTools } from "ecCom"; +import AssociativeTreeMult from "./components/associativeTreeMult"; +import AssociativeSearchMult from "./components/associativeSearchMult"; +import AssociativeSearchSingle from "./components/AssociativeSearchSingle"; +import CustomBrowserDialog from "./components/customBrowserDialog"; +import classNames from "classnames"; +import "./index.less"; + +const getLabel = WeaLocaleProvider.getLabel; +const getKey = WeaTools.getKey; + +class Index extends Component { + constructor(props) { + super(props); + this.state = { + browserDialog: { visible: false }, + selectedData: {}, searchKeys: [], // 搜索按钮选择的数据和keys + rightDatas: [] // 右侧展示的数据 + }; + } + + componentDidMount() { + const { value, fieldConfig } = this.props; + const { value: defaultValue, browserConditionParam: { replaceDatas = [] } } = fieldConfig; + if ((value || defaultValue) && replaceDatas.length > 0) { + this.setState({ + searchKeys: (value || defaultValue).split(","), + selectedData: _.reduce(replaceDatas, (pre, cur) => ({ ...pre, [cur["id"]]: cur }), {}) + }); + } + } + + componentWillReceiveProps(nextProps, nextContext) { + if ( + (nextProps.value !== this.props.value && _.isEmpty(nextProps.value)) || + (nextProps.fieldConfig.value !== this.props.fieldConfig.value && _.isEmpty(nextProps.fieldConfig.value)) + ) { + this.setState({ searchKeys: [], selectedData: [] }); + } + } + + renderSingle = () => { + const { fieldConfig } = this.props; + const { selectedData, searchKeys } = this.state; + return (
    + +
    ); + }; + renderMult = () => { + const { fieldConfig } = this.props; + const { browserConditionParam = {} } = fieldConfig || {}; + const { selectedData, searchKeys } = this.state; + return (
    + { + browserConditionParam.treeSelect ? + : + + } +
    ); + }; + onBrowerChangeHandler = (values, datas) => { + const { form, fieldConfig, isSingle } = this.props; + const { browserConditionParam = {} } = fieldConfig || {}; + this.setState({ + searchKeys: (isSingle || browserConditionParam.isSingle) ? values.slice(-1) : values, + selectedData: ((isSingle || browserConditionParam.isSingle) && !_.isEmpty(values)) ? { [_.last(values)]: datas[_.last(values)] } : datas + }, () => { + this.props.onChange && this.props.onChange(values.join(",")); + this.props.onCustomChange && this.props.onCustomChange(this.state.selectedData); + if (form) { + form.updateFields({ + [getKey(fieldConfig)]: { value: this.state.searchKeys.join(",") } + }); + } + }); + }; + onBrowerClick = (keys, selectedObj) => { + if (_.isEmpty(keys)) { + this.setState({ searchKeys: [], selectedData: {}, rightDatas: [] }); + } + this.setState({ browserDialog: { visible: true } }); + }; + + render() { + const { browserDialog, selectedData, searchKeys } = this.state; + const { isSingle, viewAttr, fieldConfig = {} } = this.props; + const { browserConditionParam = {} } = fieldConfig || {}; + const className = classNames({ + "wea-browser": true, + "wea-field-readonly": viewAttr === "1" || fieldConfig.viewAttr === "1" + }); + const browser = (isSingle || browserConditionParam.isSingle) ? this.renderSingle() : this.renderMult(); + const style = {}; + if (this.props.resize) style.visibility = "hidden"; + return ( +
    {browser}
    + this.setState({ browserDialog: { visible: false } })} + datas={selectedData} selectedValues={searchKeys}/> +     + ); + } +} + +export default Index; diff --git a/pc4mobx/hrmSalary/components/CustomBrowser/index.less b/pc4mobx/hrmSalary/components/CustomBrowser/index.less new file mode 100644 index 00000000..d4d61a16 --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomBrowser/index.less @@ -0,0 +1,72 @@ +.custom_browser_dialog { + .wea-hr-muti-dialog-title { + display: flex; + justify-content: space-between; + align-items: center; + } + + .wea-hr-muti-input-table { + background: #f6f6f6; + padding: 8px 16px; + height: 100%; + + .wea-new-table { + background: #FFF; + } + } + + .ant-spin-nested-loading, .ant-spin-container { + height: 100%; + } + + .wea-hr-muti-dialog { + height: 100%; + background: #f6f6f6; + padding: 8px 16px; + + .wea-hr-muti-input-left, .wea-hr-muti-input-right { + background: #FFF; + } + + .wea-transfer-list { + background: #FFF; + border: 1px solid #e9e9e9; + } + + .wea-input-focus { + height: 35px !important; + width: 100% !important; + + input { + height: 100% !important; + } + } + + .wea-transfer-list-wrapper { + border: none !important; + + .transfer-tree { + padding: 0 !important; + + & > li { + margin: 0; + cursor: pointer; + width: 100%; + position: relative; + padding: 6px 0 6px 20px !important; + border-bottom: 1px solid #e9e9e9; + color: #333; + overflow: hidden; + + .ant-tree-switcher { + display: none !important; + } + + .tree-title { + line-height: 30px; + } + } + } + } + } +} diff --git a/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/components/salaryDetails.js b/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/components/salaryDetails.js index 3f01a8bf..aeafccb6 100644 --- a/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/components/salaryDetails.js +++ b/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/components/salaryDetails.js @@ -6,13 +6,14 @@ */ import React, { Component } from "react"; import { inject, observer } from "mobx-react"; -import { toJS } from "mobx"; -import { WeaLoadingGlobal, WeaLocaleProvider } from "ecCom"; import { WeaTableNew } from "comsMobx"; +import { WeaLoadingGlobal, WeaLocaleProvider } from "ecCom"; import { message, Spin } from "antd"; -import * as API from "../../../apis/statistics"; +import { toJS } from "mobx"; import { getIframeParentHeight } from "../../../util"; import { sysConfCodeRule } from "../../../apis/ruleconfig"; +import CustomTransferDialog from "../../../components/CustomBrowser/components/customTransferDialog"; +import * as API from "../../../apis/statistics"; import "../index.less"; const WeaTableComx = WeaTableNew.WeaTable; @@ -26,7 +27,12 @@ class SalaryDetails extends Component { this.state = { loading: false, dataSource: [], columns: [], selectedRowKeys: [], pageInfo: { current: 1, pageSize: 10, total: 0 }, payload: {}, - showTotalCell: false, updateSum: true + showTotalCell: false, updateSum: true, + transferDialog: { + visible: false, searchParamsKey: "name", dataParams: { page: "salary_details_report" }, + completeURL: "/api/bs/hrmsalary/common/pageList/get/setting" + // convertDatasource: null + } }; } @@ -113,10 +119,10 @@ class SalaryDetails extends Component { }; getColumns = () => { const { attendanceStore: { tableStore } } = this.props; - const { dataSource, pageInfo, selectedRowKeys, showTotalCell, payload, updateSum } = this.state; + const { dataSource, pageInfo, selectedRowKeys, showTotalCell, payload, updateSum, transferDialog } = this.state; const columns = _.filter(toJS(tableStore.columns), (item) => item.display === "true" && item.dataIndex !== "acctTimes"); const sumRowlistUrl = showTotalCell ? "/api/bs/hrmsalary/report/statistics/employee/salaryListSum" : ""; - if (!_.isEmpty(columns)) { + if (!_.isEmpty(columns) && !transferDialog.visible) { this.postMessageToChild({ dataSource, pageInfo, selectedRowKeys, showTotalCell, calcDetail: true, tableScrollHeight: 154, sumRowlistUrl, payload: { ...payload, updateSum }, @@ -130,9 +136,12 @@ class SalaryDetails extends Component { } return []; }; + handleSetDefCols = () => { + this.setState({ transferDialog: { ...this.state.transferDialog, visible: true } }); + }; render() { - const { loading, dataSource } = this.state; + const { loading, dataSource, transferDialog } = this.state; const { attendanceStore: { tableStore } } = this.props; return (
    + {/*默认显示列*/} + this.setState({ + transferDialog: { ...transferDialog, visible: false } + })}/>
    ); } diff --git a/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/index.js b/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/index.js index 121e334a..f8ac8451 100644 --- a/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/index.js +++ b/pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/index.js @@ -275,7 +275,7 @@ class Index extends Component { render() { const { - taxAgentStore: { statisticsReportBtn }, + taxAgentStore: { statisticsReportBtn, PageAndOptAuth }, attendanceStore: { statisticsForm, reportForm, tableStore } } = this.props; const { @@ -313,7 +313,7 @@ class Index extends Component { ]; - const dropMenuDatas = [ + let dropMenuDatas = [ { key: "log", icon: , content: getLabel(545781, "操作日志") @@ -333,6 +333,11 @@ class Index extends Component { { key: "detail", title: getLabel(111, "员工明细") }, { key: "salaryDetail", title: getLabel(111, "薪资明细") } ]; + dropMenuDatas = selectedKey === "salaryDetail" ? dropMenuDatas.slice(-1) : dropMenuDatas.slice(0, 1); + (PageAndOptAuth.isChief && selectedKey === "salaryDetail") && (dropMenuDatas = [...dropMenuDatas, { + key: "DEF_COLUMN", icon: , content: getLabel(111, "默认显示列"), + onClick: () => this.salaryRef.wrappedInstance.handleSetDefCols() + }]); return ( } selectedKey={selectedKey} @@ -340,8 +345,7 @@ class Index extends Component { buttons={(!statisticsReportBtn && selectedKey === "statistics") ? buttons.slice(-1) : buttons} buttonSpace={10} onChange={selectedKey => this.setState({ selectedKey }, () => this.state.selectedKey === "statistics" && this.initReportFormCondition())} showDropIcon={selectedKey !== "detail"} onDropMenuClick={this.onDropMenuClick} - dropMenuDatas={selectedKey === "salaryDetail" ? dropMenuDatas.slice(-1) : dropMenuDatas.slice(0, 1)} - > + dropMenuDatas={dropMenuDatas}>
    this.setState({ showSearchAd: false })} onAdSearch={this.onAdSearch}/>
    diff --git a/pc4mobx/hrmSalary/stores/taxAgent.js b/pc4mobx/hrmSalary/stores/taxAgent.js index ef5cfe2d..33b74a55 100644 --- a/pc4mobx/hrmSalary/stores/taxAgent.js +++ b/pc4mobx/hrmSalary/stores/taxAgent.js @@ -8,6 +8,15 @@ import { decentralizationConditions, editConditions } from "../pages/taxAgent/ed const { TableStore } = WeaTableNew; export class TaxAgentStore { + @observable advanceForm = new WeaForm(); //权限-角色高级搜索form表单 + @observable roleForm = new WeaForm(); //权限-角色form表单 + @action initRoleForm = () => this.roleForm = new WeaForm(); + @observable roleOperatorForm = new WeaForm(); //权限-角色操作者form表单 + @action initRoleOperatorForm = () => this.roleOperatorForm = new WeaForm(); + @observable PageAndOptAuth = { able: false, opts: [] }; // 业务线页面权限 + @action initPageAndOptAuth = () => this.PageAndOptAuth = { able: true, opts: ["query", "admin"] };// 设置业务线页面权限 + + @observable tableStore = new TableStore(); // new table @observable form = new WeaForm(); //表单实体 @observable formDecentralization = new WeaForm(); //关闭分权表单 @@ -140,6 +149,7 @@ export class TaxAgentStore { return new Promise((resolve, reject) => { API.getPermission(params).then(({ status, data }) => { if (status) { + this.PageAndOptAuth = data; const { isAdminEnable, isChief, isOpenDevolution } = data; this.setShowOperateBtn( !isOpenDevolution ? true : isAdminEnable ? true : false