化妆品大世界网站设计与实现

1、济源职业技术学院济源职业技术学院 毕毕 业业 设设 计（论计（论 文）文） 题目化妆品大世界网站设计与实现 系别信息工程系 专业计算机网络技术专业 班级计网 0804 姓名韩菲 学号 指导教师苏文芝 日期2010 年 11 月 18 日 目 录 摘 要.II ABSTRACT.III 第 1 章 引言.- 1 - 1.1 任务概述.- 1 - 1.2 需求概述.- 1 - 1.3 设计目标.- 2 - 1.4 运行环境.- 2 - 第 2 章 总体设计.- 3 - 2.1 网站总体模块概述.- 3 - 2.2 网站总体功能介绍.- 3 - 2.3 功能分配和模块设计.- 4 - 2.4 数据库

2、设计.- 5 - 第 3 章 模块详细设计与实现.- 8 - 3.1 模块功能详细描述.- 8 - 3.1.1 网站的流程图.- 8 - 3.1.2 前台的管理.- 8 - 3.2 模块关键技术.- 14 - 3.3 模块功能实现.- 18 - 致谢.- 19 - 参考文献.- 20 - 摘摘 要要 随着生活水平的提高，护肤品逐渐地成为了人们生活的必需品，而化妆品 更是爱美女性们的宠儿，点缀着丰富多彩的生活。这股风潮也慢慢地吹入了大 学校园，许多大学生也开始拥有化妆品，为自己成为时尚的职业女性作准备。 大学生作为一个庞大的潜在消费群体，他们的消费行为和特点是值得关注的， 而且学生群体不仅在现时

3、有着巨大的消费潜力，以后也将成为社会的消费主流。 因此，商家根据这个特点，开发化妆品大世界网站以对商家店面化妆品进行宣 传就必不可少了。 随着化妆品市场竞争的激烈化、现代化和国际化，随着计算机技术的飞速 发展，计算机在服务行业中的地位明显提高，利用计算机实现各种功能的运作 也日趋普遍，进而利用计算机来实现网站设计和网站管理更是势在必行。 化妆品大世界网站设计是典型的 ASP 网站设计，其设计主要包括后台数据 库的建立和维护以及前台美观的页面的设计两个方面。对于前者要求建立起数 据一致性和完整性强、数据安全性好的库。网站设计结果证明，本人所设计的 化妆品大世界网站设计可满足爱美女性们网上查看化妆

4、品、电话订购、网上学 习美容彩妆知识和网上留言交流三个方面的要求。会员可以通过登录卡号增加 积分，浏览者可以任意浏览任一品牌的化妆品和美容彩妆知识，并且可以网上 留言。管理员可以进入后台，对网站内化妆品、美容彩妆文章进行添加，管理 和删除。 关键字：关键字：化妆品大世界网站设计，爱美女性，美容彩妆 AbstractAbstract With the improvement of living standards, skin care products gradually become a necessity of lift, cosmetics and beauty is the darlin

5、g of women who, embellished by a colorful life. This trend has slowly carried into to university campus; many students are beginning to have cosmetics, to become a fashionable career woman to make preparations. Students as a huge potential consumer groups, and their consumption behavior and characte

6、ristics are a cause for concern, and students who are not only present in the consumer has tremendous potential, the future will become the mainstream consumer. So, according to the characteristics, the cosmetics site to the merchant locations cosmetics publicity is essential. With the cosmetics of

7、fierce market competition, modernization and internationalization, with the rapid development of computer technology, the computers position in the service industry markedly improved, using a computer to achieve the operation of the various functions are becoming increasingly common, and then use co

8、mputers to design a web site and site management is even more imperative. Cosmetics big world website design is typical of ASP web site design, the database design includes the establishment and maintenance and the front page of a beautiful design two ways. For the former require create the data uni

9、formity and integrities are strong and data security, a good library. The website design as a result, the design of cosmetics big world web site design can be satisfies if the internet to see women make up the telephone book, online learning beauty make-up knowledge and internet message exchanges th

