Dorado7项目开发实践

Dorado7 项目开发实践基础知识点：工程创建、主框架页面的创建、Ajax 交互处理、动态视图、产品表的增删改和查询、表单开发技巧、数据校验、数据状态、下拉框、数据数、主从表、虚拟属性和虚拟关系、布局管理器、视图模板向导。War 发布测试：在项目开发中，为了配合系统的调试所做的许多临时性的设定。1 Dorado 7.0 页面控件1.SplitPanel 页面分割布局 MainControl 主控件和 SideControl 控件( 容器型控件)。2.TabControl 实现多标签页的效果( 本身是一个多页标签的容器，为了实现多标签页的效果，需为其添加子控件,如 ControlTab ：面板标签页的一种，一种容器型控件，可以再内部添加其他 Dorado7 子控件对象，作为标签页的内容。IFrameTab:此控件允许 Tab 标签页直接将一个 URL 作为其内部的显示内容。caption：标题属性。path:该属性定义内部页面。设定 ControlTab 或 IFrameTab 标签页属性标签页比较常用的属性包括：caption 标题属性closeable 显示关闭按钮disabled 是否可用主控件 TabControl 基本属性：tabPlacment 控制标签页签的显示位置： top bottomtabMinWidth 控制标签页页头标题的最小宽度currentTab 当前默认的标签页(默认计数从 0 开始)showMenuButton 显示菜单按钮 (当页面上标签页比较多时，TabControl 控件会自动提供导航按钮)3.Menu 控件 实现菜单功能Menu 对象设置属性(id 属性值设为 menu1)。Menu 常用菜单栏控件对象：CheckableMenuItem 带有复选框的菜单栏MenuItem 普通的菜单栏Separator 菜单分割栏按钮菜单：由于 Menu 是不可见控件对象，需添加可见控件对象，使其关联 Menu。如：在 View 节点下添加一个 Button 控件 对象,并设定 Button 对象的 Caption 属性为“操作“和 Menu 属性为“menu1“，menu 属性可以通过下拉菜单选择刚才建立的 menu1 控件。菜单工具栏：ToolBarToolBar 工具栏是常用控件，可作为菜单或快捷按钮的容器使用，添加在 view 根节点下。在 ToolBar 中添加 ToolBarButton 控件，caption 属性为“操作“,menu 属性为“menu1“。可以通过对 ToolBar 添加一些控件或属性来改变菜单的显示风格，比如可以通过为 ToolBar添加 Fill 对象使菜单 按钮居右显示。右键菜单：Tree 中的右键菜单Panel 的右键菜单4.主框架页面开发：SplitPanel TabControl ToolBar Tree 实现。2 控件实例演示：1) AjaxAction 控件：1 静态参数传人方式在可见控件的 button 按钮上绑定 AjaxAction，静态赋值给 action1 的 parameter 属性，service 属性：simpleAjax#toUpperCase。绑定 action1 到 button 的 action 属性上。当首次使用时需要在返回的结果代码行打断点，在页面点击按钮去激活调用。如下的代码行：return “input:n“+str+“nn“+“output:n“+str.toUpperCase();后台的服务端代码：import org.springframework.stereotype.Component;import com.bstek.dorado.annotation.Expose;Componentpublic class SimpleAjax Exposepublic String toUpperCase(String str)return“input:n“+str+“nn“+“output:n“+str.toUpperCase();2 动态参数传人方式(使用 TextEditor) 设置 action2 的 service 属性： simpleAjax#toUpperCase，然后在 button 按钮的 OnClick 事件中：var value=this.get(“#editor1.value“); 获取某控件的值this.get(“#action2“).set(“parameter“,value).execute(function(result) 给获取到的控件对象 parameter 属性赋值，并执行回调函数dorado.MessageBox.alert(result););注：self 表示的是当前的控件对象，this 表示的是当前的视图文件。 设置 action3 的 service 属性： simpleAjax#multiPlay，然后在 button 按钮事件 Onclick 中编写如下代码：var action=this.get(“#action3“);dorado.MessageBmpt(“please two numbers here“,defaultText:“3,5“,callback:function(text)var nums=text.split(“,“);var parameter=num1：nums0,num2：nums1;action.set(“parameter“,parameter).execute(function(result)dorado.MessageBox.alert(nums0 + “ * “+nums1+“ = “ + result);););服务端代码：Exposepublic int multiPlay(int num1,int num2)return num1 * num2;2) 动态添加视图( 以按钮为例) ：在 Button 属性框的 listener 设置为:spring:dynaView1#onButton1OnInit,设置按钮的 id 为button1，然后在后台编写如下代码：package com.demo.example01;import org.springframework.stereotype.Component;import mon.event.DefaultClientEvent;import com.bstek.dorado.view.widget.base.Button;Componentpublic class DynaView1 public void onButton1OnInit(Button button)/动态设置空间的属性button.setCaption(“(动态视图测试 按钮)“ );button.setWidth(“300“);button.addClientEventListener(“onClick“, new DefaultClientEvent(“dorado.MessageBox.alert(You clicked+self.get(caption)“)；public void beforeButton2OnInit(Button button)/动态设置空间的属性button.setCaption(“(动态修改视图测试按钮)“);button.setWidth(“300“);button.addClientEventListener(“onClick“,new DefaultClientEvent(“dorado.MessageBox.alert(You clicked+self.get(caption)“);自定义的数据表的增删改查操作。 添加 dataset：Id: dsCustomerdataprovider: customerPR#getCustomerdatatype： Customerpagesize: 20 添加 Toolbar(底层添加子控件):Datapliot:设置 dataset: dsCustomeritemCodes: pages5 个 ToolBarButton:添加 onClick 事件：this.get(“#dsCustomer.data“).insert();this.get(“#dialogEdit“).show();修改onClick 事件：this.get(“#dialogEdit“).show();删除onClick事件：var entity=this.get(“#dsCustomer.data:#“);if(entity)dorado.MessageBox.confirm(“您确认要删除此条记录吗？“,function()entity.remove(););保存按钮：设置 action 属性：actionUpdatecaption 属性：保存查询按钮：caption 属性：查询View 节点下添加两个 TextEditor:如 editorUserName 和 editorUserPwd查询按钮 onClick 事件:var name=this.get(“#editorUsername.value“);var pwd=this.get(“#editorUserpwd.value“);/调用flushAsync()方法采取异步的方式var parameter=username:name,userpwd:pwd;this.get(“#dsUsers“).set(“parameter“,parameter).flushAsync(); 添加 AutoForm 控件：设置 dataset： dsCustomerautoCreateElements: true 添加 DataGrid 控件：设置 dataset： dsCustomer 添加 UpdateAction 控件：设置属性 id： actionUpdate(绑定于保存按钮)dataResolver: customerPR#saveAll添加子控件：UpdateItem:设置属性 dataset： dsCustomer 添加 Dialog 控件：Buttons 下添加两个 button确定按钮(单击事件)：var dialog=this.get(“#dialogEdit“);this.get(“#actionUpdate“).execute(function()dialog.hide();)取消按钮(单击事件):this.get(“#dsCustomer.data“).cancel();this.get(“#dialogEdit“).hide();Children 下添加一个 AutoForm(数据表格) 控件设置 dataset： dsCustomerautoCreateElements: true后台代码：Componentpublic class CustomerPR ResourceCustomerDao customerDao;DataProviderpublic void getCustomer(Page page) customerDao.find(page, “from Customer“);DataProviderpublic List getAllCustomer()return customerDao.find(“from Customer“);DataResolverTransactionalpublic void saveAll(List customer) customerDao.persistEntities(customer);Dataset的dataprovide属性DataProviderpublic Collection getAll()return customerDao.getAll();UpdateAction的dataresolver属性DataResolverTransactionalpublic void saveAll(Collection customer)customerDao.persistEntities(customer);模糊查询(组合条件)DataProviderpublic void getUserquery2(Page page,Map parameter)if (null!=parameter) String username=(String)parameter.get(“username“);String userpwd=(String)parameter.get(“userpwd“);String whereCase=“;if (null!=username) whereCase =“ name like %“+username+“%“;if (null!=userpwd) if (StringHelper.isNotEmpty(whereCase) whereCase+=“and pwd like %“+userpwd+“%“;String queryStr=(StringHelper.isEmpty(whereCase)?“:“ where “+whereCase;userDao.find(page, “from User“+queryStr);elseuserDao.find(page, “from User“);AutoForm 控件：读取数据一：Var value=this.get(“#autoFormElement1”).get(“value”); 读取数据二：Var entity=this.get(“#form1”).get(“entity”);Dorado.MessageBox.alert(entity.autoFormElement1);或者设定 AutoFormElement1 的 property 属性。Var entity=this.get(“#form1.entity”);Dorado.MessageBox.alert(p1);设置数据一：This.set(“#autoFormElement1.value”,”testValue”);设置数据二：添加 button，实现 onClick 事件:This.set(“#form1.entity”,Prop1: ” ”);查询功能:添加一个 AutoForm，设置其 id 属性：formCondition。AutoForm 下添加两个 AutoFormElement，分别设置其属性 name.第一个:productName第二个:unitsInStockVar entity=this.get(“#formCondition.entity”);Var dataset=this.get（“#dsProduct” ） ；Dataset.set(“parameter”,productName:ductName,unitsInStock:entity.unitsInStock);dataset.flushAsync();简化查询功能:Var entity=this.get(“#formCondition.entity”);this.get（“#dsProduct”