feature/2.17.1.2411.01-薪酬报表薪资明细显示模式

pc4mobx/hrmSalary/components/CustomBrowser/components/customTransferDialog.js

@@ -8,7 +8,7 @@
   * @description:
 */
 import React, { Component } from "react";
-import { WeaDialog, WeaInputSearch, WeaLocaleProvider, WeaNewScroll } from "ecCom";
+import { WeaDialog, WeaInputSearch, WeaLocaleProvider, WeaNewScroll, WeaTable } from "ecCom";
 import { Button, Col, Row, Spin } from "antd";
 import CustomBrowserMutiLeft from "./customBrowserMutiLeft";
 import CustomBrowserMutiRight from "./customBrowserMutiRight";
@@ -22,8 +22,8 @@ class CustomTransferDialog extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      loading: false, listDatas: [],
+      loading: false, listDatas: [], columns: [], selectedRowKeys: [], pageInfo: { current: 1, pageSize: 10, total: 0 },
-      query: { [props.searchParamsKey]: "" },
+      query: props.searchParamsKey ? { [props.searchParamsKey]: "" } : {},
       leftListSelectedKeys: [], // 左侧table选择的keys
       leftListSelectedData: [], // 左侧table选择的数据
       rightCheckedKeys: [], //右侧选择的keys
