項(xiàng)目開發(fā)過程注意事項(xiàng)

1、項(xiàng)目開發(fā)流程及注意事項(xiàng)一、開發(fā)環(huán)境（1）開發(fā)工具：eclipse（2）數(shù)據(jù)庫：Oracle（3）導(dǎo)入代碼格式化模板 1. java代碼格式化模板導(dǎo)入java_formatter.xmlWindowPreferencesJavaCode StyleFormatterImport Profile2. javascript代碼格式化模板 導(dǎo)入javascript_formatter.xmlWindowPreferencesJavaScriptCode StyleFormatterImport Profile二、開發(fā)流程及注意事項(xiàng)（1）創(chuàng)建數(shù)據(jù)庫1.建立表空間create tablespace tab

2、lespace_nameloggingdatafile 'D:oracleAdministratororadataorcltablespace_name.dbf' size 200mautoextend onnext 10m maxsize unlimitedextent management local;2.建立數(shù)據(jù)庫用戶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.創(chuàng)建項(xiàng)目開發(fā)所需表 create table table_name( column_name data_type)創(chuàng)建表也可以使用PL/SQL Developer 工具通過圖形界面來創(chuàng)建表.(2)后臺代碼編寫（SpringMVC+Mybatis）1.通過配置文件自動生成domain dao 和數(shù)據(jù)庫映射文件配置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">數(shù)據(jù)庫連接需要的jar包<generatorConfiguration&g

5、t;<!- 數(shù)據(jù)庫連接開發(fā)包位置 -><classPathEntry location="D:programmarsWebContentWEB-INFlibojdbc6.jar" /><context id="oracle" targetRuntime="MyBatis3"><plugin type=""></plugin><commentGenerator><!- 去除自動生成的注釋 -><property name=&qu

6、ot;suppressAllComments" value="true" />jdbc配置參數(shù)</commentGenerator><!- 數(shù)據(jù)庫連接 -><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>目標(biāo)項(xiàng)目路徑數(shù)據(jù)庫映射文件生成位置路徑<!- 數(shù)據(jù)庫映射文件生成位置 -><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>首字母大寫數(shù)據(jù)庫表配置 <!- 數(shù)據(jù)庫表 -><table schema="" tableName="TBL_PRACTICE" domainObjectName="

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

12、gt;運(yùn)行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中的接口實(shí)現(xiàn)類即可自動被mybatis注冊自動生成數(shù)據(jù)庫映射文件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);./根據(jù)項(xiàng)目需求自行添加方法service接口實(shí)現(xiàn)類繼承Base中聲明的日志根據(jù)Spring的注解機(jī)制表明這是一個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")繼承系統(tǒng)提供controller基類public class practiceController extends BaseController Resource訪問該方法的請求映射路徑 private final IPracticeService practiceService = null;表示返回值將自動轉(zhuǎn)為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); 表示此參數(shù)可由前臺json自動轉(zhuǎn)換成本參數(shù)對象 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 :列表查詢，參數(shù)：查詢條件，page對象sav

25、e :添加保存，參數(shù)：新增的對象update:修改保存，參數(shù)：修改的對象delete:刪除， 參數(shù)：刪除的對象IDExt.application中name值(3)前臺代碼編寫（ExtJS4）1.model命名與java類命名規(guī)則一致首字母大寫說明該類在model層下Ext.define('',本模型的字段，它是field數(shù)組extend:',fields:可以實(shí)現(xiàn)排序功能 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 注意命名及大小寫規(guī)范)2.storeExt.define('', 定義了代理方式ajax提交和json讀取數(shù)據(jù) extend : '', model : '');注意命名規(guī)范及大小寫特別是別名view添加頁面Ext.define('', 創(chuàng)建別名方便通過xtpe來創(chuàng)建該組件實(shí)例，便于在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 : '測試狀態(tài)', afterLabelTextTpl : '<font color=red>*</font>', allowBlank : false , xtype : 'datefield', name : 'testDate', fieldLabel : '測試時間', format : 'Y-

30、m-d', editable : false , buttons : text : '提交', formBind : true, /所有驗(yàn)證都通過后才可點(diǎn)擊 disabled : true, action : 'create' , text : '重置', handler : function() this.up('form').getForm().reset(); );編輯頁面Ext.define('', 別名命名規(guī)范 全部小寫 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 / 表單項(xiàng)只讀 , name : 'testUser', fieldLabel : '測試用戶', afterLabelTextTpl : '<font color=red>*</font>', allowBlank : false , name : 'testState', fieldLabel : '測試狀態(tài)', afterLabelTextTpl : '<font color=red>*</font>', all

33、owBlank : false , xtype : 'datefield', name : 'testDate', fieldLabel : '測試時間', format : 'Y-m-d', editable : false , buttons : text : '提交', formBind : true, /所有驗(yàn)證都通過后才可點(diǎn)擊 disabled : true, action : 'update' , text : '重置', handler : function() thi

34、s.up('form').getForm().reset(); );注意大小寫及命名規(guī)范展示頁面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 : '測試狀態(tài)' / 表單項(xiàng)非空 , xtype : 'container', layout : 'column', items : xtype : 'container', columnWidth : .4, layout : 'form', items : xtype : 'displayfield',

