diff --git a/pc4mobx/hrmSalary/index.js b/pc4mobx/hrmSalary/index.js
index 0990c113..1aaf8045 100644
--- a/pc4mobx/hrmSalary/index.js
+++ b/pc4mobx/hrmSalary/index.js
@@ -51,6 +51,7 @@ import WatermarkPreview from "./pages/payroll/watermarkPreview";
 import ExternalPersonManage from "./pages/externalPersonManage";
 import AdjustSalaryManage from "./pages/adjustSalaryManage";
 import TopologyMap from "./pages/topologyMap";
+import SupplementaryCalc from "./pages/supplementaryCalc";
 
 import stores from "./stores";
 import "./style/index";
@@ -110,6 +111,7 @@ const DataAcquisition = (props) => props.children;
 // reportView 薪酬报表查看
 // externalPersonManage 非系统人员管理
 // adjustSalaryManage 档案管理
+// supplementaryCalc 补算
 
 const Routes = (
   <Route
@@ -185,6 +187,7 @@ const Routes = (
     <Route key="reportView" path="reportView" component={ReportView}/>
     <Route key="externalPersonManage" path="externalPersonManage" component={ExternalPersonManage}/>
     <Route key="topologyView" path="topologyView/:salarySobId/:salaryItemId" component={TopologyMap}/>
+    <Route key="supplementaryCalc" path="supplementaryCalc" component={SupplementaryCalc}/>
   </Route>
 );
 
diff --git a/pc4mobx/hrmSalary/pages/supplementaryCalc/index.js b/pc4mobx/hrmSalary/pages/supplementaryCalc/index.js
new file mode 100644
index 00000000..558c2c38
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/supplementaryCalc/index.js
@@ -0,0 +1,190 @@
+/*
+ * Author: 黎永顺
+ * name: 补算
+ * Description:
+ * Date: 2024/3/26
+ */
+import React, { Component } from "react";
+import { Button, message } from "antd";
+import { WeaBrowser, WeaError, WeaFormItem, WeaLocaleProvider, WeaSearchGroup, WeaSelect, WeaTop } from "ecCom";
+import { supplementAcctRecord } from "../../apis";
+import "./index.less";
+
+const { getLabel } = WeaLocaleProvider;
+
+class Index extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      type: "sob", salaryItemIds: "", salarySobIds: "",
+      salaryAcctRecordIds: "", loading: false
+    };
+  }
+
+  handleChangeItems = (key, value) => {
+    this.setState({ [key]: value });
+  };
+  handleSubmit = () => {
+    const { salaryItemIds, salarySobIds, salaryAcctRecordIds, type } = this.state;
+    if (!salaryItemIds && !salarySobIds && type === "sob") {
+      this.refs.salaryItemError.showError();
+      this.refs.salarySobError.showError();
+      return;
+    }
+    if (!salaryItemIds && !salaryAcctRecordIds && type === "record") {
+      this.refs.salaryItemError.showError();
+      this.refs.salaryPigeonholeError.showError();
+      return;
+    }
+    if (!salaryItemIds) {
+      this.refs.salaryItemError.showError();
+      return;
+    }
+    if (!salaryAcctRecordIds && type === "record") {
+      this.refs.salaryPigeonholeError.showError();
+      return;
+    }
+    if (!salarySobIds && type === "sob") {
+      this.refs.salarySobError.showError();
+      return;
+    }
+    this.setState({ loading: true });
+    supplementAcctRecord({
+      type,
+      salaryAcctRecordIds: salaryAcctRecordIds ? salaryAcctRecordIds.split(",") : [],
+      salarySobIds: salarySobIds ? salarySobIds.split(",") : [],
+      salaryItemIds: salaryItemIds ? salaryItemIds.split(",") : []
+    }).then(({ status, errormsg }) => {
+      this.setState({ loading: false });
+      if (status) {
+        message.success(getLabel(111, "补算成功"));
+      } else {
+        message.error(errormsg || getLabel(111, "补算失败"));
+      }
+    }).catch(() => this.setState({ loading: false }));
+  };
+
+  render() {
+    const { type, salaryItemIds, salarySobIds, salaryAcctRecordIds, loading } = this.state;
+    return (
+      <WeaTop
+        title={getLabel(111, "补算")} iconBgcolor="#F14A2D" showDropIcon={false}
+        icon={<i className="icon-coms-fa"/>}
+        buttons={[
+          <Button type="primary" onClick={this.handleSubmit} loading={loading}>{getLabel(111, "补算")}</Button>
+        ]}
+      >
+        <div className="retroactiveWrapper">
+          <WeaSearchGroup showGroup needTigger={false} center>
+            <WeaFormItem label={getLabel(111, "补算维度")} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
+              <WeaError tipPosition="bottom" ref="typeError" error={getLabel(111, "此项必填")}>
+                <WeaSelect
+                  options={[
+                    { key: "sob", showname: "按薪资账套维度" },
+                    { key: "record", showname: "按核算记录维度" }
+                  ]}
+                  detailtype={3} value={type} viewAttr={3}
+                  onChange={type => this.setState({ type }, () => {
+                    this.setState({ salarySobIds: "", salaryAcctRecordIds: "", salaryItemIds: "" });
+                  })}
+                />
+              </WeaError>
+            </WeaFormItem>
+            {
+              type === "sob" ?
+                <WeaFormItem label={getLabel(111, "薪资账套")} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
+                  <WeaError tipPosition="bottom" ref="salarySobError" error={getLabel(111, "此项必填")}>
+                    <WeaBrowser
+                      title={getLabel(111, "薪资账套")}
+                      type={162} viewAttr={3} isSingle={false}
+                      value={salarySobIds} isMultCheckbox
+                      completeParams={{
+                        type: 162,
+                        fielddbtype: "browser.salarySobBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      conditionDataParams={{
+                        type: "browser.salarySobBrowser",
+                        fielddbtype: "browser.salarySobBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      dataParams={{
+                        type: "browser.salarySobBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      destDataParams={{
+                        type: "browser.salarySobBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      inputStyle={{ width: "100%" }}
+                      onChange={(salarySobIds) => this.handleChangeItems("salarySobIds", salarySobIds)}
+                    />
+                  </WeaError>
+                </WeaFormItem> :
+                <WeaFormItem label={getLabel(111, "薪资核算归档记录")} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
+                  <WeaError tipPosition="bottom" ref="salaryPigeonholeError" error={getLabel(111, "此项必填")}>
+                    <WeaBrowser
+                      title={getLabel(111, "薪资核算归档记录")}
+                      type={162} viewAttr={3} isSingle={false}
+                      value={salaryAcctRecordIds} isMultCheckbox
+                      completeParams={{
+                        type: 162,
+                        fielddbtype: "browser.salaryAcctArchivedRecordBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      conditionDataParams={{
+                        type: "browser.salaryAcctArchivedRecordBrowser",
+                        fielddbtype: "browser.salaryAcctArchivedRecordBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      dataParams={{
+                        type: "browser.salaryAcctArchivedRecordBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      destDataParams={{
+                        type: "browser.salaryAcctArchivedRecordBrowser",
+                        f_weaver_belongto_usertype: "0"
+                      }}
+                      inputStyle={{ width: "100%" }}
+                      onChange={(salaryAcctRecordIds) => this.handleChangeItems("salaryAcctRecordIds", salaryAcctRecordIds)}
+                    />
+                  </WeaError>
+                </WeaFormItem>
+            }
+            <WeaFormItem label={getLabel(111, "薪资项目")} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
+              <WeaError tipPosition="bottom" ref="salaryItemError" error={getLabel(111, "此项必填")}>
+                <WeaBrowser
+                  title={getLabel(111, "薪资项目")}
+                  type={162} viewAttr={3} isSingle={false}
+                  value={salaryItemIds} isMultCheckbox
+                  completeParams={{
+                    type: 162,
+                    fielddbtype: "browser.salaryItemBrowser",
+                    f_weaver_belongto_usertype: "0"
+                  }}
+                  conditionDataParams={{
+                    type: "browser.salaryItemBrowser",
+                    fielddbtype: "browser.salaryItemBrowser",
+                    f_weaver_belongto_usertype: "0"
+                  }}
+                  dataParams={{
+                    type: "browser.salaryItemBrowser",
+                    f_weaver_belongto_usertype: "0"
+                  }}
+                  destDataParams={{
+                    type: "browser.salaryItemBrowser",
+                    f_weaver_belongto_usertype: "0"
+                  }}
+                  inputStyle={{ width: "100%" }}
+                  onChange={(salaryItemIds) => this.handleChangeItems("salaryItemIds", salaryItemIds)}
+                />
+              </WeaError>
+            </WeaFormItem>
+          </WeaSearchGroup>
+        </div>
+      </WeaTop>
+    );
+  }
+}
+
+export default Index;
diff --git a/pc4mobx/hrmSalary/pages/supplementaryCalc/index.less b/pc4mobx/hrmSalary/pages/supplementaryCalc/index.less
new file mode 100644
index 00000000..e69de29b