@@ -50,16 +50,18 @@ class CustomTransferDialog extends Component {
   }
 
   getData = (init = false, props) => {
-    const { query } = this.state;
+    const { query, pageInfo } = this.state;
-    const { completeURL, convertDatasource, dataParams = {} } = props || this.props;
+    const { completeURL, convertDatasource, dataParams = {}, dialogType } = props || this.props;
     let payload = { ...dataParams, ...query };
+    dialogType === "table" && (payload = { ...payload, ...pageInfo });
     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
+          listDatas: convertDatasource ? convertDatasource(data.list) : data.list, columns: data.columns,
+          pageInfo: { ...pageInfo, current, pageSize, total }
         });
       } else {
         this.setState({
@@ -132,15 +134,18 @@ class CustomTransferDialog extends Component {
   };
   renderTitle = () => {
     return (<div className="wea-hr-muti-dialog-title">
-      <span>{getLabel(111, "数据选择")}</span>
+      <span>{this.props.title || getLabel(111, "数据选择")}</span>
       <div>{this.props.titleOptsComs}</div>
     </div>);
   };
 
   render() {
-    const { loading, listDatas, query, leftListSelectedKeys, rightDatas, rightCheckedKeys } = this.state;
     const {
-      searchParamsKey, saveLoading, buttons = [
+      loading, listDatas, query, leftListSelectedKeys, rightDatas, rightCheckedKeys, pageInfo, selectedRowKeys,
+      columns
+    } = this.state;
+    const {
+      searchParamsKey, saveLoading, dialogType = "", rowKey, buttons = [
         <Button type="primary" loading={saveLoading} onClick={this.handleOk}
                 disabled={_.isEmpty(rightDatas)}>{getLabel(111, "确 定")}</Button>,
         <Button type="ghost" onClick={this.props.onCancel}>{getLabel(111, "取 消")}</Button>
@@ -197,6 +202,32 @@ class CustomTransferDialog extends Component {
         </div>
       </div>
     </Spin>;
+    if (dialogType === "table") {
+      const sheight = this.dialog ? this.dialog.state.height - 116 : 260;
+      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());
+        },
+        onChange: current => {
+          this.setState({ pageInfo: { ...pageInfo, current } }, () => this.getData());
+        }
+      };
+      const rowSelection = {
+        selectedRowKeys,
+        onChange: selectedRowKeys => this.setState({ selectedRowKeys })
+      };
+      dom = <div className="wea-hr-muti-input-table">
+        <WeaTable dataSource={listDatas} loading={loading} pagination={pagination} scroll={{ y: sheight }}
+                  rowSelection={rowSelection} rowKey={rowKey || "id"} columns={columns}/>
+      </div>;
+    }
     return (
       <WeaDialog
         {...this.props} initLoadCss ref={dom => this.dialog = dom} title={this.renderTitle()}

pc4mobx/hrmSalary/components/CustomBrowser/index.less

@@ -3,6 +3,20 @@
     display: flex;
     justify-content: space-between;
     align-items: center;
+
+    .wea-select, .ant-select-selection, .ant-select {
+      width: 100%;
+    }
+
+    .wea-select {
+      display: inline-block;
+      position: relative;
+    }
+
+    .ant-select-selection {
+      height: 30px;
+      border-radius: 0;
+    }
   }
 
   .wea-hr-muti-input-table {

pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/components/salaryDetails.js

@@ -13,11 +13,11 @@ import { getIframeParentHeight } from "../../../util";
 import { sysConfCodeRule } from "../../../apis/ruleconfig";
 import CustomTransferDialog from "../../../components/CustomBrowser/components/customTransferDialog";
 import SalaryDetailsTempDialog from "./salaryDetailsTempDialog";
+import SalaryTempMangerDialog from "./salaryTempMangerDialog";
 import { MonthRangePicker } from "../../reportView/components/statisticalMicroSettingsSlide";
 import AdvanceInputBtn from "../components/advanceInputBtn";
 import SearchPannel from "../components/searchPannel";
 import * as API from "../../../apis/statistics";
-import { resetPageListSetting } from "../../../apis/statistics";
 import cs from "classnames";
 import "../index.less";
 
@@ -42,7 +42,11 @@ class SalaryDetails extends Component {
             checked: this.converCheckedCol(datas)
           };
         },
-        type: "default"
+        dialogType: "temp"
+      },
+      tempManageDialog: { //模板管理
+        visible: false, completeURL: "", dialogType: "table",
+        dataParams: { page: "salary_details_report" }
       }
     };
   }
@@ -172,9 +176,8 @@ class SalaryDetails extends Component {
   };
   handleSetDefCols = (params = {}) => this.setState({
     transferDialog: {
-      ...this.state.transferDialog, visible: true, type: "temp",
+      ...this.state.transferDialog, visible: true, dataParams: { ...this.state.transferDialog.dataParams, ...params },
-      dataParams: { ...this.state.transferDialog.dataParams, ...params },
+      completeURL: "/api/bs/hrmsalary/common/pageList/template/get", dialogType: "temp"
-      completeURL: "/api/bs/hrmsalary/common/pageList/template/get"
     }
   }, () => this.getPageListTemplatelist());
   converCheckedCol = (data) => {
@@ -196,17 +199,20 @@ class SalaryDetails extends Component {
       if (status) {
         message.success(getLabel(111, "操作成功！"));
         this.setState({
-          transferDialog: { ...this.state.transferDialog, visible: false, type: "default" }
+          transferDialog: { ...this.state.transferDialog, visible: false, dialogType: "temp" }
         }, () => this.getSalaryList());
       } else {
         message.error(errormsg);
       }
     });
   };
-  handelAddTemp = (templateId) => {
+  handelAddTemp = (templateId = "") => {
     const { tempDialog, tempPageList } = this.state;
     this.setState({
-      tempDialog: { ...tempDialog, id: templateId, template: _.find(tempPageList, o => o.key === templateId) }
+      tempDialog: {
+        ...tempDialog, visible: true, setting: _.map(this.transferRef.state.rightDatas, o => o.id)
+        // template: _.find(tempPageList, o => o.key === templateId)
+      }
     });
   };
   changePageListTemplate = (templateId) => {
@@ -229,23 +235,11 @@ class SalaryDetails extends Component {
       });
     });
   };
