版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_26981333/article/details/83110830
一、前言
参考权限规则功能,页面如下:
二、页面结构
Screen页面其实就是一个XML页面,页面结构如下:
- screen
- init-procedure
- view
- script
- dataSets(数据存储)
- dataSet
- dataSet
- …
- screenTopToolbar(数据显示)
- form(数据显示)
- formToolbar
- textField
- grid(数据显示)
- columns
- editors
Aurora的Web界面主要由dataSets、form和grid以及其他组件构成。
三、dataSet
- fields
- events
1.本质
(1)dataSet是前端的数据存储
组件。所有前后端交互的数据都会存在dataSet中。
(2)显示组件 <-> DataSet <-> 后端。
(3)所有的显示组件都会绑定在dataset上,您所看能够在页面上看到的一切都只是负责显示和数据输入,实际的数据都存储在Dataset中
2.两个DS
DataSet与后端实体类相对应
QueryDs — 用于查询
ResultDs — 用于提交
3.fields
field 属性
属性名 | 含义 | 描述 |
---|---|---|
name | 属性名 | name字段值与后端实体类属性一一对应 |
prompt | 描述 | Screen中填写描述代码,页面渲染时会根据当前语言环境获取到对应的中文描述(或英文描述) |
3.1 下拉框
<a:dataSet id="FND502_docCategoryDs" autoQuery="true"
queryUrl="$[/request/@context_path]/common/auroraCode/FND.DOC_CATEGORY/"/>
<a:dataSet id="FND502_businessRuleQueryDs" autoCreate="true">
<a:fields >
<a:field name="businessRuleCode" prompt="fnd_business_rule.business_rule_code"/>
<a:field name="businessName" prompt="fnd_business_rule.business_rule_name" />
<!-- 下拉框,单据类型名列表 -->
<a:field name="docCategoryName" displayField="meaning" options="FND502_docCategoryDs"
returnField="docCategory" valueField="value"
prompt="fnd_business_rule.doc_category_name" />
<a:field name="docCategory" />
</a:fields>
</a:dataSet>
3.2 多语言
多语言字段对应的field需要添加 dto 以及 dtoId 属性。
<a:field name="businessName" descIdField="businessName_id" prompt="fnd_business_rule.business_rule_name" dto="com.hand.hec.panda.fnd.dto.FndBusinessRule" dtoId="businessRuleId" />
4. events
DataSet是具有事件的。
<a:events>
<a:event name="submitsuccess" handler="FND502_businessRuleSubmitSuccess"/>
</a:events>
四、screenTopToolbar
工具条 是一个显示组件。所有的显示组件都需要绑定在dataset上。
<a:screenTopToolbar>
<a:gridButton bind="FND502_businessRuleResultGrid" type="add" width="80"/>
<a:gridButton bind="FND502_businessRuleResultGrid" type="save" width="80"/>
<a:gridButton bind="FND502_businessRuleResultGrid" type="delete" width="80"/>
</a:screenTopToolbar>
gridButton 属性列表:
属性名 | 含义 | 描述 |
---|---|---|
bind | 指定绑定的DataSet | 对应的按钮类型的操作会对绑定的DataSet产生相应的影响 |
type | 按钮类型 | add / save / delete /clear |
五、Form
queryForm 是一个显示组件。所有的显示组件都需要绑定在dataset上。
<a:queryForm bindTarget="FND502_businessRuleQueryDs" resultTarget="FND502_businessRuleResultDs" style="width:100%;border:none">
<a:formToolBar labelWidth="100">
<a:label name="separator"/>
<a:textField name="businessRuleCode" bindTarget="FND502_businessRuleQueryDs" typeCase="upper"/>
<a:textField name="businessName" bindTarget="FND502_businessRuleQueryDs"/>
<a:comboBox name="docCategoryName" bindTarget="FND502_businessRuleQueryDs"/>
</a:formToolBar>
</a:queryForm>
- bindTarget : 将查询条件绑定到 QueryDs
- resultTarget : 将查询返回结果绑定到 ResultDs
六、Grid
grid是一个栅格形式的显示组件,显示为一个表格。所有的显示组件都需要绑定在dataset上。
<a:grid id="FND502_businessRuleResultGrid" bindTarget="FND502_businessRuleResultDs" marginHeight="115" marginWidth="3" navBar="true">
<a:columns>
<a:column name="businessRuleCode" align="center" editorFunction="textFunc" width="80"/>
<a:column name="businessName" align="left" editor="FND502_tld" width="120"/>
<a:column name="docCategoryName" align="left" editor="FND502_cb" width="120"/>
<a:column name="enabledFlag" align="center" editor="FND502_chk" width="80"/>
<a:column name="businessRuleDetails" renderer="FND502_businessRuleDetails" width="120"/>
</a:columns>
<a:editors>
<a:tledit id="FND502_tld"/>
<a:textField id="FND502_tf_01"/>
<a:textField id="FND502_tf_02" typeCase="upper"/>
<a:lov id="FND502_lov" />
<a:checkBox id="FND502_chk"/>
<a:comboBox id="FND502_cb" />
<a:numberField id="FND502_nf" allowDecimals="false" allowNegative="false" />
</a:editors>
</a:grid>
- bindTarget : 指定绑定的DataSet
- navBar : 分页导航
- editors :编辑器。加上编辑器就可以有输入框了。