10、ree of parties. Member may, by access card number to increase the number of visitors can be browed, any brand of cosmetics and beauty make-up knowledge and internet message. Administrators can get into the background to the web site, the cosmetics and facial makeup article be added, and deleted. Key

11、words: cosmetics big world website design, devotion woman, facial makeup 第第 1 1 章章 引言引言 1.1 任务概述任务概述 化妆品市场生机勃勃，外资品牌优势不减。经过十几年的培育和发展，我国已成为 亚洲重要的化妆品市场，行业内品牌化竞争格局已经形成，日益成为集产业化、市场化、 国际化为一体的综合性产业。随着计算机技术的飞速发展，计算机在服务行业中的地位 明显提高，利用计算机实现各种功能的运作也日趋普遍，进而利用计算机来实现网站设 计和网站管理更是势在必行。 浏览者可以通过网站了解一些关于化妆品产品等方面的信息，可以对

12、化妆品的各种 品牌的图片，价格，会员价，及品牌介绍一目了然，并且可以学习美容和彩妆方面的知 识。会员可以通过输入自己卡号和密码进行登录，登录后可以增加自己的会员积分。浏 览者还可以通过留言方式留下您宝贵的建议，如果有喜欢的护肤品，可以电话订购。后 台管理员凭管理员账号、密码可登录后台对化妆品进行修改、添加、删除，对护肤和彩 妆方面的文章进行修改、添加、删除，对留言内容可以进行添加、修改、删除，同时也 可以增加、删除、修改后台管理员和会员的卡号和密码等。 1.2 需求概述需求概述 需求概述的任务是通过详细调查商家店面内正在卖的化妆品品牌，明确商家的各种 需求，然后才能确定设计的网站该朝哪个方向上

13、设计。化妆品网站必须充分考虑今后要 添加的新品牌、新护肤文章、新彩妆文章以及新的会员，不能仅仅只显示当前的化妆品 品牌来设计数据库。 这设计所需软件是 Dreamweaver，Access。会员用户凭个人账号、密钥可登录会员界 面进行会员积分。商家的会员卡是需要一次性购买 500 元的东西以后或者购买会员卡两 种途径而得到的，所以网站设计不用考虑会员卡号的注册这一功能。后台管理员凭管理 员账号、密钥可登录后台进行化妆品品牌整理、添加、删除等工作。管理员进入后台能 够添加新的管理员用户，新的会员用户。并且管理员能根据季节的变换，化妆品产品的 变化来添加新的护肤文章、彩妆文章和化妆品产品的详细信息

14、。 1.3 设计目标设计目标 我们通过本网站设计，按照商家和用户的需求，结合商家店内化妆品品牌，利用先 进的计算机数据库技术实现以下功能： 1.会员用户可以通过会员卡号、密码登录本网站增加会员积分。 2.管理员可以方便、快捷地对化妆品品牌进行删除、修改、添加等管理。 3.能够显示护肤、彩妆方面的美文。 4.可以快捷、准确的显示每一个化妆品品牌的图片、价格、会员价格及详细介绍等 信息。 5. 管理员可以方便、快捷地对护肤、彩妆美文进行删除、修改、添加等管理。 1.4 运行环境运行环境 硬件环境： 1.处理器：AMD1700+或更高级处理器系统 2.主板：华硕 4Core1600-GLAN（英特尔

15、 P35/G33/G31/P31 Express） 3.内存：128MB 以上内存 4.主硬盘：20GB 以上硬盘空间 5.显卡：NVIDIA GeForce 9600 GT(128 MB) 6.显示器：1024768（效果最佳） 软件环境： 1.数据库：Microsoft Access 2.网页脚本：VBScript 3.网页编辑工具：Micromedia Dreamweaver 8 4.操作系统：Microsoft Windows XP Professional 5.其他支撑组件：ODBC 数据源、Internet 信息服务（IIS） 第第 2 2 章章 总体设计总体设计 2.1 网站总体