-  resetColsSetting = () => {
-    resetPageListSetting({ page: "salary_details_report" }).then(({ status, errormsg }) => {
-      if (status) {
-        message.success(getLabel(111, "操作成功！"));
-        this.setState({
-          transferDialog: { ...this.state.transferDialog, visible: false, type: "default" }
-        }, () => this.getSalaryList());
-      } else {
-        message.error(errormsg);
-      }
-    });
-  };
 
   render() {
-    const { loading, dataSource, transferDialog, tempDialog, tempPageList, templateId } = this.state;
+    const { loading, dataSource, transferDialog, tempDialog, tempPageList, templateId, tempManageDialog } = this.state;
-    const { attendanceStore: { tableStore }, dateRange, showSearchAd, salaryDetailShowType } = this.props;
+    const { dateRange, showSearchAd } = this.props;
-    const { dataParams: { defaultSetting } } = transferDialog;
+    const { dialogType } = transferDialog;
     return (<React.Fragment>
         <div className="query-div">
           <MonthRangePicker dateRange={dateRange} viewAttr={2} onChange={this.props.onChange}/>
@@ -273,29 +267,37 @@ class SalaryDetails extends Component {
           {/*/>*/}
           {/*默认显示列,薪资模板列表*/}
           <CustomTransferDialog {...transferDialog} ref={dom => this.transferRef = dom}
-                                buttons={[
-                                  <Button type="primary"
-                                          onClick={() => this.handelAddTemp(templateId)}>{getLabel(111, "存为模板")}</Button>,
-                                  <Button type="ghost">{getLabel(111, "模板管理")}</Button>
-                                ]}
-                                titleOptsComs={
-                                  <WeaSelect style={{ width: 200 }} options={tempPageList}
-                                             showSearch optionFilterProp="children" value={templateId}
-                                             onChange={this.changePageListTemplate}/>}
                                 onCancel={() => this.setState({
-                                  transferDialog: {
+                                  transferDialog: { ...transferDialog, completeURL: "", visible: false }
-                                    ...transferDialog, completeURL: "", visible: false, type: "default"
+                                })}
+                                buttons={
+                                  dialogType === "temp" ? [
+                                    <Button type="primary"
+                                            onClick={this.handelAddTemp}>{getLabel(111, "存为模板")}</Button>,
+                                    <Button type="ghost" onClick={() => this.setState({
+                                      tempManageDialog: {
+                                        ...tempManageDialog, visible: true,
+                                        completeURL: "/api/bs/hrmsalary/common/pageList/template/pageList"
                                       }
-                                })}/>
+                                    })}>{getLabel(111, "模板管理")}</Button>
+                                  ] : []
+                                }
+                                titleOptsComs={
+                                  dialogType === "temp" ?
+                                    <WeaSelect style={{ width: 200 }} options={tempPageList}
+                                               showSearch optionFilterProp="children"
+                                               value={templateId}
+                                               onChange={this.changePageListTemplate}/> : null
+                                }/>
           {/*薪资明细模板设置*/}
           <SalaryDetailsTempDialog {...tempDialog}
                                    onCancel={callback => this.setState({
                                      tempDialog: { ...tempDialog, visible: false, setting: [] }
                                    }, () => callback && callback())}
-                                   onSuccess={() => {
+                                   onSuccess={this.getPageListTemplatelist}/>
-                                     this.getPageListTemplatelist();
+          <SalaryTempMangerDialog {...tempManageDialog} onCancel={() => this.setState({
-                                     this.getSalaryList();
+            tempManageDialog: { ...tempManageDialog, completeURL: "", visible: false }
-                                   }}/>
+          })}/>
         </div>
       </React.Fragment>
     );

pc4mobx/hrmSalary/pages/analysisOfSalaryStatistics/components/salaryTempMangerDialog.js

@@ -0,0 +1,22 @@
+/*
+  * 薪酬报表-薪酬明细
+  * 模板管理弹框
+  * @Author:    黎永顺
+  * @Date:      2024/12/4
+  * @Wechat:
+  * @Email:     971387674@qq.com
+  * @description:
+*/
+import React, { Component } from "react";
+import { WeaLocaleProvider } from "ecCom";
+import CustomTransferDialog from "../../../components/CustomBrowser/components/customTransferDialog";
+
+const getLabel = WeaLocaleProvider.getLabel;
+
+class SalaryTempMangerDialog extends Component {
+  render() {
+    return (<CustomTransferDialog {...this.props} buttons={[]} title={getLabel(111, "模板管理")}/>);
+  }
+}
+
+export default SalaryTempMangerDialog;