custom/西部信托0401

pc4mobx/hrmSalary/pages/custom-pages/xbxt/personalSalaryReport.js

@@ -34,6 +34,10 @@ class PersonalSalaryReport extends Component {
     window.addEventListener("message", this.handleReceive, false);
   }
 
+  componentWillReceiveProps(nextProps, nextContext) {
+    if (nextProps.dateRange !== this.props.dateRange) this.getSalaryReport(nextProps);
+  }
+
   componentWillUnmount() {
     window.removeEventListener("message", this.handleReceive, false);
   }
@@ -60,8 +64,9 @@ class PersonalSalaryReport extends Component {
     const childFrameObj = document.getElementById("atdTable");
     childFrameObj && childFrameObj.contentWindow.postMessage(JSON.stringify({ ...payload, i18n }), "*");
   };
-  getSalaryReport = () => {
+  getSalaryReport = (props) => {
-    const { pageInfo, dateRange } = this.state, [startDateStr, endDateStr] = dateRange;
+    const { pageInfo, dateRange: pageDateRange } = this.state, { dateRange } = props || this.props;
+    const [startDateStr, endDateStr] = dateRange || pageDateRange;
     const payload = { startDateStr, endDateStr, ...pageInfo };
     this.setState({ loading: true });
     postFetch("/api/bs/hrmsalary/report/statistics/employee/salaryReport", payload).then(({ status, data }) => {
@@ -89,13 +94,25 @@ class PersonalSalaryReport extends Component {
 
 
   render() {
-    const { dataSource, loading, dateRange } = this.state;
+    const { dataSource, loading, dateRange } = this.state, { isCom = false } = this.props;
-    const dom = document.querySelector(".wea-new-top-content");
+    const dom = document.querySelector(".wea-new-top-content") || document.querySelector(".wea-new-top-req-content");
     let height = 280;
     if (dataSource.length > 0 && dom) {
       const tableHeight = dataSource.length * 39 + 127;
       height = dom.offsetHeight > tableHeight ? tableHeight : dom.offsetHeight;
     }
+    if (isCom) return (
+      <div style={{ height: height + "px" }}>
+        <Spin spinning={loading}>
+          <iframe
+            style={{ border: 0, width: "100%", height: "100%" }}
+            // src="http://localhost:7607/#/calcTable"
+            src="/spa/hrmSalary/hrmSalaryCalculateDetail/index.html#/calcTable"
+            id="atdTable"
+          />
+        </Spin>
+      </div>
+    );
     return (<WeaTop
       title={getLabel(111, "个人薪资报表")} buttonSpace={10} className="xbxt_report"
       icon={<i className="icon-coms-fa"/>} iconBgcolor="#F14A2D"

pc4mobx/hrmSalary/pages/mySalaryBenefits/components/payrollTable/index.js

@@ -5,49 +5,26 @@
  * Date: 2023/11/13
  */
 import React, { Component } from "react";
-import { inject, observer } from "mobx-react";
 import { WeaLocaleProvider, WeaTable } from "ecCom";
 import { Dropdown, Menu } from "antd";
 import { mySalaryBillList, mySalaryBillList4Card } from "../../../../apis/mySalaryBenefits";
-import { payrollCheckType } from "../../../../apis/payroll";
-import Authority from "../../../mySalary/authority";
-import CaptchaModal from "../../../../components/captchaModal";
 
 const getLabel = WeaLocaleProvider.getLabel;
 const API = {
   mySalaryBillList, mySalaryBillList4Card
 };
 
-@inject("mySalaryStore")
-@observer
 class Index extends Component {
   constructor(props) {
     super(props);
     this.state = {
       dataSource: [], columns: [], pageInfo: { current: 1, pageSize: 10, total: 0 },
-      loading: false, store: { loading: true, hasRight: false }, captchaVisible: false
+      loading: false
     };
   }
 
-  async componentDidMount() {
+  componentDidMount() {
-    const { data, status } = await payrollCheckType();
+    this.getMySalaryBillList(this.props);
-    if (status && data === "PWD") {
-      if (window.doCheckSecondaryVerify4ec && !this.props.type) {
-        window.doCheckSecondaryVerify4ec({ mouldCode: "HRM", itemCode: "SALARY" }, (data) => {
-          const { status } = data;
-          if (status === "1") {
-            this.setState({ store: { loading: false, hasRight: true } });
-            this.getMySalaryBillList(this.props);
-          } else {
-            this.setState({ store: { loading: false, hasRight: false } });
-          }
-        });
-      } else {
-        this.getMySalaryBillList(this.props);
-      }
-    } else {
-      this.setState({ captchaVisible: true });
-    }
   }
 
   componentWillReceiveProps(nextProps, nextContext) {
@@ -57,7 +34,7 @@ class Index extends Component {
   getMySalaryBillList = (props) => {
     this.setState({ loading: true });
     const { pageInfo } = this.state;
-    const { salaryYearMonth, employeeId, type = "mySalaryBillList" } = props || this.props;
+    const { salaryYearMonth, employeeId, type = "mySalaryBillList" } = props;
     API[type]({ salaryYearMonth, employeeId, ...pageInfo }).then(({ status, data }) => {
       this.setState({ loading: false });
       if (status) {
@@ -81,7 +58,7 @@ class Index extends Component {
   };
 
   render() {
-    const { dataSource, loading, columns, pageInfo, store, captchaVisible } = this.state;
+    const { dataSource, loading, columns, pageInfo } = this.state;
     const pagination = {
       ...pageInfo,
       showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
@@ -99,18 +76,7 @@ class Index extends Component {
         }, () => this.getMySalaryBillList(this.props));
       }
     };
-    {/*发送验证码*/
+    return (
-    }
-    if (captchaVisible) {
-      return <CaptchaModal
-        visible={captchaVisible}
-        onCancel={() => this.setState({ captchaVisible: false, store: { loading: false, hasRight: false } })}
-        onConfirm={() => {
-          this.setState({ store: { loading: false, hasRight: true } }, () => this.getMySalaryBillList(this.props));
-        }}
-      />;
-    }
-    return (<Authority store={store}>
       <WeaTable rowKey="id" dataSource={dataSource} pagination={pagination}
                 scroll={{ y: `calc(100vh - 166px)` }}
                 loading={loading} columns={[...columns, {
@@ -135,7 +101,7 @@ class Index extends Component {
         </React.Fragment>)
       }]}
       />
-    </Authority>);
+    );
   }
 }
 

pc4mobx/hrmSalary/pages/mySalaryBenefits/index.js

@@ -9,9 +9,12 @@ import { WeaLocaleProvider, WeaReqTop } from "ecCom";
 import Payroll from "./components/payrollTable";
 import SalaryAdjustmentRecords from "./components/SalaryAdjustmentRecords";
 import { MonthRangePicker } from "../reportView/components/statisticalMicroSettingsSlide";
+import PersonalSalaryReport from "../custom-pages/xbxt/personalSalaryReport";
 import Authority from "../mySalary/authority";
 import * as API from "../../apis/ruleconfig";
 import LogDialog from "../../components/logViewModal";
+import { payrollCheckType } from "../../apis/payroll";
+import CaptchaModal from "../../components/captchaModal";
 import moment from "moment";
 import "./index.less";
 
@@ -22,7 +25,7 @@ class Index extends Component {
     super(props);
     this.state = {
       selectedKey: "0", sysinfo: {}, tabs: [], store: { loading: false, hasRight: false },
-      logDialogVisible: false, filterConditions: "[]",
+      logDialogVisible: false, filterConditions: "[]", captchaVisible: false,
       salaryYearMonth: [
         moment().subtract(1, "year").startOf("year").format("YYYY-MM"),
         moment().endOf("year").format("YYYY-MM")
@@ -30,21 +33,43 @@ class Index extends Component {
     };
   }
 
+  async componentWillMount() {
+    const { data, status } = await payrollCheckType();
+    if (status && data === "PWD") {
+      if (window.doCheckSecondaryVerify4ec) {
+        window.doCheckSecondaryVerify4ec({ mouldCode: "HRM", itemCode: "SALARY" }, (data) => {
+          const { status } = data;
+          if (status === "1") {
+            this.setState({ store: { loading: false, hasRight: true } });
+          } else {
+            this.setState({ store: { loading: false, hasRight: false } });
+          }
+        });
+      } else {
+        this.setState({ store: { loading: false, hasRight: false } });
+      }
+    } else {
+      this.setState({ captchaVisible: true });
+    }
+  }
+
   async componentDidMount() {
-    this.setState({ store: { ...this.state.store, loading: true } });
+    // this.setState({ store: { ...this.state.store, loading: true } });
     const { data: sysinfo } = await API.sysinfo();
     const { adjustShowStatus, salaryShowStatus } = sysinfo;
     let tabs = [
       { key: "1", title: getLabel(111, "工资单") },
+      { key: "3", title: getLabel(111, "个人薪酬统计") },
       { key: "2", title: getLabel(543150, "调薪记录") }
     ];
     salaryShowStatus === "0" && (tabs = _.filter(tabs, o => o.key !== "1"));
     adjustShowStatus === "0" && (tabs = _.filter(tabs, o => o.key !== "2"));
-    this.setState({ sysinfo, tabs, store: { ...this.state.store, loading: false } }, () => {
+    // , store: { ...this.state.store, loading: false }
+    this.setState({ sysinfo, tabs }, () => {
       const { tabs, store } = this.state;
       this.setState({
-        selectedKey: !_.isEmpty(tabs) ? _.head(tabs).key : "0",
+        selectedKey: !_.isEmpty(tabs) ? _.head(tabs).key : "0"
-        store: { ...store, hasRight: !_.isEmpty(tabs) }
+        // store: { ...store, hasRight: !_.isEmpty(tabs) }
       });
     });
   }
@@ -60,6 +85,9 @@ class Index extends Component {
       case "2":
         Dom = <SalaryAdjustmentRecords/>;
         break;
+      case "3":
+        Dom = <PersonalSalaryReport isCom dateRange={salaryYearMonth}/>;
+        break;
       default:
         break;
     }
@@ -79,7 +107,7 @@ class Index extends Component {
   };
 
   render() {
-    const { selectedKey, salaryYearMonth, tabs, logDialogVisible, filterConditions } = this.state;
+    const { selectedKey, salaryYearMonth, tabs, logDialogVisible, filterConditions, captchaVisible } = this.state;
     const btns = [
       <div className="flex-salary">
         <div className="mysalary-search-title">{getLabel(542604, "薪资所属月")}</div>
@@ -88,13 +116,24 @@ class Index extends Component {
       </div>
     ];
     const logFunction = selectedKey === "1" ? "mysalarybill" : "myadjustrecord";
+    {/*发送验证码*/
+    }
+    if (captchaVisible) {
+      return <CaptchaModal
+        visible={captchaVisible}
+        onCancel={() => this.setState({ captchaVisible: false, store: { loading: false, hasRight: false } })}
+        onConfirm={() => {
+          this.setState({ store: { loading: false, hasRight: true } });
+        }}
+      />;
+    }
     return (
       <Authority ecId={`${this && this.props && this.props.ecId || ""}_Authority@lulowc`}
                  store={{ ...this.state.store }}>
         <WeaReqTop
           title={getLabel(537998, "我的薪资福利")} icon={<i className="icon-coms-fa"/>}
           iconBgcolor="#F14A2D" tabDatas={tabs} className="mySalary_wrapper"
-          buttons={selectedKey === "1" ? btns : []} buttonSpace={10} selectedKey={selectedKey}
+          buttons={(selectedKey === "1" || selectedKey === "3") ? btns : []} buttonSpace={10} selectedKey={selectedKey}
           onChange={selectedKey => this.setState({ selectedKey })}
           showDropIcon onDropMenuClick={this.onDropMenuClick}
           dropMenuDatas={[
@@ -114,4 +153,4 @@ class Index extends Component {
   }
 }
 
-export default Index;
+export default Index;

pc4mobx/hrmSalary/pages/mySalaryBenefits/index.less

@@ -1,6 +1,10 @@
 .mySalary_wrapper {
   .wea-new-top-req-content {
     padding: 8px 16px;
+
+    .ant-spin-nested-loading, .ant-spin-container {
+      height: 100%;
+    }
   }
 
   .wea-transfer-list-wrapper {
@@ -20,4 +24,4 @@
   .wea-new-table {
     background: #fff;
   }
-}
+}