针对Vue的后台权限功能实现思路(持续更新)

权限是一块设计挺繁琐的功能,尤其是设计到前端SPA应用,前后端的耦合性太强,先屡屡思路,再实现,如果您有好的建议,也可评论留言。

基本的表结构如下

用户表。user

字段

说明

id

用户ID

username

用户名

示例

id

username

1

赛冷思

前端路由表。routes

字段

说明

id

路由自增ID

pid

父级路由ID,默认根路由为0

path

方便操作无线分类的关键字段,后面再说

web_pata

前端路由路径,注意:为方便各种SPA,前后不带斜杠,交给前端自己处理即可

name

路由名称

desc

路由描述

sort

排序,例如同一级路由,可按此字段排序,这个排序结果将会在前端菜单中提现

extra

拓展信息,格式为JSON字符串,例如vue-router中的meta信息

有几项需要注意:

  1. 添加功能尽量让前端开发者填写,你懂得
  2. 修改时,前端一定要知道,你懂得
  3. 删除时,前端一定要知道,你懂得

切记,这些东西都是跟前端相关联。。。

示例

id

pid

path

web_path

name

desc

sort

extra

1

0

0,

manager

内容管理

管理内容的路由

1

{}

2

1

0,1,

article

文章管理

文章管理

1

{}

3

2

0,1,2,

list

文章列表

查看文章列表页面

1

{}

4

2

0,1,2,

view

文章详情

查看文章详情页面

1

{}

5

2

0,1,2,

edit

添加/修改文章

添加和修改文章公用页面

1

{"test":"article-edit"}

6

1

0,1,

mind

随笔管理

随笔管理

1

{}

7

6

0,1,6,

list

随笔列表

查看随笔列表页面

1

{}

8

6

0,1,6,

view

随笔详情

查看随笔详情页面

1

{}

9

6

0,1,6,

edit

添加/修改随笔

添加和修改随笔公用页面

1

{"test":"mind-edit"}

注意:给用户选择路由时,如果选择的是最底层的路由,那么从它自身到最顶层父级,都应该被选择,例如选择文章列表,那么文章管理和内容管理都应该被选中。同样,如果选择的不是最底层的,那么所有的子级应该被选中,不再细说。 解释一下关键字段

  • pid 父级ID,根级ID为0,没啥说
  • path 默认为"0,",意思就把当前数据,从最顶层的父级pid到自身的pid,用英文","链接起来,最后要加个逗号 例如,文章管理自己的pid为1,它得父级内容管理的pid是0,所以文章管理的path就是"0,1,",一次类推就行
  • extra 前端路由的拓展信息

用户路由关联表。user_routes

字段

说明

id

自身自增ID

user_id

用户ID

route_id

路由ID

extra

拓展信息,格式为JSON字符串,例如vue-router中的meta信息,此拓展在将会和routes表extra合并,可以通过这个字段细粒度控制路由中的小操作

示例

id

user_id

route_id

extra

1

1

1

{}

2

1

2

{}

3

1

6

{}

4

1

3

{}

5

1

4

{}

6

1

9

{"add":true,"update":false}

通过示例可以看出,该用户拥有的路由其实就三个页面,分别是:文章列表,文章查看和添加/修改随笔,注意:添加/修改随笔extra里面设置了,add为true,update为false,意思是,只能添加,不能修改,前端可以在用户进入这个页面的时候,通过这个信息来决定到底能干啥,从而也就实现了细粒度控制每个页面的具体操作。

最终给前端返回的数据格式如下:

{
    id:1,
    username:'赛冷思',
    routes:[
        {
            id:1,
            web_path:'manager',
            name:'内容管理',
            extra:{},
            ...其他字段
            children:[
                {
                    id:2,
                    web_path:'article',
                    name:'文章管理',
                    extra:{},
                    children:[
                        {
                            id:3,
                            web_path:'list',
                            name:'文章列表',
                            extra:{},
                        },
                        {
                            id:4,
                            web_path:'view',
                            name:'文章详情',
                            extra:{},
                        }
                    ]
                },
                {
                    {
                        id:6,
                        web_path:'mind',
                        name:'随笔管理',
                        extra:{},
                        children:[
                            {
                                id:9,
                                web_path:'view',
                                name:'添加/修改随笔',
                                extra:{
                                    test:'mind-edit',
                                    add:true,
                                    update:false
                                }
                            }
                        ]
                    }
                }
            ]
        }
    ]
}

大致思路就是这样,回头在实现的过程中发现不完善的,将会持续更新。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏PPV课数据科学社区

大数据系列(4)——Hadoop集群VSFTP和SecureCRT安装配置

前言 经过前三篇文章的介绍,已经通过VMware安装了Hadoop的集群环境,当然,我相信安装的过程肯定遇到或多或少的问题,这些都需要自己解决,解决的过程就是学...

2944
来自专栏实战docker

极速体验编译openjdk8(docker环境)

本文不讲解编译openjdk8的过程,而是专注于用最少的步骤把openjdk8源码编译构建成jdk。 进行本文的实践有个前提:请读者们先在电脑上安装docker...

2416
来自专栏李蔚蓬的专栏

解决 | 此数据库文件跟当前sql server实例不兼容 & sql server2008无法连接到(local)

最近在搞ASP.NET,因实验室VS版本跟PC不一样可能,拷回来一打开就这样子:

562
来自专栏维C果糖

详述 Maven 依赖范围及依赖调节原则

当在我们 POM 文件中配置 Maven 依赖的时候,常见的格式如下: <project> ... <dependencies> ...

2167
来自专栏埋名

Git 常用命令清单笔记

这里是我的笔记,记录一些git常用和一些记不住的命令,这个笔记原本是基于 颜海镜的文章增加的,后面慢慢增加了许多内容,可以看出的的学习轨迹。分享出来方便自己查看...

853
来自专栏ios 技术积累

Maven 初识

才接触Maven的时候也是一头雾水,网上搜索了一些资料后感觉Maven和iOS开发中的cocoapods很像,cocoapods自动下载我们需要的开源类不需要手...

743
来自专栏玄魂工作室

Hacker基础之Linux篇:进阶Linux命令三

objdump命令是Linux下的反汇编目标文件或者可执行文件的命令,当然,它还有其他作用

763
来自专栏24K纯开源

使用Qt installer framework制作安装包

一、介绍     使用Qt库开发的应用程序,一般有两种发布方式: (1)静态编译发布。这种方式使得程序在编译的时候会将Qt核心库全部编译到一个可执行文件中。其优...

2488
来自专栏Janti

每天学一点Docker(1)

Docker能做些什么? 1.docker能够解决虚拟机能够解决的问题 2.隔离应用依赖 3.创建应用镜像并复制 4.创建容易分发的即启即用的应用 5.dock...

3877
来自专栏北京马哥教育

Linux 企业运维人员最常用 150 个命令汇总! 收藏了!

? 命令功能说明线上查询及帮助命令 (2 个)man查看命令帮助,命令的词典,更复杂的还有 info,但不常用。help查看 Linux 内置命令的帮助,比如...

2888

扫码关注云+社区