B端系统之功能权限设置页面

今天主要想分享一下最近在项目中遇到的功能权限设置的页面设计...

FIRST

~

前言

在B端系统中权限设置是常见的功能，合理的权限设计有助于协助用户处理更多事务，并且提升用户的操作效率。衡量一个B端系统好坏的重要标准是：它的权限是否足够细致，拓展性是否很强。

权限管理可谓是系统的基础，良好的权限功能设计可使系统稳定发展，避免后续由于业务变化导致权限功能大改甚至推倒重做的情况发生。

在SAAS系统中，也是通过权限设置来定义不同版本的功能，一般而言，基础版本的功能比较少，而升级版本的功能就会更加的全面。

而对于B端自身系统而言，会存在很多的角色，比如常见的系统管理员、普通用户，这两者的功能权限会存在较大的差距，所以会通过后台权限来区分不同角色之间的功能权限。

在B端系统中权限分为功能权限和数据权限，详细的权限设置已经分享过，今天主要想分享一下最近在项目中遇到的功能权限设置的页面设计。

SECOND

~

B端系统功能权限是什么？

功能权限，就是用户登录后，能看到哪些菜单，能看到哪些按钮，能执行哪些操作的权限。

前面有提到在B端系统中不同的角色会有不同的功能权限，什么是功能权限呢？这里举一个简单的例子：

某公司的高层管理员A在系统中拥有系统的全部权限，可以对系统中的模块进行增、删、改、查，而公司中的小职员B只拥有系统中的普通角色权限，只能查看自己的业务，不具备增、删、改的权限，这里的增、删、改也就是我们系统中所提到的功能权限。

对于一个完整的B端系统而言，功能权限远不止这些，不同的系统具有不同的业务，不同的业务场景也会对应具有不同的功能，例如常见的发布、提交审批、下载等功能，所以具体的功能需要根据实际的业务常见去定义，再根据不同的角色分配不同的权限。

THIRD

~

功能权限设置页面方案思考

下面分析了我在项目中设计功能权限设置页面的几种方案，对于不同的设计方案也需要考虑不同的场景，一共分为四种方案：树结构、分级展示、分类展示、平铺展示。

a、树结构（整棵树）

b、分级展示

c、分类展示

d、平铺展示（涉及到数据结构的变化）

a、树结构（整棵树）

如果系统中功能模块较少，并且功能比较简单，设置的功能权限也比较简单，这样的业务场景对于功能设置页面是最简单的，我们只需要将整个系统中的功能采用一颗树的结构展示即可，用户只需要根据模块勾选对应的功能，如果功能存在多级结构，这个方案也同样适用。

上面的这种场景也可以通过平铺的方式实现，可以一眼看全所有的功能项，更加的直观，不过需要考虑设置页面是弹窗形式还是整个页面出现的形式，不同的展示形式也是需要考虑结构和布局的选择。

b、分级展示

如果系统中功能模块较多，并且功能比较复杂，子集结构较深，设置功能权限时需要一级一级展开，页面高度有限，展示的选项也比较有限，所以采用分级的形式展示，将同级的选项水平排版，可以更好的利用页面的宽度。

但是对于相同层级的功能选项不均匀的情况则不太适用，因为会导致页面的排版高低不齐，例如下图的流程体系下的流程，如果对应的功能选项比较少时，右侧就会有大量的空白，排版会高度不均，造成页面混乱的情况。

c、分类展示

如果系统中功能模块较多，每个模块的功能项比较多，就可以选择采用分类展示的方案呈现，通过切换左侧分类设置对应模块的功能权限，每个模块展示对应的功能，功能模块比较清晰，且可以快速找到对应模块进行设置。

但是对于模块功能不均的情况则不太友好，因为很多子模块的功能不会很多，就会导致该模块下的功能选项比较少，页面展示会比较空，

我也尝试过将选项竖排，最后一级的数据平铺的方式，这样的排版可以减少高度的空间，但是页面的宽度空间有很多的浪费，因为二级的功能选项都是单行的，所以会浪费横向的空间。

d、平铺展示（涉及到数据结构的变化）

平铺展示更多的是针对具有相同层级、功能选项较多，设置比较复杂的场景。

最终方案是通过将所有的选项平铺展示，尽可能的利用页面的空间，并且用户可以直观的看到页面中的选项，可以快速勾选和查看。

但是由于前期给的需求文档，数据层级并没有下面的设计稿这样整齐有序，原本的数据层级有四级，并且每一级的功能项都差距很大，有的到了第二级后就直接结束了，所以前期在思考设计方案时也是尝试了上面多种方案，都不敬人意。

最后通过将整体的功能模块层级和选项都做了数据上的调整，为了让设置页面层级更清晰统一，每个模块都分为了三个层级，每个层级都有对应的功能选项，这样在设计排版时也非常的清晰。

THE END

~

结语

B端项目业务比较复杂，对于角色的区分和权限的区分都需要做到严谨无误，否则就会给业务带来巨大的影响，而功能权限则是权限设置中必不可少的功能，也需要综合整个项目的实际业务场景，根据实际需求选择合适的方案，目的都是为了用户更好的理解功能权限以及设置功能权限。