一，項目簡介

?網(wǎng)絡(luò)銷售已經(jīng)成為現(xiàn)在商品銷售的一個主流趨勢，傳統(tǒng)的代理模式己經(jīng)不再適合現(xiàn)在的商業(yè)的生態(tài)發(fā)展。網(wǎng)絡(luò)銷售可以實現(xiàn)F2C的這種廠家直銷到客戶手中的方式，這樣既能降低銷售費用，又能減少中間的程序，可以為顧客提供便利。，而且可以打破地域和時空的限制，讓買賣更加的自由靈活。

經(jīng)過調(diào)研開發(fā)的這套SSM手機(jī)商城系統(tǒng)，主要基于SSM框架進(jìn)行商城系統(tǒng)的整體開發(fā)實現(xiàn)。前端使用Bootstrap進(jìn)行頁面布局，并使用MySql5.7關(guān)系型數(shù)據(jù)庫進(jìn)行商品和業(yè)務(wù)數(shù)據(jù)的存儲。系統(tǒng)整體功能完整，操作簡潔方便。

本商城系統(tǒng)主要實現(xiàn)在線銷售各類品牌手機(jī)的功能，包含前端商品展示和購買以及后臺管理功能。主要實現(xiàn)商品瀏覽、在線下單購買手機(jī)、熱銷手機(jī)查看、個人中心管理、后臺的用戶數(shù)據(jù)、訂單數(shù)據(jù)、產(chǎn)品數(shù)據(jù)的管理等相關(guān)功能。本商城的上線必定能為商家的產(chǎn)品銷售提供更好的銷售渠道。

下面展示一下SSM手機(jī)商城的功能結(jié)構(gòu)圖

編輯

SSM手機(jī)商城系統(tǒng)的使用者主要包含兩種用戶角色，其一是商城后臺管理員角色，其二是商城前端用戶角色，這兩個角色的具體功能如下：

??? 管理員角色：管理員登陸手機(jī)商城系統(tǒng)后臺管理，管理并操作系統(tǒng)中的相關(guān)業(yè)務(wù)數(shù)據(jù)，包括前端客戶管理、手機(jī)商品管理、手機(jī)訂單管理、手機(jī)分類管理等；

前臺用戶角色：前臺用戶登錄SSM手機(jī)商城系統(tǒng)后可以進(jìn)行手機(jī)商品信息瀏覽、選擇手機(jī)添加到購物車、在線下單購買、個人中心管理等操作。

二，環(huán)境介紹

語言環(huán)境：Java:? jdk1.8

數(shù)據(jù)庫：Mysql: mysql5.7

應(yīng)用服務(wù)器：Tomcat:? tomcat8.5.31

開發(fā)工具：IDEA或eclipse

后臺開發(fā)技術(shù)：SSM框架

前臺開發(fā)技術(shù)：Bootstrap+Jquery+Ajax

三，系統(tǒng)展示

3.1 SSM手機(jī)商城功能模塊的展示

3.1.1 前臺首頁展示

SSM手機(jī)商城前端主要就是實現(xiàn)商品的信息瀏覽及購買下單操作，采用Bootstrap框架 ，主要基于 HTML、CSS、JAVASCRIPT、JSP，它簡潔靈活，且使用便捷，前臺首頁主要包含商品瀏覽、在線下單、個人中心、我的訂單等。具體操作界面展示如下圖3-1所示。

編輯

圖3-1 前臺首頁界面

.1.2前臺用戶購物車模塊

? SSM手機(jī)商場面前臺用戶登陸系統(tǒng)后可以進(jìn)入手機(jī)詳情頁面中將手機(jī)添加到購物車。然后在購物車中可以實現(xiàn)在線下單購買操作。添加購物車及用戶下單操作界面如下圖3-2、3-3所示。

編輯

圖3-2 前臺用戶添加購物車操作界面

編輯

圖3-3 前臺用戶提交訂單操作界面

3.1.3前臺用戶個人訂單管理模塊

? SSM手機(jī)商城系統(tǒng)前臺用戶登陸系統(tǒng)后可以在個人訂單管理模塊中管理個人的訂單信息?？梢愿鶕?jù)訂單狀態(tài)顯示相關(guān)信息，并可以對未支付的訂單進(jìn)行支付操作，前端用戶個人訂單管理操作界面如下圖3-4所示。

編輯

圖3-4前臺用戶個人訂單管理操作界面

3.1.4前臺用戶個人信息管理模塊

SSM手機(jī)商城系統(tǒng)前臺用戶登陸系統(tǒng)后可以在個人信息管理模塊中管理個人的相關(guān)信息。前端用戶個人信息管理操作界面如下圖3-5所示。

