【導(dǎo)讀】隨著市場經(jīng)濟的逐漸形成，全球化經(jīng)濟已在國內(nèi)迅速發(fā)展起來。以往的銷售模式正。來的不便越來越感到不滿，交易的時間長、效率低。高額的運費、銷售場地的憑租費等。繁多的額外開支也給商家?guī)沓林氐某杀局С觥榱诉m應(yīng)市場、適應(yīng)經(jīng)濟前進的步伐，買家和商家都在努力積極地尋找一種能夠帶來高效率、低成本銷售模式。因此我決定選擇“網(wǎng)上商城系統(tǒng)”這樣一個課題作為我的畢業(yè)設(shè)計。系統(tǒng)中的數(shù)據(jù)格式和字段設(shè)置不具體針對某一個行業(yè)或企業(yè)，因而具有普遍的適。JSP是由SunMicrosystems公司倡導(dǎo)、許多公司參與一起建立的一。種動態(tài)網(wǎng)頁技術(shù)標準。插入的Java程序段可以操作數(shù)據(jù)庫、重新定向網(wǎng)。JSP頁面由HTML代碼和嵌入其中的Java代碼所組成。這些Java代碼進行處理，然后將生成的HTML頁面返回給客戶端的瀏覽器。JSP的技術(shù)基礎(chǔ)，而且大型的Web應(yīng)用程序的開發(fā)需要JavaServlet和JSP配合才能完成。單確認，個人信息自主管理等功能。人們?nèi)粘Ｉ钪胁豢扇鄙俚闹匾糠帧?

　　

