diff --git a/pc4mobx/hrmSalary/apis/taxAgent.js b/pc4mobx/hrmSalary/apis/taxAgent.js
index 1f297904..aa74fd63 100644
--- a/pc4mobx/hrmSalary/apis/taxAgent.js
+++ b/pc4mobx/hrmSalary/apis/taxAgent.js
@@ -100,6 +100,10 @@ export const hasIconInTax = (params) => {
 };
 
 /**权限-角色相关*/
+//角色列表
+export const getRoleList = (params) => {
+  return postFetch("/api/bs/hrmsalary/auth/role/list", params);
+};
 //保存角色
 export const saveAuthRole = (params) => {
   return postFetch("/api/bs/hrmsalary/auth/role/save", params);
diff --git a/pc4mobx/hrmSalary/pages/roleManagement/index.js b/pc4mobx/hrmSalary/pages/roleManagement/index.js
index 8b9f1355..66b92a2a 100644
--- a/pc4mobx/hrmSalary/pages/roleManagement/index.js
+++ b/pc4mobx/hrmSalary/pages/roleManagement/index.js
@@ -8,23 +8,65 @@
   * @description:
 */
 import React, { Component } from "react";
-import { WeaLocaleProvider, WeaTop } from "ecCom";
+import { WeaInputSearch, WeaLocaleProvider, WeaTable, WeaTop } from "ecCom";
+import * as API from "../../apis/taxAgent";
 import { Button } from "antd";
 import "./index.less";
 
 const getLabel = WeaLocaleProvider.getLabel;
 
 class Index extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      query: { name: "" }, dataSource: [], columns: [], pageInfo: { current: 1, pageSize: 10, total: 0 }
+    };
+  }
+
+  componentDidMount() {
+    this.getRoleList();
+  }
+
+  getRoleList = () => {
+    const { query, pageInfo } = this.state;
+    const paylaod = { ...pageInfo, ...query };
+    API.getRoleList(paylaod).then(({ status, data }) => {
+      if (status) {
+        console.log(data);
+      }
+    });
+  };
+
   render() {
+    const { query, dataSource, columns, pageInfo } = this.state;
     const buttons = [
-      <Button type="primary">{getLabel(111, "新建")}</Button>
+      <Button type="primary">{getLabel(111, "新建")}</Button>,
+      <WeaInputSearch value={query.name} onChange={name => this.setState({ query: { name } })}
+                      onSearch={() => this.setState({ pageInfo: { ...pageInfo, current: 1 } },
+                        () => this.getRoleList())}/>
     ];
+    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.getRoleList());
+      },
+      onChange: current => {
+        this.setState({ pageInfo: { ...pageInfo, current } }, () => this.getRoleList());
+      }
+    };
     return (
       <WeaTop
         title={getLabel(111, "角色管理")} icon={<i className="icon-coms-Flow-setting"/>}
         iconBgcolor="#F14A2D" buttons={buttons} className="rolemanagement-index"
       >
-        <div className="rolemanagement-content"></div>
+        <div className="rolemanagement-content">
+          <WeaTable dataSource={dataSource} columns={columns} pagination={pagination}
+                    scroll={{ y: `calc(100vh - 173px)` }}/>
+        </div>
       </WeaTop>
     );
   }
diff --git a/pc4mobx/hrmSalary/pages/roleManagement/index.less b/pc4mobx/hrmSalary/pages/roleManagement/index.less
index de10225a..190f45bc 100644
--- a/pc4mobx/hrmSalary/pages/roleManagement/index.less
+++ b/pc4mobx/hrmSalary/pages/roleManagement/index.less
@@ -4,5 +4,9 @@
     overflow-y: hidden;
     padding: 16px 16px 0;
     background: rgb(246, 246, 246);
+
+    .wea-new-table {
+      background: #FFF;
+    }
   }
 }