16、模块概述网站总体模块概述 作为一般用户，需要从事的活动：可以对每一种化妆品的图片、价格、会 员价格、化妆品成分、功效进行查看；可以详细阅读护肤、彩妆方面的美文； 可以判断自己的肤质；并且还可以进行留言。作为会员用户，可以通过自己的 会员卡号和密码登录，增加会员积分。 针对以上需求，本网站设计了会员登录、化妆品显示、护肤美文、彩妆美 文、肤质测试和后台管理。会员用户通过自己在商家那里获得的会员卡号和密 码进行登录会员页面，然后登录可以增加会员的积分。后台管理人员能够对化 妆品的各个信息，最新的护肤、彩妆文章和公告公示，进行添加、修改和删除。 网站信息实时更新等模块。这完全能够满足用户对网站页面的

17、需求，并且对商 家的店面进行有效地宣传。 网站设计整体美观、操作方便，为一般用户、会员用户和商家的交流打了 很好的基础，从而很有效地宣传了商家的店里的品牌，实现了信息化宣传的目 的。 2.2 网站总体功能介绍网站总体功能介绍 前台总体功能介绍 （1）查看化妆品的各个品牌的图片、名称、价格、会员价格、化妆品成分 以及使用成效。 （2）网站的公告。 （3）查看每一个护肤美文。 （4）查看每一个明媚彩妆美文。 （5）会员登录。 （6）肤质测试。 （7）联系我们。 （8）后台管理。 网站整体页面的首页如图 2-1 所示。 图 2-1 网站页面的首页 2.3 功能分配和模块设计功能分配和模块设计 前台各

18、模版设计及功能 （1）会员用户登录 会员用户凭会员卡号和密码即可登录本网站，登录以后可以获得 0.5 分的 积分。 （2）后台登录 管理员用户凭管理员账号和密码即可进入后台，进行化妆品、文章、会员 用户增加、管理员用户增加和管理员密码修改等的相关管理。 （3）品牌大全 用于用户查看各个化妆品品牌的图片、名称、价格、会员价格、产品成分、 使用效果等信息。 （4）完美护肤 点击可以看到各种各样的护肤美文。 （5）明媚彩妆 点击可以看到各种各样的彩妆美文。 （6）肤质测试 可以根据提供的肤质类型来判断自己是什么样的肤质。 （7）公告 用户能够通过公告看到商家店面最新的消息。 （8）留言板 用户有什么

19、宝贵的建议可以通过留言的方式进行留言。 （9）联系我们 用户有什么问题或者喜欢什么样的化妆品可以通过电话联系我们。 2.4 数据库设计数据库设计 数据库是通用化的相关数据的集合，它不仅包括数据本身，而且包括数据 之间的联系。为了让多种应用程序并发的使用数据库中具有最小冗余的共享数 据， 必须使数据与程序具有较高的独立性。则需要一个软件系统对数据进行专 门的管理，提供安全性和完整性等统一控制，方便用户以交互命令或程序方式 对数据库进行操作。本设计中是在一个名为 aspdb.mdb 数据库中建立了 admin 表，member 表，huazhuangpin 表,wenzhang 表，liuyanb

20、an 表等。 1.admin（管理员管理信息）根据表： 表 2.1 admin 数据表 字段名说明数据类型字段长度允许空 uname 管理员账号文本型 50 否 password 管理员密码文本型 50 否 time 时间日期/时间否 此表保存网站后台管理员的账号、密码和管理员添加新的用户或者修改密 码时的时间。 2. member(会员用户信息)信息数据表： 表 2.2 member 信息数据表 字段名说明数据类型字段长度允许空 kahao 会员卡号文本型 50 否 password 会员密码文本型 50 否 jifen 会员积分数字型长整型否 此表显示会员用户的信息。 3. huazhua

