:zap: 2.0.4.RELEASE

package.json

@@ -1,6 +1,6 @@
 {
   "name": "saber-admin",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",

src/api/system/menu.js

@@ -46,3 +46,51 @@ export const getMenu = (id) => {
     }
   })
 }
+
+export const getListScope = (current, size, params) => {
+  return request({
+    url: '/api/blade-system/data-scope/list',
+    method: 'get',
+    params: {
+      ...params,
+      current,
+      size,
+    }
+  })
+}
+
+export const removeScope = (ids) => {
+  return request({
+    url: '/api/blade-system/data-scope/remove',
+    method: 'post',
+    params: {
+      ids,
+    }
+  })
+}
+
+export const addScope = (row) => {
+  return request({
+    url: '/api/blade-system/data-scope/submit',
+    method: 'post',
+    data: row
+  })
+}
+
+export const updateScope = (row) => {
+  return request({
+    url: '/api/blade-system/data-scope/submit',
+    method: 'post',
+    data: row
+  })
+}
+
+export const getMenuScope = (id) => {
+  return request({
+    url: '/api/blade-system/data-scope/detail',
+    method: 'get',
+    params: {
+      id,
+    }
+  })
+}

src/api/system/role.js

@@ -18,13 +18,14 @@ export const grantTree = () => {
   })
 }
 
-export const grant = (roleIds, menuIds) => {
+export const grant = (roleIds, menuIds, scopeIds) => {
   return request({
     url: '/api/blade-system/role/grant',
     method: 'post',
     params: {
       roleIds,
-      menuIds
+      menuIds,
+      scopeIds
     }
   })
 }

src/views/system/dept.vue

@@ -24,6 +24,10 @@
                    @click="handleDelete">删 除
         </el-button>
       </template>
+      <template slot-scope="{row}"
+                slot="deptCategory">
+        <el-tag>{{row.deptCategoryName}}</el-tag>
+      </template>
     </avue-crud>
   </basic-container>
 </template>
@@ -59,12 +63,12 @@
           viewBtn: true,
           column: [
             {
-              label: "部门名称",
+              label: "机构名称",
               prop: "deptName",
               search: true,
               rules: [{
                 required: true,
-                message: "请输入部门名称",
+                message: "请输入机构名称",
                 trigger: "blur"
               }]
             },
@@ -90,17 +94,17 @@
               }]
             },
             {
-              label: "部门全称",
+              label: "机构全称",
               prop: "fullName",
               search: true,
               rules: [{
                 required: true,
-                message: "请输入部门全称",
+                message: "请输入机构全称",
                 trigger: "blur"
               }]
             },
             {
-              label: "上级部门",
+              label: "上级机构",
               prop: "parentId",
               dicData: [],
               type: "tree",
@@ -110,11 +114,27 @@
               },
               rules: [{
                 required: false,
-                message: "请选择上级部门",
+                message: "请选择上级机构",
                 trigger: "click"
               }]
             },
-
+            {
+              label: "机构类型",
+              type: "select",
+              dicUrl: "/api/blade-system/dict/dictionary?code=org_category",
+              props: {
+                label: "dictValue",
+                value: "dictKey"
+              },
+              width: 180,
+              prop: "deptCategory",
+              slot: true,
+              rules: [{
+                required: true,
+                message: "请输入机构类型",
+                trigger: "blur"
+              }]
+            },
             {
               label: "排序",
               prop: "sort",
@@ -129,12 +149,12 @@
             {
               label: "备注",
               prop: "remark",
-              span: 24,
               rules: [{
                 required: false,
                 message: "请输入备注",
                 trigger: "blur"
-              }]
+              }],
+              hide: true
             }
           ]
         },
@@ -242,10 +262,10 @@
         }
         done();
       },
