diff --git a/src/pages/user/RoleManager.vue b/src/pages/user/RoleManager.vue
index 10e940b..8b1da83 100644
--- a/src/pages/user/RoleManager.vue
+++ b/src/pages/user/RoleManager.vue
@@ -1,48 +1,57 @@
 <style scoped>
-    /deep/.addButton {
+    /deep/ .addButton {
         background: #3496EB;
     }
-    /deep/.deleteButton {
-        border:1px solid #3496EB;
+
+    /deep/ .deleteButton {
+        border: 1px solid #3496EB;
         color: #3496EB;
         background: white;
     }
-    /deep/.role-select-radio-group {
+
+    /deep/ .role-select-radio-group {
         height: 24px;
         line-height: 24px;
         color: #637182;
         border: 1px solid #EDEFF1;
     }
-    /deep/.ivu-radio-group-button .ivu-radio-wrapper-checked:first-child {
+
+    /deep/ .ivu-radio-group-button .ivu-radio-wrapper-checked:first-child {
         color: #2d8cf0;
     }
-    /deep/.system-role-div {
+
+    /deep/ .system-role-div {
         height: 39px;
         padding: 10px;
     }
-    /deep/.system-role-img {
+
+    /deep/ .system-role-img {
         height: 12px;
         width: 12px;
         display: inline-block;
         margin-right: 9px;
         margin-left: 7px;
     }
-    /deep/.system-role-name-selected {
+
+    /deep/ .system-role-name-selected {
         font-size: 14px;
         display: inline-block;
         color: #2074E2;
         cursor: default;
     }
-    /deep/.system-role-name-un-select {
+
+    /deep/ .system-role-name-un-select {
         font-size: 14px;
         display: inline-block;
         color: #535353;
         cursor: default;
     }
-    /deep/.system-role-name-un-select:hover {
+
+    /deep/ .system-role-name-un-select:hover {
         color: #2074E2;
     }
-    /deep/.system-role-number-selected {
+
+    /deep/ .system-role-number-selected {
         font-size: 13px;
         display: inline-block;
         color: #2074E2;
@@ -50,7 +59,8 @@
         margin-right: 11px;
         cursor: pointer;
     }
-    /deep/.system-role-number-un-select {
+
+    /deep/ .system-role-number-un-select {
         font-size: 13px;
         display: inline-block;
         color: #535353;
@@ -58,14 +68,17 @@
         margin-right: 11px;
         cursor: pointer;
     }
-    /deep/.ivu-checkbox {
+
+    /deep/ .ivu-checkbox {
         margin-right: 13px;
     }
-    /deep/.ivu-checkbox-checked .ivu-checkbox-inner {
+
+    /deep/ .ivu-checkbox-checked .ivu-checkbox-inner {
         border-color: #2074E2;
         background-color: #2074E2;
     }
-    /deep/.ivu-checkbox-indeterminate .ivu-checkbox-inner {
+
+    /deep/ .ivu-checkbox-indeterminate .ivu-checkbox-inner {
         border-color: #2074E2;
         background-color: #2074E2;
     }
@@ -89,7 +102,7 @@
                     </div>
                 </div>
             </i-col>
-            <i-col span="1"style="max-width: 5px;background-color: #EFF3F8;height: 100%;">
+            <i-col span="1" style="max-width: 5px;background-color: #EFF3F8;height: 100%;">
             </i-col>
             <!--权限多选-->
             <i-col span="18" style="height: 100%;">
@@ -103,12 +116,14 @@
                     <div v-for="item in permissionList" :key="item.id">
                         <div style="border-bottom: 1px solid #E4E9F1;height: 49px;line-height: 49px;background-color: #F7F8FA;">
                             <Checkbox :indeterminate="item.indeterminate" :value="item.check"
-                                      @click.prevent.native="handleItemCheckAll(item)"  style="height: 95%;color:#697882;background-color: #F7F8FA;">{{item.name}}</Checkbox>
+                                      @click.prevent.native="handleItemCheckAll(item)"
+                                      style="height: 95%;color:#697882;background-color: #F7F8FA;">{{item.name}}
+                            </Checkbox>
                         </div>
                         <!--2-->
-                            <div v-for="itemSon in item.sonPermissionList" :key="itemSon.id" style="height: 49px;">
-                                <div style="float: left;width: 20%;border-right: 1px solid #E4E9F1;border-bottom: 1px solid #E4E9F1;height: 49px;line-height: 49px;">
-                                    <CheckboxGroup v-model="item.checkArr">
+                        <div v-for="itemSon in item.sonPermissionList" :key="itemSon.id" style="height: 49px;">
+                            <div style="float: left;width: 20%;border-right: 1px solid #E4E9F1;border-bottom: 1px solid #E4E9F1;height: 49px;line-height: 49px;">
+                                <CheckboxGroup v-model="item.checkArr">
 
                                     <Checkbox style="margin-left: 30px;color:#697882" :label="itemSon.id"
                                               @click.prevent.native="handleItemSonCheckAll(itemSon, item)"
@@ -116,35 +131,39 @@
                                               :indeterminate="itemSon.indeterminate" :value="itemSon.check">
                                         {{itemSon.name}}
                                     </Checkbox>
-                                    </CheckboxGroup>
+                                </CheckboxGroup>
 
-                                </div>
-                                <!--3-->
-                                <div style="float: left;width: 80%;height: 49px;line-height: 49px;border-bottom: 1px solid #E4E9F1;">
-                                    <CheckboxGroup v-model="itemSon.checkArr"  @on-change="handleGrandSonCheckChange(itemSon, item)">
-                                        <Checkbox v-for="itemGrandson in itemSon.sonPermissionList"
-                                                  :key="itemGrandson.id"
-                                                  style="margin-left: 30px;color:#697882" :label="itemGrandson.id" :value="itemGrandson.check">
-                                            {{itemGrandson.name}}
-                                        </Checkbox>
-                                    </CheckboxGroup>
-                                </div>
                             </div>
+                            <!--3-->
+                            <div style="float: left;width: 80%;height: 49px;line-height: 49px;border-bottom: 1px solid #E4E9F1;">
+                                <CheckboxGroup v-model="itemSon.checkArr"
+                                               @on-change="handleGrandSonCheckChange(itemSon, item)">
+                                    <Checkbox v-for="itemGrandson in itemSon.sonPermissionList"
+                                              :key="itemGrandson.id"
+                                              style="margin-left: 30px;color:#697882" :label="itemGrandson.id"
+                                              :value="itemGrandson.check">
+                                        {{itemGrandson.name}}
+                                    </Checkbox>
+                                </CheckboxGroup>
+                            </div>
+                        </div>
 
                     </div>
                 </div>
                 <div style="top: 76%;border-top: 1px solid #E4E9F1;width: 100%;padding-top: 20px;position: absolute;text-align: center;">
-                    <Button  type="text" style="width: 70px;border: 1px solid #BBBBBB;height: 32px;color: #333333;margin-right: 35px;line-height: 32px;" @click="cancelEdit()">取消</Button>
-                    <Button type="primary" style="width: 70px;height: 32px;line-height: 32px;background-color: #2074E2;" @click="savePermission()">确定</Button>
+                    <Button type="primary" style="width: 70px;height: 32px;line-height: 32px;background-color: #2074E2;"
+                            @click="savePermission()">保存
+                    </Button>
                 </div>
             </i-col>
         </Row>
     </div>
 </template>
 <script>
-    // import RoleManager from '../../services/user/RoleManager'
+    import RoleManager from '../../services/user/RoleManager'
     import roleSelectedImg from '../../../static/img/role-selected.png'
     import roleUnSelectImg from '../../../static/img/role-un-select.png'
+
     export default {
         data() {
             return {
@@ -152,7 +171,7 @@
                 //当前选中角色id
                 roleSelectId: 1,
                 //角色集合
-                roleList:[
+                roleList: [
                     {
                         id: 1,
                         name: "系统管理员",
@@ -193,8 +212,8 @@
                         //选中1个：true，全部选中：true，全未选：false
                         indeterminate: false,
                         //选中的子权限
-                        checkArr:[],
-                        sonPermissionList:[
+                        checkArr: [],
+                        sonPermissionList: [
                             {
                                 id: 2,
                                 name: '二级权限a',
@@ -203,8 +222,8 @@
                                 check: false,
                                 //选中1个：true，全部选中：true，全未选：false
                                 indeterminate: false,
-                                checkArr:[],
-                                sonPermissionList:[
+                                checkArr: [],
+                                sonPermissionList: [
                                     {
                                         id: 7,
                                         name: '三级权限a',
@@ -225,8 +244,8 @@
                                 check: false,
                                 //选中1个：true，全部选中：true，全未选：false
                                 indeterminate: false,
-                                checkArr:[],
-                                sonPermissionList:[
+                                checkArr: [],
+                                sonPermissionList: [
                                     {
                                         id: 9,
                                         name: '三级权限c',
@@ -239,22 +258,23 @@
                                     }
                                 ]
                             }
-                        ]},{
+                        ]
+                    }, {
                         id: 4,
                         name: '一级权限b',
                         level: 1,
                         check: false,
-                        checkArr:[],
+                        checkArr: [],
                         indeterminate: false,
-                        sonPermissionList:[
+                        sonPermissionList: [
                             {
                                 id: 5,
                                 name: '二级权限c',
                                 level: 2,
                                 check: false,
-                                checkArr:[],
+                                checkArr: [],
                                 indeterminate: false,
-                                sonPermissionList:[
+                                sonPermissionList: [
                                     {
                                         id: 11,
                                         name: '三级权限e',
@@ -272,9 +292,9 @@
                                 name: '二级权限d',
                                 level: 2,
                                 check: false,
-                                checkArr:[],
+                                checkArr: [],
                                 indeterminate: false,
-                                sonPermissionList:[
+                                sonPermissionList: [
                                     {
                                         id: 13,
                                         name: '三级权限g',
@@ -287,17 +307,18 @@
                                     }
                                 ]
                             }
-                        ]},
+                        ]
+                    },
                 ]
 
             }
         },
         mounted: function () {
-
+            this.roleInit();
         },
         methods: {
             //一级权限-点击事件
-            handleItemCheckAll (item) {
+            handleItemCheckAll(item) {
                 // let item = this.permissionList[index];
                 if (item.indeterminate) {
                     item.check = false;
@@ -372,7 +393,7 @@
                 console.log(item);
             },
             //三级权限-点击事件
-            handleGrandSonCheckChange (itemSon, item) {
+            handleGrandSonCheckChange(itemSon, item) {
                 /*let item = this.permissionList[index];
                 let itemSon = this.permissionList[index].sonPermissionList[itemSonIndex];*/
                 let sonPermissionCount = itemSon.sonPermissionList.length;
@@ -404,7 +425,7 @@
             },
             //点击角色数字跳转到账号管理页面
             goToAccManagerPage: function () {
-
+                this.$router.push({path: '/account/manager'});
             },
             //选中角色
             selectRole: function (id) {
@@ -414,23 +435,94 @@
                     if (item.id === curId) {
                         item.imgUrl = roleSelectedImg;
                         item.selectFlag = "selected";
+                        that.roleSelectId = item.id;
                     } else {
                         item.imgUrl = roleUnSelectImg;
                         item.selectFlag = "unSelect";
                     }
                 });
-
-            },
-            //取消选中
-            cancelEdit: function () {
-
+                that.rolePermissionList();
             },
             //保存
             savePermission: function () {
-
+                let request = {
+                    roleId: this.roleSelectId,
+                    permissionJson:JSON.stringify(this.permissionList)
+                };
+                let that = this;
+                RoleManager.saveRolePermission(request, function (data) {
+                    data = data.data;
+                    if (data.code === '9999') {
+                        that.$router.push('/login');
+                        that.$Message.error("会话超时请重新登陆!");
+                    }
+                    if (data.code === '0001') {
+                        that.$Message.error("保存角色失败!");
+                        return;
+                    }
+                    if (data.code === '0000') {
+                        that.$Message.info("保存角色权限成功!");
+                    }
+                })
+            },
+            //查询角色
+            roleInit: function () {
+                let that = this;
+                that.roleList = [];
+                RoleManager.listRoleInfoApi({}, function (data) {
+                    data = data.data;
+                    if (data.code === '9999') {
+                        that.$router.push('/login');
+                        that.$Message.error("会话超时请重新登陆!");
+                    }
+                    if (data.code === '0001') {
+                        that.$Message.error("查询角色失败!");
+                        return;
+                    }
+                    if (data.code === '0000') {
+                        data = data.results;
+                        for (let i = 0; i < data.length; i++) {
+                            let row = data[i];
+                            row.imgUrl = roleUnSelectImg;
+                            if (i === 0) {
+                                row.selectFlag = "selected";
+                            } else {
+                                row.selectFlag = "unSelect";
+                            }
+                            that.roleList.push(row);
+                        }
+                        that.roleSelectId = that.roleList[0].id;
+                        that.rolePermissionList();
+                    }
+                })
+            },
+            //查询角色的所有权限
+            rolePermissionList: function () {
+                let request = {
+                    roleId: this.roleSelectId
+                };
+                this.permissionList = [];
+                let that = this;
+                RoleManager.rolePermissionList(request, function (data) {
+                    data = data.data;
+                    if (data.code === '9999') {
+                        that.$router.push('/login');
+                        that.$Message.error("会话超时请重新登陆!");
+                    }
+                    if (data.code === '0001') {
+                        that.$Message.error("查询角色权限失败!");
+                        return;
+                    }
+                    if (data.code === '0000') {
+                        data = data.results;
+                        for (let i = 0; i < data.length; i++) {
+                            let row = data[i];
+                            that.permissionList.push(row);
+                        }
+                    }
+                });
             }
         }
-
     }
 </script>
 
diff --git a/src/services/user/RoleManager.js b/src/services/user/RoleManager.js
index a1ce0cf..9894662 100644
--- a/src/services/user/RoleManager.js
+++ b/src/services/user/RoleManager.js
@@ -11,11 +11,32 @@ import http from '../CommonHttp'
  * @param call
  * @returns {Promise<any | never>}
  */
-/*export function listRoleInfoApi(params, call) {
-    return http.post('', params).then(call);
-}*/
+export function listRoleInfoApi(params, call) {
+    return http.get('/role/role/account/count', params).then(call);
+}
 
-export default {
-    // listRoleInfoApi
+/**
+ * 查询角色权限
+ * @param params
+ * @param call
+ * @returns {Promise<any | never>}
+ */
+export function rolePermissionList(params, call) {
+    return http.post('/permission/role/list', params).then(call);
+}
 
+/**
+ * 保存角色
+ * @param params
+ * @param call
+ * @returns {Promise<any | never>}
+ */
+export function saveRolePermission(params, call) {
+    return http.post('/permission/role/save', params).then(call);
+}
+
+export default {
+    listRoleInfoApi,
+    rolePermissionList,
+    saveRolePermission
 }