基于AJAX的設(shè)備在線報修系統(tǒng)的設(shè)計與實現(xiàn)

王朋 劉衛(wèi)星 趙勇軍

摘 要：本文首先對系統(tǒng)開發(fā)所需要的技術(shù)進行詳細(xì)的講解。然后對故障報修系統(tǒng)進行了全面的角色和功能的建模，闡述了系統(tǒng)的總體功能設(shè)計，對各個功能模塊進行了實現(xiàn)。本系統(tǒng)性能和功能都達(dá)到了設(shè)計的要求，有效地滿足了用戶的需求，整體性能良好。

關(guān)鍵詞：Ajax；故障報修；異步交互

中圖分類號：TP391 文獻標(biāo)識號：A 文章編號：2095-2163（2015-）02-

Design and Implementation of Online Repair System based on Ajax

WANG Peng， LIU Weixing， ZHAO Yongjun

（Network Management Center， Aba Teachers College， Wenchuan Sichuan 623002，China）

Abstract：This paper firstly analyzes the system development technology in detail， then aimed at the role and function of the fault repair system， completes the comprehensive modeling. Based on the aboved， the paper expounds the overall function of the fault repair system， and realizes each function module of this system. The system has a good performance， therefore meets the design requirement， and effectively satisfies the users.

Key Words： Ajax； Fault Repair； Asynchronous Interaction

中圖分類號：TP311 文獻標(biāo)識碼：A

0 引 言

隨著互聯(lián)網(wǎng)的不斷發(fā)展與逐漸成熟，企事業(yè)單位中的設(shè)備越來越多，遇到的問題也就日趨客觀，從目前來看有以下幾種處理方式：第一是親自到維修中心去報修。這種情況浪費了員工的大量時間，并要填寫故障的單子。此外，還需聘請專門的人員進行報修單的處理，這種模式增加了企業(yè)人力和物力的支出，而且效率也很低。第二種情況是電話報修。但這種方式缺乏維護人員和客戶之間的有效溝通，維修工程師難以把握故障的真實情況。最后一種就是網(wǎng)絡(luò)報修。該種模式是當(dāng)用戶遇到問題，借助網(wǎng)絡(luò)將次問題填寫匯總為故障的詳細(xì)信息后，再提交給專門的維修人員，故障信息將會詳盡細(xì)致地呈現(xiàn)給維修工程師。而工程師就可以根據(jù)故障的描述實施故障的有效解決，因而此種方式就顯著縮短了用戶的等待和問題解決時間，并且提高了企業(yè)的運營效率。綜上可知，為了及時處理用戶遭遇的現(xiàn)場故障，提升企業(yè)的實時應(yīng)變效率，有必要建立一套完整、高效的設(shè)備報修平臺，幫助企業(yè)用戶及時解決工作中出現(xiàn)的各類設(shè)備突發(fā)故障問題。

針對這一課題，本文利用了Ajax開發(fā)技術(shù)，分析和設(shè)計了一個響應(yīng)速度快、用戶體驗良好的設(shè)備在線報修系統(tǒng)。旨在改善企事業(yè)的客服方式和客服能力，讓用戶提出的問題得到及時或限時的解決，滿足企事業(yè)高速發(fā)展對故障維護質(zhì)量不斷提高的現(xiàn)實要求。

1 技術(shù)簡介

為了營造良好的用戶體驗，系統(tǒng)開發(fā)采用了Ajax局部刷新的技術(shù)，實現(xiàn)了與系統(tǒng)后臺的異步交互。Ajax并不是一項嶄新的技術(shù)，而是一些現(xiàn)有成熟的技術(shù)的嵌入組合。這些技術(shù)相互協(xié)作，共同完成用戶的請求工作。在Ajax中主要是HTML、JavaScript、Dynamic HTML、DOM文檔對象模型和XMLHttpRequest技術(shù)的匹配組合[1]。

