vue后台管理系统介绍
项目GitHub地址:https://github.com/Little-Orange7/cmms-vue
一.简介
很多公司稍微复杂一点的业务,基本上都需要后台管理系统,来对业务进行各个维度的统计、对公司人员管理等等,这些后台管理系统都有一个基础的共性,就是对登录用户的管理,对用户角色的管理,对登录用户的操作权限的管理等,所以此项目就将这部分作为一个基础功能编写出来作为一个通用后台管理系统(common management system),为各种后台管理系统提供一个基础的版本框架,使企业能快速的开发自己的业务模块,而非重新从零开始搭建编写这种基础性的功能。整个项目是完全前后端分离,分为两个部分,前端使用vue编写(对应仓库中的cmms-vue),后端使用springboot编写(对应仓库中的cmms)。
下面是部分截图:
菜单管理

给角色配置菜单

给用户配置角色

二.设计逻辑
每个用户登录之后,所看到的菜单,是由用户所拥有的角色决定的,其对应角色配置了哪些菜单,则用户登录之后就可以看到哪些菜单,从而控制了用户的菜单权限;关于机构的设计,每个用户都对应了一个机构,即每个用户都属于公司的一个部门,可以根据机构来查看其下拥有的用户有哪些。
1.菜单设计
菜单管理采用的是树形的控件,菜单的结构和层级关系都可以由管理员来定制,利用树形结构管理比较方便和直观:

2.角色设计
角色管理比较核心的就是配置菜单,选择一个角色,为其配置对应的菜单权限,配置菜单也是采用树形控件直接勾选,很直观和方便的查看到角色拥有的菜单,并且易于操作:

3.用户设计
不同的用户登录,所看到的菜单可能是不一样的,主要是因为用户拥有的角色不一样;用户管理比较核心的就是角色配置,一个用户可以对应多一个不同的角色,那么该用户拥有的菜单权限就是其所拥有的所有角色的并集:

项目github地址:https://github.com/Little-Orange7/cmms-vue
(项目后续还将持续的完善中,欢迎有兴趣的小伙伴加入)
vue后台管理系统介绍的更多相关文章
- 【vue】MongoDB+Nodejs+express+Vue后台管理项目Demo
¶项目分析 一个完整的网站服务架构,包括: 1.web frame ---这里应用express框架 2.web server ---这里应用nodejs 3.Database ---这里 ...
- Vue 后台管理
这里是结合vue和element快速成型的一个demo 里面展示了基本的后台管理界面的大体结构和element的基本操作 GitHub的地址:https://github.com/wwwming/ad ...
- vue后台管理项目中菜单栏切换的三种方法
第一种方法:vue嵌套路由(二) <el-menu :default-active="defaultActive" style="min-height: 100%; ...
- Core + Vue 后台管理基础框架0——开篇
1.背景 最近,打算新开个项目,鉴于团队技术栈,选型.net core + vue,前后端分离.本打算捡现成的轮子的,github上大致逛了逛,总发现这样那样的不太适合心中那些“完美实践”,例如:Ab ...
- Core + Vue 后台管理基础框架4——前端授权
1.前言 上篇,我们讲了后端的授权.与后端不同,前端主要是通过功能入口如菜单.按钮的显隐来控制授权的.具体来讲,就是根据指定用户的制定权限来加载对应侧边栏菜单和页面内的功能按钮.我们一个个来讲. 2. ...
- 从0搭建vue后台管理项目到颈椎病康复指南(一)
网上搜索了很久Vue项目搭建指南,并没有找到写的比较符合心意的,所以打算自己撸一个指南,集合众家之所长(不善于排版,有点逼死强迫症,如果觉得写的有问题,可以留言斧正,觉得写的太差的,可以留言哪里差, ...
- Core + Vue 后台管理基础框架2——认证
1.前言 这块儿当时在IdentityServer4和JWT之间犹豫了一下,后来考虑到现状,出于3个原因,暂时放弃了IdentityServer4选择了JWT: (1)目前这个前端框架更适配JWT: ...
- Core + Vue 后台管理基础框架3——后端授权
1.前言 但凡业务系统,授权是绕不开的一环.见过太多只在前端做菜单及按钮显隐控制,但后端裸奔的,觉着前端看不到,系统就安全,掩耳盗铃也好,自欺欺人也罢,这里不做评论.在.NET CORE中,也见过不少 ...
- Core + Vue 后台管理基础框架1——运行系统
1.down源码 git clone https://github.com/KINGGUOKUN/SystemManagement.git,项目目录如下: 2.还原数据库 找到项目根目录下System ...
随机推荐
- java添加对象成功后想知道当前添加对象的id
我使用的是springboot Mybatis写的项目,结构如下 mapper.xml(以下2个属性必须要有,主键id 一般是自动生成的) mapper.java (注意新增的返回值不需要,一般情况 ...
- 使用d3.js的时候,如何用zoom translate scale限制拖拽范围
红色代表需要改写的代码 1.添加定义图像大小和容器的大小及坐标 d3.behavior.zoom = function () { var moveCanvas={ width: , height: , ...
- Python 控制流代码混淆简介,加大别人分析你代码逻辑和流程难度
前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者: 王平 PS:如有需要Python学习资料的小伙伴可以加点击下方链接自 ...
- L25词嵌入进阶GloVe模型
词嵌入进阶 在"Word2Vec的实现"一节中,我们在小规模数据集上训练了一个 Word2Vec 词嵌入模型,并通过词向量的余弦相似度搜索近义词.虽然 Word2Vec 已经能够成 ...
- E - Roaming Atcoder
题解:https://blog.csdn.net/qq_40655981/article/details/104459253 题目大意:n个房间,,每个房间都有一个人,一共k天,在一天,一个人可以到任 ...
- qa问答机器人pysparnn问题的召回
""" 构造召回的模型 """ from sklearn.feature_extraction.text import TfidfVecto ...
- 使用STM8S i2c对TPS65987寄存器进行读写
上图是TPS65987的i2c读写协议,和标准i2c协议有点出入,不过也不难理解,在读的时候i2c slave在发送数据过来之前会先发送1byte数据表示后面会有几个字节数据过来,在写的时候i2c h ...
- tp5--模型关联
来源于:https://blog.csdn.net/u012600104/article/details/78927629 先说明,模型关联和join管理是不一样的,用文章和评论的关系来举例.(一对多 ...
- Makefile 头文件 <> 与 "" 的差别,与 Visual Studio 不同
#include "" : 首先在所有被编译的.c所在的路径中,查找头文件,如果找不到,则到 -I路径下去找头文件 #inclue <> :首先在-I路径下去找,如果找 ...
- Codeforces Round #632 (Div. 2) 题解
空山新雨后,天气晚来秋. 明月松间照,清泉石上流. 竹喧归浣女,莲动下渔舟. 随意春芳歇,王孙自可留.--王维 A. Little Artem 网址:https://codeforces.com/co ...