38、name : 'testDate', fieldLabel : '測試時間' / 表單項(xiàng)非空 注意大小寫和命名規(guī)范特別是別名的規(guī)范 ); 主頁面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'/ 標(biāo)識名稱 , text : '重置', handler : function() this.up('form').getForm().reset();/ 表單元素重置 , xtype : 'form', border : false,/ 去掉邊框 items : xtype : 'grid', / 指定一個grid子元素 itemId : 'practiceListGrid', / 在組件中設(shè)置 ite

42、mId selModel : selType : "checkboxmodel" , multiSelect : true,/ 可復(fù)選 loadMask : true,/ 可遮罩 columns : text : '測試名稱',/ 表頭該列的顯示名稱 dataIndex : 'testName',/ 指定Store的id字段來作為該列的value值 flex : 1 / 列寬 , text : '測試用戶',/ 表頭該列的顯示名稱 dataIndex : 'testUser',/ 指定Store的name字段來

43、作為該列的value值 flex : 1 / 列寬 , text : '測試狀態(tài)',/ 表頭該列的顯示名稱 dataIndex : 'testState',/ 指定Store的name字段來作為該列的value值 flex : 1 / 列寬 , text : '測試時間',/ 表頭該列的顯示名稱 dataIndex : 'testDate',/ 指定Store的name字段來作為該列的value值注意書寫準(zhǔn)確的數(shù)據(jù)來源路徑 flex : 1 / 列寬 , store : 'practice.PracticeStore

44、9;,/ 使用的數(shù)據(jù) dockedItems : xtype : 'pagingtoolbar',/ 分頁工具欄 store : 'practice.PracticeStore',/ 分頁使用的數(shù)據(jù) dock : 'bottom',/ 面板的?？课恢脼榈撞?displayInfo : true / 是否顯示信息 , tbar : xtype : 'button', itemId : 'add',/ 標(biāo)識名稱 text : '添加', iconCls : 'icon-add'/ 圖標(biāo)

45、, xtype : 'button', itemId : 'edit',/ 標(biāo)識名稱 text : '編輯', iconCls : 'icon-edit'/ 圖標(biāo) , xtype : 'button', itemId : 'delete',/ 標(biāo)識名稱 text : '刪除', iconCls : 'icon-delete'/ 圖標(biāo) , xtype : 'button', itemId : 'view',/ 標(biāo)識名稱 text : &#

46、39;查看', iconCls : 'icon-view'/ 圖標(biāo) );注意大小寫及命名規(guī)范準(zhǔn)確書寫stores models views的來源路徑controllerExt.define('', extend : '', stores : 'practice.PracticeStore', models : 'practice.PracticeModel', views : 'practice.PracticeList', 'practice.PracticeAdd',根據(jù)

47、視圖層別名中的按鈕ID找到按鈕執(zhí)行相對應(yīng)的操作 'practice.PracticeView','practice.PracticeEdit', init : function() this.control( 'practicelist buttonitemId=search' : / 列表的查詢按鈕事件視圖層的別名 click : this.searchPractice , 'practicelist buttonitemId=add' : / 列表頁面的按鈕的itemId為add的點(diǎn)擊事件 click : this.addPr

48、actice , 'practicelist buttonitemId=delete' : / 列表頁面的按鈕的itemId為add的點(diǎn)擊事件 click : this.deletePractice , 'practiceadd buttonaction=create ' : / 增加頁面的保存按鈕點(diǎn)擊事件 click : this.savePractice , 'practicelist buttonitemId=view' : / 列表的編輯按鈕事件 click : this.viewPractice , 'practicelist

49、buttonitemId=edit' : / 列表的編輯按鈕事件 click : this.editPractice , 'practiceedit buttonaction=update' : / 更新頁面的保存按鈕點(diǎn)擊事件 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 = / 查詢的參數(shù) testName : values.testName, testUser : values.testUser ; Ext.apply(, new_params);/ 傳遞參數(shù) store.load(); , addPractice

51、 : function(btn) Ext.create('', title : '增加測試', width : 650, height : 600, iconCls : '',視圖層的別名 layout : 'fit',/ 布局:自動填滿容器 items : xtype : 'practiceadd'/ 定義組件實(shí)例 ).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中所有表單域當(dāng)前值得 var myMask = new Ext.LoadMask(Ext.getBody(), msg : "請稍等，正在提交." ); myMask.show();/ 遮罩層顯示 E

53、xt.Ajax.request(/ ajax方式提交 url : 'practice/save',/ 向服務(wù)器發(fā)送請求時使用的URL method : 'post',/ 使用的HTTP請求方式 scope : this, jsonData : values,/ 數(shù)據(jù)為json格式 success : function(response, options) / 順利執(zhí)行完畢后進(jìn)入success方法 var result = Ext.decode(response.responseText);/ 解碼（解析）JSON字符串對象 if (myMask != undef

54、ined) myMask.hide();/ 遮罩層隱藏 if (result.success) / 接收后臺發(fā)送的result狀態(tài)。若result.success=true則成功，false則執(zhí)行框架級提示，此處不需處理 Ext.Msg.alert("提示", result.message, function() win.close();/ 彈出窗口關(guān)閉 store.load();/ 重新加載數(shù)據(jù)到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;/ 當(dāng)前被選擇的記錄的數(shù)組 if (grid.getSelectionModel().getSe