Axure教程:通用权限管理原型

简介: Axure教程:通用权限管理原型

原型预览及下载址:https://axhub.im/pro/34cea0d26344c9bb/#g=1

Hello大家好,权限管理可以说是每个系统都必备的一个功能,也有可能是一个权限系统管理同一个企业多个系统的用户权限。所以作者今天和大家分享一个权限管理系统的高保真原型及制作教程。

这个原型包括了角色管理、用户管理和权限管理共计17个页面内容。而且大部分内容是用中继器完成的,使用方便,只需要填写表格即可。当然了,这个原型交互效果和真的一样,你们也可以学到几个中继器之间的交互。

一、效果演示9

1. 角色管理

角色管理应包括角色名称、说明、状态、成员和权限

1.1创建角色

创建角色只需要简单的填写名称和说明即可,默认启用状态。

这里注意角色名是唯一的。

640.gif

添加角色后,可以在用户管理和权限管理处看到该角色

640.gif

1.2选择角色成员

新增角色后,可以为该角色快速选择用户,可以高效管理相同角色用户的权限。

640.gif

在角色管理页维护角色用户后,联动到角色详情页、用户管理和用户详细页,可以看到该用户已经选中该角色。

640.gif

1.3选择角色权限

640.gif

同样,在角色管理页维护角色权限后,联动到角色详情页和权限管理页面,都可以看到该用户选中的权限。

640.gif

1.4模糊搜索角色

640.gif

1.5启用和禁用

启用或禁用后,同样可以在角色详情页显示同样状态

640.gif

1.6删除角色

可以在角色管理页或者角色详细页删除角色。如果在详细页删除,会联动至角色管理页。

640.gif

1.7查看角色详细信息

点击角色名称可以查看不同角色的详细信息

640.gif

1.8批量操作

同样的也会联动交互至其他页面,大家可以自行体验。

640.gif

2. 用户管理

用户管理应包括角色账号、基本信息、状态、角色和权限。

2.1创建用户

创建用户包括账号,用户名,手机号码,邮箱,输入框等,提交时系统能进行判断,如果输入不正确会有相应的提示。同样,添加用户后,也会联动至角色管理、角色详情、权限管理等页面,大家可以自己体验。

注:用户账号是唯一的,但是用户名不唯一,毕竟人有同名

640.gif

2.2选择用户角色

选择用户角色后,也会联动至角色管理、角色详情、权限管理等页面,大家可以自己体验。

640.gif

2.3选择用户权限

如果需要单独设置该角色的某项权限,也可以在这里进行设置。

640.gif

2.4模糊搜索用户

输入用户账号或名称,可以模糊搜索用户

640.gif

2.5启用和禁用

同样的启用或禁用后,能联动到用户详细页

640.gif

2.6删除用户

可以在用户管理页或者用户详细页删除角色。如果在详细页删除,会联动至用户管理页。

640.gif

2.7查看用户详细信息

点击角色名称可以查看不同用户的详细信息

640.gif

2.8编辑用户信息

640.gif

2.9重置密码

640.gif

2.10批量操作

和上面一样,也会联动交互至其他页面,大家可以自行体验。

640.gif

3. 权限管理

权限管理应包括权限策略管理和授权

3.1添加权限策略

可以通过可视化配置和脚本配置两种方式添加权限策略。

可以手动添加系统服务。

可以设置操作权限和资源权限。

同样新增权限策略后,联动交互到用户和角色管理,大家可以自己体验

640.gif

3.2维护权限策略

维护权限策略后,联动交互到用户和角色管理,大家可以自己体验

810b547af859c8464a301fe4612b5c91.jpg

3.3批量授权

授权后联动至用户和角色管理,大家可以自己体验

f9f4184f1d934667ea3d040b43efc2ca.jpg

3.4删除和批量删除

删除权限策略后联动至用户和角色管理,大家可以自己体验

e5069a8fdc99289b358911f084472c2b.jpg

二、教程思路

1. 角色管理

什么是角色管理呢?

例如说运营专员是一个角色,运营经理又是一个角色,角色与角色质之间有的权限是不一样的,就好比运营经理会比运营专员的权限大。但是一个角色会有多个人,比如说一家银行可能就有几千个大堂经理了。而这些大堂经理有很大一部分权限是一致的,角色管理就是管理这一致的权限。

58e4be8045a7a90998dfeb30c338b34e.png

1.1 制作材料

添加角色按钮一个,搜索框一个,刷新按钮一个,中继器一个包含:多选按钮,角色名称,角色状态(启用按钮),角色成员、角色权限、删除按钮,以及批量启用、禁用、删除按钮。

1.2 角色中继器内表格

如下图所示:

no:编号,按1、2、3、4、5、6、7的方式即可,载入时,按no升序排列

groupname:角色名,每项加载时,设置角色名文本=Item.groupname

groupremark:角色说明,每项加载时,设置角色说明=Item.groupremark

