feature/2.9.42310.01-薪资项目拓扑图

pc4mobx/hrmSalary/index.js

@@ -42,7 +42,6 @@ import MySalaryView from "./pages/mySalary/mySalaryView";
 import WatermarkPreview from "./pages/payroll/watermarkPreview";
 import ExternalPersonManage from "./pages/externalPersonManage";
 import AdjustSalaryManage from "./pages/adjustSalaryManage";
-import SalaryItemDiagram from "./pages/salaryItemDiagram";
 
 import stores from "./stores";
 import "./style/index";
@@ -96,7 +95,6 @@ const DataAcquisition = (props) => props.children;
 // reportView 薪酬报表查看
 // externalPersonManage 非系统人员管理
 // adjustSalaryManage 档案管理
-// salaryItemDiagram 薪资档案拓扑图
 
 const Routes = (
   <Route
@@ -125,7 +123,6 @@ const Routes = (
       />
     </Route>
     <Route key="salaryItem" path="salaryItem" component={SalaryItem}/>
-    <Route key="salaryItemDiagram" path="salaryItemDiagram" component={SalaryItemDiagram}/>
     <Route key="salaryFile" path="salaryFile" component={PayrollFiles}/>
     <Route key="adjustSalaryManage" path="adjustSalaryManage" component={AdjustSalaryManage}/>
     <Route

pc4mobx/hrmSalary/pages/calculate/doCalc/components/salaryEditCalc/diagramModal.js

@@ -0,0 +1,59 @@
+/*
+ * Author: 黎永顺
+ * name: 薪资项目拓扑图-查看
+ * Description:
+ * Date: 2023/10/26
+ */
+import React, { Component } from "react";
+import { WeaDialog, WeaLocaleProvider } from "ecCom";
+import SalaryItemDiagram from "../../../../salaryItemDiagram";
+
+const getLabel = WeaLocaleProvider.getLabel;
+
+class DiagramModal extends Component {
+  componentDidMount() {
+    window.addEventListener("message", this.handleReceive, false);
+  }
+
+  handleReceive = async ({ data }) => {
+    const { type } = data;
+    if (type === "initDiagram") this.postMessageToChild(this.props);
+  };
+
+  componentWillUnmount() {
+    window.removeEventListener("message", this.handleReceive, false);
+  }
+
+  postMessageToChild = (payload = {}) => {
+    const { width, height } = this.diagramRef.state.style;
+    const i18n = {
+      "公式": getLabel(18125, "公式")
+    };
+    const childFrameObj = document.getElementById("topologyDiagram");
+    childFrameObj.contentWindow.postMessage(JSON.stringify({ ...payload, width, height, i18n }), "*");
+  };
+
+  render() {
+    return (
+      <WeaDialog
+        {...this.props} ref={dom => this.diagramRef = dom}
+        scalable hasScroll className="diagramDialog" initLoadCss
+        title={getLabel(111, "拓扑图")}
+        style={{
+          width: 1150,
+          height: 850,
+          minHeight: 200,
+          minWidth: 380,
+          maxHeight: "90%",
+          maxWidth: "90%",
+          overflow: "hidden",
+          transform: "translate(0px, 0px)"
+        }}
+      >
+        <SalaryItemDiagram/>
+      </WeaDialog>
+    );
+  }
+}
+
+export default DiagramModal;

pc4mobx/hrmSalary/pages/calculate/doCalc/components/salaryEditCalc/editCalcTable.js

@@ -11,6 +11,7 @@ import { inject, observer } from "mobx-react";
 import { acctResultList, updateLockStatus } from "../../../../../apis/calculate";
 import ProgressModal from "../../../../../components/progressModal";
 import EditSalaryCalcSlide from "./editSalaryCalcSlide";
+import DiagramModal from "./diagramModal";
 
 const getLabel = WeaLocaleProvider.getLabel;
 
@@ -22,7 +23,8 @@ class EditCalcTable extends Component {
     this.state = {
       loading: false, pageInfo: { current: 1, pageSize: 10, total: 0 },
       selectedRowKeys: [], progressVisible: false, progress: 0,
-      salaryCalcSlide: { visible: false, id: "" }
+      salaryCalcSlide: { visible: false, id: "" },
+      diagramModal: { visible: false, salaryItemId: "", salarySobId: "" }
     };
     this.timerLock = null;
   }
@@ -59,13 +61,24 @@ class EditCalcTable extends Component {
             salaryCalcSlide: { visible: true, id: salaryCalcId }
           });
           break;
+        case "DIAGRAM":
+          const { salarySobId } = this.props;
+          const { diagramModal } = this.state;
+          this.setState({ diagramModal: { ...diagramModal, ...params, visible: true, salarySobId } });
+          break;
         default:
           break;
       }
     }
   };
   updateLockStatus = (payload) => {
-    const { lockStatus } = payload;
+    const { salarySobId } = this.props;
+    const { diagramModal } = this.state;
+    const { lockStatus, salaryItemId } = payload;
+    if (lockStatus === "DIAGRAM") {
+      this.setState({ diagramModal: { ...diagramModal, visible: true, salarySobId, salaryItemId } });
+      return;
+    }
     Modal.confirm({
       title: getLabel(131329, "信息确认"),
       content: <div>
@@ -125,7 +138,7 @@ class EditCalcTable extends Component {
       "当前状态未锁定，点击锁定": getLabel(111, "当前状态未锁定，点击锁定"),
       "共": getLabel(18609, "共"), "条": getLabel(18256, "条"),
       "总计": getLabel(523, "总计"), "批量解锁": getLabel(111, "批量解锁"),
-      "批量锁定": getLabel(111, "批量锁定")
+      "批量锁定": getLabel(111, "批量锁定"), "查看拓扑图": getLabel(111, "查看拓扑图")
     };
     const childFrameObj = document.getElementById("atdTable");
     childFrameObj.contentWindow.postMessage(JSON.stringify({ ...payload, i18n }), "*");
@@ -160,7 +173,7 @@ class EditCalcTable extends Component {
   };
 
   render() {
-    const { loading, progressVisible, progress, salaryCalcSlide } = this.state;
+    const { loading, progressVisible, progress, salaryCalcSlide, diagramModal } = this.state;
     return (
       <div className="editCalcTable-layout">
         <Spin spinning={loading}>
@@ -177,6 +190,10 @@ class EditCalcTable extends Component {
                                    id: ""
                                  }
                                }, () => isFresh === "true" && this.queryCalcResultList())}/>
+          {
+            diagramModal.visible &&
+            <DiagramModal {...diagramModal} onCancel={() => this.setState({ diagramModal: { visible: false } })}/>
+          }
           {
             progressVisible &&
             <ProgressModal

pc4mobx/hrmSalary/pages/calculate/doCalc/components/salaryEditCalc/index.js

@@ -86,7 +86,7 @@ class Index extends Component {
             onAdSearch={this.onAdSearch}
           />
         </div>
-        <EditCalcTable ref={dom => this.calcTableRef = dom}
+        <EditCalcTable ref={dom => this.calcTableRef = dom} salarySobId={salarySobCycle.salarySobId}
                        {...this.props} showTotalCell={showTotalCell}
                        onShowFormulaTd={this.handleShowFormulaTa}/>
       </div>

pc4mobx/hrmSalary/pages/salaryItemDiagram/index.js

@@ -13,7 +13,7 @@ class Index extends Component {
         style={{ border: 0, width: "100%", height: "100%" }}
         src="http://localhost:7607/#/salaryItemDiagram"
         // src="/spa/hrmSalary/hrmSalaryCalculateDetail/index.html#/salaryItemDiagram"
-        id="atdTable"
+        id="topologyDiagram"
       />
     );
   }