具體來說，XMLHttpRequest是Ajax的核心，實現(xiàn)客戶端和服務(wù)器端的異步通信過程。Ajax通過JavaScript調(diào)用XMLHttpRequest對象來與服務(wù)器進行交互[2]。XMLHttpRequest對象能夠根據(jù)用戶的需要與服務(wù)器進行自動交互，這個過程對于用戶來說是透明的。這樣在用戶做其他事情的時候，客戶端就可以在后臺與服務(wù)器完成交互，縮短了用戶的等待時間，同時減少了網(wǎng)絡(luò)傳輸?shù)膸?，也緩解了服?wù)器的壓力。圖1就說明了傳統(tǒng)模式和Ajax模式應(yīng)用程序的區(qū)別。

圖1 Ajax工作模式與傳統(tǒng)模式比較

Fig.1 Comparison between the working mode and traditional mode of Ajax

在Ajax模式下，當(dāng)用戶在填寫表單時，Ajax會在后臺對服務(wù)器將用戶填寫的數(shù)據(jù)進行特定的格式包裝，并對服務(wù)器發(fā)出HTTP請求，實現(xiàn)了客戶端和服務(wù)器端的異步傳輸。當(dāng)服務(wù)器處理完數(shù)據(jù)，會將處理的結(jié)果返回給Ajax引擎，Ajax收到服務(wù)器返回的數(shù)據(jù)，就調(diào)用特定的響應(yīng)方法在瀏覽器上將結(jié)果顯示給用戶。也就是說，用戶不需要等待服務(wù)器的響應(yīng)，就可以進行其他的操作。這個異步處理的過程對用戶來說是透明的。從用戶的角度來看，用戶操作后面的數(shù)據(jù)時，前面的數(shù)據(jù)已經(jīng)提交服務(wù)器進行了處理并且得到了處理結(jié)果，從而給用戶帶來了一種良好的體驗。

2 系統(tǒng)總體設(shè)計

在系統(tǒng)中，存在以下幾種角色。對各類角色的任務(wù)設(shè)計則可進行如下描述。

（1）系統(tǒng)用戶：用戶可以根據(jù)自己的賬號登陸到系統(tǒng)中，進行故障的初步診斷和識別，當(dāng)遠(yuǎn)程故障診斷不起作用時，用戶就要填寫故障報修單，說明具體的故障現(xiàn)象，并提交系統(tǒng)，等待專業(yè)維修人員進行檢修。用戶可以查看自己提交報修單的處理進度，而在派單之前，用戶也可以對提交的報修單進行修改和追加。另外，還可以查看自己的報修記錄和已處理的報修單狀況。

（2）監(jiān)控管理員：查看和審核報修單，對報修單進行派單工作。同時，還可查看和維護維修工程師的信息。

（3）維修工程師：查看自己的派單，對已處理的故障進行消單。對不能解決的問題進行上報。查看設(shè)備庫存情況。

（4）超級管理員：對系統(tǒng)進行維護，進行用戶角色權(quán)限的分配工作。系統(tǒng)角色圖如圖2所示。

圖2 系統(tǒng)角色建模圖

Fig.2 System role modeling

綜上，基于對系統(tǒng)中角色功能的分析，即對系統(tǒng)的總體功能進行了模塊化的設(shè)計。具體地，根據(jù)系統(tǒng)所要實現(xiàn)的具體功能，并且依據(jù)系統(tǒng)中存在的不同的操作、角色及權(quán)限，系統(tǒng)的總體功能架構(gòu)如圖3所示。

圖3 系統(tǒng)功能總體架構(gòu)圖

Fig.3 Architecture diagram of system function

從圖3可以看出，系統(tǒng)共分為4大模塊，模塊劃分依據(jù)是基于系統(tǒng)中的角色存在作用。分別地，各模塊的實現(xiàn)功能可做如下概述：

（1）普通用戶模塊：本模塊包含了設(shè)備故障遠(yuǎn)程診斷模塊、查詢模塊、故障報修模塊。

（2）監(jiān)控員管理模塊：本模塊是針對系統(tǒng)的監(jiān)控管理員，包括報修單管理、系統(tǒng)查詢、個人信息管理、派單管理。

（3）維修人員模塊：該模塊包括報修單管理、系統(tǒng)查詢、個人信息管理等。

（4）超級管理員模塊：該模塊包括系統(tǒng)維護與設(shè)置、角色權(quán)限的分配、數(shù)據(jù)管理等。