qiyong:每项加载时,如果item.qiyong=1,设置启用按钮状态为启用,否则则设置为未启用

xuanzhong:每项加载时,如果item.xuanzhong=1,设置改行选择按钮为选中状态,否则则为未选中状态。

186da6d0ffadc3742c3e1b05bd038138.png

2. 用户管理

用户管理应包括角色账号、基本信息、状态、角色和权限、密码重置等功能。

有的小朋友可能会问,为什么,角色那里可以选择用户,还要在用户这里选择角色呢?因为方便!现在很多都是一个人承担多个角色的,那如果我新增一个用户,我可能在角色页操作多次,那如果我在用户页就可以选择角色,那就只需要操作一次了。

还有的同学可能会问,为什么用户要有自己的权限,用角色的不行吗?刚刚提到了,角色是管理共性的权限,但是,即使是同一角色,例如大家都是大堂经理,在不同的网点,也会有自己私有的权限,所以用户管理就可以维护用户的私有权限。

d37b3be7d0285ec731481bfac6d77d46.png

2.1 制作材料

添加用户按钮一个,搜索框一个,刷新按钮一个,中继器一个包含:多选按钮,用户账号,用户名称、启用按钮,角色选择、权限设置、删除按钮,以及批量启用、禁用、删除按钮。

2.2 用户中继器内表格

如下图所示:

no:编号,按1、2、3、4、5、6、7的方式即可,载入时,按no升序排列

useraccount:用户账号,每项加载时,设置角色名文本=Item.useraccount

username:用户名称,每项加载时,设置用户名称=Item.username

telephone:手机号码,用语记录用户的手机号码

email:电子邮箱,用于记录用户的电子邮箱

qiyong:每项加载时,如果item.qiyong=1,设置启用按钮状态为启用,否则则设置为未启用

xuanzhong:每项加载时,如果item.xuanzhong=1,设置改行选择按钮为选中状态,否则则为未选中状态

cd91cdcb5dd302e5f9021802b8a6f8c4.png

3. 权限管理

权限管理应包括权限策略管理和授权。

那为什么在这里要批量授权呢,例如说某个系统新增了一个功能,那如果这里没有批量授权的话,我就要找到n个角色,n个用户一个个进行授权了。

a8817f4e948bbd1dd58fa156646f9d13.png

3.1 制作材料

添加策略按钮一个,搜索框一个,刷新按钮一个,中继器一个包含:多选按钮,权限名称,权限说明角、批量授权、编辑策略、删除策略,以及批量删除按钮。

3.2 权限中继器内表格

如下图所示:

no:编号,按1、2、3、4、5、6、7的方式即可,载入时,按no升序排列

quanxianname:权限策略,每项加载时,设置权限名文本=Item.quanxianname

quanxianshuoming:权限说明,每项加载时,设置角色说明=Item.quanxianshuoming

peizhimoshi:权限的配置模式:可视化配置或脚本配置

chanpinfuwu:这个是设置fuwuquanxian

caozuoquanxian:只读、操作或者其他权限

ziyuanquanxian:设置资源的权限,如邮件、消息等。

xuanzhong:每项加载时,如果item.xuanzhong=1,设置改行选择按钮为选中状态,否则则为未选中状态

0b17f63b6295ee51c30a08b6e79c7f1c.png

作者:梓贤vigo;


微信公众号:Axure高保真原型,分享一系列产品经理常用的原型模板、教程、视频、文档等原创内容


本文由微信公众号:Axure高保真原型 授权发布,未经许可,禁止转载

相关文章
|
5月前
原型工具Axure和墨刀哪个更好?
原型工具Axure和墨刀哪个更好?
62 1
|
7月前
|
架构师 数据可视化 人机交互
Axure介绍与原型案例分享
Axure介绍与原型案例分享
|
数据安全/隐私保护
【Axure教程】通用权限管理原型(上)
【Axure教程】通用权限管理原型
【Axure教程】通用权限管理原型(上)
|
11月前
|
数据可视化 数据安全/隐私保护
Axure教程:通用权限管理原型
Axure教程:通用权限管理原型
【Axure教程】自定义审批流原型模板
【Axure教程】自定义审批流原型模板
【Axure原型分享】日志管理
【Axure原型分享】日志管理
|
11月前
|
编解码 数据可视化 定位技术
Axure交互大全 全交互案例模板及视频教程
Axure交互大全 全交互案例模板及视频教程
|
数据可视化 数据安全/隐私保护
【Axure教程】通用权限管理原型(下)
【Axure教程】通用权限管理原型
【Axure教程】通用权限管理原型(下)
|
数据可视化 数据安全/隐私保护
【Axure教程】通用权限管理原型
【Axure教程】通用权限管理原型
【Axure教程】通用权限管理原型
|
数据安全/隐私保护
【Axure教程】多角色登录原型
【Axure教程】多角色登录原型
【Axure教程】多角色登录原型