项目开发过程注意事项

1、项目开发流程及注意事项一、开发环境（1）开发工具：eclipse（2）数据库：Oracle（3）导入代码格式化模板 1. java代码格式化模板导入java_formatter.xmlWindowPreferencesJavaCode StyleFormatterImport Profile2. javascript代码格式化模板 导入javascript_formatter.xmlWindowPreferencesJavaScriptCode StyleFormatterImport Profile二、开发流程及注意事项（1）创建数据库1.建立表空间create tablespace tab

2、lespace_nameloggingdatafile 'D:oracleAdministratororadataorcltablespace_name.dbf' size 200mautoextend onnext 10m maxsize unlimitedextent management local;2.建立数据库用户create user user_name identified by user_passworddefault tablespace tablespace_name;grant connect,resource to user_name; grant db

3、a to user_name;3.为用户分配表空间revoke unlimited tablespace from user_name;alter user user_name quota unlimited on tablespace_name;4.创建项目开发所需表 create table table_name( column_name data_type)创建表也可以使用PL/SQL Developer 工具通过图形界面来创建表.(2)后台代码编写（SpringMVC+Mybatis）1.通过配置文件自动生成domain dao 和数据库映射文件配置marssrcmarsGenerat

4、orConfig.xml文件<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE generatorConfiguration PUBLIC "-//DTD MyBatis Generator Configuration 1.0/EN" "/dtd/mybatis-generator-config_1_0.dtd">数据库连接需要的jar包<generatorConfiguration&g

5、t;<!- 数据库连接开发包位置 -><classPathEntry location="D:programmarsWebContentWEB-INFlibojdbc6.jar" /><context id="oracle" targetRuntime="MyBatis3"><plugin type=""></plugin><commentGenerator><!- 去除自动生成的注释 -><property name=&qu

6、ot;suppressAllComments" value="true" />jdbc配置参数</commentGenerator><!- 数据库连接 -><jdbcConnection driverClass="" connectionURL="jdbc:oracle:thin::1521:orcl"userId="mars" password="mars"></jdbcConnection><javaTy

7、peResolver><property name="forceBigDecimals" value="false" /></javaTypeResolver>domain生成位置路径<!- domain生成位置 -><javaModelGenerator targetPackage="" targetProject="."><property name="enableSubPackages" value="true"

8、; /><property name="trimStrings" value="true" /></javaModelGenerator>目标项目路径数据库映射文件生成位置路径<!- 数据库映射文件生成位置 -><sqlMapGenerator targetPackage="" targetProject="."><!- enableSubPackages:是否让schema作为包的后缀 ->   &

9、#160;<property name="enableSubPackages" value="true" /></sqlMapGenerator>dao生成位置路径<!- DAO生成位置 -><!- type: XMLMAPPER, ANNOTATEDMAPPER -><javaClientGenerator targetPackage="" type="XMLMAPPER" targetProject=".">方法的可见性<pr

10、operty name="enableSubPackages" value="true" /><property name="exampleMethodVisibility" value="private" /></javaClientGenerator>首字母大写数据库表配置 <!- 数据库表 -><table schema="" tableName="TBL_PRACTICE" domainObjectName="

11、Practice" alias="pra">事先创建一个序列<property name="useActualColumnNames" value="false" /><generatedKey column="ID" sqlStatement="SELECT S_TBL_PRACTICE.NEXTVAL AS ID FROM DUAL"/></table></context></generatorConfiguration&

12、gt;运行bulid-mybatis.xml文件<?xml version="1.0" encoding="UTF-8"?><project default="genfiles" basedir="."><property name="" value="$basedir" /><target name="genfiles" description="Generate the files">

13、<taskdef name="mbgenerator" classname="" classpath="mars-mybatis-generator-core-1.3.2.jar" /><mbgenerator overwrite="true" configfile="marsGeneratorConfig.xml" verbose="false"><propertyset><propertyref name=""

14、 /></propertyset></mbgenerator></target></project>自动生成domain文件 自动生成dao文件PracticeMapper extends IMapper DAO接口继承IMapper接口 DAO中的接口实现类即可自动被mybatis注册自动生成数据库映射文件serviceservice接口package ;public interface IPracticeService public int insert(Practice practice); public int update(Pra

15、ctice practice); public int delete(PracticeExample practiceExample); public List<Practice> select(PracticeExample practiceExample); public int count(PracticeExample practiceExample); public Practice selectByPrimaryKey(Long i);./根据项目需求自行添加方法service接口实现类继承Base中声明的日志根据Spring的注解机制表明这是一个servicepack

