轻轻松松使用“构件化”技术构建Web应用.doc

轻轻松松使用“构件化”技术构建Web应用轻轻松松使用“构件化”技术构建Web应用No part of this document may be reproduced, stored in any electronic retrieval system, or transmitted in any form or by any means, mechanical, photocopying, recording, otherwise, without the written permission of the copyright owner.目录1.前言31.1.图例31.2.准备工作32.快速开发：单表增删改查42.1.页面效果42.2.数据准备52.3.创建数据模型62.4.设置显示属性82.5.增删改查一步完成102.6.EOS数据库维护功能开发诀窍173.实现关联表操作183.1.数据准备183.2.创建数据模型183.3.产生录入关联数据的界面203.4.使用Lookup实现关联表操作233.4.1用Lookup来实现录入界面输入机构233.4.2在结果集中显示关联实体的属性264.实现从表操作284.1.数据准备284.2.创建数据模型284.3.使用Datacell实现从表数据录入304.3.1首先修改JSP录入界面304.3.2修改逻辑程序324.4.EOS应用逻辑开发诀窍365.还能再快吗？375.1.模型设置375.2.主从表功能一步完成381. 前言刚拿到EOS发现这个产品会看到有很多的概念和全新的编程思想，作为一个新手能否快速学习EOS？本文中将把EOS最基本的关键动作展示出来，学习基础动作可以为以后的熟练打下了基础。本教程中并不涉及EOS中关于安装、SOA基本概念、部署与管理。主要是通过向导方式开发一个简单数据库操作的web功能来体验EOS编程思想，中间穿插介绍了一些EOS的基本概念与开发技巧。这篇文档的阅读群设想为第一次接触EOS的开发者，或者是EOS产品体验人员，在浏览这篇文档后就能够掌握EOS的基本开发。就像本文的题目一样能够真正轻轻松松构建应用。1.1. 图例序号图例含义No.1EOS基本概念No.2开发心得与小技巧No.3&说明与注意事项1.2. 准备工作下载EOS 开发版安装包， 可以参见详细的安装说明EOS 6.0 安装手册。2. 快速开发：单表增删改查2.1. 页面效果在Web页面上展现数据库中的一张表，实现了对单表的数据库查询、增加与删除功能操作，并且实现了分页查询，效果如下图。查询与结果效果图录入与修改表单2.2. 数据准备为了实现一个单表的增删改查功能，需要先准备一张数据库表。在安装过程设置一个可用的数据库。& 说明：因为EOS平台主要针对企业系统，因此在安装过程前准备好一个数据库，并且安装过程中初始化数据库。后续所有的数据库脚本都是基于Oracle的，建议准备一个Oracle数据库可以通过数据库的客户端完成数据库表的创建，以及数据库中的初始数据的准备。数据库脚本： 小技巧：EOS Studio中已经内置了一个sql编辑器，并且可以用Studio通过安装包已经准备好的数据库连接直接执行上面的数据库脚本，创建好数据库表。可以参考下面的界面进行下面操作：1、 可以在项目中创建一个文件夹，然后创建对应数据库脚本文件2、 选择连接数据库3、 在sql文件编辑器点击邮件就可以运行sql文件& 注意：执行sql后需要重新刷新“数据库资源管理”视图中的“表”就能够看到新创建的表了。3、SQL编辑器点右键菜单来执行1、使用数据库连接2、可以在这儿创建一个文件夹，然后直接创建一个.sql文件2.3. 创建数据模型右键点击“资源管理器”视图中，用户创建的构件包下的“数据/数据模型”节点，选择“创建/数据集”菜单，创建一个名为“data”的数据集在（data）数据集中直接将左下角的“数据库资源”视图中的“O_OPERATOR”表直接拖拽到（data）数据集编辑器的空白处。Studio将创建出一个数据实体名称（OOperator）。拖拽 EOS原理：数据实体在应用编程中，需要建立业务域对象模型，普元提供的数据建模工具可以完成企业的元数据定义。在管理应用系统中，通常建立的数据定义都是通过DB数据库进行持久化的。通过数据库反转回来的数据定义就是一个可以持久化的数据实体。在上面例子中创建的OOperator这个实体，实际上建立一个OOperator对象和数据库表O_OPERATOR直接MAP映射关系，可以调用数据服务API实现数据库持久化操作。2.4. 设置显示属性打开上面创建的数据实体，修改所有的属性的显示名称：然后设置每个字段在JSP页面中的表现形式，下面介绍几种基本的：1、 字符串录入，数据校验：双击“userId”字段，设置“显示属性”2、 业务字典某些字段数据是采用编码的方式保存，EOS产品提供了一套业务字典管理功能，通过业务字典提供的一组TAG，就可以完成代码数据的录入和显示。双击“gender”属性，然后给“gender”设置一个业务字典类型。使用业务字典 EOS原理：显示属性通过web方式录入和显示数据的时候，格式会相对固定，在系统数据建模的过程中将页面的录入/显示进行设计，然后在页面编程中就可以直接使用数据模型中的显示属性了。显示属性中录入/显示，实际上对应的就是EOS提供一组基础的标签库，所以在设置显示属性的时候配置的所有内容实际上就是对标签库的参数进行初始值设置。目前提供的录入的TAG控件有：date、time、text、lookup、switchCheckbox、textarea、select以及一组dict（业务字典标签），具体的TAG控件请参考EOS Richweb开发指南2.5. 增删改查一步完成在使用EOS的技术体系架构编程时，需要了解很多类似于页面流、逻辑流等概念才能实现一组功能，怎么把这些内容了解的更清楚了，下面就用一个向导的方式完成单表维护功能。1.4前面已经完成的数据建模和显示属性的配置，我们下面正式进入了编程。在左侧资源管理器视图的创建的（project）项目中的（com.primeton.eos）构件包点击右键使用“功能向导”中的“单表维护功能向导”。选择数据实体，当然是选择刚才创建的OOperator：设置查询条件：增加条件点击增加可以反复增加新的条件上面给“userName”属性设置一个模糊查询的条件，看到“标签配置”了吗，很熟悉吧，其实这些配置和显示属性一样，实际上这些配置就是直接使用上节已经配置好的显示属性。我们再设性别的查询条件吧： 小技巧：如何产生in的查询提交？在数据库开发中，某些字段采用编码方式保存，编码通常是一组固定的数据，在查询的时候可能希望产生in (1, 2)这样的条件，但是在页面中如何构造了？EOS提供了一个简单的方案：查询条件操作符选择“in”使用业务字典的d:checkbox标签，将submitMethod属性设置为：special方式。通过上面的条件就可以实现in的查询操作了。点击“下一步”进入查询结果集的设置点击“下一步”进入录入“OOperator”表单的配置点击“下一步”进入选择目录，通过向导生成代码的最后一环了。给逻辑流、页面流选择一个文件生成目录“com.primeton.eos”，web资源的保存目录可以直接输入“operator”（向导生成过程中会自动创建不存在的目录）。最后点击“完成”，生成了所有的程序代码，产生的代码文件如下：文件名类型目录说明OOperatorQuery.jspJsp页面页面资源/operator查询条件与查询结果页面OOperatorInput.jspJsp页面页面资源/operator数据录入页面OOperatorMaintain.flowx页面流com.primeton.eos.OOperatorMaintain.flowx维护功能的页面流，描述了查询页面和录入页面之间关系addOOx逻辑流com.primeton.eos.ooperatorbiz.addOOx增加操作员业务逻辑deleteOOx逻辑流com.primeton.eos.ooperatorbiz.deleteOOx删除操作有逻辑getOOx逻辑流com.primeton.eos.ooperatorbiz.getOOx根据编号获得操作员逻辑queryOOx逻辑流com.primeton.eos.ooperatorbiz.queryOOx带分页的查询逻辑updateOOx逻辑流com.primeton.eos.ooperatorbiz.updateOOx更新操作员信息的逻辑文件对应的资源树如下：完成功能向导操作后，执行刚才生成的代码：首先启动server：启动成功后，然后通过下面的方式获得访问URL：打开一个浏览器输入复制的URL请求：:8080/eos-default/com.primeton.eos.OOperatorMaintain.flow如果你看到了下面的界面，那么恭喜你完成了上面的所有功能。2.6. EOS数据库维护功能开发诀窍 EOS快速开发：“表维护功能很简单，三步即可成完成，先建数据模型，关键设置显示属性，向导功能来驱动，代码自然就完成。”3. 实现关联表操作在业务系统中通常业务实体之间会建立关联关系，而且希望在页面中能够体现这些关联关系，通常关联关系体现在关联实体的选择录入以及在页面中可以显示关联实体的信息。因此本章节会介绍如何实现关联表在页面中录入以及如何显示关联实体属性。3.1. 数据准备我们给对快速开发章节中案例的“操作员”对象增加一个关联，我们给操作员表中增加“orgId”字段，然后将这个字段关联到一个机构表上。因此我们将建立一个这样的关系模型：对应的数据库表的脚本： 同样可以参照2.2. 数据准备中小技巧实现数据库表创建。3.2. 创建数据模型我们重新打开第2章创建好的数据集“data”。然后参照上一章的2.2. 创建数据模型的操作，将“数据库资源管理器”中的“O_ORG”表拖拽到数据中，系统将自动的创建出下面的模型：然后我们在data数据集的空白处点击右键选择“重新加载”我们就会创建出OOperator与OOrg实体之间的关联关系。双击关联关系连线就可以设置关联关系属性： 小技巧：建立实体之间的关联关系后可以配置“是否加载关联实体”，如果配置了“true”，那么从数据库中查找OOperator实体的时候，会采用jion方式自动将OOrg实体查询出来，这样对于一些关联关系的数据库操作中只用配置就可以解决开发的问题。& 注意：因为EOS的数据服务引擎会自动产生关联查询操作，如果关联关系的两张表的数据量都超过百万级以上的数据，不建议采用自动加载关联实体的方式。如果“1”端的数据在十万级以内的数据量，这种操作对系统性能影响会非常小。& 注意：目前join方式是依赖在studio中配置n端的外键字段是否“必填”来控制的：外键字段必填：产生inner 内连接查询外键字段不是必填：产生 outer 外连接查询3.3. 产生录入关联数据的界面我们在录入操作员所在的机构的时候，不可能让用户自己直接填写机构编号，没有人能够记住公司的机构编号是多少，通常会提供一个录入界面选择一个机构来录入。那我们怎么做这个界面了？答案就是一个：还是向导。下面我就介绍如何通过“Lookup对话框向导”产生录入机构编号的操作。首先选择数据实体，并且选择在页面中用那个属性的值来显示，对于机构来说当然是“orgName”的值在页面中显示出来。然后设置选择机构的时候可以进行过滤的查询条件，在这儿我们设置了orgName（机构名称）可以通过模糊查询，也可以通过orgCode（机构代码）直接查询然后配置一个数据显示列表（viewList）方式来选择一个机构来填入，在这儿我们什么都不用设置，系统已经默认填好了。发现没有和上一次不一样了进入最后一环，选择生成的程序的所在目录：3.4. 使用Lookup实现关联表操作上面又生成了一些程序了，还没有看到对OOperator的功能的操作，我们怎么去结合Lookup来完成真正的业务操作了？ 用Lookup来实现录入界面输入机构我们打开第2章产生的录入OOperator的界面程序“OOperatorInput.jsp”，找到录入“备注”部分进行代码调整：下面是原始代码：。 备注。将上面的代码改成下面的内容所在机构 备注上面是增加了一个很重要的Tag，就是：其中lookupUrl就是上一节中向导产生的页面流。我们通过:8080/eos-default/com.primeton.eos.OOperatorMaintain.flow进入查询界面，选择一个操作员然后选择“修改”按钮操作，就出现了下面界面，可以通过“所在机构”的录入框左边按钮，就会弹出一个选择机构的窗口了。 EOS原理：关联实体属性通过上面的操作，我们就可以录入了操作员的所在机构信息，而且是在没有修改任何逻辑代码的情况，只调整了JSP页面就达到了这个效果。我们就要看一下我们对关联实体属性，我们打开data数据集，在属性列表中增加一个oOrg属性：因此，如果定义了一个变量ooperator（类型是OOperator实体），那么我们可以通过Xpath方式访问当前变量中的属性。例如：oopeartor/userName 访问ooperator变量的实体中的“姓名”属性值ooperator/oOrg/orgId 我们就可以访问到变量ooperator的子实体属性oOrg的orgId属性值。 小技巧：Xpath访问对象就像在java对象中使用“.”的方式访问对象一样。& 注意：在EOS的实体定义中，如果使用了关联实体的方式的时候，主实体的外键属性是不存在，且不可访问。例如上面的例子：ooperator/orgId 这个属性是不存在的，必须通过ooperator/oOrg/orgId才能访问操作员所在的机构的编号。这个方式和我们的常用的数据库的访问方式完全不同，这是因为我们建立的业务域对象模型，在OOperator这个对象中只有OOrg这个对象，orgId这个属性必须依赖一个OOrg对象才能够存在。 EOS原理：页面流的参数提交通过上面的操作，我们在页面中通过xpath方式就可以将数据提交到实体对象中，这个是如何实现的了？我们打开操作员维护的页面流，打开“OOperatorInput.jsp”图元，我们看到了在这块可以输入“输出参数”，在这块我们就可以定义“OOperatorInput.jsp”通过HTTP可以提交的参数。我们看到上图中有一个名称为“ooperator”，类型是“OOperator”实体的参数。这样通过HTTP提交的所有 oopeartor/ 开头的参数和OOperator实体中的定义想匹配的。& 注意：在页面流中没有定义的任何参数是不允许提交到页面流引擎中。页面流中可以接受浏览器提交的参数可以在下面三个地方配置：1、 页面流定义中的变量定义（就是页面流数据，可以参考页面流开发指南）这个参数定义对当前页面流任何请求都有效2、 页面视图的“输出参数”。这儿定义的参数对当前页面视图的所有action操作有效3、 页面视图连出的“action”连线上。这儿定义参数只对当前action有效3.4.2 在结果集中显示关联实体的属性我们前面已经实现了关联实体的录入，到底数据是否提交到系统中了，我们需要在页面中显示关联实体的属性信息。打开“OOperatorQuery.jsp”文件，我们对结果列表中增加一列显示机构名称，下面是对文件的修改：我们先增加一个表头，修改内容如下：。姓名。 修改后结果： 姓名机构然后在迭代循环中输出机构名称，修改内容如下：。 修改后： 我们再看一下查询结果集页面，我们就能够看到了前面录入的机构名了。为什么不修改查询就达到这个效果了？因为在可以看到本章的“创建数据模型”配置了“加载关联实体”这个参数，这样我们不用修改查询就可以显示关联实体的属性。4. 实现从表操作前面完成一个简单的关联表的操作，这个关联操作实现了业务对象从属于其他对象的处理，但是业务中还有一种关联操作，就是业务实体包含了子业务实体，例如：学校有班级。我们把这种关系称为聚合关系，更加通俗一些就是主从表关系，因此这个章节我们专门介绍如何用构件写主从表操作。4.1. 页面效果因为要实现从表的数据录入，通常我们在录入主表的表单同时，可以在一个表格中直接对从表进行数据操作。具体效果如下：4.2. 数据准备在前面例子中我们已经有了OOperator操作员实体对象，我们给OOperator创建一个子实体：OContact（联系人）。创建联系人的脚步： 4.3. 创建数据模型我们重新打开前面创建好的数据集“data”。然后参照上一章的创建数据模型的操作，将“数据库资源管理器”中的“O_CONTACTS”表拖拽到数据中，系统将自动的创建出下面的模型：我们看到上面的模型和OOperator n-1 OOrg一样，联系人中有一个操作员的实体，但是我们会发现业务上一个联系人从属于一个操作员，联系人是需要依托一个操作员才能存在，因此我们需要将这个 OContacts n-1 OOperator的关联模型改成 OOperator 1-n OContacts的聚合模型。然后我们就会发现在OOperator实体中有一个oContacts对象，而且这个对象是数组类型的。 EOS原理：1-n关联关系通过上面的操作，我们可以建立了一个业务建模，操作员有多个联系人属性，而在数据库的表达方式中只能够是联系人通过外键关联操作员。因此EOS提供的数据定义并不是数据库ER模型的设计器，而是建立业务模型的设计器。& 注意：在定义1-n的关联关系的时候，关联关系中的“是否加载关联实体”的属性需要设置为“false”，因为1-n关系中n端的数据量是未知的，如果选择了true，每次做1端数据查询的时候都会自动加载n端的数据使得查询性能缓慢4.4. 使用Datacell实现从表数据录入前面已经建立了1-n的关联关系，如何在界面中体现了，通常对于主从表来说，我们会通过一个表单录入主表记录，用一个表格录入从表的信息，因此我们将采用EOS Richweb中的一个重要控件Datacell来完成主从表的录入。4.3.1 首先修改JSP录入界面我们先打开前面已经提到的OOperatorInput.jsp文件，我们拖拽一个EOS 的Ajax控件Datacell来实现OContacts（联系人）的录入。打开OOperatorInput.jsp文件找到：“ ”代码位置，然后从面板中拖一个Datacell控件到这行代码开头。参照下面图设置Datcell控件的属性： Datacell的属性设置：在xpath中都填入：ooperator/oContacts，并且在“列设置”中删除contactId和operatorId两个字段。工具条位置“top”，包含工具可以通过“浏览”按钮只选择“编辑”中的“添加”和“删除”点击“完成”保存Datacell的配置，然后再修改OOperatorInput.jsp文件：在“ ”前面增加一段js代码，代码如下：function submitDatacell(frm) if (checkForm(frm) var dcell = $id(cell1);dcell.submitAllByHidden();return true;return false;然后将当前表单的提交函数改成上面的submitDatacell方法。 改成 小技巧：datacell提交数据的方式Datacell是一个Ajax控件，它可以直接通过ajax方式和服务端进行调用，但是它也可以像HTML中的form的方式提交数据。例如上面的例子：submitAllByHidden()这个函数就可以将当前datacell中的数据以一个对象数组方式提交到服务端。还有其他更有意思的功能，请参考Richweb的参考手册中慢慢研究吧。4.3.2 修改逻辑程序做了这么多的开发，还没有涉及到如何修业务逻辑程序，我们来看看为了实现主从表的开发，我们需要什么要的逻辑，而构件化的代码开发是怎么的了？首先修改“addOOperator”增加操作员的逻辑，我们打开“com.priemton.eos”构件包的“构件”的“com.primeton.eos”下的“ooperatorbiz”的“addOOx”：我们打开“构件库”，通过工具条上的左边按钮：， 打开“自定义库”，拖拽一个“insertEntityCascade-级联方式插入一条记录”逻辑到编辑器中，然后将原来连接到“insertEntity”的连线连到“insertEntityCascade”操作上，保存得到下面结果： 小技巧：巧用“自定义”构件库EOS应用编程模型中强调的是通过“流程+数据+人机交互”来实现应用。通过流程方式绘制逻辑的时候需要拖入更小粒度的运算操作，通常运算操作都是在“构件库”的“项目引用库”中。在实际的编程中需要定义逻辑的参数和局部变量，为了简化开发，在“自定义”库中我们将SDO对应的基础操作，或者是java的（String、BigDecimal等）对象的jdk库中的基本操作直接显示出来。这儿绝大多数的开发只需要从“自定义”库中找运算操作就可以。小提示：你打开deleteOOperator那个逻辑流，你将那个数组变量拖到编辑器中看有什么出现了。对于其他的逻辑我们参照“addOOperator”的方法来修改。“deleteOOperator”删除操作员操作我们不用修改了，它的操作已经用了cascade模式了“updateOOperator”我们将“updateEntity”运算操作改成“updateEntityCascade”。对于“getOOperator”操作，我们将增加一个“expandRelation”（这个方法在自定义库中）：设置这个参数的方法，在参数“property”的值设置为“oContacts”，这样就可以将ooperator对象的oContacts从数据库中加载。 小技巧：cascade级联操作应用中通常需要更新主从表的数据，因此EOS的基础构件库中提供了一组对单实体进行级联操作的方法：insertEntityCascade、updateEntityCascade、deleteEntityCascade。这组方法能够实现对1-n的关联关系的基本数据库操作（只能处理一级级联），特别是update功能能够自动删除不在datacell中提交数据。& 注意：因为级联操作会对从表进行复杂数据处理，如果在业务上1-n的n端数据非常大的情况下，不建议使用级联操作。而且如果n端数据量很大的情况下也不建议建立1-n的聚合关系。我们通过:8080/eos-default/com.primeton.eos.OOperatorMaintain.flow进入查询界面，选择一个操作员然后选择“修改”按钮操作，就出现了下面界面，我们可以在下面的表格中直接录入“OContacts”联系人的信息了。4.5. EOS应用逻辑开发诀窍 EOS应用逻辑是一个标准MVC：逻辑流实现了业务逻辑（Model），页面流描述了页面之间流转关系（Control），JSP是界面的表现（View）。5. 还能再快吗？前面介绍了基于数据库基本模型的功能实现，我们要完成一组基本场景还是需要做很多操作的，而且每个操作还是比较麻烦的，特别是修改JSP页面的代码，我们还能更快的完成上面的功能吗？答案有一个，可以利用向导的功能来帮助你完成代码构造过程。5.1. 模型设置在第二章中我们已经设置实体属性的显示属性了，而且我们通过显示属性能够帮助我们完成基本代码的构造，那么对于关联属性来说我们怎么设置了？我们双击“oOrg”这个属性，发现和其他字段显示属性不一样，我们可以设置这个子实体每个属性的显示属性。 小技巧：n-1的关联实体的显示属性设置我们对实体进行基本操作的时候，可以通过配置关联实体的显示属性实现代码快速生成。例如：操作员信息处理的时候，我们可以通过lookup控件来实现对机构实体的处理。这儿配置了关联实体的主键设置：1、 lookupUrl属性：c