添加权限校验、权限缓存、前端按钮校验、页面优化、md文档

README.md

@@ -1,37 +1,50 @@
 # lzq.admin
 
 #### 介绍
-Golang语言实现的SaaS系统，项目基于gin、xorm、jwt、vue实现的前后端分离多租户后台管理系统，主要功能有多租户、用户管理、权限管理
+Golang语言实现的多租户SaaS系统，项目基于gin、xorm、jwt、swagger、vue实现的前后端分离多租户后台管理系统，主要功能有多租户、用户管理、RBAC权限管理、按钮级别的权限校验及redis缓存，日志支持Elasticsearch
+
+#### 功能
+1. 多租户：同套代码，同套部署，根据租户进行数据隔离
+2. 系统用户管理
+3. 菜单管理
+4. 操作权限管理：支持菜单、按钮级别的权限校验
+5. 角色管理：支持账号多角色授权
+6. 日志系统：支持本地日志文件和Elasticsearch
 
 #### 软件架构
 软件架构说明
 
 
 #### 安装教程
-##### ui界面
-1. npm install
-2.如果报node-sass错误，则执行npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass
-2. npm run dev 
-
-#### 使用说明
-
-1.  xxxx
-2.  xxxx
-3.  xxxx
-
-#### 参与贡献
-
-1.  Fork 本仓库
-2.  新建 Feat_xxx 分支
-3.  提交代码
-4.  新建 Pull Request
-
-
-#### 特技
+##### 开发环境搭建
+1. 安装MySql数据库>=5.7（必须）
+2. 安装Redis数据库（必须）
+3. 安装ELK
+4. 安装Node（必须）
+
+##### 后端
+1. 安装golang及搭建golang开发环境
+2. 安装Goland或VisualStudio Code开发工具
+3. 复制tools目录下的hsf_basic_dev.sql脚本到自己的mysql数据库中执行
+4. 使用golang开发工具运行代码或者进入项目的lzq-admin目录中，使用操作系统命令方式运行golang项目(go run main.go)
+
+##### 前端
+```
+1. cd lzq-admin-vue
+2. npm install --registry=https://registry.npm.taobao.org
+3. npm run dev
+```
+
+#### 可能出现的问题及解决办法
+##### 1. 报node-sass错误
+解决办法：
+``` 
+npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass 
+```
+
+#### 界面展示
+![](/tools/md-images/1646896434.png)
+![](/tools/md-images/1646896535.jpg)
+![](/tools/md-images/1646896551.jpg)
+![](/tools/md-images/1646896572.jpg)
 
-1.  使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
-2.  Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
-3.  你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
-4.  [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
-5.  Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
-6.  Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)

lzq-admin-vue/.env.development

@@ -2,7 +2,7 @@
 ENV = 'development'
 
 # base api
-#'http://123.56.69.37:10102/'  'http://localhost:5015/' http://localhost:30001/
+#'http://localhost:5015/' http://localhost:30001/
 VUE_APP_BASE_API = 'http://localhost:30001/'
 
 # vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,

lzq-admin-vue/package.json

@@ -49,7 +49,7 @@
     "driver.js": "0.9.5",
     "dropzone": "5.5.1",
     "echarts": "4.2.1",
-    "element-ui": "^2.13.1",
+    "element-ui": "^2.15.7",
     "file-saver": "2.0.1",
     "fuse.js": "3.4.4",
     "js-cookie": "2.2.0",

lzq-admin-vue/src/api/authorize.js

@@ -1,8 +1,23 @@
 import request from '@/utils/request'
 
+export function getMenuRouterList() {
+  return request({
+    url: '/api/app/authenticateChecker/grantedMenus',
+    method: 'get'
+  })
+}
+
+export function getGrantedPermissions() {
+  return request({
+    url: '/api/app/permissionChecker/grantedPermissions',
+    method: 'get'
+  })
+}
+
 export function deleteuserDatePrivilege(userDataPrivilegeId) {
   return request({
-    url: `/api/app/authorize/userRole?UserDataPrivilegeId=${userDataPrivilegeId}`,
+    url: `/api/app/authorize/userRole?userDataPrivilegeId=${userDataPrivilegeId}`,
     method: 'delete'
   })
 }
+

lzq-admin-vue/src/api/user.js

@@ -9,13 +9,6 @@ export function login(data) {
   })
 }
 