21、ngpin 信息数据表： 表 2.3 huazhuangpin 信息数据表 字段名说明数据类型字段长度允许空 id 编号文本型 50 否 name 化妆品名字文本型 50 否 BigClassName 品牌文本型 50 否 BigClassNameID 品牌编号文本型 50 否 SmallClassName 小分类文本型 50 否 SmaNameID 小分类编号文本型 50 否 FirstImageName 小图标文本型 50 否 price 价格文本型 50 否 Hyprice 会员价格文本型 50 否 jieshao 产品介绍文本型 50 否 picture 图片文本型 50 否 hits

22、 点击数文本型 50 否 AddDate 上传时间日期/时间 50 否 User 上传者文本型 50 否 zongjie 品牌总结备注否 此表用来对化妆品的编号、名字、品牌、品牌编号、小图标、价格、会员 价格、图片、点击数、上传时间、上传者和化妆品详细介绍等的添加、修改及 删除等管理。 4. wenzhang (护肤、彩妆文章)信息数据表： 表 2.4 wenzhang 信息数据表 字段名说明数据类型字段长度允许空 id 编号文本型 50 否 name 文章名字文本型 50 否 BigClassName 文章分类文本型 50 否 BigClassNameID 分类编号文本型 50 否 Smal

23、lClassName 小分类文本型 50 否 SmaNameID 小分类编号文本型 50 否 FirstImageName 小图标文本型 50 否 hits 点击数文本型 50 否 AddDate 上传时间日期/时间 50 否 User 上传者文本型 50 否 neirong 文章内容备注否 此表用来对护肤彩妆文章的编号、文章名字、文章分类、分类编号、点击 数、文章内容等的添加、删除、修改等管理。 5. liuyanban（留言板）信息数据表： 表 2.5 liuyanban 息数据表 字段名说明数据类型字段长度允许空 id 编号文本型 50 否 user 留言者文本型 50 否 Title

24、留言专题文本型 50 否 Neirong 留言内容文本型 100 否 time 留言时间日期/时间 50 否 此表用来管理留言的添加、删除和修改。 第第 3 3 章章 模块详细设计与实现模块详细设计与实现 3.1 模块功能详细描述模块功能详细描述 3.1.1 网站的流程图网站的流程图 流程图如图 3-1 所示。 品 牌 大 全 完 美 护 肤 明 媚 彩 妆 后 台 管 理 肤 质 测 试 联 系 我 们 留 言 板 会 员 登 录 化妆品大世界 图 3-1 网站流程图 3.1.2 前台的管理前台的管理 前台的具体模块设计 . 网站首页 点击首页即可进入页面，此页面介绍该网站实现的所有功能：会

25、员登 录界面、化妆品品牌大全、完美护肤的文章、明媚彩妆的文章、后台管理、 肤质测试、联系我们以及留言板等功能，如图 3-2。 图 3-2 网站首页页面 2 .会员用户登录 输入会员卡号和密码即可登录。 如图 3-3所示。 图 3-3 会员登录页面 登录可增加积分，如图 3-4所示。 图 3-4 注册成功页面 会员登录成功后，主页面如图 3-5所示。 图 3-5 登录成功后登录页面 3 .后台管理 在此输入管理员名称、密码即可进入后台进行后台管理，如图 3-6 的页面 所示。 图 3-6 后台登录页面 4 .品牌大全 用户在点击品牌大全可进入图 3-7 所示的页面查看化妆品品牌。 图 3-7 化

26、妆品品牌显示 图 3-8 化妆品详细介绍 5 .联系我们 通过如图 3-9 所示页面的联系我们进行相关问题的咨询。 图 3-9 联系我们 6 .完美护肤 点击完美护肤，可查看完美护肤方面的文章，如图 3-10所示。 图 3-10 完美护肤的文章 7 .明媚彩妆 点击明媚彩妆，可查看明媚彩妆方面的文章，如图 3-11所示。 图 3-11 明媚彩妆的文章 8 .肤质测试 点击肤质测试，可判断自己的肤质，如图 3-12所示。 图 3-12 可判断自己的皮肤 9 .用户能够通过公告看到最新的商家店面消息，如图 3-13所示。 图 3-13 公告 3.2 模块关键技术模块关键技术 用编写网站应用程序时间