本文研發(fā)系統(tǒng)的技術(shù)架構(gòu)利用了非常流行的Struts2和Ajax技術(shù)，并采用MVC分層設(shè)計的方式進行實現(xiàn)。在系統(tǒng)中，Struts2充當(dāng)了中心控制器的角色，所有的請求都會被Struts攔截，控制器將根據(jù)請求的類型，調(diào)用不同的業(yè)務(wù)邏輯進行處理，而后根據(jù)處理結(jié)果的類型調(diào)用不同的視圖模型，再將處理結(jié)果展示給用戶[3]。視圖層采用了Ajax技術(shù)進行局部動態(tài)更新，由此而帶來了良好的用戶體驗。系統(tǒng)的技術(shù)架構(gòu)如圖4所示。

圖4 技術(shù)架構(gòu)圖

Fig.4 Technical architecture diagram

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

普通用戶、維修人員和系統(tǒng)監(jiān)控員是本文系統(tǒng)的三個核心角色，而超級管理員則主要針對用戶的基本信息，角色和權(quán)限模塊的設(shè)置，系統(tǒng)的數(shù)據(jù)等進行管理。本研究設(shè)計并最終成功實現(xiàn)了設(shè)備在線報修系統(tǒng)。限于篇幅，本節(jié)就以報修單管理模塊的實現(xiàn)為例來介紹具體開發(fā)過程。其它模塊的實現(xiàn)過程則不再贅述。

在報修單管理模塊中，經(jīng)過調(diào)研可知，報修單包括報修編號、報修類型、故障描述、故障地點、報修時間、維修人、報修狀態(tài)等幾種屬性。用戶可以根據(jù)報修單的狀態(tài)查看報修單的進度。為此，報修單管理模塊的系統(tǒng)流程圖則如圖5所示。

圖5 報修單管理系統(tǒng)流程圖

Fig.5 Flow-process diagram of repair management system

報修單管理模塊的實現(xiàn)代碼如下：

public List getAllMaintains（） {

String hql = "FROM Maintain m "；

Session session = null；

Transaction tx = null；

Maintain maintains = null；

try {

session = getSessionFactory（）.openSession（）；

tx = session.beginTransaction（）；

maintains = session.createQuery（hql）.list（）；

tx.commit（）；

} catch （Exception e） {

return null；

} finally {

if（session ！= null）session.close（）；}

return maintains； }

4 結(jié)束語

本系統(tǒng)使用簡單，只需用戶填寫少量的信息即可進行故障設(shè)備的報修。系統(tǒng)充分利用了Ajax異步請求數(shù)據(jù)的特點，定時從后臺獲取數(shù)據(jù)并將數(shù)據(jù)展示給監(jiān)控員，保證故障得到動態(tài)、及時的解決，降低了因故障維修不及時帶給企業(yè)的損失，因而具有較好的實用推廣價值。

參考文獻：

[1] 李健，郭宇明，石桂名.基于DWR的Ajax技術(shù)研究與實現(xiàn)[J].現(xiàn)代計算機，2007（7）： 132-133.

[2] 梁征.基于Ajax技術(shù)實現(xiàn)網(wǎng)絡(luò)報修系統(tǒng)的改造[J].廣西科學(xué)院學(xué)報，2008（1）：66-68.

[3] 孫鑫.Struts2深入詳解[M].北京：電子工業(yè)出版社，2008.

[4] 白國靖.基于工作流的學(xué)生宿舍網(wǎng)絡(luò)報修系統(tǒng)的設(shè)計與實現(xiàn)[D].廣州：華南理工大學(xué)，2010.

1 基金項目：阿壩師范高等?？茖W(xué)校校級規(guī)劃基金項目（ASB13-20）。

作者簡介：王 朋（1984-），男，河南開封人，碩士，助理研究員，主要研究方向：云計算與虛擬化、計算機軟件與理論；

趙勇軍（1978-），男，四川南充人，碩士，助理研究員，主要研究方向：計算機應(yīng)用；

劉衛(wèi)星（1969-），男，四川成都人，碩士，助理研究員，主要研究方向：計算機與多媒體。