-      currentChange(currentPage){
+      currentChange(currentPage) {
         this.page.currentPage = currentPage;
       },
-      sizeChange(pageSize){
+      sizeChange(pageSize) {
         this.page.pageSize = pageSize;
       },
       onLoad(page, params = {}) {

src/views/system/menu.vue

@@ -24,18 +24,54 @@
                    @click="handleDelete">删 除
         </el-button>
       </template>
-      <template slot-scope="{row}"
-                slot="source">
+      <template slot-scope="{row}" slot="menu">
+        <el-button type="text"
+                   icon="el-icon-setting"
+                   size="small"
+                   v-if="permission.menu_data_scope"
+                   plain
+                   class="none-border"
+                   @click.stop="handleDataScope(row)">数据权限
+        </el-button>
+      </template>
+      <template slot-scope="{row}" slot="source">
         <div style="text-align:center">
           <i :class="row.source"></i>
         </div>
       </template>
     </avue-crud>
+    <avue-drawer :title="`[${scopeMenuName}] 数据权限配置`" show-close :width="1000" v-model="drawerVisible"
+                 :before-close="handleDrawerClose">
+      <avue-crud :option="optionScope"
+                 :data="dataScope"
+                 :page="pageScope"
+                 v-model="formScope"
+                 ref="crudScope"
+                 @row-del="rowDelScope"
+                 @row-update="rowUpdateScope"
+                 @row-save="rowSaveScope"
+                 :before-open="beforeOpenScope"
+                 @search-change="searchChangeScope"
+                 @search-reset="searchResetScope"
+                 @selection-change="selectionChangeScope"
+                 @current-change="currentChangeScope"
+                 @size-change="sizeChangeScope"
+                 @on-load="onLoadScope">
+        <template slot="menuLeft">
+          <el-button type="danger"
+                     size="small"
+                     icon="el-icon-delete"
+                     plain
+                     @click="handleDeleteScope">删 除
+          </el-button>
+        </template>
+      </avue-crud>
+    </avue-drawer>
   </basic-container>
 </template>
 
 <script>
-  import {getList, remove, update, add, getMenu} from "@/api/system/menu";
+  import {add, remove, update, getList, getMenu, addScope, removeScope, updateScope, getListScope, getMenuScope} from "@/api/system/menu";
   import {mapGetters} from "vuex";
   import iconList from "@/config/iconList";
 
@@ -49,6 +85,10 @@
           currentPage: 1,
           total: 0
         },
+        drawerVisible: false,
+        scopeMenuId: 0,
+        scopeMenuName: "菜单",
+        menu: true,
         option: {
           tip: false,
           dialogWidth: "60%",
@@ -57,6 +97,7 @@
           index: true,
           selection: true,
           viewBtn: true,
+          menuWidth: 250,
           column: [
             {
               label: "菜单名称",
@@ -103,6 +144,7 @@
               prop: "source",
               type: "icon-select",
               slot: true,
+              width: 80,
               iconList: iconList,
               rules: [
                 {
@@ -189,6 +231,7 @@
               label: "菜单排序",
               prop: "sort",
               type: "number",
+              width: 80,
               rules: [
                 {
                   required: true,
@@ -223,7 +266,97 @@
             }
           ]
         },
-        data: []
+        data: [],
+        formScope: {},
+        selectionListScope: [],
+        pageScope: {
+          pageSize: 10,
+          currentPage: 1,
+          total: 0
+        },
+        optionScope: {
+          tip: false,
+          border: true,
+          index: true,
+          viewBtn: true,
+          selection: true,
+          menuWidth: 175,
+          column: [
+            {
+              label: "权限名",
+              prop: "scopeName",
+              search: true,
+              rules: [{
+                required: true,
+                message: "请输入数据权限名",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "权限编号",
+              prop: "resourceCode",
+              search: true,
+              width:100,
+              rules: [{
+                required: true,
+                message: "请输入数据权限编号",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "权限字段",
+              prop: "scopeColumn",
+              width:130,
+              rules: [{
+                required: true,
+                message: "请输入数据权限编号",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "规则类型",
+              type: "select",
+              dicUrl: "/api/blade-system/dict/dictionary?code=scope_type",
+              props: {
+                label: "dictValue",
+                value: "dictKey"
+              },
+              width:140,
+              prop: "scopeType",
+              rules: [{
+                required: true,
+                message: "请输入通知类型",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "权限类名",
+              prop: "scopeClass",
+              span: 24,
+              hide: true,
+              rules: [{
+                required: true,
+                message: "请输入权限类名",
+                trigger: "blur"
+              }],
+            },
+            {
+              label: "规则值",
+              prop: "scopeValue",
+              span: 24,
+              minRows: 5,
+              type: "textarea",
+              hide: true,
+            },
+            {
+              label: "备注",
+              prop: "remark",
+              span: 24,
+              hide: true,
+            },
+          ]
+        },
+        dataScope: []
       };
     },
 
@@ -243,9 +376,17 @@
           ids.push(ele.id);
         });
         return ids.join(",");
+      },
+      scopeIds() {
+        let ids = [];
+        this.selectionListScope.forEach(ele => {
+          ids.push(ele.id);
+        });
+        return ids.join(",");
       }
     },
     methods: {
+      // 菜单管理模块
       rowSave(row, loading, done) {
         add(row).then(() => {
           loading();
@@ -328,21 +469,140 @@
         }
         done();
       },
-      currentChange(currentPage){
+      currentChange(currentPage) {
         this.page.currentPage = currentPage;
       },
-      sizeChange(pageSize){
+      sizeChange(pageSize) {
         this.page.pageSize = pageSize;
       },
       onLoad(page, params = {}) {
         getList(page.currentPage, page.pageSize, params).then(res => {
+          this.data = res.data.data;
+        });
+      },
+      // 数据权限模块
+      handleDataScope(row) {
+        this.drawerVisible = true;
+        this.scopeMenuId = row.id;
+        this.scopeMenuName = row.name;
+      },
+      handleDrawerClose(hide) {
+        hide();
+      },
+      rowSaveScope(row, loading, done) {
+        row = {
+          ...row,
+          menuId: this.scopeMenuId,
+        }
+        addScope(row).then(() => {
+          loading();
+          this.onLoadScope(this.pageScope);
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+        }, error => {
+          done();
+          console.log(error);
+        });
+      },
+      rowUpdateScope(row, index, loading, done) {
+        row = {
+          ...row,
+          menuId: this.scopeMenuId,
+        }
+        updateScope(row).then(() => {
+          loading();
+          this.onLoadScope(this.pageScope);
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+        }, error => {
+          done();
+          console.log(error);
+        });
+      },
+      rowDelScope(row) {
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        })
+          .then(() => {
+            return removeScope(row.id);
+          })
+          .then(() => {
+            this.onLoadScope(this.pageScope);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+          });
+      },
+      handleDeleteScope() {
+        if (this.selectionListScope.length === 0) {
+          this.$message.warning("请选择至少一条数据");
+          return;
+        }
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        })
+          .then(() => {
+            return removeScope(this.scopeIds);
+          })
+          .then(() => {
+            this.onLoadScope(this.pageScope);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+            this.$refs.crudScope.toggleSelection();
+          });
+      },
+      beforeOpenScope(done, type) {
+        if (["edit", "view"].includes(type)) {
+          getMenuScope(this.formScope.id).then(res => {
+            this.formScope = res.data.data;
+          });
+        }
+        done();
+      },
+      searchResetScope() {
+        this.onLoadScope(this.pageScope);
+      },
+      searchChangeScope(params) {
+        this.onLoadScope(this.pageScope, params);
+      },
+      selectionChangeScope(list) {
+        this.selectionListScope = list;
+      },
+      currentChangeScope(currentPage) {
+        this.pageScope.currentPage = currentPage;
+      },
+      sizeChangeScope(pageSize) {
+        this.pageScope.pageSize = pageSize;
+      },
+      onLoadScope(page, params = {}) {
+        const values = {
+          ...params,
+          menuId: this.scopeMenuId,
+        }
+        getListScope(page.currentPage, page.pageSize, values).then(res => {
           const data = res.data.data;
-          this.data = data;
+          this.pageScope.total = data.total;
+          this.dataScope = data.records;
         });
-      }
+      },
     }
   };
 </script>
 
 <style>
+  .none-border {
+    border: 0;
+    background-color: transparent !important;
+  }
 </style>

src/views/system/role.vue

@@ -29,16 +29,31 @@
         </el-button>
       </template>
     </avue-crud>
-    <el-dialog title="角色配置"
+    <el-dialog title="角色权限配置"
                :visible.sync="box"
-               width="20%">
-      <el-tree :data="list"
-               show-checkbox
-               node-key="id"
-               ref="tree"
-               :default-checked-keys="defaultObj"
-               :props="props">
-      </el-tree>
+               width="345px">
+      <el-tabs type="border-card">
+        <el-tab-pane label="菜单权限">
+          <el-tree :data="menuGrantList"
+                   show-checkbox
+                   node-key="id"
+                   ref="treeMenu"
+                   :default-checked-keys="menuTreeObj"
+                   :props="props">
+          </el-tree>
+        </el-tab-pane>
+        <el-tab-pane label="数据权限">
+          <el-tree :data="scopeGrantList"
+                   show-checkbox
+                   node-key="id"
+                   ref="treeScope"
+                   :default-checked-keys="scopeTreeObj"
+                   :props="props">
+          </el-tree>
+        </el-tab-pane>
+        <el-tab-pane label="接口权限">敬请期待</el-tab-pane>
+      </el-tabs>
+
       <span slot="footer"
             class="dialog-footer">
         <el-button @click="box = false">取 消</el-button>
@@ -50,269 +65,275 @@
 </template>
 
 <script>
-import {
-  getList,
-  remove,
-  update,
-  add,
-  grant,
-  grantTree,
-  getRole,
-  getRoleTree
-} from "@/api/system/role";
-import { mapGetters } from "vuex";
-import website from '@/config/website';
+  import {
+    getList,
+    remove,
+    update,
+    add,
+    grant,
+    grantTree,
+    getRole,
+    getRoleTree,
+  } from "@/api/system/role";
+  import {mapGetters} from "vuex";
+  import website from '@/config/website';
 
-export default {
-  data() {
-    return {
-      form: {},
-      box: false,
-      props: {
-        label: "title",
-        value: "key"
-      },
-      list: [],
-      defaultObj: [],
-      selectionList: [],
-      page: {
-        pageSize: 10,
-        currentPage: 1,
-        total: 0
-      },
-      option: {
-        tip: false,
-        tree: true,
-        border: true,
-        index: true,
-        selection: true,
-        viewBtn: true,
-        dialogWidth: 300,
-        dialogHeight: 400,
-        column: [
-          {
-            label: "角色名称",
-            prop: "roleName",
-            search: true,
-            span: 24,
-            rules: [
-              {
-                required: true,
-                message: "请输入角色名称",
-                trigger: "blur"
-              }
-            ]
-          },
-          {
-            label: "所属租户",
-            prop: "tenantId",
-            type: "tree",
-            dicUrl: "/api/blade-system/tenant/select",
-            addDisplay: false,
-            editDisplay: false,
-            viewDisplay: website.tenantMode,
-            span: 24,
-            props: {
-              label: "tenantName",
-              value: "tenantId"
+  export default {
+    data() {
+      return {
+        form: {},
+        box: false,
+        props: {
+          label: "title",
+          value: "key"
+        },
+        menuGrantList: [],
+        scopeGrantList: [],
+        apiGrantList: [],
+        menuTreeObj: [],
+        scopeTreeObj: [],
+        selectionList: [],
+        page: {
+          pageSize: 10,
+          currentPage: 1,
+          total: 0
+        },
+        option: {
+          tip: false,
+          tree: true,
+          border: true,
+          index: true,
+          selection: true,
+          viewBtn: true,
+          dialogWidth: 300,
+          dialogHeight: 400,
+          column: [
+            {
+              label: "角色名称",
+              prop: "roleName",
+              search: true,
+              span: 24,
+              rules: [
+                {
+                  required: true,
+                  message: "请输入角色名称",
+                  trigger: "blur"
+                }
+              ]
             },
-            hide: !website.tenantMode,
-            search: website.tenantMode,
-            rules: [{
-              required: true,
-              message: "请输入所属租户",
-              trigger: "click"
-            }]
-          },
-          {
-            label: "角色别名",
-            prop: "roleAlias",
-            search: true,
-            span: 24,
-            rules: [
-              {
+            {
+              label: "所属租户",
+              prop: "tenantId",
+              type: "tree",
+              dicUrl: "/api/blade-system/tenant/select",
+              addDisplay: false,
+              editDisplay: false,
+              viewDisplay: website.tenantMode,
+              span: 24,
+              props: {
+                label: "tenantName",
+                value: "tenantId"
+              },
+              hide: !website.tenantMode,
+              search: website.tenantMode,
+              rules: [{
                 required: true,
-                message: "请输入角色别名",
-                trigger: "blur"
-              }
-            ]
-          },
-          {
-            label: "上级角色",
-            prop: "parentId",
-            dicData: [],
-            type: "tree",
-            hide: true,
-            span: 24,
-            props: {
-              label: "title"
-            },
-            rules: [
-              {
-                required: false,
-                message: "请选择上级角色",
+                message: "请输入所属租户",
                 trigger: "click"
-              }
-            ]
-          },
-          {
-            label: "角色排序",
-            prop: "sort",
-            type: "number",
-            span: 24,
-            rules: [
-              {
-                required: true,
-                message: "请输入角色排序",
-                trigger: "blur"
-              }
-            ]
-          }
-        ]
-      },
-      data: []
-    };
-  },
-  computed: {
-    ...mapGetters(["permission"]),
-    permissionList() {
-      return {
-        addBtn: this.vaildData(this.permission.role_add, false),
-        viewBtn: this.vaildData(this.permission.role_view, false),
-        delBtn: this.vaildData(this.permission.role_delete, false),
-        editBtn: this.vaildData(this.permission.role_edit, false)
+              }]
+            },
+            {
+              label: "角色别名",
+              prop: "roleAlias",
+              search: true,
+              span: 24,
+              rules: [
+                {
+                  required: true,
+                  message: "请输入角色别名",
+                  trigger: "blur"
+                }
+              ]
+            },
+            {
+              label: "上级角色",
+              prop: "parentId",
+              dicData: [],
+              type: "tree",
+              hide: true,
+              span: 24,
+              props: {
+                label: "title"
+              },
+              rules: [
+                {
+                  required: false,
+                  message: "请选择上级角色",
+                  trigger: "click"
+                }
+              ]
+            },
+            {
+              label: "角色排序",
+              prop: "sort",
+              type: "number",
+              span: 24,
+              rules: [
+                {
+                  required: true,
+                  message: "请输入角色排序",
+                  trigger: "blur"
+                }
+              ]
+            }
+          ]
+        },
+        data: []
       };
     },
-    ids() {
-      let ids = [];
-      this.selectionList.forEach(ele => {
-        ids.push(ele.id);
-      });
-      return ids.join(",");
-    }
-  },
-  methods: {
-    submit() {
-      const menuLIst = this.$refs.tree.getCheckedKeys().join(",");
-      grant(this.ids, menuLIst).then(() => {
-        this.box = false;
-        this.$message({
-          type: "success",
-          message: "操作成功!"
-        });
-        this.onLoad(this.page);
-      });
-    },
-    rowSave(row, loading, done) {
-      add(row).then(() => {
-        loading();
-        this.onLoad(this.page);
-        this.$message({
-          type: "success",
-          message: "操作成功!"
+    computed: {
+      ...mapGetters(["permission"]),
+      permissionList() {
+        return {
+          addBtn: this.vaildData(this.permission.role_add, false),
+          viewBtn: this.vaildData(this.permission.role_view, false),
+          delBtn: this.vaildData(this.permission.role_delete, false),
+          editBtn: this.vaildData(this.permission.role_edit, false)
+        };
+      },
+      ids() {
+        let ids = [];
+        this.selectionList.forEach(ele => {
+          ids.push(ele.id);
         });
-      }, error => {
-        done();
-        console.log(error);
-      });
+        return ids.join(",");
+      }
     },
-    rowUpdate(row, index, loading, done) {
-      update(row).then(() => {
-        this.onLoad(this.page);
-        loading();
-        this.$message({
-          type: "success",
-          message: "操作成功!"
+    methods: {
+      submit() {
+        const menuList = this.$refs.treeMenu.getCheckedKeys().join(",");
+        const scopeList = this.$refs.treeScope.getCheckedKeys().join(",");
+        grant(this.ids, menuList, scopeList).then(() => {
+          this.box = false;
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+          this.onLoad(this.page);
         });
-      }, error => {
-        done();
-        console.log(error);
-      });
-    },
-    rowDel(row) {
-      this.$confirm("确定将选择数据删除?", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      })
-        .then(() => {
-          return remove(row.id);
-        })
-        .then(() => {
+      },
+      rowSave(row, loading, done) {
+        add(row).then(() => {
+          loading();
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
+        }, error => {
+          done();
+          console.log(error);
         });
-    },
-
-    searchReset() {
-      this.onLoad(this.page);
-    },
-    searchChange(params) {
-      this.onLoad(this.page, params);
-    },
-    selectionChange(list) {
-      this.selectionList = list;
-    },
-    handleRole() {
-      if (this.selectionList.length !== 1) {
-        this.$message.warning("只能选择一条数据");
-        return;
-      }
-      this.defaultObj = [];
-      grantTree()
-        .then(res => {
-          this.list = res.data.data;
-          return getRole(this.ids);
-        })
-        .then(res => {
-          this.defaultObj = res.data.data;
-          this.box = true;
-        });
-    },
-    handleDelete() {
-      if (this.selectionList.length === 0) {
-        this.$message.warning("请选择至少一条数据");
-        return;
-      }
-      this.$confirm("确定将选择数据删除?", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      })
-        .then(() => {
-          return remove(this.ids);
-        })
-        .then(() => {
+      },
+      rowUpdate(row, index, loading, done) {
+        update(row).then(() => {
           this.onLoad(this.page);
+          loading();
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          this.$refs.crud.toggleSelection();
+        }, error => {
+          done();
+          console.log(error);
         });
-    },
-    currentChange(currentPage){
-      this.page.currentPage = currentPage;
-    },
-    sizeChange(pageSize){
-      this.page.pageSize = pageSize;
-    },
-    onLoad(page, params = {}) {
-      getList(page.currentPage, page.pageSize, params).then(res => {
-        const data = res.data.data;
-        this.data = data;
-        getRoleTree().then(res => {
+      },
+      rowDel(row) {
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        })
+          .then(() => {
+            return remove(row.id);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+          });
+      },
+
+      searchReset() {
+        this.onLoad(this.page);
+      },
+      searchChange(params) {
+        this.onLoad(this.page, params);
+      },
+      selectionChange(list) {
+        this.selectionList = list;
+      },
+      handleRole() {
+        if (this.selectionList.length !== 1) {
+          this.$message.warning("只能选择一条数据");
+          return;
+        }
+        this.menuTreeObj = [];
+        this.scopeTreeObj = [];
+        grantTree()
+          .then(res => {
+            this.menuGrantList = res.data.data.menu;
+            this.scopeGrantList = res.data.data.scope;
+            getRole(this.ids).then(res => {
+              this.menuTreeObj = res.data.data.menu;
+              this.scopeTreeObj = res.data.data.scope;
+              this.box = true;
+            });
+          });
+      },
+      handleDelete() {
+        if (this.selectionList.length === 0) {
+          this.$message.warning("请选择至少一条数据");
+          return;
+        }
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        })
+          .then(() => {
+            return remove(this.ids);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+            this.$refs.crud.toggleSelection();
+          });
+      },
+      currentChange(currentPage) {
+        this.page.currentPage = currentPage;
+      },
+      sizeChange(pageSize) {
+        this.page.pageSize = pageSize;
+      },
+      onLoad(page, params = {}) {
+        getList(page.currentPage, page.pageSize, params).then(res => {
           const data = res.data.data;
-          const index = this.$refs.crud.findColumnIndex("parentId");
-          this.option.column[index].dicData = data;
+          this.data = data;
+          getRoleTree().then(res => {
+            const data = res.data.data;
+            const index = this.$refs.crud.findColumnIndex("parentId");
+            this.option.column[index].dicData = data;
+          });
         });
-      });
+      }
     }
-  }
-};
+  };
 </script>
 
 <style>