27、长了，难免会遇到各式各样的问题，在编 写本网站的过程如化妆品信息的上传则是我们很棘手的问题，经过一段时间搜 集资料，终于使我克服了这个困难，使用纯代码来实现化妆品信息的显 示、上传及首页化妆品滚动显示的功能。其主要代码如下： （1）化妆品信息的显示代码： % set rs=server.CreateObject(adodb.recordset) sql=select * from huazhuangpin rs.open sql,conn,1,1 if rs.eof and rs.bof then response.Write 暂时还没有此类商品 response.End() Else p=2

28、 rs.PageSize=p allPages=rs.PageCount page=Request.QueryString(page) If isEmpty(page) or Cint(page)allPages Then page=allPages end if rs.AbsolutePage=page rs.AbsolutePage=page Response.Write do while not rs.eof and p=1 Response.Write for i=1 to 3 Response.Write Response.Write & Response.Write & 产品名：

29、& rs(name) & & 品牌： & rs(BigClassName) & 价格：$ & rs(price) & & 会员价: $ & rs(hyprice)& rs.MoveNext If rs.EOF Then Exit For Next If rs.EOF Then Exit do rs.MoveNext Response.Write p=p-1 loop Response.Write if rs.eof and rs.bof then else p=2 rs.PageSize=p allPages=rs.PageCount page=Request.QueryString(page

30、) If isEmpty(page) or Cint(page)allPages Then page=allPages end if iCount=rs.RecordCount 记录总数 iPageSize=rs.PageSize maxpage=rs.PageCount page=request(page) per_page=rs.PageSize if Not IsNumeric(page) or page= then page=1 else page=cint(page) end if % （2）化妆品上传的主要代码： （3）首页化妆品品牌滚动的主要代码： var dir=1/每步移动像

31、素，大快 var speed=1/循环周期（毫秒）大慢 demo2.innerHTML=demo1.innerHTML function Marquee()/正常移动 /alert(demo2.offsetWidth+n+demo.scrollLeft) if (dir0 & (demo2.offsetWidth-demo.scrollLeft)=0) demo.scrollLeft=0 if (dir0 &(demo.scrollLeft=0) demo.scrollLeft=demo2.offsetWidth demo.scrollLeft+=dir demo.onmouseover=fu

32、nction() clearInterval(MyMar)/暂停移动 demo.onmouseout=function() MyMar=setInterval(Marquee,speed)/继续移动 function r_left()if (dir=-1)dir=1/换向左移 function r_right()if (dir=1)dir=-1/换向右移 var MyMar=setInterval(Marquee,speed) 3.3 模块功能实现模块功能实现 网站功能模块图如图 3-13所示。 品 牌 大 全 完 美 护 肤 退 出 管 理 化 妆 品 品 牌 管 理 护 肤 彩 妆 文 章

33、 管 理 会 员 用 户 添 加 后 台 管 理 用 户 添 加 修 改 管 理 用 户 密 码 留 言 板 管 理 会 员 登 录 明 媚 彩 妆 后 台 管 理 肤 质 测 试 联 系 我 们 留 言 板 增 加 积 分 化妆品大世界 图 3-13 功能模块图 （1）该网站前台的功能：对所有的化妆品有关的内容进行显示。 （2）该网站会员用户登录模块功能实现：可以通过会员的卡号和密码登录， 然后增加会员的积分。 （3）该网站后台登录模块功能实现：管理员可以通过自己的用户名和密码 进入后台进行化妆品品牌、护肤彩妆文章、会员、管理员、留言板进行添加和 管理。 致谢致谢 随着毕业论文的完成，我的大学生涯也即将结束。在论文的写作过程中得 到了老师与同学们的帮助，在此感谢大家对我的支持与鼓励。这一段时间是我 大学阶段的尾声，同时也是人生中的一个纪念碑，我在其中也享受到了研究的 乐趣。 首先我要感谢毕业设计的指导老师苏文芝老师，通过苏老师的