編輯

圖3-5前臺用戶個人信息管理操作界面

3.1.5前臺用戶注冊模塊

? SSM手機(jī)商城系統(tǒng)前臺用戶可以進(jìn)行個人信息注冊后再進(jìn)行登陸。前端用戶個人賬戶注冊操作界面如下圖3-6所示。

編輯

圖3-6前臺用戶個人注冊操作界面

其中用戶密碼和密碼是必填項，會進(jìn)行基于JS正則表達(dá)式的校驗，如果錄的數(shù)據(jù)不符合要求，將進(jìn)行相應(yīng)的信息提示。

3.1.6前臺用戶登陸模塊

? SSM手機(jī)商城系統(tǒng)前臺用戶可以進(jìn)行個人信息注冊后可以進(jìn)行系統(tǒng)登陸，登陸系統(tǒng)后方可執(zhí)行有權(quán)限的購買等操作。前端用戶個人登陸操作界面如下圖3-7所示。

編輯

圖3-7前臺用戶個人登陸操作界面

3.2后臺功能模塊的展示

3.2.1后臺用戶登錄功能

? SSM手機(jī)商城系統(tǒng)后臺用戶如果想要對商城的相關(guān)信息進(jìn)行管理操作，首先要登錄系統(tǒng)，才可展開相關(guān)的操作。輸入手機(jī)號和密碼后用戶登陸界面如下圖3-8所示。

編輯

圖3-8后臺用戶登錄操作界面

3.2.2客戶管理功能

? SSM手機(jī)商城系統(tǒng)系統(tǒng)管理員用戶登陸系統(tǒng)后，可以進(jìn)入客戶管理菜單進(jìn)行相應(yīng)的管理員客戶信息管理。用戶管理操作界面如下圖3-9、3-10所示：

編輯

圖3-9后臺戶管理功能界面圖

編輯

圖3-10后臺客戶新增界面圖

3.2.3 后臺手機(jī)商品管理操作UI

? SSM手機(jī)商城系統(tǒng)管理員用戶登陸系統(tǒng)后，可以進(jìn)入商品管理菜單進(jìn)行相應(yīng)的手機(jī)商品信息管理。其中主要包含手機(jī)商品的添加、修改、查詢、加入條幅、加入新品、加入熱銷以及相應(yīng)的移出操作等。商品信息管理操作界面如下圖3-11、3-12所示。

編輯

圖3-11后臺商品管理功能UI界面

編輯

圖3-12商臺餐品新增功能UI界面

4.2.4 后臺訂單管理操作UI

? SSM手機(jī)商城系統(tǒng)系統(tǒng)管理員用戶登陸系統(tǒng)后，可以進(jìn)入商品訂單管理菜單進(jìn)行相應(yīng)的商品訂單信息管理。其中主要包含訂單的查詢、訂單明細(xì)的查看等，可以根據(jù)訂單不同的完成狀態(tài)來查行查看，并可以根據(jù)用戶的付款情況，收貨情況等來設(shè)置訂單的不同完成狀，訂單信息管理操作界面如下圖4-13所示。

編輯

圖4-13后臺訂單管理功能UI界面

4.2.5 后臺商品類目管理操作UI

? SSM手機(jī)商城系統(tǒng)管理員用戶登陸系統(tǒng)后，可以進(jìn)入商品類目管理模塊管理餐品的分類信息。商品類目管理界面如下圖3-14所示。

編輯

圖3-14商品類目管理功能UI界面

3.2.6 后臺管理員個人密碼管理操作UI

? SSM手機(jī)商城系統(tǒng)管理員用戶登陸系統(tǒng)后，在后臺可以對進(jìn)自己的密碼進(jìn)行修改管理操作。個人密碼管理界面如下圖4-15所示。

編輯

圖3-15個人密碼修改功能UI界面

四，核心代碼展示

