普元EOS RichWeb(富客户端)实践总结

    最近公司未来一银行项目要使用到普元的EOS，客服是普元合作机构，没办法，必须将系统在EOS平台上部署开发，认真学习了2个星期，对EOS6.0的印象还是非常的好。丰富的页面开发组件，SOA我不是特别特别的说的出来，看了SOA相关文档和对比传统的开发模式，EOS的思想非常值得学习，EOS里面的组件设计，能更好的增加代码的可重复性，模块的独立性，这对于一个大型银行系统来说，所带来的好处不言而喻。不过这些高深莫测的名词也掩盖不来它背后一些基本的东西，大量使用接口，XML，依赖注入等等。概念是用来推销的。在使用过程中也渐渐发现存在的一些问题，甚至是软件BUG，当然这都是可以理解的，毕竟6.0刚出来不久，相信以后的版本会有更多值得我们期待和改进的地方。

 

EOS RichWeb组成

一、             理论基础

1. ide开发环境
   ide开发环境包括了jsp编辑器，工具面板和属性视图。
2. javascript api
   EOS RichWeb提供了字符串处理，日期处理，dom操作，ajax操作等js函数。
3. 标签库
       所谓的标签库，跟我们平时使用的JSTL标签和struts标签功能原理都是一样，可以联想起来使用。
       EOS RichWeb共提供了6大类的标签。
   • Bean类： 用于把数据区、Cookie、Http头、http请求参数以及资源文件中的内容输出。
   • Html类：在html控件元素基础上进行了扩展和增强。
   • Logic类：提供了一些逻辑判断标签， 用于jsp页面逻辑控制。
   • Dict类： 生成与业务字典相关的html控件元素。
   • Webcomp类：提供了date，popmenu，panel，tabpanel，tree等高级控件。
   • RichClient类：提供了datacell，comboselect等ajax控件。

 

标签名	功能	备注
Bean 类	用于把数据区、Cookie、Http头、http请求参数以及资源文件中的内容输出
bean_write	从数据区获取数据 并打印出数据
bean_set	将数据并写入数据区。相当于：request.setAttribute
bean_romove	移除数据区数据。相当于：request. romove
bean_size	获取数据区数据 集合长度
bean_message	国际化消息 和struts的Message一个用法
Html类	提供了对基本HTML标签的封装，支持DataContext.
Logic类	提供了一些逻辑判断标签， 用于jsp页面逻辑控制
Webcomp类	提供了date，popmenu，panel，tabpanel，tree等高级控件
RichClient类	提供了datacell，comboselect等ajax控件

 

EOS的JSP编辑器还是相当好用，提供了丰富的控件，拖拽即可生成代码，特殊的部分需要手工更改。标签大部分提供了对Xpath语法的支持，对JavaBean,List,Map,Document,request,sessiond的操作都很方便。

 

PS：

1)       EOS的RichWeb和建设银行的标签库所提供的全部功能基本一样，数据集遍历，日期类型甚至页面的action跳转方式都类似，建议可参考于CCBCSPS的WEB层来掌握EOS RichWeb开发。

2. 比较运算（等于）判断（）和逻辑循环（）结合JSTL标签的  学习很容易。

3．Webcomp类和RichClient类是实现EOS RichWeb的高级控件，特殊的页面效果等等都可以简单的实现。控件大部分使用ajax实现，效率很高。

 

二、             标签实例

1.    单选列表

单行选择控件由两个标签组成： 和,必须嵌套在中才能使用，可以嵌套用来设置行参数。在使用单行选择控件标签时，嵌套。

  例子：

对一个查询的学生信息viewList列表进行遍历并展示，使用单行选择控件 配合logic类的标签实现, 中使用来设置勾选选中的参数。

  

 

 

 

2.    多行选择控件

多行选择控件由两个标签组成： 和。必须嵌套在中才能使用，可以嵌套用来设置行参数.使用方法和单选一样，更多效果可参考EOS RichWeb开发指南 ，对控件的JS接口进行简单的配置即可实现。在使用多行选择控件标签时，嵌套。

 

 

 

  

 

 

 

由两个标签组成： 和。使用方法和单选一样，必须嵌套在中才能使用，可以嵌套用来设置行参数。更多效果可参考EOS RichWeb开发指南 ，对控件的JS接口进行简单的配置即可实现。在使用多行选择控件标签时，需嵌套。

3.    同页面多个列表

例子：在同一页面展示学生信息和学校信息2个列表。

后台处理

将学生信息列表stuList和学校信息列表schList保存在viewMap中待显示，代码如下：

HashMap  map  = new HashMap();

map.put("stuList", stuList) ;

map.put("schList", schList)

request.setAttribute(viewMap,map);

 

页面处理

⑴新建页面stuschList.jsp如下：

<% HashMap viewMap =(HashMap)request.getAttribute("viewMap") ; Iterator itkey = viewMap.keySet().iterator(); while(itkey.hasNext()){ String key = (String)itkey.next(); request.setAttribute(key,viewMap.get(key)); } %>  

 

 

通过上段代码可以将viewMap中的stuList和schList设置到request中，方便我们用遍历取值。值得注意的是：在后台中我们进行map.put("stuList", stuList) ;map.put("schList", schList)的时候，必须保证key和value的变量名称是一样的，否则使用上段代码将不能达到预期效果。

 

⑵然后使用Logic类的标签分别对其进行展示。

选择	学号	姓名	年龄
-->

选择	学校编号	学校名称
-->

  

 

虽然EOS提供了对HashMap取值的标签，但是HashMap中的value,对象只能是一维数组，对于二维数组的value，不能继续配合进行遍历。

1.    弹出框模态页面配置

弹出框在执行com.richweb.eos.PoupSch.flow后会弹出选择页面，对这个页面需要手写JS和设置参数，当勾选了数据后才可以正常返回到父页面。

 

弹出框页面处理

  -->  

 

 

勾选某笔资料后，配置返回哪些数据需返回到父页面。

在js里，模态页面返回的数据都是存放在数据对象Array中，在父页面的回调函数通过取数组中的数据设置到父页面获取的数据。如何在模态页面处理选择需要返回的值，请参考如下代码：

 

 

 

 

 

 

弹出框父页面处理

弹出框,一种是使用RichWeb的lookup标签，一种是使用EOS JS库的showModal,后台需要多写点js。

先看代码：

学校(lookUp实现)

 

⑴预先配置好弹出框的页面流com.richweb.eos.PoupSch.flow。

⑵使用标签时， 需配置id，lookupUrl，onReturnFunc。<w:lookup dialogTitle="学校弹出框" allowInput="false" name="schname" id="lookup1" lookupUrl="com.richweb.eos.PoupSch.flow"

  onReturnFunc="returnFunc" /> 。其中looupUrl是弹出框URL，onReturnFunc是弹出框返回触发的函数。其他参数属性可以参考开发手册去理解。

⑶手写返回函数。使用showModal做弹出框，需要自己写JS，设置模态页面的URL,，大小，位置，及回调函数callback。参考JS如下：

 

1.     页面跳转

例子：页面有新增，修改，删除按钮，点击需要跳到不同的页面。

 

 点击按钮会触发一个JS，不同的操作调用不同的JS，JS的功能是设置本次操作的action动作名称，通知页面流来执行。