diff --git a/pc4mobx/hrmSalary/apis/custom-apis/huitong/index.js b/pc4mobx/hrmSalary/apis/custom-apis/huitong/index.js
new file mode 100644
index 00000000..ab6baa58
--- /dev/null
+++ b/pc4mobx/hrmSalary/apis/custom-apis/huitong/index.js
@@ -0,0 +1,6 @@
+import { postFetch } from "../../../util/request";
+
+//汇通建设-薪酬送审数据穿透（分页）
+export const getXcssDataDetail = params => {
+  return postFetch("/api/bs/hrmsalary/salaryacct/htjs/xcssDataDetail", params);
+};
diff --git a/pc4mobx/hrmSalary/index.js b/pc4mobx/hrmSalary/index.js
index 27bc86f2..74fefbc7 100644
--- a/pc4mobx/hrmSalary/index.js
+++ b/pc4mobx/hrmSalary/index.js
@@ -55,6 +55,7 @@ import SupplementaryCalc from "./pages/supplementaryCalc";
 import VariableSalary from "./pages/variableSalary";
 import Layout from "./layout";
 
+import CustomRoutes from "./pages/custom-pages";
 import stores from "./stores";
 import "./style/index";
 
@@ -170,6 +171,7 @@ const Routes = (
     <Route key="topologyView" path="topologyView/:salarySobId/:salaryItemId" component={TopologyMap}/>
     <Route key="supplementaryCalc" path="supplementaryCalc" component={SupplementaryCalc}/>
     <Route key="variableSalary" path="variableSalary" component={VariableSalary}/>
+    {CustomRoutes}
   </Route>
 );
 
diff --git a/pc4mobx/hrmSalary/pages/custom-pages/huitong/dataDetail/index.js b/pc4mobx/hrmSalary/pages/custom-pages/huitong/dataDetail/index.js
new file mode 100644
index 00000000..ada36826
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/custom-pages/huitong/dataDetail/index.js
@@ -0,0 +1,74 @@
+/*
+  * 汇通建设二开
+  * 薪酬送审数据穿透（分页）
+  * @Author:    黎永顺
+  * @Date:      2024/10/25
+  * @Wechat:
+  * @Email:     971387674@qq.com
+  * @description:
+*/
+import React, { Component } from "react";
+import { WeaLocaleProvider, WeaTable, WeaTop } from "ecCom";
+import * as API from "../../../../apis/custom-apis/huitong";
+import "./index.less";
+
+const getLabel = WeaLocaleProvider.getLabel;
+
+class Index extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      pageInfo: { current: 1, pageSize: 10, total: 0 }, loading: false,
+      dataSource: [], columns: []
+    };
+  }
+
+  componentDidMount() {
+    this.getXcssDataDetail();
+  }
+
+  getXcssDataDetail = () => {
+    const { pageInfo } = this.state, { params } = this.props;
+    this.setState({ loading: true });
+    API.getXcssDataDetail({ ...params, ...pageInfo }).then(({ status, data }) => {
+      this.setState({ loading: false });
+      if (status) {
+        const { pageInfo: pageParams, columns } = data;
+        const { list: dataSource, pageNum: current, pageSize, total } = pageParams;
+        this.setState({
+          dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
+          columns: _.map(columns, o => ({ dataIndex: o.column, title: o.text, width: o.width + "px" }))
+        });
+      }
+    });
+  };
+
+  render() {
+    const { dataSource, columns, pageInfo, loading } = this.state;
+    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.getXcssDataDetail());
+      },
+      onChange: current => {
+        this.setState({ pageInfo: { ...pageInfo, current } }, () => this.getXcssDataDetail());
+      }
+    };
+    const height = !_.isEmpty(columns) ? document.querySelector(".wea-new-top-content").style.height : "500px";
+    return (
+      <WeaTop
+        title={getLabel(111, "薪酬送审数据")} icon={<i className="icon-coms-fa"/>} buttons={[]} showDropIcon={false}
+        iconBgcolor="#F14A2D" className="custom_data_huitong">
+        <div className="huitong-body">
+          <WeaTable dataSource={dataSource} columns={columns} loading={loading} bordered pagination={pagination}
+                    scroll={{ x: 1200, y: `calc(${height} - 120px)` }}/>
+        </div>
+      </WeaTop>);
+  }
+}
+
+export default Index;
diff --git a/pc4mobx/hrmSalary/pages/custom-pages/huitong/dataDetail/index.less b/pc4mobx/hrmSalary/pages/custom-pages/huitong/dataDetail/index.less
new file mode 100644
index 00000000..d5b50733
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/custom-pages/huitong/dataDetail/index.less
@@ -0,0 +1,17 @@
+.custom_data_huitong {
+  .huitong-body {
+    height: 100%;
+    padding: 8px 16px 0 16px;
+    background: #F6F6F6;
+
+    .wea-new-table {
+      background: #FFF;
+    }
+
+    .custom_huitong_list {
+      .ant-spin-nested-loading, .ant-spin-container {
+        height: 100%;
+      }
+    }
+  }
+}
diff --git a/pc4mobx/hrmSalary/pages/custom-pages/index.js b/pc4mobx/hrmSalary/pages/custom-pages/index.js
index e69de29b..5487f3b7 100644
--- a/pc4mobx/hrmSalary/pages/custom-pages/index.js
+++ b/pc4mobx/hrmSalary/pages/custom-pages/index.js
@@ -0,0 +1,10 @@
+import React from "react";
+import Route from "react-router/lib/Route";
+import DataDetail from "./huitong/dataDetail";
+
+const CustomRoutes = [
+  <Route key="customPage_dataDetail_huitong" path="customPage_dataDetail_huitong/:subcompanyId/:salaryMonth"
+         component={DataDetail}/>
+];
+
+export default CustomRoutes;