邱麗麗　陸　源

(中國電子科技集團(tuán)第二十八研究所　江蘇 南京 210007)

?

基于ExtJS和SSH2架構(gòu)的網(wǎng)上報銷系統(tǒng)設(shè)計與實現(xiàn)

邱麗麗陸源

(中國電子科技集團(tuán)第二十八研究所江蘇 南京 210007)

針對某企業(yè)需開發(fā)具有良好用戶體驗和可維護(hù)性的網(wǎng)上報銷系統(tǒng)的需求，闡述一個基于ExtJS和SSH2架構(gòu)的網(wǎng)上報銷系統(tǒng)的設(shè)計及實現(xiàn)。深入研究開發(fā)中使用的整合架構(gòu)和通信方式，分析設(shè)計網(wǎng)上報銷系統(tǒng)的界面功能和數(shù)據(jù)模型，并給出關(guān)鍵功能設(shè)計，最后給出系統(tǒng)實現(xiàn)。該系統(tǒng)的實際運行表明，這種整合架構(gòu)下的Web系統(tǒng)比傳統(tǒng)的Web應(yīng)用程序有更高的用戶體驗和可維護(hù)性。

網(wǎng)上報銷ExtJSSSH2RowEditor擴(kuò)展

0　引　言

某大型國企，隨著企業(yè)生產(chǎn)規(guī)模的發(fā)展，目前的手工報銷模式存在業(yè)務(wù)效率低下、內(nèi)部資金無法進(jìn)行有效的控制和查詢困難等諸多問題[1]。希望借助Web技術(shù)進(jìn)行網(wǎng)上報銷，來達(dá)到提高處理效率，實現(xiàn)費用控制和方便查詢的目的。另外，需求調(diào)研時發(fā)現(xiàn)，該單位存在大量使用無盤上網(wǎng)和使用除IE外其他多種瀏覽器的情況，所以用戶希望開發(fā)的Web應(yīng)用對客戶端要求盡量低，并有較好的體驗。同時開發(fā)交付后，未來由該單位的信息部門自行維護(hù)升級，所以又希望有較好的維護(hù)性。Web應(yīng)用中基于B/S多層體系架構(gòu)以其客戶端和服務(wù)器端分離的優(yōu)點而受到廣泛的關(guān)注[2,3]。然而，傳統(tǒng)的B/S架構(gòu)沒有良好的軟件設(shè)計模式和開發(fā)框架，開發(fā)的JSP頁面中既包含表示層的數(shù)據(jù)又有實現(xiàn)業(yè)務(wù)邏輯的程序代碼，存在系統(tǒng)維護(hù)難度高、頁面交互性和表現(xiàn)能力差的不足。

本文針對該企業(yè)的實際需求，考慮到系統(tǒng)的擴(kuò)展性和可維護(hù)性，使用輕量級的SSH2架構(gòu)[4]對系統(tǒng)進(jìn)行分層構(gòu)建。對于客戶端界面表現(xiàn)力不足的問題，相比于普通的網(wǎng)頁開發(fā)語言，ExtJS有表現(xiàn)力強、低開發(fā)難度、跨瀏覽器運行和低通信量的優(yōu)點，所以本系統(tǒng)在客戶端引入ExtJS框架實現(xiàn)，闡述了一個基于ExtJS和SSH2架構(gòu)的網(wǎng)上報銷系統(tǒng)的設(shè)計及實現(xiàn)，研究了SSH2與ExtJS框架結(jié)合后的分層架構(gòu)和通信方式，并設(shè)計擴(kuò)展RowEditor控件，使得多個信息錄入grid只需編寫一個通用RowEditor控件，減少了代碼量。實際應(yīng)用表明，該設(shè)計比傳統(tǒng)的Web系統(tǒng)不僅提高了系統(tǒng)的開發(fā)效率，提供了更好的用戶體驗，而且邏輯清晰的架構(gòu)還使系統(tǒng)具有更好的維護(hù)性和擴(kuò)展性。

1　主要技術(shù)

1.1整合架構(gòu)

