Merge branch 'feature/V2-数据透视' into release-2023-06-08

2023-06-08 14:52:55 +08:00 · 2023-06-08 14:52:55 +08:00 · c6527075b5
parent 5ed50dd98b 8bb1146ca5
commit c6527075b5
4 changed files with 127 additions and 65 deletions
--- a/pc4mobx/hrmSalary/pages/reportView/components/povitpivotChartModal.js
+++ b/pc4mobx/hrmSalary/pages/reportView/components/povitpivotChartModal.js
@ -6,11 +6,13 @@
 */
 import React, { Component } from "react";
 import { WeaDialog, WeaLocaleProvider } from "ecCom";
+import { WeaTableNew } from "comsMobx";
 import { Spin } from "antd";
 import { toJS } from "mobx";
 import { inject, observer } from "mobx-react";
 import "./index.less";

+const WeaTableComx = WeaTableNew.WeaTable;
 const { getLabel } = WeaLocaleProvider;

@inject("payrollFilesStore")
@ -35,6 +37,14 @@ class PovitpivotChartModal extends Component {
    if (nextProps.visible !== this.props.visible && nextProps.visible) {
      const { id, dimensionId, dimensionValue } = nextProps;
      this.getDataPerspective({ id, dimensionId, dimensionValue });
+    } else {
+      this.setState({
+        dataSource: [],
+        loading: false,
+        pageInfo: {
+          current: 1, pageSize: 10, total: 0
+        }
+      });
    }
  }

@ -46,8 +56,10 @@ class PovitpivotChartModal extends Component {
    const { type, payload: { id, params } = {} } = data;
    const { dataSource, pageInfo } = this.state;
    if (type === "init") {
+      const { payrollFilesStore: { pivotTableStore } } = this.props;
+      const columns = _.filter(toJS(pivotTableStore.columns), (item) => item.display === "true" && item.dataIndex !== "randomFieldId");
      this.postMessageToChild({
-        dataSource, showSum: false, pageInfo
+        dataSource, showSum: false, pageInfo, columns
      });
    } else if (type === "turn") {
      if (id === "PAGEINFO") {
@ -64,9 +76,7 @@ class PovitpivotChartModal extends Component {
  };
  postMessageToChild = (payload) => {
    const childFrameObj = document.getElementById("commonTable");
-    const { dataSource, showSum = false, pageInfo } = payload;
-    const { payrollFilesStore: { pivotTableStore } } = this.props;
-    const columns = toJS(pivotTableStore.columns);
+    const { dataSource, showSum = false, pageInfo, columns } = payload;
    childFrameObj && childFrameObj.contentWindow.postMessage(JSON.stringify({
      dataSource, columns, showSum, pageInfo
    }), "*");
@ -82,18 +92,23 @@ class PovitpivotChartModal extends Component {
        this.setState({
          dataSource: list || [],
          pageInfo: { ...pageInfo, current, pageSize, total }
-        }, () => {
-          this.postMessageToChild({
-            dataSource: this.state.dataSource,
-            showSum: false, pageInfo: this.state.pageInfo
-          });
        });
      }
    }).catch(() => this.setState({ loading: false }));
  };
+  getColumns = () => {
+    const { dataSource, pageInfo } = this.state;
+    const { payrollFilesStore: { pivotTableStore } } = this.props;
+    const columns = _.filter(toJS(pivotTableStore.columns), (item) => item.display === "true" && item.dataIndex !== "randomFieldId");
+    this.postMessageToChild({
+      columns, dataSource,
+      showSum: false, pageInfo
+    });
+  };

  render() {
    const { loading } = this.state;
+    const { payrollFilesStore: { pivotTableStore } } = this.props;
    return (
      <WeaDialog
        title={getLabel(111, "数据透视")} scalable className="pivot-wrapper" initLoadCss
@ -107,6 +122,12 @@ class PovitpivotChartModal extends Component {
            id="commonTable"
          />
        </Spin>
+        <WeaTableComx
+          style={{ display: "none" }}
+          comsWeaTableStore={pivotTableStore}
+          needScroll={true}
+          columns={this.getColumns()}
+        />
      </WeaDialog>
    );
  }
--- a/pc4mobx/hrmSalary/pages/salaryItem/index.js
+++ b/pc4mobx/hrmSalary/pages/salaryItem/index.js
@ -223,9 +223,8 @@ export default class SalaryItem extends React.Component {
    }

    const handleMenuClick = (e) => {
-      const { salaryItemStore: { getSysItemList, setEditSlideVisible, initRequest } } = this.props;
+      const { salaryItemStore: { setEditSlideVisible, initRequest } } = this.props;
      if (e.key === "1") {
-        getSysItemList({});
        setSystemItemVisible(true);
      } else if (e.key === "2") {
        this.setState({ editable: true, isAdd: true });
--- a/pc4mobx/hrmSalary/pages/salaryItem/index.less
+++ b/pc4mobx/hrmSalary/pages/salaryItem/index.less
@ -71,6 +71,11 @@
      justify-content: flex-end;
      align-items: center;
      padding: 16px 20px;
+
+      .wea-tab {
+        width: 100%;
+        border-bottom: none;
+      }
    }
  }
 }
--- a/pc4mobx/hrmSalary/pages/salaryItem/systemSalaryItemModal.js
+++ b/pc4mobx/hrmSalary/pages/salaryItem/systemSalaryItemModal.js
@ -1,81 +1,118 @@
 import React from "react";
-import { WeaDialog, WeaInputSearch } from "ecCom";
-import { Button } from "antd";
-import { inject, observer } from "mobx-react";
-import { WeaTableNew } from "comsMobx";
+import { WeaDialog, WeaLocaleProvider, WeaTab } from "ecCom";
+import { Button, message } from "antd";
+import { getSysItemList, saveSysItem } from "../../apis/item";
+import UnifiedTable from "../../components/UnifiedTable";
 import "./index.less";

-const WeaTable = WeaTableNew.WeaTable;
-
-@inject("salaryItemStore")
-@observer
+const { getLabel } = WeaLocaleProvider;
 export default class SystemSalaryItemModal extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
-      searchValue: ""
+      dataSource: [],
+      columns: [],
+      name: "",
+      loading: false,
+      saveLoading: false,
+      selectedRowKeys: [],
+      pageInfo: {
+        current: 1, pageSize: 10, total: 0
+      }
    };
  }

