网上购物系统毕业设计论文.pdf

摘要本设计主要针对网上购买台式电脑零件进行。首先分析了在网 上购买电脑和电脑零件的前景和优点，阐述了在网上购买的需求。分 析了数据库技术和其他开发工具，并使用适合的技术来开发本网站。设计阐述了网站的数据库实现，并对系统进行测试。最后指出了存在 的问题和不足。关键词：网购；电脑零件购买网站；网站开发；2This document is produced by free version of Print2Flash.Visit fbr more information目录弓I言.4一 需求分析.51.1市场需求分析.51.2网站功能需求分析.51.3系统开发环境和软件.6二总体设计.82.1电脑销售网站设计流程.82.2网站注册功能.92.3网站的登录功能.102.4网站商品收藏功能.11三数据库设计.123.1.user（用户）.1232con）uter（电脑表）.12四系统的实现.134.1登录与注册.134.2主要功能模块.15五网站系统测试.215.1登录测试.215.2电脑销售入账测试.225.3采购出入账测试.245.4历史记录查询测试.265.5兼容性测试.275.6测试总结.27总结.28致谢.29参考文献.303This document is produced by free version of Print2Flash.Visit fbr more information引言随着网络经济的发展，人们购物方式产生了巨大改变，电子商务 成为了一种主要购物方式。电脑是人们学习生活和工作主主要工具。电脑分为台式电脑和笔记本电脑。笔记本电脑主要是方便携带，而台 式电脑则比同价位笔记本电脑配置要好。而台式电脑也分俄日两种：组装机和品牌机。品牌机是电脑配置相对平衡，不会有哪个突出很好,也不会有哪个很差。而组装机则是根据客户自己的需求对哪一部分比 如显卡，主板，CPU诸如之类的要求或高或低。在此条件之下，一个能单独选择购买零件和按照客户需求对电脑 进行配置组装的电脑零件购买网站就应运而生。此网站设计主要应用 了 html+css技术和mysql数据库jsp技术，设计网站在技术上、客 户需求上、财力支持上切实可行。此次网站设计对系统进行了需求分析，并分析了相关流程，阐述 了系统的设计思想与项目规划，然后就是展示系统的关键界面和实现 相关功能操作，最后是测试系统主要界面与主要功能的实现。并把测 试结果用文字表述出来。4This document is produced by free version of Print2Flash.Visit fbr more information需求分析1.1市场需求分析台式电脑零件购买网站开发设计的目的是为了实现电脑采购管 理的便携和系统化，让人们购买电脑更加方便。本系统分为用户管理、商品购物管理和商品售后服务。系统用户管理主要是用户注册用户访 问等信息，商品购买管理主要是电脑及设备购买情况的记录，商品售 后主要是对商品售出后的维护跟踪事务。系统要求：(1)操作简单：界面设计出直观且简单的前端UI,能够让用户 一目了然的操作，能让管理员能够快速上手后台系统。(2)操作流畅:优化了本系统的逻辑代码，在不损坏功能的情况 下精简了代码，完善了很多的逻辑代码。(3)代码可维护性高:公共了许多工具类，将代码拆分了许多小 块，能随时更改代码，而不影响系统运行。1.2网站功能需求分析1.2.1功能划分1.用户注册登录5This document is produced by free version of Print2Flash.Visit fbr more information2.首页商品展示3.根据用户需求推荐4.商品收藏及确定购买5.关于网站6.联系方式1.2.2功能描述1用户注册登录点击我的账号选择注册或者登陆。2商品挑选点击查看展示的商品属性。3商品推荐填写需求对商品进行筛选。4商品购买点击已收藏或新商品进行购买。5查看网站点击首页查看网站内容。6联系方式点击联系方式查看。1.3系统开发环境和软件1.硬件及软件平台操作系统：Windows；开发工具：D reamweaver,Sublime,Adobe photoshop2.数据库软件MySQL是一个关系型数据库，由于它方便快捷易使用的特点导致 它现在很受当代程序员们的欢迎，当然也是现在较为流行的数据库管 理系统。MySQL除了开放它的源代码之外，较重要的地方是在于随着 时代的进步，科技的发展，版本的升级，它的功能也愈加完善。6This document is produced by free version of Print2Flash.Visit fbr more information 在MySQL中，对数据库的基本操作有：建立数据库、建立表结构、数据操作、组织数据、存储数据、管理数据、维护数据和修改数据等 操作。MySQL操作起来的过程以及结果都是非常清晰明了，操作数据 库和表结构起来是非常简单的，其操作性较强。用MySQL来作为关系数据库开发具有很多的可实用性，现代社会 中，许多个人网站以及企业网站开发设计的程序员们都喜欢用MySQLo 不仅仅MySQL所占内存小，速度又快，有可以降低网站开发的成本，并且还具有开放源代码的特点，这就是我为什么选择MySQL作为后台 开发平台的原因。3.htmlHtml:超文本标记语言(Hyper Text Markup Language),是我 们网页最常用普通的语言了，在经历了多个版本的发展，已经发展到 5.0版了，即HTML5。通过观察网页源代码我们可以从中知道：制作 网页的语言是用”括起来的.有些是成对出现，有些不是 我们称这样用尖括号括起来的语言为HTML,它是 Hyper Text Markup Language的首字母简写，它的意思是超文本标 记语言，超文本指的是超链接，标记指的是标签，是一种用来制作 网页的语言，这种语言由一个个的标签组成，用这种语言制作的文 件保存的是一个文设计件，文件的扩展名为.html或者,htm4.Csscss 级联样式表(Cascading Style Sheet)简称“CSS”,又称 为“风格样式表(Style Sheet)”，用来进行网页风格设计。Css7This document is produced by free version ofPrint2Flash.Visit for more information 通过设立样式表，可以有效统一地控制HTML中各标志的显示属性。级联样式表可以使人控制网页外观。使用级联样式表，可以精确指定 网页元素位置，外观以及创建特殊效果。二总体设计2.1电脑销售网站设计流程电脑销售网站需要实现的功能是用户管理和商品购买管理。用户 注册后可登录到本网站，在电脑购物网站内主要有这几个功能模块：选择电脑、查找电脑基本属性、添加收藏或直接购买，确定型号、数 量。最后支付款项。8This document is produced by free version of Print2Flash.Visit fbr more information付款购买图2-1电脑网站流程图2.2网站注册功能尚未注册和注册过的客户都可点击每个页面右上方登录注册可 直接注册如果以后想继续登录本网站可选择记住账号，当忘记自己的 密码时可点击忘记密码来找回密码。已注册的客户可以选择输入账号 与密码来登录网站。注册|脉荻取佥正码庐验证码fi密码剧确认密码立即皿图2-2系统注册界面9This document is produced by free version ofPrint2Flash Visit for more information2.3网站的登录功能图2-3就是此系统的登录界面，在登录时可以选择注册的账号登 录或者手机登录。会有验证码来判断是否是机器登录，全部输入正确 之后点击立即登录即可登录。用户登录图3-1系统登录界面10This document is produced by free version ofPrint2Flash Visit for more information2.4网站商品收藏功能在选择好自己心仪的商品后可点击收藏，如果想增加购买数量可 直接在数量一栏输入直接想要的数字。或者点击页面右上方的收藏图 标查看自己的商品和选择直接查看已收藏。在选择好商品后在商品旁 边选择购买数量然后选择送货地址，最后进行付款。11This document is produced by free version of Print2Flash.Visit fbr more information三数据库设计3.1.user(用户)表3-1用户表名称类型（长度）允许为空主键描述UsernameVarchar(40)Not nullYes用户名PasswordVarchar(15)Not Null密码telephoneVarchar(10)Not Null电话用户表主要实现对用户的管理，用户源于网络电脑购物，对用户的管 理主要是用户名和用户密码，电话方便以后与用户直接联系。在表中 用户名是主键，具有维一性。puter（电脑表）表3-2电脑表名称类型（长度）允许为空主键描述cmidInt(50)Not nullYes电脑编号cmNameVarchar(20)NotNull电脑名字price1 nt(6)NotNull单价该表主要记载电脑和相关配件的基本信息，cmid是电脑的主机12This document is produced by free version of Print2Flash.Visit fbr more information 号，是惟一的，电脑品名区分比较复杂，常用的是电脑的型号，在电 脑信息中价格是不可或缺的要素。表3-3订购表3.orde（订购表）名称类型（长度）允许为空主键描述idInt(20)Not nullYes购物编号numint(4)NotNull数量costint(20)NotNull金额orderdate(10)NotNull日期Customerchar(10)NotNull消费者四系统的实现本部分详细介绍项目的各个模块分别是登录注册模块、电脑销售 模块、出库入库管理模块和采购模块。4.1登录与注册利用的html+cs技术实现登录注册界面，在进行界面的编码过程 中尽量采用CSS与html代码的分离，采用链接的形式实现其功能。这样便于代码编写且界面更美观，便于代码的更新与调整。界面效果如下：13This document is produced by free version of Print2Flash.Visit fbr more information用户登录图4-1登录注册模板通过嵌套技术的div方式实现界面登录注册的功能，首页from表单代码：14This document is produced by free version ofPrint2Flash.Visit for more informationlabel style=color登录信息界面用于用户输入用户名与密码。用户输入的名称和密码并通过 from表单提交到数据库查询。通过检索数据库返回的ture或者false 判断用户是否已经注册，没未注册或注册不成功，则提示用户点击到 注册界面。用户注册界面与常用注册方式相似。后台有数据管理用户 信息，当将用户注册信息与库存中的信息一致时显示注册成功，否则 注册失败。员工也权限了查看自己的账号信息，并修改修改自己信息。创建数据表格通过常用的属性来实现：通过jQuery EasyUI的 datagrid下colunms属性field得到属性名,title设置表格名称，width用来设置表格宽度。4.2主要功能模块4.2.1商品采购模块电脑采购销售模块通过用户输入采购订单的商品数量、商品名 称、商品价格，商品编号提交到数据库，数据库存入值后，会返还一 个值，jsp通过判断值，提示用户商品购买成功或者购买失败。如果 购买成功其值会显示在商品购买界面，并通过计算界面会自动计算采 购的金额。15This document is produced by free version of Print2Flash.Visit fbr more information首页I订单欧X幽显E 刁V商品 m峥单折 蟾 小寸瑜单 派御琨御琨潇1割新盼 2017052356251256 m2255吏易完成 有&无 丁单 产廊阱演产钢产影棒 2017052356251256 x2255变易完成 血濯 无 棉溜?喻衡瑁捆产繇靖产协 2017052356251256 X2255吏易完成 囱事 无图4-2电脑采购订单模板4.2.2电脑销售模块商品销售模块通过使用者将订单输入数据库中，然后通过无刷 新技术实时的将数据库中的信息进行显示。也能将订单处理后直接进 行交易金额的计算。用户也可以直接再界面上对产品的商品名、商品 数量、商品编号、等等进行直接的修改，修改完成后会有消息弹窗，让用户进行修改的确认，以免出现用户出现误改的操作，减免不必要 的失误性质的操作。16This document is produced by free version of Print2Flash.Visit fbr more information筮货订毕g口全选订单精单价_l销榜订单tAfiiES产虽介籍产品海产昂海产狷介缉=昂河 20170523561255x2无l瞧订单己源麦n.产动宙吊介翁产品介绍产丽阔产品介绍 2017052356251256*2i的t 亩#无.产沛捋（产松品泌产=品介缎?017fl52S5fi?51S?5fi2*M亮成 页#无:IMI图4-3电脑采购销售模板部分代码如下:查询采购支出post方法paramparamthrowsthrowsrequest客户端请求服务器response服务器响应客户端Servlet Exception 抛出 servlet 异常 lOException 抛出 io 异常doP ost(HttpServletRequest request,/*；*I*I*I*I*/public voidHttpServletResponse response)throws Se rvlet E xc ept io n lOException response.setContentType(,text/html);request setCharacterEncoding(,UTF-8);response.setCharacterEncoding(,UTF-8);P rintwriter out=response,getWriter();调用采购支出详情单座层P urchaseDetailDao purchaseDetailDao=new P urchaseDetailDao();放入List集合ListHst=purchaseDetailDao.selectMoney();转化成son格式DSONArray jsonObj=DSONArray./ro/nObject(list);返回到前段页面out.print(jsonObj);17This document is produced by free version of Print2Flash.Visit fbr more information4.2.3出库入库模块电脑出库入库与电脑的采购销售有关，本系统仓储库的重要性显 而易见，占有较大比重。其实际代码实现相对简单，本系统只设立单 位个仓库，例表的个数减少，代码更容易实现。也不要考虑表之间的 关联性，便于系统的设计与实现。其问题是系统就比较简单了。价措H:传存稣价序I厂显示停用超 显云停用商品 过滤显示全羯商品IBB|总会库库房曲|产品听WanS&爆悟_里号 j f盹 i 施 费120 9600图4-4出库入库模板实现代码如下：columns:field:cmld1,title:商品编号1,width:90,align:center,field:cmName,title:商口名称1,width:100,align:center,(field:telephonetitle:电话)；猎取当前日期van curr_time=new Date();van strDate=curr_time.getFullYear();strDate+=curr_timegetMonth()+1;strDate+=curr_time.getDate();strDate+=+curr_timegetHours();strDate+=curr_time.getMinutes();strDate+=curr_timeagetSeconds();$(fpold)val(strDate);J CtpoaTime).datebox(onSelect:function(date)var nowDate=new Date();if(datenowDate)$(#poaTimen).datebox(setValue,);18This document is produced by free version of Print2Flash.Visit fbr more information);用户输入的信息是通过jsp来获的，其过程是是先将数据提交到 servlet,然后servlet得到数据，并提交到相应的表,并返回给对应 的JSp页面分页显示。4.2.4 JBBC链接数据库数据库链接是实现系统的关键步骤。JD BC技术是目前数据库连 接的主要方式，它是一个应用于链接数据库的一个中间层。其主要的 功能是实现用户对数据的操作。JBBC对于链接数据库的关键代码如下：public static Connection getConncetion()try Class.forName(forName);conn=Driveranager,getConnection(urL,user,password);/sta=conn.createStatement();Syst em.out.println(链接成功”)；catch(ClassNotFoundException e)/TODO Auto-generated catch blocke.printStackTrace();catch(SQLException e)(/TODO Auto-generated catch blocke.printStackTrace();return conn;数据封装是实现数据库案例性操作的重要方式。用户对数据库实 行增删修改等和都需要先结数据据库进行，数据库封装后，通过调用 getConntion方法能实现对数据库的基本操作，数据库的增加修改删 除等容易实现，使用Connection方法实现对于数据的链接的，其主19This document is produced by free version of Print2Flash.Visit fbr more information 要对象有用户的url、用户名、与密码。编译sql语句常用 preparedStatement方法，利用insert语句实现数据增加、ALTER可 实现对数据库的修改，数据操作后数据行会发生变化，需要将变更后 数据返回给控制层，并判断其成功与失败。利用SQL语句查询数据信息是一种最常用的操作。其基本格式 Select查询语句，数据查询后，放入list集合中，并将其返回在 servlet的控制层接收中接收最后再转换为json格式返还给jsp,这 些数据是需要给项目使用者看到的。public static Staff selectStaff(String user,String password)(/查询数据表中表员工用户名密码String sql=use tv select*from user where userName=,n+user+1 and password=,+password+System get St ring(u serName);得到 staffIdP wdString staffIdP wd=rs.getString(,password);sta=new Staff(staffName,staffIdP wd);catch(SQLException e)(/TODO Auto-generated catch blocke.printStackTrace();finally J DBC.cLose(ps);return sta;在数据库操作中数据的删除有特殊的要求，用JD BC链接数据库中 的表数据，不能用drop来删除，如果不慎删错就会造成数据不可恢 复，会造成很大的经济损失，是不可挽回的错误，因此删除表数据应20This document is produced by free version of Print2Flash.Visit fbr more information 该使用delect进行删除操作。系统开发经历了分析、设计、编码、检测和实现。付出了很多的 时间与精力，功能实用且基本能上能实现。问题主要是系统项目未能 实现对用户系统权限的合理管理。所有用户都进入功能界面，理论上 讲每个因为其所使用的板块不同，应该拥有不同的权限。因为精力和 技术的原因，本项目未能实现此功能。系统中没有专业的财务管理，对客户管理只有注册功能，使用功能，但没能实现对客户数据动态管 理。系统中数据统计的功能也有诸多漏洞，待以逐步解决。在市场需 求方面有所考虑但不足，在未来的使用过程中不断去改进，推出更多 的版本，以适应不同的市场需求。五网站系统测试网站系统测试是网站建设的最后一个环节，也是最重要的一个 环节，网站测试是检验网站所遗漏忽略的问题，网站是否能正常运行,功能是都都已经正常实现，页面之间的链接是否有错误。总而言之，网站测试是产品展示的最后一个环节，就像是产品最后的质检员一 样，检查网站作品是否已经完美的完成是否合格符合要求。5.1登录测试用户登录有需相应权限的账号。为保证其安全性，采用验证码验 证技术，验证码图片由程序代码随机生成，每访问一次验证码自动更21This document is produced by free version of Print2Flash.Visit fbr more information 换。账号及验证码核验成功后，点击登录即可进入主界面用户登录如图5-1用户登录界面5.2电脑销售入账测试晶销售详情11111财务销售报表每危示砌,10斯有订单 巳成京订单 I 待成立订单 I 客户已退旅订单 I 待审咳壁订单单号订单阴总鳞申请吱伽间s理曲1001Xssr-52g720171226092 8T0?002017-12-26 09 28:03无22This document is produced by free version of Print2Flash.Visit fbr more information图5-2待成交订单管理1.审核该订单点销售详情国财务销售报表xssr-5Z972ClTl226092STO箪1到-条记,U 1条策1到缅名称 S 单价 药品艘板盈眼 5 20小计-X*51|Tn 小图5-3电脑审核订单2.审核成功每夏1。庭:肆号JJJ-订单烟岫女付时门=理由支操作1001Xssr-529720 L 7122S09287O50020LT-12-26 09:28:C3天a痢图5-4审核成功3.单击查看详情易销售徉情匾财朝害报表图5-4查看已审核订单5.审核退款订单。23This document is produced by free version of Print2Flash.Visit fbr more information金 销售详情 I Lkl财各销窖报表所有订单已成央订单 I 待藏订单 I 客户巳退撕单 待审单每页导慈数：1。，搜秦单号ID*订总逾申请渤时间e理由玄1012xsz C-TB62O m 2260934650待审核5124Z01-12-26 09：34：39攥作廉程图5-5审核退款单6.单击立即审核。区财各销gw金铮雪洋情图5-6审核成功7.单击通过。可以看到单号为1012的订单就是已审核通过的订单。每卖导?;|10_ T建1_单号in 订单漏号 WA 总金徐申请疫伺肘同=理由 支付1气 操作1012 x si C-T986201712260S4650 刘迷龙 51242017-12-26 09:34:39 操乍赫图5-7已审核通过的订单5.3采购出入账测试1.单击未支付订单24This document is produced by free version of Print2Flash.Visit fbr more information曷采购朔 I 固财务采购指表腌订单 I 已政订单 I 订单 I 或啊单 液单10*单号审梭人申iS/支甘8词#理由控作p替就Fifififl7ni7-1P-?S刀，胡4 03iegwe-2传审核0201T-11-P.天第1到2景记录，釜2条图5-8审核未支付订单2.单击立即审核品判游 16 I bm财痊瓣赧表I瞬i图5-9立即审核所有订单已蹈订单订单已支何订单菽何订单哄:每|10单中D，洋倚早号审核人中谕支网时间令理由支1cg:c-09532338329刘泽龙56602017-12-25 23:38:41无图5-10成功审核支付在通过各部门严格审核后，客户退款订单的审核步骤:1.单击未退款订单，单击立即审核。25This document is produced by free version of Print2Flash.Visit fbr more information苜其衲出入2.待审核成功，查看已退款订单。W首页，采购由入账苜理曷采购详情Urt财务采购报表：4dE订单已踽订单巳支付订单订单每面异1C心；所有订单忌金申请役何1捐5理由sms操作1cssr-9685085241642092017-12-26 08:52 57届里间颗EM第到1条记录，共1条图5-12查看订单详情5.4历史记录查询测试以下是项目测试的结果:26This document is produced by free version of Print2Flash.Visit fbr more information盗首K 瞧信息查词-C I慧：订单总全教=市湖间 5洋情蹒余桀 i100151242017-12-26 09:36:5查看订单详情99034251001；00017-12-26 09:3。：由查看订单详情000004010035000201T 12 20 09:20:20查看订单详情9990891003W2O9201T-12-28 09.20.55堇看门单洋情：0004209刘总iDoooom2JJT-J1-2T医芝公司.0000000第1利5粲记录.共5条上-页Q T-J图5-13历史记录5.5兼容性测试软件兼容性测试是指检查软件之间能否正确地进行交互和共享 信息。随着用户对来自各种类型软件之间共享数据能力和充分利用空 间同时执行多个程序能力的要求，测试软件之间能否协作变得越来越 重要。软件兼容性测试工作的目标是保证软件按照用户期望的方式进 行交互。5.6测试总结在计算机领域的一切作品都不是完美的，在编写过程中总会有错 误出现，而网站测试便是为了找出网站中的bug,并方便我们做出针 对性改进，使网站中的错误减少能更好的服务客户，为客户提供更好 的体验。当然了网站设计存在很多不足，对网站的制作细节的把控都不 够好。规范性和科学性都有待加强。在以后实际工作中不断完善。27This document is produced by free version of Print2Flash.Visit fbr more information总结这么长时间的努力，我的网站也完成了，感谢杨立雄老师的指导 和帮助。本次毕业设计的完成也意味着我大学的学习生涯也即将结 束。在此次制作中也遇到一些难题，但还是有各种各样的办法来应对。对制作网站也增加了许多新的知识。在之前学校里的时候对待这些知识都不怎么认真，总感觉学到的 东西不深刻，但是这次毕业设计的制作我感觉自己对以前知识的应用 熟练了许多。以前学的东西并没有太多机会自己动手实践一下，理论 联系实际不够。通过毕业设计熟悉了网站制作的基本模式，基本技术 和基本思路，为网站建设积累了宝贵的经验，也让我知道了更多学习 之外的事情。在做完设计后，我感觉自己对html和mysql、D reamweaver,Sublime,Adobe photoshop 设计中用到的技术提高了不 少。总的来说，有付出有回报，尽管有不足，但必竞迈出了可喜的一 步，真是学习生涯中一段不错的经历。28This document is produced by free version of Print2Flash.Visit fbr more information致谢首先感谢我的指导老师杨立雄老师，还有我所有的任课老师，没 有他们的教导我是不可能会知晓这么多的知识的。他们所教授的每一 点知识都是我在本次毕业设计制作和以后的工作生涯中不可或缺的。这次的毕业设计我参考了大量的文献和学者们的研究，为我奠定 的良好的基础，然而我只是一个在此方向的一个菜鸟，还有很多不曾 理解不曾知晓的东西。所以难免会有很多不足的地方。请老师们对我 提出意见和指导。三年时光一瞬而过，我也从当初懵懂无知的大一新生到现在即将 毕业的老学长了。这次的毕业设计也代表我大学生涯的结束，代表着 我即将踏入社会开始工作了。同时也要感谢我的同学和帮助过我的学长学姐们，他们的帮助让 我在大学生活不至于那么迷茫，有了自己的方向。最后，感谢学校对我们的栽培与教导，不管是以后的工作还是生 活我都不会忘记母校的校训和教诲的。29This document is produced by free version ofPrint2Flash.Visit for more information参考文献1 温谦.HTML+CSSEM.人民邮电出版社,2016,11.2 郑阿奇.MySQL实用教程（第2版）M.电子工业出版社,2016,6.3 王雨竹,HTML5入门经典D.机械工业出版社,2013,14 许莉.HTML与CSS前台页面设计D.中国水利水电出版社,20105 卢淑萍J avascript与jquery实战教程D.清华大学出版社2014-116 李东博.HTML5+CSS3从入门到精通D.清华大学出版社,2013,067（美）迈耶.CSS权威指南D.中国电力出版社.2010,430This document is produced by free version of Print2Flash.Visit fbr more information