完善前端权限校验功能，按钮没有对应操作权限则隐藏

mogu_admin/src/main/java/com/moxi/mogublog/admin/global/SysConf.java

@@ -37,6 +37,7 @@ public final class SysConf extends BaseSysConf {
 
     public final static String PARENT_LIST = "parentList";
     public final static String SON_LIST = "sonList";
+    public final static String BUTTON_LIST = "buttonList";
 
     public final static String URL = "url";
 

mogu_admin/src/main/java/com/moxi/mogublog/admin/restapi/LoginRestApi.java

@@ -170,7 +170,6 @@ public String info(HttpServletRequest request,
         List<String> roleUid = new ArrayList<>();
         roleUid.add(admin.getRoleUid());
         Collection<Role> roleList = roleService.listByIds(roleUid);
-
         map.put(SysConf.ROLES, roleList);
         return ResultUtil.result(SysConf.SUCCESS, map);
     }
@@ -210,7 +209,10 @@ public String getMenu(HttpServletRequest request) {
             }
             // 从三级分类中，得到二级分类
             if (item.getMenuType() == EMenuType.BUTTON && StringUtils.isNotEmpty(item.getParentUid())) {
+                // 找出二级菜单
                 secondMenuUidList.add(item.getParentUid());
+                // 找出全部按钮
+                buttonList.add(item);
             }
         });
 
@@ -242,6 +244,7 @@ public String getMenu(HttpServletRequest request) {
         Collections.sort(list);
         map.put(SysConf.PARENT_LIST, list);
         map.put(SysConf.SON_LIST, childCategoryMenuList);
+        map.put(SysConf.BUTTON_LIST, buttonList);
         return ResultUtil.result(SysConf.SUCCESS, map);
     }
 

mogu_sms/src/main/java/com/moxi/mogublog/sms/listener/BlogListener.java