本系統(tǒng)的架構(gòu)以SSH2架構(gòu)為后臺，前臺使用ExtJS框架展示頁面。該架構(gòu)主要分為五層：視圖層、控制層、業(yè)務(wù)邏輯層、數(shù)據(jù)持久層和數(shù)據(jù)層[5]，見圖1所示。ExtJS框架實現(xiàn)視圖層，負(fù)責(zé)接收用戶請求，并向用戶展示結(jié)果頁面?？刂茖硬捎肧truts2框架的控制器，通過Structs-config.xml配置文件配置前臺與服務(wù)器交互的Action，控制用戶對服務(wù)器的請求操作，根據(jù)請求調(diào)用業(yè)務(wù)邏輯層的業(yè)務(wù)邏輯組件，并將執(zhí)行結(jié)果返回給視圖層。業(yè)務(wù)邏輯層管理具體的業(yè)務(wù)對象和業(yè)務(wù)操作，由Spring框架實現(xiàn)。Spring的容器除了統(tǒng)一管理業(yè)務(wù)邏輯外，還提供事務(wù)處理、緩沖池等容器組件來提高系統(tǒng)的性能，并確保數(shù)據(jù)的完整性。數(shù)據(jù)持久層由Hibernate實現(xiàn)，實現(xiàn)從對象到關(guān)系數(shù)據(jù)庫的映射，并將對數(shù)據(jù)庫的所有操作封裝在Dao接口里，達(dá)到向下屏蔽數(shù)據(jù)庫之間的差異，向上提供了數(shù)據(jù)庫訪問接口的目的。數(shù)據(jù)層主要是存儲系統(tǒng)中的數(shù)據(jù)信息的數(shù)據(jù)庫。分層結(jié)構(gòu)有效地降低了各層間的耦合性，將業(yè)務(wù)邏輯和數(shù)據(jù)庫操作封裝為接口，不僅規(guī)范了系統(tǒng)編程，還使得源代碼易于理解，從而有利于日后系統(tǒng)的維護(hù)與拓展。

圖1　網(wǎng)報整合架構(gòu)

1.2通信方式

前后臺的數(shù)據(jù)通信也是ExtJS與SSH2整合的一個關(guān)鍵問題，處于視圖層中的ExtJS框架，利用其自身的Ajax特性，可無需刷新瀏覽器界面，直接通過異步方式獲取服務(wù)器數(shù)據(jù)來處理用戶界面內(nèi)容，可達(dá)到提高數(shù)據(jù)傳輸速率，提高用戶體驗[6]的目的。ExtJS 的組件可支持 JSON 或者 XML 的格式進(jìn)行數(shù)據(jù)通信。早期的Ajax技術(shù)曾經(jīng)大量的使用XML響應(yīng)，但隨著JSON技術(shù)的廣泛應(yīng)用，JSON響應(yīng)的優(yōu)點逐漸凸顯，包括同樣的數(shù)據(jù)轉(zhuǎn)換JSON格式比轉(zhuǎn)換XML格式數(shù)據(jù)量??；在服務(wù)器端生成JSON格式的字符串比生成XML格式的字符串編程簡單等。所以本系統(tǒng)使用 JSON 作為系統(tǒng)數(shù)據(jù)傳輸格式。

使用JSON數(shù)據(jù)通信的過程是：ExtJs前臺將請求指向控制層獲取數(shù)據(jù)的Action方法中，系統(tǒng)運行時會自動將請求以異步方式發(fā)送到對應(yīng)的操作方法中，請求可根據(jù)需要帶上參數(shù)。而在后臺獲取前端的請求后，傳統(tǒng)的Struts用類DispatchAction處理請求，因為整合ExtJS后使用JSON傳輸數(shù)據(jù)給前臺，所以在Action的操作方法中調(diào)用業(yè)務(wù)邏輯處理類得到執(zhí)行結(jié)果對象后，改寫DispatchAction執(zhí)行請求結(jié)束之前的代碼，使它不再像傳統(tǒng)那樣轉(zhuǎn)到Struts中指定的結(jié)果頁面，而是將結(jié)果轉(zhuǎn)換為JSON格式。然后調(diào)用JSONObject的toString 方法，直接向HttpServletResponse里寫JSON格式內(nèi)容，并帶上成功或失敗標(biāo)識，前臺就可以根據(jù)返回的標(biāo)志，判斷請求是否成功，并進(jìn)行相應(yīng)的回調(diào)函數(shù)操作。

前臺利用Ext.Ajax.request，請求的主要代碼如下：

