一般动作
登录
Wiki: BROPEN ▼: Document Index
»
Space: FAQ ▼: Document Index
»
Page: 如何定制个性设置页面
搜索
zh
页面动作
导出 ▼: 以PDF格式导出 以RTF格式导出 以HTML格式导出
更多动作 ▼: 打印预览 察看源码
欢迎进入Wiki » FAQ » 如何定制个性设置页面?

# 如何定制个性设置页面?

在2014-08-05 17:59上被李小翔修改
评论 (0) · 附件 (0) · 记录 · 信息

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>
标签： BroFramework
在2014-08-05 12:46上被李小翔创建

- 评论 （0）
- 附件 （0）
- 记录
- 信息

# 快速链接

- 首页
- 新闻动态
- FAQ

Copyright © 2013 北京博瑞开源软件有限公司
京ICP备12048974号