16、age ;Servicepublic class PracticeServiceImpl extends BaseService implements IPracticeService注明资源Resourceprivate PracticeMapper practiceMapper = null;Overridepublic int insert(Practice practice) return practiceMapper.insert(practice);Overridepublic int update(Practice practice) int result = practiceM

17、apper.updateByPrimaryKeySelective(practice);return result;Overridepublic int delete(PracticeExample practiceExample) int result = practiceMapper.deleteByExample(practiceExample);return result;Overridepublic List<Practice> select(PracticeExample PracticeExample) return practiceMapper.selectByEx

18、ample(PracticeExample);Overridepublic int count(PracticeExample PracticeExample) int result = practiceMapper.countByExample(PracticeExample);return result;Overridepublic Practice selectByPrimaryKey(Long id) return practiceMapper.selectByPrimaryKey(id);controller表明是springMVC的controller控制层package ;请求映

19、射的路径ControllerRequestMapping("/practice")继承系统提供controller基类public class practiceController extends BaseController Resource访问该方法的请求映射路径 private final IPracticeService practiceService = null;表示返回值将自动转为json格式 RequestMapping("/list") ResponseBody public Result list(String testName,St

20、ring testUser, Page page) PracticeExample practiceExample = new PracticeExample(); Criteria c = practiceExample.or(); if (testName != null) && !("".equals(testName) c.andTestNameLike(testName); if (testUser != null) && !("".equals(testUser) c.andTestUserLike(testU

21、ser); practiceExample.setOrderByClause("pra.id desc"); practiceExample.setPage(page);/ 将分页类set入查询条件类，若不set则无分页 List<Practice> list = practiceService.select(practiceExample); /(list.size(); return new ListResult<Practice>(page.getTotalRecord(), list); 表示此参数可由前台json自动转换成本参数对象 Req

22、uestMapping("/save") ResponseBody public Result save(RequestBody Practice practice) practice.setTestName(practice.getTestName(); practice.setTestUser(getCurrentUser().getName(); practice.setTestState(practice.getTestName(); practice.setTestDate(new Date(); practiceService.insert(practice);

23、 return new OperResult(true, "保存成功！"); RequestMapping("/update") ResponseBody public Result update(RequestBody Practice practice) if (practice.getId() != null) practiceService.update(practice); return new OperResult(true, "更新成功！"); RequestMapping("/delete") Re

24、sponseBody public Result delete(RequestBody List<Long> ids) throws MarsException PracticeExample practiceExample = new PracticeExample(); practiceExample.or().andIdIn(ids); practiceService.delete(practiceExample); return new OperResult(true, "删除成功！"); 方法介绍list :列表查询，参数：查询条件，page对象sav

25、e :添加保存，参数：新增的对象update:修改保存，参数：修改的对象delete:删除， 参数：删除的对象IDExt.application中name值(3)前台代码编写（ExtJS4）1.model命名与java类命名规则一致首字母大写说明该类在model层下Ext.define('',本模型的字段，它是field数组extend:',fields:可以实现排序功能 name : 'id', type : 'Long', sortable : true , name : 'testName', type : '

26、;string', sortable : true , name : 'testDate', type : 'Date', convert : function(value) var d = null; if (value != null) d = new Date(); d.setTime(value); return d; , name : 'testUser', type : 'String', sortable : true , name : 'testState', type : 'Str

27、ing', sortable : true 注意命名及大小写规范)2.storeExt.define('', 定义了代理方式ajax提交和json读取数据 extend : '', model : '');注意命名规范及大小写特别是别名view添加页面Ext.define('', 创建别名方便通过xtpe来创建该组件实例，便于在controller中使用 extend : '', alias : 'widget.practiceadd', buttonAlign : 'center&

28、#39;, frame : true, defaultType : 'textfield', items : name : 'testName', fieldLabel : '测试名称', afterLabelTextTpl : '<font color=red>*</font>', allowBlank : false , name : 'testUser', fieldLabel : '测试用户', afterLabelTextTpl : '<font co

29、lor=red>*</font>', allowBlank : false , name : 'testState', fieldLabel : '测试状态', afterLabelTextTpl : '<font color=red>*</font>', allowBlank : false , xtype : 'datefield', name : 'testDate', fieldLabel : '测试时间', format : 'Y-

30、m-d', editable : false , buttons : text : '提交', formBind : true, /所有验证都通过后才可点击 disabled : true, action : 'create' , text : '重置', handler : function() this.up('form').getForm().reset(); );编辑页面Ext.define('', 别名命名规范 全部小写 extend : 'Ext.panel.Panel', al

31、ias : 'widget.practiceedit', buttonAlign : 'center', frame : true, defaultType : 'textfield', items : xtype : 'hidden', name : 'id' , name : 'testName', fieldLabel : '测试名称', afterLabelTextTpl : '<font color=red>*</font>', al

32、lowBlank : false / 表单项只读 , name : 'testUser', fieldLabel : '测试用户', afterLabelTextTpl : '<font color=red>*</font>', allowBlank : false , name : 'testState', fieldLabel : '测试状态', afterLabelTextTpl : '<font color=red>*</font>', all

33、owBlank : false , xtype : 'datefield', name : 'testDate', fieldLabel : '测试时间', format : 'Y-m-d', editable : false , buttons : text : '提交', formBind : true, /所有验证都通过后才可点击 disabled : true, action : 'update' , text : '重置', handler : function() thi

34、s.up('form').getForm().reset(); );注意大小写及命名规范展示页面Ext.define('', extend : 'Ext.panel.Panel', alias : 'widget.practiceview', buttonAlign : 'center', frame : true, items : xtype : 'fieldset', title : '基本信息', items : xtype : 'hidden', name :

35、 'id' , xtype : 'container', layout : 'column', items : xtype : 'container', columnWidth : .4, layout : 'form', items : xtype : 'displayfield', name : 'testName', fieldLabel : '测试名称' , xtype : 'container', layout : 'column&#

36、39;, items : xtype : 'container', columnWidth : .4, layout : 'form', items : xtype : 'displayfield', name : 'testUser', fieldLabel : '测试用户' , xtype : 'container', layout : 'column', items : xtype : 'container', columnWidth : .4, layout

37、: 'form', items : xtype : 'displayfield', name : 'testState', fieldLabel : '测试状态' / 表单项非空 , xtype : 'container', layout : 'column', items : xtype : 'container', columnWidth : .4, layout : 'form', items : xtype : 'displayfield',

38、name : 'testDate', fieldLabel : '测试时间' / 表单项非空 注意大小写和命名规范特别是别名的规范 ); 主页面Ext.define('', extend : 'Ext.panel.Panel',/ Form布局，查询条件与列表纵向排列 alias : 'widget.practicelist',/ 别名 items : xtype : 'form',/ Form布局，组件纵向排列 border : false,/ 去掉边框 / title : '查询条件&#

39、39;, itemId : 'practiceListQuery',/ 组件ID items : xtype : 'container', layout : 'column',/ 列布局，横向排列 items : xtype : 'container', columnWidth : .3, layout : 'form', items : xtype : 'textfield',/ 文本框 fieldLabel : '测试名称', labelAlign : 'right

40、9;, labelWidth : 80, name : 'testName', maxWidth : 300 , xtype : 'container', columnWidth : .3, layout : 'form', items : xtype : 'textfield',/ 文本框 fieldLabel : '测试用户', labelAlign : 'right', labelWidth : 80, name : 'testUser', maxWidth : 300 , b

41、uttons : text : '查询', itemId : 'search'/ 标识名称 , text : '重置', handler : function() this.up('form').getForm().reset();/ 表单元素重置 , xtype : 'form', border : false,/ 去掉边框 items : xtype : 'grid', / 指定一个grid子元素 itemId : 'practiceListGrid', / 在组件中设置 ite

42、mId selModel : selType : "checkboxmodel" , multiSelect : true,/ 可复选 loadMask : true,/ 可遮罩 columns : text : '测试名称',/ 表头该列的显示名称 dataIndex : 'testName',/ 指定Store的id字段来作为该列的value值 flex : 1 / 列宽 , text : '测试用户',/ 表头该列的显示名称 dataIndex : 'testUser',/ 指定Store的name字段来

43、作为该列的value值 flex : 1 / 列宽 , text : '测试状态',/ 表头该列的显示名称 dataIndex : 'testState',/ 指定Store的name字段来作为该列的value值 flex : 1 / 列宽 , text : '测试时间',/ 表头该列的显示名称 dataIndex : 'testDate',/ 指定Store的name字段来作为该列的value值注意书写准确的数据来源路径 flex : 1 / 列宽 , store : 'practice.PracticeStore

44、9;,/ 使用的数据 dockedItems : xtype : 'pagingtoolbar',/ 分页工具栏 store : 'practice.PracticeStore',/ 分页使用的数据 dock : 'bottom',/ 面板的停靠位置为底部 displayInfo : true / 是否显示信息 , tbar : xtype : 'button', itemId : 'add',/ 标识名称 text : '添加', iconCls : 'icon-add'/ 图标

45、, xtype : 'button', itemId : 'edit',/ 标识名称 text : '编辑', iconCls : 'icon-edit'/ 图标 , xtype : 'button', itemId : 'delete',/ 标识名称 text : '删除', iconCls : 'icon-delete'/ 图标 , xtype : 'button', itemId : 'view',/ 标识名称 text : &#

46、39;查看', iconCls : 'icon-view'/ 图标 );注意大小写及命名规范准确书写stores models views的来源路径controllerExt.define('', extend : '', stores : 'practice.PracticeStore', models : 'practice.PracticeModel', views : 'practice.PracticeList', 'practice.PracticeAdd',根据

47、视图层别名中的按钮ID找到按钮执行相对应的操作 'practice.PracticeView','practice.PracticeEdit', init : function() this.control( 'practicelist buttonitemId=search' : / 列表的查询按钮事件视图层的别名 click : this.searchPractice , 'practicelist buttonitemId=add' : / 列表页面的按钮的itemId为add的点击事件 click : this.addPr

48、actice , 'practicelist buttonitemId=delete' : / 列表页面的按钮的itemId为add的点击事件 click : this.deletePractice , 'practiceadd buttonaction=create ' : / 增加页面的保存按钮点击事件 click : this.savePractice , 'practicelist buttonitemId=view' : / 列表的编辑按钮事件 click : this.viewPractice , 'practicelist

49、buttonitemId=edit' : / 列表的编辑按钮事件 click : this.editPractice , 'practiceedit buttonaction=update' : / 更新页面的保存按钮点击事件 click : this.updatePractice ); , searchPractice : function(btn) var store = this.getStore('practice.PracticeStore');/ 得到practice的store var practicelistQuery = btn.up(

50、'practicelist').query('#practiceListQuery')0;/ 检索组件 var form = practicelistQuery.getForm();/ 得到查询的form var values = form.getValues();/ 查询页面的所有值 var new_params = / 查询的参数 testName : values.testName, testUser : values.testUser ; Ext.apply(, new_params);/ 传递参数 store.load(); , addPractice

51、 : function(btn) Ext.create('', title : '增加测试', width : 650, height : 600, iconCls : '',视图层的别名 layout : 'fit',/ 布局:自动填满容器 items : xtype : 'practiceadd'/ 定义组件实例 ).show();/ 增加的弹出窗口显示 , savePractice : function(button) var store = this.getStore('practice.Pract

52、iceStore');/ 得到PracticeStore的store var win = button.up('window');/ 查找匹配简单选择器的window窗口 form = win.down('form');/ 容器的第一层子组件,得到页面的form var values = form.getValues();/ 获取form中所有表单域当前值得 var myMask = new Ext.LoadMask(Ext.getBody(), msg : "请稍等，正在提交." ); myMask.show();/ 遮罩层显示 E

53、xt.Ajax.request(/ ajax方式提交 url : 'practice/save',/ 向服务器发送请求时使用的URL method : 'post',/ 使用的HTTP请求方式 scope : this, jsonData : values,/ 数据为json格式 success : function(response, options) / 顺利执行完毕后进入success方法 var result = Ext.decode(response.responseText);/ 解码（解析）JSON字符串对象 if (myMask != undef

54、ined) myMask.hide();/ 遮罩层隐藏 if (result.success) / 接收后台发送的result状态。若result.success=true则成功，false则执行框架级提示，此处不需处理 Ext.Msg.alert("提示", result.message, function() win.close();/ 弹出窗口关闭 store.load();/ 重新加载数据到Store中 ); else Ext.Msg.alert("提示", result.message); ); , editPractice : function(btn) var store = this.getStore('practice.PracticeStore');/ 得到user的store var grid = ;/ 得到grid var data = grid.getSelectionModel().getSelection()0;/ 当前被选择的记录的数组 if (grid.getSelectionModel().getSe