-export function getMenuRouterList() {
-  return request({
-    url: '/api/app/authenticateChecker/grantedMenus',
-    method: 'get'
-  })
-}
-
 export function getInfo() {
   return request({
     url: '/api/app/sysUser/userInfo',

lzq-admin-vue/src/components/OperateTable/index.vue

@@ -14,8 +14,8 @@
     <el-table-column v-if="isIndex" type="index" :label="indexLabel" align="center" width="50" />
     <!-- 数据栏 -->
     <el-table-column
-      v-for="item in tableCols" 
-      :key="item.key"
+      v-for="(item,index) in tableCols" 
+      :key="index"
       :prop="item.prop" 
       :label="item.label" 
       :width="item.width"
@@ -104,8 +104,17 @@
         </span>
         <span v-if="item.type==='Tag'">
           <el-tag
-            v-for="tag in scope.row[item.prop]"
-            :key="tag"
+            v-for="(tag, i) in scope.row[item.prop]"
+            :key="i"
+            :disable-transitions="false"
+          >
+            {{ tag[item.showProp] }}
+          </el-tag>
+        </span>
+        <span v-if="item.type==='TagWithClosable'">
+          <el-tag
+            v-for="(tag,i) in scope.row[item.prop]"
+            :key="i"
             closable
             :disable-transitions="false"
             @close="handleTagClose(item.prop,tag,scope.row)"

lzq-admin-vue/src/layout/components/Navbar.vue

@@ -20,9 +20,13 @@
 
       <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
         <div class="avatar-wrapper">
-          <img :src="avatar+'?imageView2/1/w/80/h/80'" class="user-avatar">
-          <span> {{ name }} </span>
-          <i class="el-icon-arrow-down" />
+          <img v-if="isDefualtAvatar" src="@/assets/images/default-avatar.jpg" class="user-avatar">
+          <div v-else>
+            <img :src="avatar" class="user-avatar">
+          </div>
+
+          {{ name }}-{{ isDefualtAvatar }}
+          <i class="el-icon-arrow-down" style="margin-left:5px" />
         </div>
         <el-dropdown-menu slot="dropdown">
           <el-dropdown-item @click.native="logout">
@@ -42,6 +46,7 @@ import ErrorLog from '@/components/ErrorLog'
 import Screenfull from '@/components/Screenfull'
 // import SizeSelect from '@/components/SizeSelect'
 import Search from '@/components/HeaderSearch'
+import store from '@/store'
 
 export default {
   components: {
@@ -52,6 +57,12 @@ export default {
     // SizeSelect,
     Search
   },
+  data() {
+    // var avatarImg = (length(store.getters.avatar) > 0 ? store.getters.avatar : '@/assets/images/default-avatar.jpg')
+    return {
+      isDefualtAvatar: store.getters.avatar === '' || store.getters.avatar === null
+    }
+  },
   computed: {
     ...mapGetters([
       'sidebar',
@@ -133,23 +144,25 @@ export default {
       margin-right: 15px;
 
       .avatar-wrapper {
-        margin-top: 5px;
         position: relative;
-
+        display: flex;
+        align-items: center;
+        font-size: 12px;
         .user-avatar {
           cursor: pointer;
-          width: 40px;
-          height: 40px;
+          width: 30px;
+          height: 30px;
           border-radius: 10px;
+          margin-right: 5px;
         }
 
-        .el-icon-caret-bottom {
-          cursor: pointer;
-          position: absolute;
-          right: -20px;
-          top: 25px;
-          font-size: 12px;
-        }
+        // .el-icon-caret-bottom {
+        //   cursor: pointer;
+        //   position: absolute;
+        //   right: -20px;
+        //   top: 25px;
+        //   font-size: 12px;
+        // }
       }
     }
     

lzq-admin-vue/src/layout/components/Sidebar/Logo.vue

@@ -6,7 +6,7 @@
         <h1 v-else class="sidebar-title">{{ title }} </h1>
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
+        <img src="../../../../public/logo.png" class="sidebar-logo">
         <h1 class="sidebar-title">{{ title }} </h1>
       </router-link>
     </transition>
@@ -25,7 +25,7 @@ export default {
   data() {
     return {
       title: 'HSF管理系统',
-      logo: 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
+      logo: '../../../../public/logo.png'
     }
   }
 }

lzq-admin-vue/src/permission.js

@@ -36,6 +36,7 @@ router.beforeEach(async(to, from, next) => {
           // note: roles must be a object array! such as: ['admin'] or ,['developer','editor']
           await store.dispatch('user/getInfo')
           const menus = await store.dispatch('user/getMenus')
+          await store.dispatch('user/getGrantedPermissions')
           // generate accessible routes map based on roles
           const accessRoutes = await store.dispatch('permission/generateRoutes', menus)
           // console.log(accessRoutes)

lzq-admin-vue/src/router/index.js

@@ -149,8 +149,8 @@ export const componentsMap = {
   Authorization_PermissionList: () => import('@/views/authorization/permission-list'),
   Authorization_RoleList: () => import('@/views/authorization/role-list'),
   Infrastructure_Icon: () => import('@/views/icons/index'),
-  Infrastructure_SysUserList: () => import('@/views/sysuser/sysuser-list'),
-  Workflow_ProcessSettings: () => import('@/views/workflow/approvaltype-list')
+  Infrastructure_SysUserList: () => import('@/views/sysuser/sysuser-list')
+  // Workflow_ProcessSettings: () => import('@/views/workflow/approvaltype-list')
 }
 
 const createRouter = () => new Router({

lzq-admin-vue/src/store/getters.js

@@ -11,6 +11,8 @@ const getters = {
   roles: state => state.user.roles,
   menus: state => state.user.menus,
   permission_routes: state => state.permission.routes,
-  errorLogs: state => state.errorLog.logs
+  errorLogs: state => state.errorLog.logs,
+  permissions: state => state.user.permissions,
+  superAdmin: state => state.user.superAdmin
 }
 export default getters