【正文】 16 網(wǎng) 上購物 系統(tǒng) 全局 ER圖 。 . 5 數(shù)據(jù)表設(shè)計 對于信息管理系統(tǒng)，數(shù)據(jù)基本上都是使用數(shù)據(jù)庫進行管理。數(shù)據(jù)庫設(shè)計是對保存管理系統(tǒng)數(shù)據(jù)的數(shù)據(jù)庫結(jié)構(gòu)進行設(shè)計，對整個系統(tǒng)的開發(fā)具有非常重要的作用。 用戶信息表見下圖 圖 3 7 用戶信息表 Fig 37 user information chart 圖 3 6 系統(tǒng)全局 ER 圖 Fig 36 System global ER graph 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 17 商品信息表見下圖 圖 3 8 商品信息表圖 Fig 38 product information chart 訂單表見下圖 圖 3 9 訂單信息表圖 Fig 39 order information chart 訂單項表見下圖 圖 310 訂單項信息表圖 Fig 310 order item information chart 本章小結(jié) 本章介紹了對本網(wǎng)站的概要設(shè)計，給出了 本網(wǎng)是購物系統(tǒng) 的功能結(jié)構(gòu)圖、實體關(guān)系圖等，說明了各模塊之間的聯(lián)系。本章完成了系統(tǒng)數(shù)據(jù)庫的數(shù)據(jù)需求分析的過程，說明了天津理工大學 2020 屆畢業(yè)設(shè)計說明書 18 數(shù)據(jù)庫由概念結(jié)構(gòu)設(shè)計轉(zhuǎn)換成邏輯結(jié)構(gòu)設(shè)計的過程，并把各個物理數(shù)據(jù)模型結(jié)合起來形成一個整體的關(guān)系數(shù)據(jù)庫模型，為系統(tǒng)詳細設(shè)計與實現(xiàn)奠定了基礎(chǔ)。綜上所述，我認為，設(shè)計數(shù)據(jù)庫的數(shù)據(jù)表，建立表與表之前的關(guān)系。對整個網(wǎng)站系統(tǒng)來說是十分必要的。 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 19 第四章 詳細設(shè)計與實現(xiàn) 詳細設(shè)計的根本目標是確定應(yīng)該具體地實現(xiàn)所要求的系統(tǒng)，也就是說，經(jīng)過這個階段的設(shè)計工作，應(yīng)該得出對目標系統(tǒng)的精確描述，從而在編碼階段可以把這個描述直接翻譯成用某種程序設(shè)計語言書寫的程序。 在項目開發(fā)時，使用一種穩(wěn)定成熟的框架是項目成功的重要因素。 MVC 的基本思想就是邏輯與顯示的分離， Model 是應(yīng)用程序的主體部分，它表示業(yè)務(wù)數(shù)據(jù)或者業(yè)務(wù)邏輯， View 是應(yīng)用程序中與用戶界面相關(guān)的部分，也就是用戶看到并與之交互的界面， Controller 根據(jù)用戶的輸入，控制用戶界面數(shù)據(jù)的顯示和更新 Model 對象的狀態(tài)， MVC 不僅實現(xiàn)了功能模塊和顯示模塊的分離，同時也提供了應(yīng)用系統(tǒng)的可維護性、可擴展性、可移植性和組件的可重用性。模型、視圖與控制器的分離，使得一個模型可以具有多個顯示視圖。如果用戶通過某個視圖的控制 器改變了模型的數(shù)據(jù)，所有其它依賴于這些數(shù)據(jù)的視圖都應(yīng)反映到這些變化。因此，無論何時發(fā)生了何種數(shù)據(jù)變化，控制器都會將變化通知所有的視圖，導(dǎo)致顯示的更新。 系統(tǒng)運行平臺設(shè)置 與主界面設(shè)計 新代運動 網(wǎng)，根據(jù)上述運行可行性分析以及系統(tǒng)的數(shù)據(jù)庫與系統(tǒng)的功能模塊概要設(shè)計后，結(jié)合實際情況，先將系統(tǒng)運行平臺設(shè)置如下： 1．服務(wù)器端硬件環(huán)境： CPU： Intel I3 或更高 內(nèi)存： 2G 客戶端硬件環(huán)境： CPU： Intel Pentium4 內(nèi)存： 256MB 由于客戶端主要用于瀏覽器和操作數(shù)據(jù)，所以對客戶端的硬件環(huán)境要求不高。 2．服務(wù)器端軟件環(huán)境： Web 服務(wù)器： Java 開發(fā)包： 以上 數(shù)據(jù)庫： 開發(fā)工具： MyEclipse ， Dreamweaver 客戶端軟件環(huán)境： 瀏覽器： Inter Explorer 或以上 由于客戶端主要用于瀏覽器和操作數(shù)據(jù)，所以客戶端軟件環(huán)境設(shè)置要求不高。 本 網(wǎng)站的 主界面整體結(jié)構(gòu)為 上下 左 中 右結(jié)構(gòu)， 上面部分為導(dǎo)航區(qū)，下面部分為版權(quán)，左面部分 為動態(tài)生成商品類別 ，右面部 分為 資訊 區(qū)， 中間部分為商品展示區(qū) 。 前臺分為以下幾部分 1. 首頁 a. 顯示某類商品 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 20 b. 根據(jù) ID 顯示圖片 c. 搜索 d. 注冊 e. 登錄 f. 自助服務(wù) 2. 搜索界面 3. 搜索結(jié)果界面 4. 注冊 a. 注冊頁面 b. 注冊成功 c. 注冊失敗 5. 登錄 a. 登錄頁面 b. 登錄成功頁面 c. 登錄失敗頁面 6. 自主服務(wù) a. 修改密碼 b. 修改密碼成功 c. 修改密碼失敗 d. 修改其他信息 e. 修改其他信息成功 f. 修改其他信息失敗 7. 購物界面 a. 購物車瀏覽 b. 結(jié)帳 后臺界面分為以下這幾個方面 （在 admin 目錄下） 1. 管理員登錄界面 2. 管理首頁 a. 用戶管理 b. 產(chǎn)品管理 c. 類別管理 d. 訂單管理 3. 用戶管理 a. 顯示用戶 b. 刪除用戶 c. 搜索用戶 4. 產(chǎn)品管理 a. 產(chǎn)品顯示 b. 產(chǎn)品添加 c. 產(chǎn)品更改 d. 產(chǎn)品刪除 e. 產(chǎn)品搜索 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 21 5. 類別管理 a. 類別顯示 b. 類別添加 c. 類別刪除 d. 類別修改 6. 訂單管理 a. 訂單瀏覽 b. 訂單處理 以上所列界面將用 dreamwaver 設(shè)計，再用 MyEclipse 進行編碼實現(xiàn)。 1．實現(xiàn)目標 簡單、友好、方便操作的主頁面。點擊 ” 新用戶 注冊 ” 按鈕可以直接進入注冊頁面。只有登陸后才可以進行 購買商品 。 導(dǎo)航 欄上的按鈕均可點擊后鏈接到對應(yīng)的頁面上?？蓜討B(tài)顯示 商品類別、銷售排行、瀏覽歷史 。 2．實現(xiàn)過程 頁面名稱： 使用 dreamwave 完成主 頁 面模板頁的 設(shè)計 。 商品類別、銷售排行、瀏覽歷史 用 AJAX 技術(shù)框架 DWR 實現(xiàn) 。 下圖是首頁界面。 各模塊詳細設(shè)計與實現(xiàn) 本節(jié)對 網(wǎng)上商城 的主要模塊進行了詳細設(shè)計與實現(xiàn)過程的論述。對于每個模塊的三層架構(gòu)進行分析。并給出相應(yīng)的實現(xiàn) 目標與實現(xiàn)過程 。本網(wǎng)站各個模塊均采用了 MVC 三層架構(gòu)的方式實現(xiàn)，對各個模塊進行了代碼的設(shè)計和實施。其中，分別建立了清晰的 action， DAO，service 類用來實現(xiàn)。 圖 4 1 首頁界面圖 Fig 41 Home interface chart 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 22 用戶注冊模塊 新用戶必須注冊，并且填入個人信息完成注冊后才能進行商品的購買等活動。沒有帳號的用戶可以在首頁的用戶注冊模塊進行注冊，而已有賬戶的用戶則可以直接登錄。該模塊界面如下圖。 圖 4 2 首頁用戶注冊登錄模塊界面圖 Fig 42 index user login chart 點擊進入新用戶注冊之后需要填寫個人信息等。見下圖 在這個 jsp 頁面中用 form表單收集數(shù)據(jù)并且提交給自身 代碼如下： form method=post name=register action= onSubmit==true。 input type=hidden name=action value=register/ 在收集用戶信息后包裝成 user 類進行處理 代碼如下 (GBK)。 String action = (action)。 if(action != null amp。amp。 ().equals(register)) { String username = (username)。 String password = (password)。 String phone = (phone)。 String addr = (addr)。 User u = new User()。 圖 4 3 用戶注冊界面圖 Fig 43 Register interface 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 23 (username)。 (password)。 (phone)。 (addr)。 (new Date())。 ()。 (注冊成功 !恭喜 !)。 return。 } 以上的代碼初步的運用了 MVC 思想， jsp 頁面在本模塊中對應(yīng) 為 View 視圖層，在頁面上收集數(shù)據(jù)進行初步加工并調(diào)用 JavaBean 對應(yīng)的 user 類的方法和屬性如 ()等這是 Control 控制層。在 ()方法中調(diào)用 DAO 類中的 save 方法，改寫后臺數(shù)據(jù)庫這是Model 模型層。 后臺用戶信息查看模塊 用戶注冊完成后，管理員可以在后臺管理模塊中查看用戶的個人信息，并進行管理。該模塊界面如下圖 相關(guān)代碼如下： public static ListUser getUsers() { ListUser users = new ArrayListUser()。 Connection conn = ()。 String sql = select * from user。 Statement stmt = (conn)。 ResultSet rs = (stmt, sql)。 try { while (()) { 圖 4 4 后臺管理模塊圖 Fig 44 Admin Block Diagram 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 24 User u = new User()。 ((id))。 ((username))。 ((password))。 ((phone))。 ((addr))。 ((rdate))。 (u)。 } } catch (SQLException e) { ()。 } finally { (rs)。 (stmt)。 (conn)。 } return users。 } 上面的代碼主要是從數(shù)據(jù)庫中讀出所有的用戶信息把每個用戶的信息包裝成 users 類也就是用戶群類，再返回到 jsp 頁面中進行顯示。 產(chǎn)品管理模塊 在本模塊中管理員可以方便的對產(chǎn)品進行管理。包括瀏覽產(chǎn)品，設(shè)置類別，修改產(chǎn)品信息，刪除商品，添加商品等功能。主界面如下圖。 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 25 在這個界面中可以看到已經(jīng)加入了 2 個測試用商品。其相關(guān)核心代碼如下： final int PAGE_SIZE = 2。 //每頁顯示多少條記錄 final int PAGES_PER_TIME = 10。//每次顯示多少個頁碼鏈接 int pageNo = 1。 String strPageNo = (pageNo)。 if (strPageNo != null amp。amp。 !().equals()) { try { pageNo = (strPageNo)。 } catch (NumberFormatException e) { pageNo = 1。 } } if (pageNo = 0) pageNo = 1。 這段代碼其功能是讀出后臺數(shù)據(jù)庫中一共有多少商品并且進行分頁顯示。在這里可以設(shè)置每頁顯示的商品數(shù)量和每頁可顯示的頁碼鏈接。這樣可以方便管理員用戶進行操作。 在本模塊中可以進行商品的刪除操作并且可以用復(fù)選框選擇所要刪除的商品進行多個商品的一次性刪除。這樣方便了管理員的操作減輕了管理員的勞動強度。如下圖所示（注意紅色標識）。 圖 4 5 產(chǎn)品管理模塊圖 Fig 45 Product Management Block Diagram 天津理工大學 2020 屆畢業(yè)設(shè)計說明書 26 在這里運用到了一段 javaScript 技巧。其核心代碼如下： script type=text/javascript function checkDelete() { var ids = (id)。 if() { for(var i=0。 i。 i++) { ids[i].checked=checked。 } } else { for(var i=0。 i。 i++) { ids[i].checked=。 } } } /script 上面的這段 javascript 代碼主要實現(xiàn)的功能是判斷復(fù)選框。在頁面左下角處有個以復(fù)選框是可以選中后選擇當前頁面的所有商品的。如果點擊全選則把當前頁面的所有商品全部選中。如果用戶確定要刪除，則系統(tǒng)會提示您是否真的要刪除，這樣可以有效的避免管理員的失誤操作。在刪除成功后系統(tǒng)會在本頁面給出刪除成功的提示如下圖（注意紅色框提示）。 圖 4 6 產(chǎn)品刪除界面圖 Fig 46 Remove the interface of the product 天津理工大學