⚡ 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
             }
           ]
         },

src/views/system/menu.vue

@@ -24,18 +24,54 @@
                    @click="handleDelete">删 除
         </el-button>
       </template>
-      <template slot-scope="{row}"
+      <template slot-scope="{row}" slot="menu">
-                slot="source">
+        <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();
@@ -336,13 +477,132 @@
       },
       onLoad(page, params = {}) {
         getList(page.currentPage, page.pageSize, params).then(res => {
-          const data = res.data.data;
+          this.data = res.data.data;
-          this.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.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%">
+               width="345px">
-      <el-tree :data="list"
+      <el-tabs type="border-card">
+        <el-tab-pane label="菜单权限">
+          <el-tree :data="menuGrantList"
                    show-checkbox
                    node-key="id"
-               ref="tree"
+                   ref="treeMenu"
-               :default-checked-keys="defaultObj"
+                   :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>
@@ -58,7 +73,7 @@ import {
     grant,
     grantTree,
     getRole,
-  getRoleTree
+    getRoleTree,
   } from "@/api/system/role";
   import {mapGetters} from "vuex";
   import website from '@/config/website';
@@ -72,8 +87,11 @@ export default {
           label: "title",
           value: "key"
         },
-      list: [],
+        menuGrantList: [],
-      defaultObj: [],
+        scopeGrantList: [],
+        apiGrantList: [],
+        menuTreeObj: [],
+        scopeTreeObj: [],
         selectionList: [],
         page: {
           pageSize: 10,
@@ -193,8 +211,9 @@ export default {
     },
     methods: {
       submit() {
-      const menuLIst = this.$refs.tree.getCheckedKeys().join(",");
+        const menuList = this.$refs.treeMenu.getCheckedKeys().join(",");
-      grant(this.ids, menuLIst).then(() => {
+        const scopeList = this.$refs.treeScope.getCheckedKeys().join(",");
+        grant(this.ids, menuList, scopeList).then(() => {
           this.box = false;
           this.$message({
             type: "success",
@@ -261,16 +280,18 @@ export default {
           this.$message.warning("只能选择一条数据");
           return;
         }
-      this.defaultObj = [];
+        this.menuTreeObj = [];
+        this.scopeTreeObj = [];
         grantTree()
           .then(res => {
-          this.list = res.data.data;
+            this.menuGrantList = res.data.data.menu;
-          return getRole(this.ids);
+            this.scopeGrantList = res.data.data.scope;
-        })
+            getRole(this.ids).then(res => {
-        .then(res => {
+              this.menuTreeObj = res.data.data.menu;
-          this.defaultObj = res.data.data;
+              this.scopeTreeObj = res.data.data.scope;
               this.box = true;
             });
+          });
       },
       handleDelete() {
         if (this.selectionList.length === 0) {