Ext.Ajax.request({

url: "…XXXServlet",

//服務(wù)器相應(yīng)操作的地址

params: {

//json對象 },

method: "post",

//請求時使用的默認(rèn)的http方法

success: function() {

//請求成功后的回調(diào)函數(shù)},

failure: function() {

//請求失敗后的回調(diào)函數(shù) }});

2　系統(tǒng)分析與設(shè)計

2.1界面功能設(shè)計

整個網(wǎng)上報銷管理系統(tǒng)包含借款、報銷和還款業(yè)務(wù)，通常又因差旅、會務(wù)、出國等事由借款或報銷，設(shè)計區(qū)分差旅、會務(wù)、出國、一般等四種事由，根據(jù)業(yè)務(wù)部門的工作和會計的管理設(shè)計總體界面模塊如圖2所示。主要分為兩大模塊，部門申請和會計集中辦理，其中業(yè)務(wù)經(jīng)辦人是指指具體需要借款、報銷和還款的人員因為還款一般是業(yè)務(wù)經(jīng)辦人直接至財務(wù)進(jìn)行還款辦理，不存在申請的信息，故還款辦理功能設(shè)計為會計直接辦理。

其中部門申請模塊包括借款申請、報銷申請和借款報銷情況查看三部分，主要供使用部門完成借款或報銷信息的申請錄入功能。在進(jìn)行差旅報銷信息錄入時，可同時錄入城際交通票據(jù)信息，作為會計計算補助的參考，實時查看業(yè)務(wù)經(jīng)辦人的借款或報銷情況的功能可作為業(yè)務(wù)部門錄入申請時的參考。當(dāng)申請完成保存提交后，會計即可在會計集中辦理頁面進(jìn)行辦理。

會計集中辦理模塊包括借款辦理、還款辦理和報銷辦理等三個模塊。借款和報銷根據(jù)業(yè)務(wù)部門錄入提交的數(shù)據(jù)逐條進(jìn)行辦理，借款辦理時，可先查看業(yè)務(wù)經(jīng)辦人借款情況，再根據(jù)借款申請信息進(jìn)行借款辦理。報銷辦理稍微復(fù)雜，含檢查票據(jù)和計算補助，核銷借款等操作。還款辦理因為不需業(yè)務(wù)經(jīng)辦人提供申請數(shù)據(jù)，是會計的直接錄入辦理信息操作。另外提供對借款情況、報銷情況和還款情況的綜合查詢功能。

圖2　網(wǎng)報功能總體設(shè)計

2.2數(shù)據(jù)模型分析與設(shè)計

根據(jù)企業(yè)借款、核銷、還款的靈活性。一次借多次報銷核銷和還款，多次借一次報銷核銷或還清。前賬不清，后賬不借的控制，及系統(tǒng)應(yīng)清晰展現(xiàn)借款情況的需求。核心是設(shè)計借款、報銷結(jié)算、還款、核銷記錄四張表，將會務(wù)、出國等相關(guān)事務(wù)表另行設(shè)計，并建立關(guān)聯(lián)。同時為適應(yīng)外幣借款，借款、還款、核銷記錄表應(yīng)同時記錄原幣、本幣計量以及業(yè)務(wù)發(fā)生時的“系統(tǒng)”當(dāng)時匯率。系統(tǒng)應(yīng)建立統(tǒng)一可維護(hù)的匯率。另外，為減低復(fù)雜，報銷結(jié)算，只計人民幣(即系統(tǒng)本幣類型)結(jié)算。設(shè)計的主要數(shù)據(jù)概念模型如圖3所示。

圖3　網(wǎng)報主要概念模型設(shè)計

其中借款表中記錄借款數(shù)據(jù)，在核銷時更新借款表中的核銷數(shù)據(jù)，當(dāng)全部核銷完時，在借款表中記錄核清日期。報銷表中記錄報銷數(shù)據(jù)，在核銷時，記錄核銷的合計本幣記量數(shù)據(jù)，另外記錄報銷時還款的外幣數(shù)量和外幣匯率。還款表中記錄還款數(shù)據(jù)，分為直接還款數(shù)據(jù)和核銷還款數(shù)據(jù)，核銷還款數(shù)據(jù)來自報銷時的還款本幣計量數(shù)據(jù)，直接還款數(shù)據(jù)來自于還款系統(tǒng)。核銷表中數(shù)據(jù)記錄對借款的核銷信息，按借款的幣種記錄原幣和本幣計量，數(shù)據(jù)來源于還款系統(tǒng)或報銷系統(tǒng)，報銷時的核銷數(shù)據(jù)只記錄報銷的核銷總額數(shù)據(jù)和借款數(shù)據(jù)的關(guān)系，對于報銷的還款數(shù)據(jù)，不需記錄核銷信息。

3　關(guān)鍵功能設(shè)計

3.1使用過濾器進(jìn)行統(tǒng)一管理

在網(wǎng)報系統(tǒng)中，若登錄用戶的已借款數(shù)額巨大，已經(jīng)超出了控制范圍，又未還清，系統(tǒng)應(yīng)預(yù)先處理，不允許其跳轉(zhuǎn)到借款頁面。此外，還有一些對用戶請求的預(yù)處理，比如網(wǎng)頁權(quán)限和數(shù)據(jù)權(quán)限控制、訪問網(wǎng)頁時常會遇到Session超時錯誤等，都需要在頁面中加入判斷，然而當(dāng)系統(tǒng)頁面比較多的時候，每個頁面都這樣加將會很費事，且將來的維護(hù)工作量也是很大，靈活性很差。本文通過Filter過濾器[9]來解決這個問題，它主要用于對用戶請求的預(yù)處理，在客戶端的HttpServletRequest到達(dá)Servlet之前，攔截HttpServletRequest進(jìn)行操作。

對于角色和數(shù)據(jù)權(quán)限控制，本系統(tǒng)定義角色應(yīng)用Action表和角色數(shù)據(jù)權(quán)限表，將用戶配置為對應(yīng)的應(yīng)用角色和數(shù)據(jù)查看角色。用戶登錄系統(tǒng)后，在過濾器中系統(tǒng)根據(jù)用戶的ID從數(shù)據(jù)庫中查找到對應(yīng)的角色權(quán)限Action和數(shù)據(jù)查看權(quán)限參數(shù)，然后再傳遞至后臺執(zhí)行對應(yīng)的操作?？蛻舳送ɡ肍ilter接口和doFilter方法實現(xiàn)系統(tǒng)統(tǒng)一管理的主要代碼如下：

public class FilterWB implements Filter{

//實現(xiàn)Filter接口

//實現(xiàn)其doFilter方法來攔截請求

public void doFilter(ServletRequest sreq, ServletResponse response, FilterChain filterChain)

throws IOException, ServletException {

HttpServletRequest request=(HttpServletRequest)sreq;

HttpSession session = request.getSession(false);

if(session == null) {

//如果是session超時，在此處做處理

}

var user= request.getSession.getAttribute("loginuser");

{

//在此對登錄用戶查找對應(yīng)的應(yīng)用權(quán)限Action和數(shù)據(jù)查看

//權(quán)限參數(shù)，若有借款，同時進(jìn)行借款額的判斷處理操作

}

//錯誤頁面

request.getRequestDispatcher("/Error.jsp").

forward(request,response);

}

3.2RowEditor編輯控件的擴(kuò)展

根據(jù)上一節(jié)的分析，本系統(tǒng)存在差旅、會務(wù)、出國、一般等四種事由的借款和報銷信息錄入，需要設(shè)計實現(xiàn)8個錄入界面。本系統(tǒng)引入RowEditor編輯控件，利用RowEditor控件特性，用戶可直接在grid上添加業(yè)務(wù)信息，同時可通過雙擊對業(yè)務(wù)信息進(jìn)行修改等操作。通常情況下，需對每一類錄入信息根據(jù)不同的信息模型定制相應(yīng)的RowEditor編輯控件，使程序員編寫大量重復(fù)的代碼。

本文設(shè)計擴(kuò)展RowEditor控件，將使用控件的grid和提交編輯信息的后臺地址作為RowEditor控件的參數(shù)，RowEditor控件運行時將根據(jù)具體的參數(shù)執(zhí)行對應(yīng)的操作。這樣一來，只需編寫一個通用的帶參數(shù)的RowEditor控件，將該RowEditor控件作為8個業(yè)務(wù)信息錄入grid的插件，用戶錄入業(yè)務(wù)信息后，將根據(jù)不同的grid傳遞不同的參數(shù)，動態(tài)執(zhí)行數(shù)據(jù)操作，減少了代碼量。

實現(xiàn)代碼的主要流程是在RowEditor控件的編輯結(jié)束后的保存操作函數(shù)中，獲取對應(yīng)grid的業(yè)務(wù)信息參數(shù)和提交的地址參數(shù)，將業(yè)務(wù)信息參數(shù)傳遞給對應(yīng)提交地址的后臺操作保存，擴(kuò)展RowEditor控件的主要代碼如下：

extend_editor=function(config){

var defConf={

saveText:’Save’,

listeners:{

‘a(chǎn)fteredit’:function(){

var s=Ext.getcmp(config,gridid).

getSelectionModel().getSelections();

//獲取提交的數(shù)據(jù)json

var Params=Object.keys(s[0].json);

var tempArr={};

…//將json對象轉(zhuǎn)化為參數(shù)序列tempArr

Ext.Ajax.request({

url:config.url;

//數(shù)據(jù)提交的地址

params: tempArr

//數(shù)據(jù)參數(shù)

success:function(response){

…

//提交成功的操作}

…})

}}}};

在grid中實例化以上定義的RowEditor擴(kuò)展插件的主要代碼如下：

plugins;[new extend_editor({

“url”:”…”,”gridid”:”GridId”

})]

4　系統(tǒng)實現(xiàn)

4.1視圖層實現(xiàn)

新建部門借款申請、部門報銷申請和財務(wù)辦理JSP頁面，為了能使用ExtJS編碼開發(fā)，將ExtJS相關(guān)發(fā)布包：ext-all.css、ext-base.js和核心庫：ext-all.s引入系統(tǒng)。在ExtJS框架下，窗口、樹、表格和菜單都是可以直接復(fù)用的組件，在開發(fā)的時候，只需要直接使用這些組件，就可以創(chuàng)建出豐富多彩的應(yīng)用程序界面。本系統(tǒng)的客戶端界面中主要用到的是表格組件grid、record對象和存儲record對象的store組件，store獲取數(shù)據(jù)后，將它裝配至表格grid，就可以顯示數(shù)據(jù)了。另外，為了實現(xiàn)grid行的增刪改，需要引進(jìn)RowEditor.js文件，為了實現(xiàn)grid行的自動合計總數(shù)的功能，需要使用GroupSummary插件，所以本系統(tǒng)還必須引入如下文件。

報銷申請頁面的主要代碼如下：

//自動合計行插件

var summary = new Ext.ux.grid.GridSummary();

//主界面

var newpanel = new Ext.Panel({

…

//引入RowEditor和GroupSummary插件

plugins: [new extend_editor({ “url”:”…”,”gridid”:”GridId”

}),summary],

items:[ {

//填寫報銷信息的gridpanel

new Ext.grid.GridPanel({

id:'bx_info_grid'

title:'報銷信息填寫',

columns: [

editor:{…}

//報銷額的編輯控件

…

//增加合計行，對填寫的報銷額自動進(jìn)行合計

summaryRenderer:function(v,params,data){

return ‘

合計

’;}

…

}]});

4.2控制層實現(xiàn)

編寫控制層類JkAction.java、BxAction.java和HkAction.java。這些類用于接收頁面發(fā)過來的請求，處理請求中傳過來的數(shù)據(jù)，并且調(diào)用相應(yīng)的業(yè)務(wù)邏輯層類完成對實體類的增刪改查操作，最后將處理的結(jié)果返回給前端頁面。最后在struts.xml文件中配置action，實現(xiàn)ExtJS與服務(wù)器進(jìn)行數(shù)據(jù)交互的目的，并將action中result類型定義為JSON，使其返回給視圖層的是JSON格式的字符串。

4.3業(yè)務(wù)邏輯層

系統(tǒng)在實現(xiàn)業(yè)務(wù)邏輯是通過調(diào)用接口的方式，而非直接調(diào)用具體類，首先編寫業(yè)務(wù)邏輯接口，然后再編寫實體類來實現(xiàn)業(yè)務(wù)邏輯組件。本系統(tǒng)分為部門申請和會計集中辦理兩大模塊，兩大模塊下又分為多個小模塊，因業(yè)務(wù)邏輯層在各個模塊中實現(xiàn)的方法是一致的，所以在這里就只以實現(xiàn)借款為例來介紹。編寫業(yè)務(wù)邏輯層接口JkService.java，在其中定義對實體類Jk.java 的增刪改查4 種操作，然后編寫業(yè)務(wù)邏輯層實現(xiàn)類JkServiceImpl.java，在實現(xiàn)類中調(diào)用數(shù)據(jù)持久層類中的方法實現(xiàn)接口中定義的增刪改查4種操作。

4.4數(shù)據(jù)持久層

根據(jù)數(shù)據(jù)模型編寫相應(yīng)的實體類Jk.java、Bx.java和Hk.java 及實體類映射文件Jk.hbm.xml、Bx.hbm.xml和Hk. xml。具體的數(shù)據(jù)庫連接和釋放等操作交給Hibernate和數(shù)據(jù)庫連接池實現(xiàn)。對于具體的數(shù)據(jù)庫操作應(yīng)用類，首先創(chuàng)建抽象類EntityDao類，該類繼承了HibernateDaoSupport類，且只有一個SessionFactory參數(shù)。然后在config文件下創(chuàng)建hibernateDao.xml文件來管理dao的配置，并且注入SessionFactory。接下來編寫具體的數(shù)據(jù)庫操作實現(xiàn)類：JkDaoImpl、BxDaoImpl、HkDaoImpl和HxDaoImpl都繼承抽象類EntityDao。在實現(xiàn)類中實現(xiàn)對數(shù)據(jù)庫的具體操作。

5　結(jié)　語

在主流的B/S框架下，根據(jù)某企業(yè)的業(yè)務(wù)實際，采用基于ExtJs和SSH2架構(gòu)設(shè)計實現(xiàn)了企業(yè)內(nèi)部簡單高效的網(wǎng)上報銷系統(tǒng)，邏輯清晰的架構(gòu)具有較高的復(fù)用性與可維護(hù)性。同時，在視圖層引入ExtJs框架進(jìn)行開發(fā)，提高了用戶體驗。實踐證明，這種整合架構(gòu)下的Web系統(tǒng)比傳統(tǒng)的Web應(yīng)用程序有更高的用戶體驗和可維護(hù)性。同時，實際運行中業(yè)發(fā)現(xiàn)，ExtJs架構(gòu)下的客戶端存在響應(yīng)速度慢的不足，這是未來研究和優(yōu)化的方向。

[1] 梁文清，劉旭光．淺談網(wǎng)上報銷系統(tǒng)[J]．計算機與網(wǎng)絡(luò)：自然科學(xué)版，2011(12):47-49.

[2] 錢亦君. 網(wǎng)絡(luò)費用報銷管理系統(tǒng)的設(shè)計與實現(xiàn)[J]．信息技術(shù), 2013,4(5): 68-71.

[3] 陳維，尚玉廷. 網(wǎng)上報銷系統(tǒng)分析與設(shè)計[J]．電腦知識與技術(shù), 2013(26):5858-5861.

[4] 張建軍，劉虎. 基于ExtJS的J2EE輕量級框架的研究與應(yīng)用[J]．計算機應(yīng)用與軟件，2014,31(4)：73-76.

[5] 閆俊甫．基于ExtJS與J2EE架構(gòu)的辦公自動化管理系統(tǒng)的設(shè)計與實現(xiàn)[D]．云南大學(xué)，2012.

[6] 韓國敬．SSH2與ExtJS框架結(jié)合的應(yīng)用研究[D]．遼寧科技大學(xué)，2013.[7] 陳道鑫，宋紹云．ExtJS框架在Web軟件開發(fā)中的應(yīng)用[J]．電腦知識與技術(shù)，2011,7(9): 2044-2047.

[8] 唐永瑞，張達(dá)敏．基于Ajax與MVC模式的信息系統(tǒng)的研究與設(shè)計[J]．電子技術(shù)應(yīng)用，2014,40(2): 128-131.

[9] 賀春林，謝琪．基于協(xié)同過濾的個性化Web服務(wù)選擇方法[J]．計算機應(yīng)用，2013, 33(1): 239-242.

[10] 羅金濤．基于ExtJS的權(quán)限樹形菜單實現(xiàn)[J]．計算機安全技術(shù)，2013(16)：121-122.

DESIGN AND IMPLEMENTATION OF ONLINE REIMBURSEMENT SYSTEM BASED ON EXTJS AND SSH2

Qiu LiliLu Yuan

(28th Research Institute, China Electronics Technology Group Corporation, Nanjing 210007, Jiangsu, China)

Aiming at the demand of an enterprise to develop an online reimbursement system with good user experience and maintainability, the authors expound the development and implementation of an ExtJS and SSH2 architecture-based online reimbursement system. We intensively studied the integration architecture and communications means used in the development, analysed and designed the interface functions and data models of the system, and provided the design of key functions as well. Finally, we presented the system implementation. It is shown by practical application of this system that the Web system with such integrated architecture has better user experience and higher maintainability than traditional Web applications.

Online reimbursement systemExtJSSSH2RowEditor extension

2015-06-06。邱麗麗，工程師，主研領(lǐng)域：計算機應(yīng)用。陸源，工程師。

TP39

A

10.3969/j.issn.1000-386x.2016.09.018