动态控制按钮权限
## onion.getPermission()
### 1.功能
实时获取操作后台按钮所需的权限数据
### 2.使用场景
根据页面地址, 获取相关接口功能的权限, 并在页面显示对应的按钮
**例**: 获取 customerSummary 接口的所有权限
```js
onion.getPermission("pages/customer/customerSummary/pageList.html")
```
根据返回的权限赋值给操作按钮, 使其能展示在页面上供用户操作
### 3.如何使用
#### 3.1 使用数据表格的页面 (一般为 pageList.html )
1. 在 HTML 页面, 添加需求中要求的操作按钮, 要求按钮上有 `limitname `, class 上有 `limitBtn layui-hide`
```html
<div class="toolbox layui-row notb p10">
<span class="layui-btn ml15 limitBtn layui-hide" limitname="system:user:save" id="userAdd"><i class="layui-icon"></i> 用户新增</span>
<button class="layui-btn" lay-submit lay-filter="userSearch"><i class="layui-icon"></i>用户查询</button>
</div>
</div>
```
2. 将返回对应操作的权限添加至 limitname
```html
<span type="button" class="layui-btn limitBtn layui-hide" limitname="pageOne:pageTwo:funcOne" id="funcOne">功能一</span>
```
> 找到对应的按钮 span，添加 limitBtn layui-hide, layui-hide 保证节点在初始化的时候是隐藏的，limitBtn 是确认当前按钮是需要限制的按钮。 limitname 是指当前限定按钮到底限制什么，里面的数据是后台返回的
#### 3.2 不使用数据表格的页面
在 JS 文件手动调用 `onion.getPermission()`, 传入参数为菜单主页 `pageList.html`
```js
onion.getPermission("pages/pageOne/pageTwo/pageList.html")
```
### 4.api定义
``` javascript
onion.getPermission = function (menuUrl) {
if (onion.showPermission) {
onion.hidePermissionBtn(onion.showPermission);
return;
}
var defaultUrl = '/common/getUserPermissions';
var menuUrl = menuUrl || false;
// 判断收集的userId 和 menu 是否都有
var permissionData = onion.getPermissionData();
permissionData = JSON.parse(permissionData);
var flag = true;
for (var key in permissionData) {
if (permissionData.hasOwnProperty(key)) {
if (permissionData[key] == '') {
flag = false;
}
}
};
if (!flag) {
return;
};
onion.ajax.post(defaultUrl, permissionData, function (res) {
if (res.code == onion.networkState.SUCC) {
if (menuUrl) {
permissionData['menu'] = menuUrl;
onion.ajax.post(defaultUrl, permissionData, function (res2) {
var data1 = res.data;
if (res.code == onion.networkState.SUCC) {
var data2 = res2.data;
var result = data1.concat(data2);
} else {
var result = data1;
}
var permissonObj = {};
result.forEach(function (item) {
permissonObj[item] = true;
});
onion.showPermission = permissonObj;
onion.hidePermissionBtn(permissonObj);
})
} else {
var data1 = res.data;
var permissonObj = {};
data1.forEach(function (item) {
permissonObj[item] = true;
});
onion.showPermission = permissonObj;
onion.hidePermissionBtn(permissonObj);
}
}
})
}
onion.hidePermissionBtn = function (data) {
$('.limitBtn').each(function (idx, btnItem) {
var limitname = $(btnItem).attr('limitname');
if (data[limitname]) {
$(btnItem).removeClass('layui-hide');
}
});
}
```