package com.controller;import java.util.Objects;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpSession;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestParam;import org.springframework.web.bind.annotation.ResponseBody;import org.springframework.web.multipart.MultipartFile;import com.entity.Admins;import com.entity.Goods;import com.entity.Tops;import com.entity.Types;import com.entity.Users;import com.service.AdminService;import com.service.GoodService;import com.service.OrderService;import com.service.TopService;import com.service.TypeService;import com.service.UserService;import com.util.PageUtil;import com.util.SafeUtil;import com.util.UploadUtil;/** * 后臺相關(guān)接口 */@Controller@RequestMapping("/admin")public class AdminController { private static final int rows = 10; @Autowired private AdminService adminService; @Autowired private OrderService orderService; @Autowired private UserService userService; @Autowired private GoodService goodService; @Autowired private TopService topService; @Autowired private TypeService typeService; /** * 管理員登錄 * @return */ @RequestMapping("/login") public String login(Admins admin, HttpServletRequest request, HttpSession session) { if (adminService.checkUser(admin.getUsername(), admin.getPassword())) { session.setAttribute("username", admin.getUsername()); return "redirect:index"; } request.setAttribute("msg", "用戶名或密碼錯誤!"); return "/admin/login.jsp"; } /** * 退出 * @return */ @RequestMapping("/logout") public String logout(HttpSession session) { session.removeAttribute("admin"); return "/admin/login.jsp"; } /** * 后臺首頁 * @return */ @RequestMapping("/index") public String index(HttpServletRequest request) { request.setAttribute("msg", "恭喜你! 登錄成功了"); return "/admin/index.jsp"; } /** * 訂單列表 * * @return */ @RequestMapping("/orderList") public String orderList(@RequestParam(required=false, defaultValue="0")byte status, HttpServletRequest request, @RequestParam(required=false, defaultValue="1") int page) { request.setAttribute("flag", 1); request.setAttribute("status", status); request.setAttribute("orderList", orderService.getList(status, page, rows)); request.setAttribute("pageTool", PageUtil.getPageTool(request, orderService.getTotal(status), page, rows)); return "/admin/order_list.jsp"; } /** * 訂單發(fā)貨 * * @return */ @RequestMapping("/orderDispose") public String orderDispose(int id, byte status, @RequestParam(required=false, defaultValue="1") int page) { orderService.dispose(id); return "redirect:orderList?flag=1&status="+status+"&page="+page; } /** * 訂單完成 * * @return */ @RequestMapping("/orderFinish") public String orderFinish(int id, byte status, @RequestParam(required=false, defaultValue="1") int page) { orderService.finish(id); return "redirect:orderList?flag=1&status="+status+"&page="+page; } /** * 訂單刪除 * * @return */ @RequestMapping("/orderDelete") public String orderDelete(int id, byte status, @RequestParam(required=false, defaultValue="1") int page) { orderService.delete(id); return "redirect:orderList?flag=1&status="+status+"&page="+page; } /** * 顧客管理 * * @return */ @RequestMapping("/userList") public String userList(HttpServletRequest request, @RequestParam(required=false, defaultValue="1") int page) { request.setAttribute("flag", 2); request.setAttribute("userList", userService.getList(page, rows)); request.setAttribute("pageTool", PageUtil.getPageTool(request, userService.getTotal(), page, rows)); return "/admin/user_list.jsp"; } /** * 顧客添加 * * @return */ @RequestMapping("/userAdd") public String userAdd(HttpServletRequest request) { request.setAttribute("flag", 2); return "/admin/user_add.jsp"; } /** * 顧客添加 * * @return */ @RequestMapping("/userSave") public String userSave(Users user, HttpServletRequest request, @RequestParam(required=false, defaultValue="1") int page) { if (userService.isExist(user.getUsername())) { request.setAttribute("msg", "用戶名已存在!"); return "/admin/user_add.jsp"; } userService.add(user); return "redirect:userList?flag=2&page="+page; } /** * 顧客密碼重置頁面 * * @return */ @RequestMapping("/userRe") public String userRe(int id, HttpServletRequest request) { request.setAttribute("flag", 2); request.setAttribute("user", userService.get(id)); return "/admin/user_reset.jsp"; } /** * 顧客密碼重置 * * @return */ @RequestMapping("/userReset") public String userReset(Users user, @RequestParam(required=false, defaultValue="1") int page) { String password = SafeUtil.encode(user.getPassword()); user = userService.get(user.getId()); user.setPassword(password); userService.update(user); return "redirect:userList?flag=2&page="+page; } /** * 顧客更新 * * @return */ @RequestMapping("/userEdit") public String userEdit(int id, HttpServletRequest request) { request.setAttribute("flag", 2); request.setAttribute("user", userService.get(id)); return "/admin/user_edit.jsp"; } /** * 顧客更新 * * @return */ @RequestMapping("/userUpdate") public String userUpdate(Users user, @RequestParam(required=false, defaultValue="1") int page) { userService.update(user); return "redirect:userList?flag=2&page="+page; } /** * 顧客刪除 * * @return */ @RequestMapping("/userDelete") public String userDelete(Users user, @RequestParam(required=false, defaultValue="1") int page) { userService.delete(user); return "redirect:userList?flag=2&page="+page; } /** * 產(chǎn)品列表 * * @return */ @RequestMapping("/goodList") public String goodList(@RequestParam(required=false, defaultValue="0")byte status, HttpServletRequest request, @RequestParam(required=false, defaultValue="1") int page) { request.setAttribute("flag", 3); request.setAttribute("page", page); request.setAttribute("status", status); request.setAttribute("goodList", goodService.getList(status, page, rows)); request.setAttribute("pageTool", PageUtil.getPageTool(request, goodService.getTotal(status), page, rows)); return "/admin/good_list.jsp"; } /** * 產(chǎn)品添加 * * @return */ @RequestMapping("/goodAdd") public String goodAdd(HttpServletRequest request) { request.setAttribute("flag", 3); request.setAttribute("typeList", typeService.getList()); return "/admin/good_add.jsp"; } /** * 產(chǎn)品添加 * * @return * @throws Exception */ @RequestMapping("/goodSave") public String goodSave(String name, int price, String intro, int stock, int typeId, MultipartFile cover, MultipartFile image1, MultipartFile image2, @RequestParam(required=false, defaultValue="1") int page) throws Exception { Goods good = new Goods(); good.setName(name); good.setPrice(price); good.setIntro(intro); good.setStock(stock); good.setTypeId(typeId); good.setCover(UploadUtil.fileUpload(cover)); good.setImage1(UploadUtil.fileUpload(image1)); good.setImage2(UploadUtil.fileUpload(image2)); goodService.add(good); return "redirect:goodList?flag=3&page="+page; } /** * 產(chǎn)品更新 * * @return */ @RequestMapping("/goodEdit") public String goodEdit(int id, HttpServletRequest request) { request.setAttribute("flag", 3); request.setAttribute("typeList", typeService.getList()); request.setAttribute("good", goodService.get(id)); return "/admin/good_edit.jsp"; } /** * 產(chǎn)品更新 * * @return * @throws Exception */ @RequestMapping("/goodUpdate") public String goodUpdate(int id, String name, int price, String intro, int stock, int typeId, ? MultipartFile cover, MultipartFile image1, MultipartFile image2, @RequestParam(required=false, defaultValue="1") int page) throws Exception { Goods good = goodService.get(id); good.setName(name); good.setPrice(price); good.setIntro(intro); good.setStock(stock); good.setTypeId(typeId); if (Objects.nonNull(cover) && !cover.isEmpty()) { good.setCover(UploadUtil.fileUpload(cover)); } if (Objects.nonNull(image1) && !image1.isEmpty()) { good.setImage1(UploadUtil.fileUpload(image1)); } if (Objects.nonNull(image2) && !image2.isEmpty()) { good.setImage2(UploadUtil.fileUpload(image2)); } goodService.update(good); return "redirect:goodList?flag=3&page="+page; } /** * 產(chǎn)品刪除 * * @return */ @RequestMapping("/goodDelete") public String goodDelete(int id, @RequestParam(required=false, defaultValue="1") int page) { goodService.delete(id); return "redirect:goodList?flag=3&page="+page; } /** * 添加推薦 * @return */ @RequestMapping("/topSave") public @ResponseBody String topSave(Tops tops, @RequestParam(required=false, defaultValue="0")byte status, @RequestParam(required=false, defaultValue="1") int page) { int id = topService.add(tops); return id > 0 ? "ok" : null; } /** * 刪除推薦 * @return */ @RequestMapping("/topDelete") public @ResponseBody String topDelete(Tops tops, @RequestParam(required=false, defaultValue="0")byte status, @RequestParam(required=false, defaultValue="1") int page) { boolean flag = topService.delete(tops); return flag ? "ok" : null; } /** * 類目列表 * * @return */ @RequestMapping("/typeList") public String typeList(HttpServletRequest request) { request.setAttribute("flag", 4); request.setAttribute("typeList", typeService.getList()); return "/admin/type_list.jsp"; } /** * 類目添加 * * @return */ @RequestMapping("/typeSave") public String typeSave(Types type, @RequestParam(required=false, defaultValue="1") int page) { typeService.add(type); return "redirect:typeList?flag=4&page="+page; } /** * 類目更新 * * @return */ @RequestMapping("/typeEdit") public String typeUp(int id, HttpServletRequest request) { request.setAttribute("flag", 4); request.setAttribute("type", typeService.get(id)); return "/admin/type_edit.jsp"; } /** * 類目更新 * * @return */ @RequestMapping("/typeUpdate") public String typeUpdate(Types type, @RequestParam(required=false, defaultValue="1") int page) { typeService.update(type); return "redirect:typeList?flag=4&page="+page; } /** * 類目刪除 * * @return */ @RequestMapping("/typeDelete") public String typeDelete(Types type, @RequestParam(required=false, defaultValue="1") int page) { typeService.delete(type); return "redirect:typeList?flag=4&page="+page; } /** * 管理員列表 * * @return */ @RequestMapping("/adminList") public String adminList(HttpServletRequest request, @RequestParam(required=false, defaultValue="1") int page) { request.setAttribute("flag", 5); request.setAttribute("adminList", adminService.getList(page, rows)); request.setAttribute("pageTool", PageUtil.getPageTool(request, adminService.getTotal(), page, rows)); return "/admin/admin_list.jsp"; } /** * 管理員修改自己密碼 * * @return */ @RequestMapping("/adminRe") public String adminRe(HttpServletRequest request, HttpSession session) { request.setAttribute("flag", 5); request.setAttribute("admin", adminService.getByUsername(String.valueOf(session.getAttribute("username")))); return "/admin/admin_reset.jsp"; } /** * 管理員修改自己密碼 * * @return */ @RequestMapping("/adminReset") public String adminReset(Admins admin, HttpServletRequest request) { request.setAttribute("flag", 5); if (adminService.get(admin.getId()).getPassword().equals(SafeUtil.encode(admin.getPassword()))) { admin.setPassword(SafeUtil.encode(admin.getPasswordNew())); adminService.update(admin); request.setAttribute("admin", admin); request.setAttribute("msg", "修改成功!"); }else { request.setAttribute("msg", "原密碼錯誤!"); } return "/admin/admin_reset.jsp"; } /** * 管理員添加 * * @return */ @RequestMapping("/adminSave") public String adminSave(Admins admin, HttpServletRequest request, @RequestParam(required=false, defaultValue="1") int page) { if (adminService.isExist(admin.getUsername())) { request.setAttribute("msg", "用戶名已存在!"); return "/admin/admin_add.jsp"; } adminService.add(admin); return "redirect:adminList?flag=5&page="+page; } /** * 管理員修改 * * @return */ @RequestMapping("/adminEdit") public String adminEdit(int id, HttpServletRequest request) { request.setAttribute("flag", 5); request.setAttribute("admin", adminService.get(id)); return "/admin/admin_edit.jsp"; } /** * 管理員更新 * * @return */ @RequestMapping("/adminUpdate") public String adminUpdate(Admins admin, @RequestParam(required=false, defaultValue="1") int page) { admin.setPassword(SafeUtil.encode(admin.getPassword())); adminService.update(admin); return "redirect:adminList?flag=5&page="+page; } /** * 管理員刪除 * * @return */ @RequestMapping("/adminDelete") public String adminDelete(Admins admin, @RequestParam(required=false, defaultValue="1") int page) { adminService.delete(admin); return "redirect:adminList?flag=5&page="+page; } }

