【《基于SSM的卡通主题商城网站设计》5500字（论文）】

基于SSM的卡通主题商城网站设计目录摘要 1Abstract 11绪论 21.1研究现状 21.2选题意义 21.3本文结构 22相关知识 22.1SSM的介绍 22.1.1SSM的定义 22.1.2SSM框架 32.2JSP前端 32.3Java语言 32.4开发工具Eclipse 33系统分析 43.1可行性分析 43.1.1技术可行性 43.1.2操作可行性 43.2系统需求分析 43.3系统流程图 43.4用例图 54系统设计 64.1界面设计 64.1.1首页 64.1.2登录页面 74.1.3管理员界面 84.1.4修改用户界面 84.1.5订单界面 84.2功能模块 94.2.1管理员模块 94.2.2用户模块 94.3数据库设计 94.3.1数据库概念设计 94.3.2数据库逻辑设计 105系统实现 125.1主页实现 125.2管理员登陆主界面 135.2.1管理员对玩具进行管理 145.2.3管理员对用户管理 145.3用户功能实现 165.3.1用户登陆进入主界面功能实现 165.3.2用户查看自己的订单 176系统测试 186.1测试目的 186.2测试过程 196.2.1管理员功能测试 196.2.2玩具功能测试 196.2.3订单功能测试 20参考文献 21PAGE21摘要：随着信息化时代的迅速发展，网上购物已经成为当今社会的一种趋势，而商品便利交易平台，卡通主题商城线下购买需要花费时间，花费精力去找喜欢的玩具，信息化可以精确搜索，提高了购物的效率，节省时间，提高了消费者的购物兴趣。前端JSP设计写出就有亲和力的网站，加深了管理员对于商品分类掌控，提高了用户的体验层度给用户带来了良好体验。运用了MySQL数据库存储数据，设计简洁明了，使得顾客查看商品方便，更使得管理员管理起来不那么繁琐。关键词：网上购物；SSM；JSP；MySQL1绪论1.1研究现状玩具商城一般都是线下在超市里的某个地方。现在把各种玩具分门别类整理好，动动手指就可以浏览全部玩具，不需要每个柜子到处跑，以便与用户快速找到自己想要的玩具，而SSM的卡通主题商城网站设计与实现就是完成这类工作，该平台实现了网络化、规范化管理[1]。现实生活中的人们为了方便，用户在通过网站的直接选择，获得自己所需要的玩具，现在出来这个基于SSM的卡通主题商城网站无疑是给广大的用户群体带来了福音。目前市场上基于SSM的卡通主题商城网站也比较多，做的较为出色的系统如：馨曼园动漫商城，这是一款专门做卡通主题商城的网站，但是该网站现在已经没落，现在由于淘宝、京东、唯品会，用户都直接去那边下单。现今的用户都是货比三家，哪家的货质量更好，玩具比较便宜，他们更多的会选择一个他们比较能接受的范围，所以在网站会适合更多人的选择，在的图书管理系统的实现过程，在这过程中对容易出现的问题提供了解决方案[2]。1.2选题意义现在买手办都是提前定制，都不知道什么时候到货，什么时候发货，在这个信息化透明的互联网时代，每个网站各个平台多多少少会存在杀熟。不管是父母给子女给亲戚的小孩挑选玩具都可以来这个网站，还是某一类成人喜欢的Cosplay手办、拼图，还有一些开发脑力、智力的小玩具，一些解密类的东西，严格要求玩具是否有危险性是否上架都会严格要求，对用户安全提供保障，给用户良好的体验状态。[3]。1.3本文结构本篇论文根据系统的实现主要分为以下六个部分：第一部分：绪论，主要说明了本论文的研究现状和意义。第二部分：介绍了本系统的相关知识。第三部分：可行性分析，系统需求分析，介绍系统功能图和用例图。第四部分：系统设计，根据需求分析出系统界面图，数据库表。第五部分：系统的实现。第六部分：系统测试，给出部分功能测试用例。2相关知识2.1SSM的介绍2.1.1SSM的定义因Struts安全性问题SSH框架逐渐被企业弃用，取而代之的是轻量级的SSM框架[4]。采用MVC设计模式，View是视图层来和用户交互，Controller是控制层，控制系统请求的走向，Model是模型层负责处理逻辑[5]，SSM中的Spring技术可以是代码的耦合度降到很低[6]。2.1.2SSM框架系统架构图使用浏览器进入卡通主题商城网站，SSM框架SpringMVC三层架构分别是控制、视图和模型层，Spring是一个轻量型控制容器，MyBatis是Java的持久性层框架，用XML配置来映射数据库中的表，如图2-1所示：图2-1SSM框架2.2JSP前端JSP是SUN公司倡导的脚本编程技术，在网页发展中期，静态页面不满足用户需求，动态页面应运而生，比起静态更加优越[7]，JSP前端页面编写与维护更加简单[8]。2.3Java语言Java是近几十年发展起来的语言，Java特别适用于商业开发[9]。大多数编程人员普遍喜欢使用Java开发软件。2.4开发工具Eclipse现在开发软件数不胜数，其中免费开源的就属Eclipse，支持Java开发，PDE用来支持插件开发EclipsePlatform则是一个开放的可扩展IDEEclipseSDK是EclipsePlatform、JDT和PDE所生产的组件合并，它们可以一次下载[10]。Eclipse除了用在Java程序的开发过程中还有能通过强大的延展功能建立其他的开发工具，还能建立Web项目[11]。3系统分析3.1可行性分析3.1.1技术可行性Java开发语言经过多年的发展，Java这门语言非常成熟，非常适用于商业开发。前端只是验证显示传递数据，后端负责主要连接数据库和数据库的相关操作，用的是SQL数据库，采用Tomcat9.0服务器。3.1.2操作可行性网站亲和的页面，简单的操作，用户只要对玩具进行购买按钮下单，和其他网站一比没有多余的操作。3.2系统需求分析本系统是基于SSM框架的玩具主题商城网站，主要用于玩具商城，所以设计的主要功能就在管理员管理用户和添加玩具，修改订单状态与用户购买玩具。系统还需要实现工作项的查看与处理，系统总体设计，如图3-1所示。图3-1系统功能图3.3系统流程图系统主要流程如下：（1）用户看完首页，想购买玩具需要登陆、注册，图3-2所示：图3-2用户注册流程（2）管理员必须登录后才能进入系统，具体流程如图3-3所示：图3-3系统管理员管理流程3.4用例图通过用例图可以清楚的知道实体间的联系，可以突出用户和系统交互关系。用例图虽然不能展示系统的细节但是可以让开发者更好的了解系统。（1）管理员需要登陆主页，对玩具进行管理、查看订单详情、修改用户信息、修改玩具类型，用例图如图3-4所示：图3-4管理员用例图（2）用户登陆主页、查看玩具菜单、购买玩具加入购物车、查看订单以及最后修改自己信息，用例图，如图3-5所示：图3-5用户用例图4系统设计4.1界面设计前端页面是网站的重要的一个点，起到一个决定性的作用，是否吸引用户的关键，应有简单明了的为主，让人一目了然，给用户带来良好的体验。4.1.1首页打开网站就能看到玩具首页，展示各类玩具，如图4-1所示：图4-1首页4.1.2登录页面用户输入登陆信息进入主页，大部分登录界面一般都很类似，本系统的界面设计，如图4-2所示：图4-2登录界面4.1.3管理员界面系统首页向用户展示了系统的菜单结构以及系统的所有功能选项，菜单结构主要是树结构的形式，而首页为突出系统也会添加一张带Logo的背景图，管理员界面如图4-3所示：图4-3管理员界面4.1.4修改用户界面修改用户界面上面是文本，下面是文本框直接填写修改内容点击提交，如图4-4所示：图4-4修改用户界面4.1.5订单界面用户购买玩具，可以查看自己的订单，订单的编号、时间、状态、金额和是否处理，如图4-5所示：图4-5订单界面4.2功能模块系统的完整有几个模块，各个功能模块组成一个系统，下面是系统的需要完善的功能4.2.1管理员模块管理员对玩具：上架玩具，对玩具添加介绍、出自、价格、最后添加样品图片。管理员对用户：给用户找回密码，修改基本信息，违法操作给予删除账号。管理员对订单：做出处理，确认订单数量，订单价格，订单是谁购买，发往何处。4.2.2用户模块用户模块的功能设计，用户登录，用户进入主界面购买玩具，用户查看购物车并提交订单，用户修改自己的信息点击确认直接修改。4.3数据库设计每个实体都会建立一张表，表与表之间关系，主表有索引也就是外键，这些表构成本网站的数据库。4.3.1数据库概念设计本系统需要建立的数据库表管理员表、用户表、订单表、玩具表，按照数据库需求画出的E-R图，如图4-6所示：图4-6系统E-R图4.3.2数据库逻辑设计根据以上系统ER图，设计出以下是数据库表管理员、玩具表、用户表等。=1\*GB2⑴管理员表管理员表用来存放管理员的账号信息如表4-1所示：表4-1管理员表字段名字段类型描述idint管理员idloginNamevarchar(50)姓名loginPwdvarchar(50)登陆密码=2\*GB2⑵用户表用户表用来存放用户信息表4-2所示：表4-2用户表字段名字段类型描述idint用户IDloginNamevarchar(50)登录名loginPwdvarchar(50)密码emailvarchar(50)邮箱phonevarchar(12)电话addressvarchar(50)地址=3\*GB2⑶玩具表玩具表用来存放玩具商品信息，有玩具id、类别、玩具名、玩具介绍、价格等，设计的详细信息，如表4-3所示：表4-3玩具表字段名字段类型描述toyIdintIDtoySeriesIdint类型toyNamevarchar(50)名称toyPriceint价格toyImagevarchar(50)样品图片=4\*GB2⑷类型表类型表用来存放玩具类型的信息，有id，玩具类型等，设计的详细信息，如表4-4所示：表4-4类型表字段名字段类型备注seriesIdintidseriesNamevarchar(50)类型=5\*GB2⑸订单表订单表用来存放用户购买玩具的信息，有用户id、玩具id、价格总额的详细信息，如表4-5所示：表4-5订单表字段名字段类型备注carIdintIDuserIdvarchar(50)用户idtoyIdtimestamp订购时间countint金钱总额=5\*GB2⑸主订单表主订单表用来存放用户购买玩具的信息，有用户id、购买时间、金额的详细信息，如表4-6所示：表4-6主订单表字段名字段类型备注userIdint用户idOrderTimeint订购时间OrderStatetimestamp数量OrderPriceint金额5系统实现5.1主页实现主页实现，可以看出不是很美观，第一排导航以及用户登陆注册，第二排是一个动态玩具图片展示，每隔一秒切换，第三排就是玩具展示，玩具图片名字和价格，如图5-1所示：图5-1网站主页主页核心代码如下：<divclass="container-fluid"><divclass="row"><divclass="col-10mt-5offset-2"><h3><iclass="fafa-book"aria-hidden="true"></i>玩具展示</h3></div><divclass="col-2offset-2"><divclass="cardtext-centermt-4float-left"style="width:18rem;"><imgsrc="static/images/toy/1.jpg"class="card-img-top"alt="..."><divclass="card-body"><h5class="card-title">大黄蜂</h5><pclass="card-text">售价：62</p></div></div></div><divclass="col-2"><divclass="cardtext-centermt-4float-left"style="width:18rem;"><imgsrc="static/images/toy/2.jpg"class="card-img-top"alt="..."><divclass="card-body"><h5class="card-title">紫色玩具小熊</h5><pclass="card-text">售价：23</p></div></div></div>5.2管理员登陆主界面管理员登陆主界面，管理员对玩具类型进行管理，对玩具上传、修改，用户提交订单管理员会对订单确认，做出派发或者作废处理，最后就是管理员对用户进行维护，忘记密码联系管理员帮你修改重新登陆，如果用户违法操作给予删除操作，如图5-2所示：图5-2管理员主界面管理员管登陆核心代码如下：@RequestMapping(value="adminlogin",method={RequestMethod.GET,RequestMethod.POST}) publicModelAndViewlogin(Admina,HttpServletRequestreq){ ModelAndViewmav=newModelAndView(); booleanresult=adminService.login(a,req);//管理员是否合法和密码是否正确 if(result){//正确进入主页 mav.setViewName("main"); }else{ mav.setViewName("adminlogin");//返回登陆页面 } returnmav; }5.2.1管理员对玩具进行管理点击新增按钮，管理员会添加玩具，玩具的名称、类型、摘要、介绍、价格，玩具的样品图片的更换、提交、对图片进行旋转保持正确，如图5-3所示：图5-3管理员对玩具管理界面管理员管理玩具核心代码如下：@RequestMapping(value="updateToy",method={RequestMethod.POST,RequestMethod.GET}) @ResponseBody publicbooleanupdateToy(Toytoy){ booleanresult=toyService.updateToy(toy);//修改玩具 returnresult; }5.2.3管理员对用户管理用户忘记登陆密码可以找管理员修改密码，对用户进行一系列操作，如图5-4所示：图5-4管理员对用户管理管理员添加用户核心代码如下：@RequestMapping(value="addUser",method={RequestMethod.POST,RequestMethod.GET}) @ResponseBody publicbooleanaddUser(Useruser){//管理员添加用户 booleanresult=userService.addUser(user); returnresult; }当管理员对用户进行修改就会出现对普通用户修改，接着提交信息就修改完成，如图5-5所示：图5-5管理员修改用户界面核心代码如下：@RequestMapping(value="deleteUserById",method={RequestMethod.POST,RequestMethod.GET}) @ResponseBody publicbooleandeleteUserById(Useruser){ booleanresult=userService.deleteUserById(user);//删除用户 returnresult; }5.3用户功能实现5.3.1用户登陆进入主界面功能实现用户登陆进入主界面，购买玩具，查看购物车，提交订单，修改个人资料，如图5-6所示：图5-6用户主界面用户登陆核心代码如下：@RequestMapping(value="userlogin",method={RequestMethod.GET,RequestMethod.POST}) publicModelAndViewlogin(Useruser,HttpServletRequestreq){ ModelAndViewmav=newModelAndView();//用户登陆 booleanresult=userService.login(user,req); if(result){//成功进入主页面 mav.setViewName("main"); }else{//错误进入用户登陆页面 mav.setViewName("userlogin"); } returnmav; }用户购买玩具可以点我的购物车，生成我的订单，最后确定我是否要这个玩具，提交订单，如图5-7所示：图5-7用户购物车界面购物车核心代码如下：@RequestMapping(value="deleteCarById",method={RequestMethod.GET,RequestMethod.POST}) @ResponseBody publicbooleandeleteCarById(Carcar){ booleanresult=carService.deleteCarById(car);//删除购物车 returnresult; }5.3.2用户查看自己的订单用户提交订单，就会发往管理员确认发货，自己可以在我的订单查看，如图5-8所示：图5-8用户订单界面订单核心代码如下：@RequestMapping(value="addMainOrder",method={RequestMethod.POST,RequestMethod.GET}) @ResponseBody publicintaddMainOrder(MainOrdermainorder){ inti=mainOrderService.addMainOrder(mainorder);//添加新订单 returni; }用户修改自己的信息，更换地址，联系方式以及电子邮箱，如图5-9所示：图5-9用户修改界面用户修改密码核心代码如下@RequestMapping(value="updateUserPwd",method={RequestMethod.POST,RequestMethod.GET}) @ResponseBody publicStringupdatePwd(Useruser,HttpServletRequestreq){ Stringflag="false"; booleanresult=userService.updatePwd(user);//用户修改密码 if(result){ flag="true"; } returnflag; }6系统测试6.1测试目的测试是为了网站的最终质量，是否存在Bug，从各个功能板块进行测试，制定测试方案，根据方案进行一步一步测试，测试完成得到最后的网站。6.2测试过程6.2.1管理员功能测试管理员进入系统前要先进行登录，登录成功后会跳转到主界面。登录失败会跳回到登录界面并显示错误信息，如图6-1所示：表6-1登录测试用例表用例编号用例描述输入/操作预期结果实际结果AdminTest_1没有输入信息登录报错，页面提示请输入账号和密码一致AdminTest_2输入的账号不存在密码：admin1登录报错，页面提示请输入账号一致AdminTest_4输入了错误的账号密码账号：admin密码：1234登录报错，页面提示账号或密码输入错误一致AdminTest_5输入正确的账号和密码用户名：admin密码：123成功登录，跳转到主界面一致图6-1管理员登陆成功页面6.2.2玩具功能测试管理员对玩具进行整理，玩具进行上架，图片显示，制定价格，如图6-2所示：表6-2玩具上传测试用例表用例编号用例描述输入/操作预期结果实际结果ToyTest_1没有输入信息玩具名字不为空一致ToyTest_2玩具名相同变形金刚已有该