diff --git a/pc4mobx/hrmSalary/apis/mySalaryBenefits.js b/pc4mobx/hrmSalary/apis/mySalaryBenefits.js
index 2cd64d80..e7c9c9b4 100644
--- a/pc4mobx/hrmSalary/apis/mySalaryBenefits.js
+++ b/pc4mobx/hrmSalary/apis/mySalaryBenefits.js
@@ -6,6 +6,14 @@ import { convertToUrlString } from "../util/url";
 export const mySalaryBillList = params => {
   return postFetch("/api/bs/hrmsalary/salaryBill/mySalaryBillList", params);
 };
+// 人事卡片-工资单列表
+export const mySalaryBillList4Card = params => {
+  return postFetch("/api/bs/hrmsalary/salaryBill/mySalaryBillList4Card", params);
+};
+// 人事卡片-调薪记录列表
+export const mySalaryRecordList4Card = params => {
+  return postFetch("/api/bs/hrmsalary/report/record/list4Card", params);
+};
 
 // 调薪记录列表
 export const recordList = params => {
diff --git a/pc4mobx/hrmSalary/pages/historicalPayroll/index.js b/pc4mobx/hrmSalary/pages/historicalPayroll/index.js
index f33c7651..49c7fdb6 100644
--- a/pc4mobx/hrmSalary/pages/historicalPayroll/index.js
+++ b/pc4mobx/hrmSalary/pages/historicalPayroll/index.js
@@ -6,8 +6,10 @@
  */
 import React, { Component } from "react";
 import { WeaLocaleProvider } from "ecCom";
-import moment from "moment";
 import { MonthRangePicker } from "../reportView/components/statisticalMicroSettingsSlide";
+import Payroll from "../mySalaryBenefits/components/payrollTable";
+import moment from "moment";
+import "./index.less";
 
 const getLabel = WeaLocaleProvider.getLabel;
 
@@ -27,9 +29,11 @@ class Index extends Component {
     return (
       <div className="history-payroll-box">
         <div className="topQuery">
+          <span className="title">{getLabel(542604, "薪资所属月")}</span>
           <MonthRangePicker dateRange={dateRange} viewAttr={2}
                             onChange={v => this.setState({ dateRange: v })}/>
         </div>
+        <Payroll salaryYearMonth={dateRange}/>
       </div>
     );
   }
diff --git a/pc4mobx/hrmSalary/pages/historicalPayroll/index.less b/pc4mobx/hrmSalary/pages/historicalPayroll/index.less
new file mode 100644
index 00000000..459ccbaf
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/historicalPayroll/index.less
@@ -0,0 +1,23 @@
+.history-payroll-box {
+  width: 100%;
+  height: 100%;
+  background: #f6f6f6;
+  padding: 16px;
+
+  .topQuery {
+    width: 100%;
+    background: #fff;
+    padding: 16px;
+    margin-bottom: 16px;
+    display: flex;
+    align-items: center;
+
+    .title {
+      margin-right: 10px;
+    }
+  }
+
+  .wea-new-table {
+    background: #fff;
+  }
+}
diff --git a/pc4mobx/hrmSalary/pages/mySalaryBenefits/components/payrollTable/index.js b/pc4mobx/hrmSalary/pages/mySalaryBenefits/components/payrollTable/index.js
index 33cb6873..94161e1a 100644
--- a/pc4mobx/hrmSalary/pages/mySalaryBenefits/components/payrollTable/index.js
+++ b/pc4mobx/hrmSalary/pages/mySalaryBenefits/components/payrollTable/index.js
@@ -15,7 +15,7 @@ class Index extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      juniorMapList: [], dataSource: [], columns: [], pageInfo: { current: 1, pageSize: 10, total: 0 },
+      dataSource: [], columns: [], pageInfo: { current: 1, pageSize: 10, total: 0 },
       loading: false, employeeId: ""
     };
   }
@@ -55,7 +55,7 @@ class Index extends Component {
   };
 
   render() {
-    const { juniorMapList, dataSource, loading, columns, pageInfo } = this.state;
+    const { dataSource, loading, columns, pageInfo } = this.state;
     const pagination = {
       ...pageInfo,
       showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,