package com.controller;import java.util.Objects;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;/** * 后臺登錄驗證攔截器 */public class AdminInterceptor extends HandlerInterceptorAdapter{ /** * 檢測登錄狀態(tài) */ @Override public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception { String uri = request.getRequestURI(); if(uri.contains("css/") || uri.contains("js/") || uri.contains("img/") || uri.contains("login") || uri.contains("logout")) { return true; // 不攔截路徑 } Object username = request.getSession().getAttribute("username"); if (Objects.nonNull(username) && !username.toString().trim().isEmpty()) { return true; // 登錄驗證通過 } response.sendRedirect("login.jsp"); return false; // 其他情況一律攔截 } }

五，項目總結(jié)

本文設(shè)計并實現(xiàn)的商城系統(tǒng)，通過互聯(lián)網(wǎng)來實現(xiàn)電子商城這一新興產(chǎn)業(yè)，電子商城主要依靠于計算機(jī)互聯(lián)網(wǎng)技術(shù)。如果缺少了這個技術(shù)，就沒有辦法實現(xiàn)電子商城，如果要想完美實現(xiàn)，互聯(lián)網(wǎng)技術(shù)就要有重大發(fā)展。這樣，電子商城就帶動了科技的巨大進(jìn)步。用戶就可以隨時隨地完成搜索商品、挑選商品、購買商品的全部過程。對于商家而言，網(wǎng)上購買商品有如下優(yōu)點：不受場地限制、購買成本低、降低了風(fēng)險、有利于更好的刺激用戶去消費購買。對于消費者來說，網(wǎng)上購買商品有如下優(yōu)點：價格便宜方便性、足不出戶就能買到滿意的商品。對商家而言，網(wǎng)上出售商品有如下優(yōu)點：可以為商家節(jié)省了商店的租金、人力成本，最重要的是商品的價格也會大大降低。