界面权限配置

场景描述

实现对界面元素设置权限，例如对界面上的操作按钮通过设置权限实现按钮只读或者隐藏操作

实现思路

1. 需要设置界面权限页面需要同时引入界面权限组件、用户组件、上下文组件
2. 在界面权限组件中设置界面元素权限项配置，之后分配权限进行访问操作
3. 运行通过门户调试运行或者正式门户访问预览效果

操作步骤

1. 从市场中引入组件
2. 在要设界面权限页面引入界面权限组件、用户组件、上下文组件
3. 选择权限界面组件，在权限设置属性中设置界面权限项
4. 在界面权限设置中，点击“添加”按钮，在组件列下拉勾选当前页面上操作按钮，也可点击“更多”选择界面其他元素
5. 鼠标移动到当前行权限项名称列，点击“新建”按钮添加权限编码及名称
6. 在当前行无权限列设置无权限时是显示只读还隐藏设置
7. 配置完成进行保存并发布应用，之后再门户应用角色管理中定义角色
8. 添加角色并分配权限并按组织进行角色授权即可（注：配置了界面权限的页面，在分配角色功能权限时如勾选所有操作，则该角色具有当前页面所有设置权限项操作）
9. 运行效果如下，无权限时界面操作权限只读或者隐藏，反之有权限则可正常操作

补充说明

对于列表中的操作按钮是通过代码动态生成的操作，需要通过写代码控制界面操作权限

define(function(_equire){ 
    var $ = require("jquery");
    var Model = function(){
        this.callParent();
        this.gridChanged = justep.Bind.observable("");
    };

   Model.prototype.onGrid0Reload=function(event){
       this.gridChanged.set(new justep.UUID().toString());  
       //修改gridChanged, 会触发justep.Bind.computed重新重执行
   }


   Model.prototype.onGrid0CellRender=function(event){
       if (event.colName == "ffujiid"){
           event.html = "<a  class='save-btn btn btn-info'>save</a>";
       }else if (event.colName == "fid"){
           event.html = "<a  class='btn refresh-btn btn-info'>refresh</a>";
       }
    }

   Model.prototype.onModelLoad=function(event){
       var self = this;
       justep.Bind.computed(function(){
           self.gridChanged.get();  //依赖gridChange变化
           var ctxComp = self.comp("context0");

           var hasSavePerm = ctxComp.hasUIPermission("savePerm"); //savePerm: 来自权限编码定义
           var saveBtn = $(self.getRootNode()).find(".save-btn"); //save-btn: CellRender生成的class
           if (hasSavePerm){
               saveBtn.attr("disabled", false);
           }else{
               saveBtn.attr("disabled", true);
           }

           var hasRefreshPerm = ctxComp.hasUIPermission("refreshPerm"); //refreshPerm: 来自权限编码定义
           var refreshBtn = $(self.getRootNode()).find(".refresh-btn"); //refresh-btn: CellRender生成的class
           //self.getRootNode()： 当前页面的根节点
           if (hasRefreshPerm){
               refreshBtn.show();
           }else{
               refreshBtn.hide();
           }
       });
    }

    Model.prototype.comp=require("_comp");
    return Model;
});