-  // 搜索改变事件
-  handleSearchChange(value) {
-    this.setState({ searchValue: value });
+  componentDidMount() {
+    this.getSysItemList();
  }

-  // 搜索
-  handleSearch(value) {
-    const { salaryItemStore } = this.props;
-    const { getSysItemList } = salaryItemStore;
-    getSysItemList({ name: value });
-  }
+  getSysItemList = () => {
+    this.setState({ loading: true });
+    const { pageInfo, name } = this.state;
+    getSysItemList({ ...pageInfo, name }).then(({ status, data }) => {
+      this.setState({ loading: false });
+      if (status) {
+        const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
+        this.setState({
+          columns, dataSource,
+          pageInfo: { ...pageInfo, current, pageSize, total }
+        });
+      }
+    }).catch(() => this.setState({ loading: false }));
+  };
+  handleAdd = () => {
+    const { selectedRowKeys } = this.state;
+    if (_.isEmpty(selectedRowKeys)) {
+      message.info(getLabel(111, "未选择任何条目"));
+      return;
+    }
+    this.setState({ saveLoading: true });
+    saveSysItem(selectedRowKeys).then(({ status, errormsg }) => {
+      this.setState({ saveLoading: false });
+      if (status) {
+        message.success(getLabel(111, "添加成功"));
+        this.setState({ selectedRowKeys: [] }, () => {
+          this.getSysItemList();
+          this.props.onCancel();
+        });
+      } else {
+        message.error(errormsg);
+      }
+    }).catch(() => this.setState({ saveLoading: false }));
+  };

  render() {
-    const { salaryItemStore } = this.props;
-    const { sysListTableStore, saveLoading } = salaryItemStore;
-    const { searchValue } = this.state;
-
-    const handleAdd = () => {
-      const { salaryItemStore: { saveSysItem } } = this.props;
-      saveSysItem();
+    const { selectedRowKeys, pageInfo, loading, columns, dataSource, saveLoading } = this.state;
+    const pagination = {
+      current: pageInfo.current,
+      pageSize: pageInfo.pageSize,
+      total: pageInfo.total,
+      showTotal: total => `${getLabel(111, "共")} ${total} ${getLabel(111, "条")}`,
+      showQuickJumper: true,
+      showSizeChanger: true,
+      pageSizeOptions: ["10", "20", "50", "100"],
+      onShowSizeChange: (current, pageSize) => {
+        this.setState({ pageInfo: { ...pageInfo, current, pageSize } }, () => {
+          this.getSysItemList();
+        });
+      },
+      onChange: current => {
+        this.setState({ pageInfo: { ...pageInfo, current } }, () => {
+          this.getSysItemList();
+        });
+      }
+    };
+    const rowSelection = {
+      selectedRowKeys,
+      onChange: (selectedRowKeys) => this.setState({ selectedRowKeys })
    };
-
    return (
      <WeaDialog
        title="添加系统薪资项目"
-        initLoadCss
-        className="sys-salary-wrapper"
-        visible={this.props.visible}
-        onCancel={() => {
+        initLoadCss className="sys-salary-wrapper"
+        visible={this.props.visible} onCancel={() => {
+        this.setState({ selectedRowKeys: [] }, () => {
          this.props.onCancel();
-        }}
-        style={{ width: "60vw" }}
+        });
+      }} style={{ width: "60vw" }} scalable
        buttons={[
-          <Button
-            type="primary"
-            loading={saveLoading}
-            onClick={() => {
-              handleAdd();
-            }}
-          >添加</Button>
+          <Button type="primary" loading={saveLoading} onClick={this.handleAdd}>添加</Button>
        ]}
      >
        <div className="headerSearchWrapper">
-          <WeaInputSearch
-            value={searchValue}
-            placeholder="请输入名称"
-            onChange={(value) => {
-              this.handleSearchChange(value);
-            }}
-            onSearch={(value) => {
-              this.handleSearch(value);
-            }}/>
+          <WeaTab datas={[]} keyParam="viewcondition" //主键
+                  searchType={["base"]} onSearchChange={name => this.setState({ name })}
+                  onSearch={this.getSysItemList}
+          />
        </div>
-        <WeaTable // table内部做了loading加载处理，页面就不需要再加了
-          comsWeaTableStore={sysListTableStore} // table store
-          hasOrder={true} // 是否启用排序
-          needScroll={false} // 是否启用table内部列表滚动，将自适应到父级高度
-          // getColumns={this.getColumns}
-          // onOperatesClick={this.onOperatesClick.bind(this)}
+        <UnifiedTable
+          loading={loading}
+          rowKey="id"
+          columns={columns}
+          dataSource={dataSource}
+          pagination={pagination}
+          rowSelection={rowSelection}
+          xWidth={columns.length * 120}
        />
      </WeaDialog>
    );