如何定制个性设置页面?
李小翔
2014-08-05 17:59

内容列表

BroFramework 提供了个性设置功能，并且包含了设置列表每页显示数、首选语种等设置；BroBPM 中进一步扩展该设置，允许设置常用流程、外出授权等功能。
这些个性设置的数据最终以键值对的形式存储在 bropen.framework.core.security.UserProfile 中，并且可以通过 session 获得其值：
import bropen.framework.Constants
Map profiles = session.getAttribute( Constants.SS_USER_PROFILES )
println profiles?.foobar
那么，应用或者插件中如何定制个性设置的页面、通过统一的UI接口来存取自己的个性设置键值呢？
BroFramework 的 bropen/framework/core/security/User/editProfile.gsp 视图中，会遍历所有 _editProfile_xxxx.gsp 视图，并将其作为子表单包含在内。其后缀规则为：
如果是插件中的自定义界面，则后缀为驼峰形式的插件名称，如 _editProfile_broFramework.gsp、_editProfile_broBpm.gsp
如果时应用的自定义界面，则后缀固定为 app，即 _editProfile_app.gsp
自定义的视图文件必须保存在 views/bropen/framework/core/security/User/ 中。
以 _editProfile_broFramework 为例：
通过判断参数 tabs，将视图分为两个部分一个是页签头，用于生成 jQuery UI 的 tab 组件的页签
一个是页签的内容部分，包含一个 div
其中页签头中 a 标签的 href 属性和页签内容 div 标签的 id 必须一致，并且唯一
小技巧：页签头中 li 标签和 div 标签都设置了一个唯一的 css class 属性，以便在应用中可以通过样式表的方式来隐藏某个个性设置，如：
.tabs-fwk-page { 
   display: none;
} 
页签内容中的个性设置表单字段 select 或者 input 等表单元素的名称前缀固定为 “profiles.”表单提交后会自动保存到 code 为后缀的 UserProfile 中
如果为空，则会自动删除对应的 UserProfile
变量 Map profiles 中保存了当前用户的所有个性设置，可以通过它获得当前值，并给表单元素赋值，如：
profiles.foobar
<%@ page import=”bropen.framework.Constants” %>
<g:if test=”${ tabs} ”>
   <%-- 页签头 --%>
   
   <li class=”tabs-fwk-page”><a href=”#tabs-fwk-page”><g:message code=’bropen.framework.core.security.UserProfile.editProfile.page’ /></a></li>
   
</g:if><g:else>
   <%-- 页签内容 --%>
   
   <div id=”tabs-fwk-page” class=”tabs-fwk-page”>
       <table>
           <tr>
               <th><label><g:message code=’bropen.framework.core.security.UserProfile.editProfile.page.username’ />:</label></th>
               <td width=”70%”><sec:username/></td>
           </tr>
           <tr>
               <th><label for=’${ Constants.UP_PAGE_MAX} ’><g:message code=’bropen.framework.core.security.UserProfile.editProfile.page.UP_PAGE_MAX’ />:</label></th>
               <td><g:select name=”profiles.${ Constants.UP_PAGE_MAX} ” from=”${ [5,10,15,20,50,100,200]} ”
                      value=”${ profiles[Constants.UP_PAGE_MAX]?:setting(’bropen.framework.pagination.default’)} ” /></td>
           </tr>
           
           <g:if test=”${ GrailsUtils.getConfig(’bropen.toolkit.i18n.supported’).size() > 1} ”>
           <tr>
               <th><label for=’${ Constants.UP_LOCALE} ’><g:message code=’bropen.framework.core.security.UserProfile.editProfile.page.UP_LOCALE’ />:</label></th>
               <td>
                   <g:select class=”up-locale” name=”profiles.${ Constants.UP_LOCALE} ”
                       from=”${ GrailsUtils.getConfig(’bropen.toolkit.i18n.supported’)} ” value=”${ profiles[Constants.UP_LOCALE]} ” />
                   <script>$j(”.up-locale option:first”).val(’’)</script>
               </td>
           </tr>
           </g:if>
       </table>
   </div>
</g:else>
在举一个应用的例子 _editProfile_app.gsp：
<g:if test=”${ tabs} ”>
   <%-- 页签头 --%>
   <li><a href=”#tabs-address”>常用地址信息</a></li>
   
   <!-- 隐藏常用流程 -->
   <style>.tabs-bpm-part {  display: none } </style>
   
</g:if><g:else>
   <%-- 页签内容 --%>
   
   <div id=”tabs-address”>
       <table>
           <tr>
               <th><label for=”address.company”>单位名称:</label></th>
               <td width=”70%”><g:textField name=”profiles.address.company” value=”${ profiles[’address.company’]} ” style=”width:96%”/></td>
           </tr>
           <tr>
               <th><label for=”address.address”>地址:</label></th>
               <td><g:textField name=”profiles.address.street” value=”${ profiles[’address.street’]} ” style=”width:96%”/></td>
           </tr>
           <tr>
               <th><label for=”address.postcode”>邮编:</label></th>
               <td><g:textField name=”profiles.address.postcode” value=”${ profiles[’address.postcode’]} ” style=”width:96%”/></td>
           </tr>
       </table>
   </div>
</g:else>