jsp生成工具的设计方案说明书

PAGEPAGE1目录ＴOC\o"1-3"＼h\z\uHYＰEＲＬINK\ｌ"_Toc3601０8８46"一、网站概述ﻩPAGERＥF_Toc３６０108846＼h1ＨYPERLＩNK\l＂_Toｃ3601０884７”１.1开发背景ﻩＰAＧＥREＦ_Toc3６0１０８８４7\ｈ1ＨYPERLINK\ｌ"_Toc360１０８８48"1。２系统环境ﻩPAGERＥF_Toc３6０1０8848\ｈ２HYPEＲＬＩNK二、系统设计 PAGEREＦ＿Toc36010８８４９\h3HYPEＲLINK＼ｌ"＿Toｃ3６01０88５0＂2.１需求分析ﻩPAGERＥF_Ｔｏｃ３6０１０8８50\ｈ3HYPEＲLINK\l”_Tｏc3６0108８５1”2.1.1功能描述 PAＧＥＲＥF_Toc36010８8５1\h３HYPERLINＫ＼l"_Toc360１08852”2.2用例分析 PAＧEREF＿Toc36０10885２＼h4HYPERLINK\l”＿Toc360１088５3”三、美工技术 PAGEＲEF_Ｔoc360１08853＼ｈ６HＹＰERＬIＮK\ｌ"＿Ｔoｃ36０108854＂3．１ｌｏgo设计 PAGＥREF_Toc３6０1０88５4\ｈ6HYPＥＲＬＩNＫ＼l”＿Ｔoｃ3６０10８８55”3.2flasｈ设计ﻩ０1088５５\h6HYPERＬINＫ\l＂_Ｔoc360１08８56"3.3div设计ﻩＰAGEREＦ＿Ｔoc３６0１08856\h6HＹPＥRＬINK\ｌ”_Ｔoc360108８５７"四、界面设计ﻩPAＧERＥF_Toc3６０108857\h８HＹPＥＲLIＮK\ｌ＂_Toc3６0１0８8５８"４．１管理员界面ﻩPＡGEREF＿Tｏc3６0１0885８＼ｈ8HYPERLINK\l＂_Ｔoｃ３601０８８5９"4.１.1登录界面ﻩ６010８8５9＼h8HYPＥRLINK\l”_Tｏｃ３601０8８60”４。１.2类别管理界面 PAGEREF＿Ｔｏｃ３６0１08860＼h8ＨＹPERLINK\l”＿Tｏc3６0１08８61”4。1．3商品管理界面 ６010８861＼h9HYＰＥRLINK\ｌ"_Ｔoc360108８６２”4．1.4订单管理界面ﻩＰAGERＥＦ_Toc360１0８８62\h1０HＹPＥRLINK＼l”_Toｃ36０１08863＂4。2用户界面 PAGＥREF_Ｔoc3６0１08８6３\ｈ１2HYPEＲLINK\l”_Toc３60１08864"4.2.1登录界面 ＰAGEREF_Ｔoc３60１0８8６4＼h12HYＰEＲLINK\ｌ＂＿Toc360１088６５”4．2.2注册界面ﻩPAGEREＦ_Toc３6０１0８865\ｈ13HYＰＥＲLIＮK\ｌ”_Ｔoc3６0108８66＂4．2.3订单管理 PＡGＥREF_Ｔoc360１０8866\h1４ＨＹPERLINK\ｌ”_Ｔoc3６010886７”4。2.４个人管理ﻩPＡＧERＥF_Toｃ3601０8８６7\h15HYPERLＩNK\l＂＿Toc360108８68”4.2．5查看购物车ﻩPＡＧEREF＿Toc3６0108８68\ｈ15HYPＥRLINKﻩ ﻩ ﻩwidth="22０"hｅighｔ=＂80"/＞</dｉv〉不光是这个图片可以引用,其它的图片或是按钮也可以去引用这一段代码。四、界面设计4.1管理员界面4。1.1登录界面本模块最主要得到是系统管理员登录的主界面。该系统主要界面如下图所示：图4-1管理员登录界面４．１。2类别管理界面本模块最主要得到是对商品进行分类管理界面,实现功能主要有添加商品类别和查看修改商品类别。该系统主要界面如下图所示：图4－2类别管理界面主要代码:ﻩ＄("．uｐd"）。ｃｌｉck(ﻩ ﻩﻩfunｃｔion()｛ ﻩ ﻩﻩ ｖaｒjchTd=＄(thiｓ)。parｅnt().pｒev（)； ﻩﻩﻩﻩvarjtｘtTd=＄（tｈｉs)。parｅnt（)．siblinｇs（”。ｃtｙpe")；ﻩ ﻩ ﻩif(＄（thｉs）。ｖal(）＝="更新"）{ ﻩﻩ ﻩﻩ $(thiｓ)．val(”确认"）;ﻩﻩ ﻩ ﻩﻩ ｊcｈＴd.childｒen（）.remoｖeAｔtｒ（”disabled"）； ﻩ ﻩ ﻩ jtxtTd．html（”〈inpuｔvaluｅ=’＂+ｊｔｘtTｄ．ｈｔｍｌ（） ﻩﻩ ＋”＇/＞＂)； ﻩ ﻩ｝elｓe｛ ﻩ ﻩﻩ $（this)．val(＂更新")； ﻩ ﻩﻩﻩjcｈTd.childｒeｎ().ａttr（"ｄisａｂlｅd",”disａblｅd");ﻩﻩﻩﻩﻩﻩﻩﻩjｔxtＴd．html（ｊtxtＴｄ.children(）．vaｌ（));ﻩﻩ ﻩﻩ vａｒisＣheｃkeｄ＝ｊchTd.ｃhildren（)ﻩﻩﻩ ﻩ ﻩﻩﻩ.atｔr（”checked")=＝＂checked”?trueﻩ ﻩﻩ ：false;ﻩﻩﻩ ﻩ ﻩ＄.post("catｅgoｒyAｃtion_ｕpdａteCategory.ａｃtioｎ＂, ﻩﻩ ﻩﻩ ﻩﻩ｛ ﻩ ﻩ ﻩﻩ ＂category．cid”：$（this)．ａtｔr( ﻩﻩ ＂lang"）, ﻩﻩﻩﻩ ﻩﻩﻩﻩ"cateｇｏｒｙ。ctype＂:ｊｔxtTd.hｔｍl(),ﻩﻩﻩﻩ ﻩﻩ ﻩ "cａtegory.cｈｏt”:iｓChecked ﻩﻩ ﻩ ﻩ｝)； ﻩﻩﻩﻩﻩ ｝ ﻩﻩ｝）；４。1。３商品管理界面本模块最主要是添加商品，查询修改商品.该系统主要界面如下图所示:图4—3商品管理界面主要代码：ﻩ functionoption（)｛ﻩ ﻩ＄（”＃ｓhｕjutｄ")。aｄｄClａss（”bg1"）；ﻩﻩﻩ$(＂＃shujｕtｄ＂)。ｍouseoｖｅr（fｕｎctｉｏｎ（）{ ﻩﻩ$（this)．remｏveＣlass（"bg1"）;ﻩ ﻩﻩ$(thｉs）．ｐａrenｔ(）．chilｄreｎ()。ａdｄCｌaｓs("bg"）；ﻩﻩ ｝）.mｏｕseoｕt（fuｎctioｎ(）{ ﻩ ＄(thｉs）.paｒent().chｉldren（）.ｒeｍoveClａss（＇ｂg’）;ﻩﻩ ﻩ＄(ｔhis).ｐarｅｎt(）.cｈildｒｅｎ（）。ａdｄClass（”bg1"）；ﻩﻩ });ﻩﻩﻩ＄（”．del")。click（ｆｕnctｉon（){ﻩﻩ iｆ(cｏnfirm（”你确定要删除这件商品吗?＂)）{ ﻩ ﻩﻩ＄。pｏst（"goｏdｓAcｔiｏn_deleｔeＧooｄｓBｙId．acｔion"，｛ﻩﻩﻩﻩﻩ ＂ｇoods。gid"：goods。gidﻩﻩ ｝）；ﻩﻩ ﻩ //删除自身行ﻩﻩ $（tｈiｓ）。pａｒents（"ｔr:first”).remoｖe（）； ﻩ ﻩ} ﻩ｝）.ｍousｅovｅr（funｃtiｏn(）｛ ﻩﻩ ＄（tｈｉｓ）。css(＂ｃursor”，”haｎd”）; ｝）；4.１。４订单管理界面用户注册主要功能是简略查询和修改.如下图所示：图４－４订单管理界面主要代码：ﻩ＄(”＃ｐａgｅNｏw＂）．change（ﻩﻩﻩ ﻩﻩ ﻩfunctｉon（）｛ ﻩ ﻩ ﻩｗindow。ｏpｅｎ(ﻩﻩ ﻩﻩ ｅNoｗ= $(this).vａl()，”_self");ﻩ ﻩ ﻩ }）; ﻩ ﻩﻩ＄。foｒmValｉdator．ｉnitCｏnfig({ﻩﻩﻩﻩﻩﻩﻩｆｏrmiｄ："foｒｍ1"，ﻩ ﻩ ﻩ oｎeｒrｏr：fuｎctiｏn（msg）｛ﻩ ﻩ ﻩﻩ ﻩalert（mｓg)ﻩ ﻩﻩﻩ ｝ ﻩ })； ﻩ ﻩ ＄("＃csnｙ”）。foｃus（function（){ ﻩ ﻩﻩﻩ WdateＰｉckeｒ(｛ ﻩﻩﻩﻩｓｋｉｎ:’ｗhyGrｅeｎ', ﻩ ﻩonclｅared：ｆuｎctｉon()｛ﻩﻩ ﻩ ﻩﻩ ＄(this).blur（）；ﻩﻩ ﻩ ﻩﻩﻩ},ﻩﻩﻩﻩﻩﻩﻩﻩｏｎpiｃｋeｄ：fｕnction(){ ﻩ ﻩ ＄(ｔhis）．bｌur（); ﻩ ﻩﻩ ﻩ｝ﻩ ﻩ ﻩﻩ ｝);ﻩ ﻩ }）;ﻩ })；４。2用户界面４。2。1登录界面这个模块主要是用户登录。如图所示：图４—5用户登录界面登录主要代码：＜tabｌewidth＝＂２84”ｈｅight="1１3＂border="0＂〉 ＜tr〉 ﻩ〈thhｅiｇhｔ=＂29”ｓcope="col"〉 ﻩﻩ<tａblｅwｉｄth＝”100％”ｈeight＝＂69％"bordeｒ="0"〉ﻩ ﻩ〈tｒ＞ ＜thwidth="３％"height="２1＂ｓｃｏpe=”cｏｌ"/>ﻩ ﻩﻩﻩ＜tｈwidtｈ=”３0％”ｃlａss=”SＴＹＬE3"scoｐｅ="ｃｏｌ"> ﻩ ﻩﻩ用户名: ﻩ〈／tｈ> ﻩ 〈ｔhwiｄth="2％＂sｃｏpe=”cｏl”／＞ﻩﻩﻩ 〈tｈwｉｄtｈ=”６０%"scope=”col"〉 ﻩﻩﻩ ＜inputtypｅ＝”tｅｘt”ｎamｅ=”useｒ。ulogin"iｄ＝＂ｔｅxtｆiｅld"/〉ﻩ </ｔｈ>ﻩ ﻩﻩ<thwidth="2％"scｏpe="ｃol"/><／ｔｒ＞ﻩﻩ</tｈ〉〈/tr></taｂlｅ>4.2.２注册界面这个模块主要是用户注册.如图所示:图4-6用户注册界面主要代码: messaｇes:｛ﻩ ﻩ ﻩ"usｅr．ulogiｎ"：{ﻩﻩ ﻩ requｉred:”登陆名必须填写", ﻩ ｒａnｇeleｎgth：jQｕery.fｏrｍat（"※输入字符长度应该在 ﻩ ﻩﻩﻩremotｅ："对不起！!!此用户名已经被占用” ﻩﻩ ﻩ},ﻩﻩﻩ ”useｒ。unａme＂：｛ﻩﻩﻩ reｑuｉred:"※必须得填写真实姓名＂ ﻩﻩﻩﻩ}， ﻩﻩﻩ＂user．upaｓs"：{ ﻩﻩ ﻩﻩrequｉrｅd：＂请填写密码!！!＂,ﻩﻩﻩﻩﻩ rangelength:ｊQuｅry.format（”密码的字符长度 ﻩﻩ｝,ﻩ ﻩ ﻩupass2：{ ﻩ ﻩﻩeｑualＴo:”两次密码输入不全都.。。"ﻩ ﻩ}, ﻩﻩ ﻩ”ｕsｅr。ueｍａil＂：{ﻩ ﻩ ﻩﻩｒeｑuirｅd:"请填写Ｅ－mａil地址！!！”， ﻩﻩﻩ eｍａil:"请输入正确的Ｅ—mａiｌ地址＂ﻩﻩﻩﻩ ｝, ﻩ ﻩﻩｃcｏde：{ﻩﻩ ﻩ ﻩｒｅquirｅd:＂必须填写验证码", ﻩrｅmote：＂您输入的验证码错误"ﻩﻩﻩ },"uｓer.ｕｐoｓt＂：{ﻩﻩﻩﻩ requｉreｄ:”请填写邮政编码”, ﻩﻩﻩﻩnｕmbｅｒ:”请输入数字",ﻩﻩﻩﻩﻩﻩrangｅlengｔh：jＱｕery．forｍat（”输入的字符长度应该是{０｝位＂) ﻩ}，"user。ｕadｄｒess”:｛ ﻩrequired:”请填写您的简略地址，可更好的送货"ﻩﻩﻩ ﻩ｝ﻩﻩ ｝ ﻩ｝）;４.２．3订单管理这个模块主要是订单管理,主要功能有查看订单，删除订单，订单支付.如图所示:图4－７用户订单管理界面4。２。4个人管理这个模块主要是账户管理、个人信息管理。如图所示：图4-8用户个人界面4．2.5查看购物车这个模块主要是查看购物车，查看自己要买的东西。如图所示：图４－９用户查看购物车4。2.6检索商品这个模块主要是检索商品，以最快的速度找到自己想要的商品。如图所示:图4－10用户检索商品界面总结回顾该系统从选题，到调研、需求分析、设计、编码实现、测试等，论文的撰写,这系列连贯的过程,感想颇多,收获也很多.大致的总结几点,如下：1.设计开发一个管理系统,首先要了解所涉及到行业的现状,肯定要想方法进行行业调研，从不同途径猎取该行业的专业知识。合理支配系统设计开发时间,进行实际开发会发现需求分析与系统设计占主要的时间，如果前面的工作做好了，编码实现占用的时间很短.再依据所了解的情况进行简略的编程阶段.2。在开发一个系统时,前期的分析筹备工作格外的重要。对于系统的需求要明确,这样才能做到有的放矢.格外是对于系统中数据的存储和表单格式的设计，设计的不好会消灭会消灭大量的数据库内存的浪费和页面与数据库连接不成功等问题。３．在设计的初期，对一个网页功能模块，要构想出简略的方案，这样可以依据所需要完成的功能来进行编写,从而使设计方案更加完善,设计开发过程中肯定要吸取阅历教训,避开返工.尤其是一些重要语句。在对简略实现功能进行编程时,要养成良好的加注释的习惯,这样的话不仅能理清思路，而且可以为以后的调试程序带来很大的便利.４.懂得充分利用网络资源，由于个人的思考方式是格外有限的，所以需求通过网络来寻求帮助,网络资料后得出的.由于在资源的量很大及其它缘由，只能靠自己依据已有的书籍资料对网络资源进行分析总结，这无形当中培育了我通过网络猎取资料信息的能力.

参考文献[1］（美）ＥrｕceＥｃkeｌ。Javａ编程思想（第4