@@ -40,7 +40,7 @@ public void updateRedis(Map<String, String> map) {
 
             String comment = map.get(SysConf.COMMAND);
 
-            String uid = map.get("blogUid");
+            String uid = map.get(SysConf.BLOG_UID);
 
             //从Redis清空对应的数据
             stringRedisTemplate.opsForValue().set(SysConf.BLOG_LEVEL + SysConf.REDIS_SEGMENTATION + SysConf.ONE, "");
@@ -49,6 +49,7 @@ public void updateRedis(Map<String, String> map) {
             stringRedisTemplate.opsForValue().set(SysConf.BLOG_LEVEL + SysConf.REDIS_SEGMENTATION + SysConf.FOUR, "");
             stringRedisTemplate.opsForValue().set(SysConf.HOT_BLOG, "");
             stringRedisTemplate.opsForValue().set(SysConf.NEW_BLOG, "");
+
             switch (comment) {
                 case SysConf.DELETE_BATCH: {
 

vue_mogu_admin/config/prod.env.js

@@ -3,17 +3,17 @@ module.exports = {
   NODE_ENV: '"production"',
 
   //生产环境
-  ADMIN_API: '"http://101.132.194.128:8601"',
-  PICTURE_API: '"http://101.132.194.128:8602"',
-  WEB_API: '"http://101.132.194.128:8603"',
-  Search_API: '"http://101.132.194.128:8605"',
-  SPRING_BOOT_ADMIN: '"http://101.132.194.128:8606/wallboard"',
-  SOLR_API: '"http://101.132.194.128:8080/solr"',
-  ELASTIC_SEARCH: '"http://101.132.194.128:5601"',
-  EUREKA_API: '"http://101.132.194.128:8761"',
-  RABBIT_MQ_ADMIN: '"http://101.132.194.128:15672"',
-  DRUID_ADMIN: '"http://101.132.194.128:8601/druid/login.html"',
-  BLOG_WEB_URL: '"http://www.moguit.cn"',
+  ADMIN_API: '"http://47.115.54.30:8601"',
+  PICTURE_API: '"http://47.115.54.30:8602"',
+  WEB_API: '"http://47.115.54.30:8603"',
+  Search_API: '"http://47.115.54.30:8605"',
+  SPRING_BOOT_ADMIN: '"http://47.115.54.30:8606/wallboard"',
+  SOLR_API: '"http://47.115.54.30:8080/solr"',
+  ELASTIC_SEARCH: '"http://47.115.54.30:5601"',
+  EUREKA_API: '"http://47.115.54.30:8761"',
+  RABBIT_MQ_ADMIN: '"http://47.115.54.30:15672"',
+  DRUID_ADMIN: '"http://47.115.54.30:8601/druid/login.html"',
+  BLOG_WEB_URL: '"http://demoweb.moguit.cn"',
   // 使用七牛云，不需要添加图片前缀
   BASE_IMAGE_URL: '""',
 
@@ -26,14 +26,14 @@ module.exports = {
     // BLOG_WEB_URL: '"http://192.168.1.101:9527"',
 
 
-    // BLOG_WEB_URL: '"http://101.132.194.128:9527"',
+    // BLOG_WEB_URL: '"http://47.115.54.30:9527"',
 
     //生产环境 tomcat方式部署
-    // ADMIN_API: '"http://101.132.194.128:8080/mogu_admin"',
-    // PICTURE_API: '"http://101.132.194.128:8080/mogu_picture"',
-    // WEB_API: '"http://101.132.194.128:8080/mogu_web"',
-    // SOLR_API: '"http://101.132.194.128:8080/solr"',
-    // BASE_IMAGE_URL: '"http://101.132.194.128:8600"',
+    // ADMIN_API: '"http://47.115.54.30:8080/mogu_admin"',
+    // PICTURE_API: '"http://47.115.54.30:8080/mogu_picture"',
+    // WEB_API: '"http://47.115.54.30:8080/mogu_web"',
+    // SOLR_API: '"http://47.115.54.30:8080/solr"',
+    // BASE_IMAGE_URL: '"http://47.115.54.30:8600"',
     //   BLOG_WEB_URL: '"http://www.moguit.cn"',
 
 

vue_mogu_admin/src/directive/index.js

@@ -0,0 +1,5 @@
+import Vue from 'vue'
+import permission from './permission'
+
+const directives = [permission]
+directives.forEach(d => Vue.use(d))

vue_mogu_admin/src/directive/permission/index.js

@@ -0,0 +1,13 @@
+import permission from './permission'
+
+const install = function(Vue) {
+  Vue.directive('permission', permission)
+}
+
+if (window.Vue) {
+  window['permission'] = permission
+  Vue.use(install); // eslint-disable-line
+}
+
+permission.install = install
+export default permission

vue_mogu_admin/src/directive/permission/permission.js

@@ -0,0 +1,41 @@
+import store from '@/store'
+
+export default {
+  inserted(el, binding, vnode) {
+    const { value } = binding
+
+    if(store.getters.buttonMap.size == undefined) {
+      // 初始加载的时候，还没有写入到vuex中，因此使用setInterval在下次dom更新时生效
+      let intervalID = setInterval(() => {
+        // 得到按钮上的路径
+        const buttonMap = store.getters.buttonMap
+        if (value && value.length > 0) {
+          const path = value
+          const hasPermission = buttonMap.get(path)
+
+          // 没有权限时，是否显示按钮，取决于button管理的上 是否显示 的设置
+          if (!hasPermission) {
+            el.parentNode && el.parentNode.removeChild(el)
+          }
+        }
+        // 清空触发器
+        if(store.getters.buttonMap.size != undefined) {
+          clearInterval(intervalID);
+        }
+      },100);
+    } else {
+      // 得到按钮上的路径
+
+      const buttonMap = store.getters.buttonMap
+      if (value && value.length > 0) {
+        const path = value
+        const hasPermission = buttonMap.get(path)
+        if (!hasPermission) {
+          el.parentNode && el.parentNode.removeChild(el)
+        }
+      } else {
+        throw new Error(`need roles! Like v-permission="'admin'"`)
+      }
+    }
+  }
+}

vue_mogu_admin/src/main.js

@@ -16,6 +16,9 @@ import store from './store'
 import '@/icons' // icon
 import '@/permission' // permission control
 
+// 引入自定义指令
+import './directive'
+
 // 添加粒子特效
 import VueParticles from 'vue-particles'
 

vue_mogu_admin/src/store/getters.js

@@ -6,6 +6,7 @@ const getters = {
   avatar: state => state.user.avatar,
   name: state => state.user.name,
   roles: state => state.user.roles,
-  menu: state => state.user.menu
+  menu: state => state.user.menu,
+  buttonMap: state => state.user.buttonMap
 }
 export default getters

vue_mogu_admin/src/store/modules/user.js

@@ -7,7 +7,8 @@ const user = {
     name: '',
     avatar: '',
     roles: [],
-    menu: {}
+    menu: {},
+    buttonMap: {}
   },
 
   mutations: {
@@ -25,6 +26,9 @@ const user = {
     },
     SET_MENU: (state, menu) => {
       state.menu = menu
+    },
+    SET_BUTTON_MAP: (state, buttonMap) => {
+      state.buttonMap = buttonMap
     }
   },
 
@@ -37,7 +41,6 @@ const user = {
         var params = new URLSearchParams()
         params.append('username', username)
         params.append('password', password)
-
         login(params).then(response => {
           const data = response.data
           setToken(data.token)
@@ -55,6 +58,13 @@ const user = {
         getMenu().then(response => {
           const data = response.data
           console.log("获取的菜单", data)
+          // 这里对按钮进行一些处理
+          let buttonList = data.buttonList
+          let map = new Map();
+          for(let a=0; a<buttonList.length; a++) {
+            map.set(buttonList[a].url, buttonList[a])
+          }
+          commit('SET_BUTTON_MAP', map)
           commit('SET_MENU', data)
           resolve(response)
         }).catch(error => {

vue_mogu_admin/src/views/authority/admin.vue

@@ -9,8 +9,8 @@
         v-model="keyword"
         placeholder="请输入管理员名"
       ></el-input>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind">查找</el-button>
-      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit">添加</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind" v-permission="'/admin/getList'">查找</el-button>
+      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit" v-permission="'/admin/add'">添加</el-button>
     </div>
 
     <el-table :data="tableData" style="width: 100%">
@@ -85,9 +85,9 @@
 
       <el-table-column label="操作" fixed="right" min-width="250" >
         <template slot-scope="scope">
-          <el-button @click="handRest(scope.row)" type="warning" size="small">重置密码</el-button>
-          <el-button @click="handleEdit(scope.row)" type="primary" size="small">编辑</el-button>
-          <el-button @click="handleDelete(scope.row)" type="danger" size="small">删除</el-button>
+          <el-button @click="handRest(scope.row)" type="warning" size="small" v-permission="'/admin/restPwd'">重置密码</el-button>
+          <el-button @click="handleEdit(scope.row)" type="primary" size="small" v-permission="'/admin/edit'">编辑</el-button>
+          <el-button @click="handleDelete(scope.row)" type="danger" size="small" v-permission="'/admin/delete'">删除</el-button>
         </template>
       </el-table-column>
     </el-table>

vue_mogu_admin/src/views/authority/button.vue

@@ -10,8 +10,8 @@
         :props="{ checkStrictly: true }"
         clearable></el-cascader>
 
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind">查找</el-button>
-      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit">添加按钮</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind" v-permission="'/categoryMenu/getList'">查找</el-button>
+      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit" v-permission="'/categoryMenu/add'">添加按钮</el-button>
     </div>
 
     <el-table :data="tableData" style="width: 100%">
@@ -91,9 +91,9 @@
 
               <el-table-column fixed="right" min-width="230">
                 <template slot-scope="scope_child">
-                  <el-button @click="handleStick(scope_child.row)" type="warning" size="small">置顶</el-button>
-                  <el-button @click="handleEdit(scope.row, scope_child.row)" type="primary" size="small">编辑</el-button>
-                  <el-button @click="handleDelete(scope_child.row)" type="danger" size="small">删除</el-button>
+                  <el-button @click="handleStick(scope_child.row)" type="warning" size="small" v-permission="'/categoryMenu/stick'">置顶</el-button>
+                  <el-button @click="handleEdit(scope.row, scope_child.row)" type="primary" size="small" v-permission="'/categoryMenu/edit'">编辑</el-button>
+                  <el-button @click="handleDelete(scope_child.row)" type="danger" size="small" v-permission="'/categoryMenu/delete'">删除</el-button>
                 </template>
               </el-table-column>
             </el-table>

vue_mogu_admin/src/views/authority/categoryMenu.vue

@@ -2,7 +2,7 @@
   <div class="app-container">
     <!-- 查询和其他操作 -->
     <div class="filter-container" style="margin: 10px 0 10px 0;">
-      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit">添加菜单</el-button>
+      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit" v-permission="'/categoryMenu/add'">添加菜单</el-button>
     </div>
 
     <el-table :data="tableData" style="width: 100%">
@@ -76,9 +76,9 @@
 
               <el-table-column fixed="right" min-width="230">
                 <template slot-scope="scope_child">
-                  <el-button @click="handleStick(scope_child.row)" type="warning" size="small">置顶</el-button>
-                  <el-button @click="handleEdit(scope_child.row)" type="primary" size="small">编辑</el-button>
-                  <el-button @click="handleDelete(scope_child.row)" type="danger" size="small">删除</el-button>
+                  <el-button @click="handleStick(scope_child.row)" type="warning" size="small" v-permission="'/categoryMenu/stick'">置顶</el-button>
+                  <el-button @click="handleEdit(scope_child.row)" type="primary" size="small" v-permission="'/categoryMenu/edit'">编辑</el-button>
+                  <el-button @click="handleDelete(scope_child.row)" type="danger" size="small" v-permission="'/categoryMenu/delete'">删除</el-button>
                 </template>
               </el-table-column>
             </el-table>

vue_mogu_admin/src/views/authority/role.vue

@@ -9,8 +9,8 @@
         v-model="keyword"
         placeholder="请输入角色名称"
       ></el-input>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind">查找</el-button>
-      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit">添加角色</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind" v-permission="'/role/getList'">查找</el-button>
+      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit" v-permission="'/role/add'">添加角色</el-button>
     </div>
 
     <el-table :data="tableData" style="width: 100%">
@@ -55,8 +55,8 @@
 
       <el-table-column label="操作" fixed="right" min-width="150">
         <template slot-scope="scope">
-          <el-button @click="handleEdit(scope.row)" type="primary" size="small">编辑</el-button>
-          <el-button @click="handleDelete(scope.row)" type="danger" size="small">删除</el-button>
+          <el-button @click="handleEdit(scope.row)" type="primary" size="small" v-permission="'/role/edit'">编辑</el-button>
+          <el-button @click="handleDelete(scope.row)" type="danger" size="small" v-permission="'/role/delete'">删除</el-button>
         </template>
       </el-table-column>
     </el-table>

vue_mogu_admin/src/views/blog/blog.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <!-- 查询和其他操作 -->
-    <div class="filter-container" style="margin: 10px 0 10px 0;">
+    <div class="filter-container" style="margin: 10px 0 10px 0;" v-permission="'/blog/getList'">
       <el-input
         clearable
         class="filter-item"
@@ -78,10 +78,10 @@
         ></el-option>
       </el-select>
 
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind">查找</el-button>
-      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit">添加博客</el-button>
-      <el-button class="filter-item" type="warning" @click="handleUpload" icon="el-icon-star-on">本地上传</el-button>
-      <el-button class="filter-item" type="danger" @click="handleDeleteBatch" icon="el-icon-delete">删除选中</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFind" v-permission="'/blog/getList'">查找</el-button>
+      <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-edit" v-permission="'/blog/add'">添加博客</el-button>
+      <el-button class="filter-item" type="warning" @click="handleUpload" icon="el-icon-star-on" v-permission="'/blog/uploadLocalBlog'">本地上传</el-button>
+      <el-button class="filter-item" type="danger" @click="handleDeleteBatch" icon="el-icon-delete" v-permission="'/blog/deleteBatch'">删除选中</el-button>
     </div>
 
     <el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
@@ -184,10 +184,11 @@
 
       <el-table-column label="操作" fixed="right" min-width="150">
         <template slot-scope="scope">
-          <el-button @click="handleEdit(scope.row)" type="primary" size="small">编辑</el-button>
-          <el-button @click="handleDelete(scope.row)" type="danger" size="small">删除</el-button>
+          <el-button @click="handleEdit(scope.row)" type="primary" size="small" v-permission="'/blog/edit'">编辑</el-button>
+          <el-button @click="handleDelete(scope.row)" type="danger" size="small" v-permission="'/blog/delete'">删除</el-button>
         </template>
       </el-table-column>
+
     </el-table>
 
     <!--分页-->