资源预览内容
第1页 / 共162页
第2页 / 共162页
第3页 / 共162页
第4页 / 共162页
第5页 / 共162页
第6页 / 共162页
第7页 / 共162页
第8页 / 共162页
第9页 / 共162页
第10页 / 共162页
亲,该文档总共162页,到这儿已超出免费预览范围,如果喜欢就下载吧!
资源描述
第10章 基于ASP.NET的儿童网站的开发,10.1 系统设计 10.2 数据库的设计与实现 10.3 主要功能模块的设计,10.1 系 统 设 计 10.1.1 系统需求分析 儿童是一个很大的消费群体,在个性化消费的今天,儿童的消费也需要个性化。目前电子商务蓬勃发展,但国内针对儿童服务的网站却暂处空白,本实例是以儿童为服务对象的网站开发。它不仅是传统的购物网站,还融入了多种元素,如有声读物、音乐、互动的虚拟空间等,切切实实为儿童定制。,该网站定义为儿童购物个性综合网站。儿童:本网站的所有内容和功能均和儿童相关。购物:本网站提供基本的服饰购物功能,主要是配合实体店的运营。个性综合:网站的设计主要以个性、温馨为主,提供童话故事、儿童音乐、BBS、试衣间、模特秀等功能,目的是方便家长,使其不需要再去其他地方搜集资料。,10.1.2 系统形象设计 1LOGO设计 网站名称“HotuBeBe”可以理解为Hot your baby,装扮你的宝贝,让你的宝贝火起来,即“时尚宝贝”。将“HotuBeBe”设计成两朵四叶草的样子,每个字母代表一个花瓣。Hotu是大朵四叶草,代表父母;BeBe是小朵四叶草,代表孩子。总体寓意是父母用自己的爱装扮自己的宝贝,让孩子健康、快乐、时尚地成长,如图10-1所示。,图10-1 网站LOGO设计,2网站首页设计 由于是“儿童综合网站”,所以在设计方面以“四叶草”为依托,尽量接近“童真、童趣”,给人一种童年和美好希望的感觉。这个网站的主要目标人群是年轻的爸爸妈妈们,他们追求方便、独特和时尚,抓住他们的心理以及需求设计了“购物”、“童话”、“音乐”、“宝贝秀”和“BBS”模块。综合性比较强的网站给年轻父母提供了很多便利及服务,因此首页中商品分类按钮采用时尚卡通化设计,效果如图10-2所示。,图10-2 首页商品分类按钮,网站设计的主题以绿色、蓝色、白色三种颜色为主色调,使用导航栏对各个网页进行导向。网站首页设立公告栏,公布网站最新的动态。网站首页整体设计效果如图10-3所示。,图10-3 网站首页整体设计效果,10.1.3 系统功能设计 系统分为会员用户模块、购物模块、论坛模块、童话模块、音乐模块和宝贝秀模块。系统将访问本网站的用户区分为注册用户和非注册用户两种,不同类型用户所拥有的权限是有区别的,具体权限分配如图10-4所示。,图10-4 不同用户的权限分配,1主页 主页即网站的首页,是网站的第一内容页,整个网站的最新、最值得推荐的内容将在这里展示。在设计上,注重协调各区域的主次关系,以营造易用性与视觉舒适性的人机交互界面为终极目标。网站主页采用静、动相结合的方式,即静态的主画面和动态的图片相结合,体现儿童的智趣。静态主页方式介绍网站具备的功能和“公告栏”提供的最新资讯。 “搜索”功能可利用ASP.NET与数据库结合的技术建立数据库查询管理系统,采用交互式动态的Web画面来实现。,2购物 购物模块具有商品分类管理、商品展示、品牌管理、支付方法管理、配送区域和配送方法设置、商品搜索和分类查询、商品评论、购物车、会员订单提交、订单管理、在线支付、订单统计、销售统计等网上商店常用的功能。该模块适合企业网站建立在线商品销售栏目,开展B2C电子商务。购物模块主要是配合实体店的运营,更多的功能还是以展示为主,这不仅为老顾客购物提供方便,也可吸引新顾客来实体店购买。,3宝贝秀 宝贝秀(模特秀)主要是根据不同季节、不同的时装主题进行服饰搭配,通过模特的展示给顾客提供当下最新的时尚资讯。同时,在此会提供“试衣间”功能,顾客可以上传宝贝的照片,然后选择虚拟衣服搭配出适合自己孩子的服饰。 我们要做的就是把人们不可或缺的“衣”这部分“E”化,让大家可以用最快的速度试穿多件自己所想要的衣服,而且不需要店员逐一地拿取,也不需要多次进出试衣间,这不仅节省了时间,而且可以预防被偷窥。,4童话与音乐 童话与音乐模块给予顾客尽可能多的选择,可以作为对孩子的教育,也可以作为孩子临睡前的故事和摇篮曲。 音乐模块中会设置最新音乐推荐、歌曲排行榜、MV推荐等,用户可在网页上直接观看音乐MV,也可以对其音乐进行下载、收藏、试听。在此模块中还设计了留言板功能,用户可以提供自己的建议。 童话模块使用Flash以电子杂志的形式简单实现,今后会以IPAD中的“有声读物”应用(如“APPLE TREE”)为蓝本进行完善。,5BBS 论坛的设置主要是为顾客提供互相交流学习的一个平台。用户可根据自己的需求发帖,比如可以展示自己宝贝的时尚照,可以进行疑问咨询等,同时论坛也是提供儿童时尚资讯的主要平台。,6会员和个人中心 本网站提供会员“注册”、“登录”和“个人中心”模块,会员可登录“个人中心”自主完善和修改个人信息。这样便于管理,也为客户提供了一个良好的自主管理平台。 “收藏夹”模块的主要功能是方便会员平时浏览网站时对自己所需的“服饰”、“音乐”、“童话”等的收藏,以便下一次访问。会员也可根据需要对其进行删除、增加等操作,此操作主要体现在“个人中心”模块中。,10.2 数据库的设计与实现 1用户登录信息表(Login) 用户登录信息表记录用户名、密码等用户信息,如表10.1所示。 2城市信息表(City) 城市信息表记录省编号对应的城市信息,如表10.2所示。 3论坛回复信息表(TalkReply) 论坛回复信息表记录论坛帖子回复信息,如表10.3所示。 4商品信息表(Product) 商品信息表记录商品的相关信息,如表10.4所示。,表10.1 用户登录信息表,表10.2 城 市 信 息 表,表10.3 论坛回复信息表,表10.4 商 品 信 息 表,5论坛信息表(Talk) 论坛信息表记录发布帖子的信息,如表10.5所示。 6购物车信息表(Buybag) 购物车信息表显示购物车商品信息,如表10.6所示。 7音乐信息表(Music) 音乐信息表记录音乐的相关信息,如表10.7所示。 8视频信息表(Mv) 视频信息表记录音乐模块视频的信息,如表10.8所示。,表10.5 论 坛 信 息 表,表10.6 购物车信息表,表10.7 音 乐 信 息 表,表10.8 视 频 信 息 表,9童话信息表(Story) 童话信息表记录网站中童话的相关信息,如表10.9所示。 10背景设置信息表(Bgset) 背景设置信息表记录产品显示背景的设置信息,如表10.10所示。 11公告栏信息表(Info) 公告栏信息表存放首页公告信息,如表10.11所示。 12省信息表(Province) 省信息表记录省编号和省名,如表10.12所示。,表10.9 童 话 信 息 表,表10.10 背景设置信息表,表10.11 公告栏信息表,表10.12 省 信 息 表,13留言信息表(Message) 留言信息表记录用户在音乐页面用户留言的信息,如表10.13所示。 14订单信息表(OrderList) 订单信息表记录用户购买商品的相关信息,如表10.14所示。 15收藏夹信息表(Favourites) 收藏夹信息表保存个人中心内的收藏夹信息,如表10.15所示。,表10.13 留 言 信 息 表,表10.14 订 单 信 息 表,表10.15 收藏夹信息表,10.3 主要功能模块的设计 10.3.1 用户登录注册模块 1用户注册模块(Reigister.aspx) 注册用户可以“登录”来获得购买商品、发帖回复、个人中心等权限。未注册用户可以“注册”,正确填写会员信息后,便能以会员身份登录。用户注册模块使用了Panel控件实现了同意用户协议、填写基本信息、填写用户详细信息等用户注册流程,其中 “用户协议”界面,如图10-5所示。,图10-5 “用户协议”界面,“用户注册”界面除了验证控件以外,使用TextBox记录提交用户的输入信息,使用FileUpload上传图片,如图10-6所示。 “用户详细信息”界面使用TextBox记录提交用户的姓名、出生年月、联系地址、邮政编码和联系方式,使用DropDownList选择省份和城市,如图10-7所示。 完成所有信息填写后,如果信息正确,则会显示“注册成功”界面,如图10-8所示。,图10-7 用户详细信息界面,图10-6 “用户注册”界面,图10-8 “注册成功”界面,注册页面(Reigister.aspx)中加入了RequiredFieldValidator、RangeValidator、RegularExpression Validator、CompareValidator、CustomValidator、ValidationSummary等验证控件,用于对用户信息进行验证。验证“用户名已存在”的效果的实现代码如下:,protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args) string Username = args.Value; if (db.judge(Username) /用户名确认 args.IsValid = false; /验证失败 else args.IsValid = true; /验证正确 ,验证需要借助Db类中封装的判断指定用户是否存在的数据库judge方法。相关代码如下: public static bool judge(string userName) SqlConnection con = db.createCon(); con.Open(); SqlCommand cmd=new SqlCommand(“select count(*) from login where UserName= “+userName+“, con); int count =(int)cmd.ExecuteScalar(); if(count0), return true; else return false; ,在填写完联系方式,单击“下一步”按钮后(触发Btn_Next3_Click事件),调用数据库对象方法insertOperate插入用户注册信息,完成注册流程。相关代码如下: protected void Btn_Next3_Click(object sender, EventArgs e) user user = new user(); user.username = this.TB_Username.Text.ToString(); /用户名 user.password = this.HFPassword.Value; /密码 user.email = this.TB_Email.Text.ToString(); /电子邮箱 user.truename = this.TB_Truename.Text.ToString(); /真实姓名 user.sex = this.RB_Sex.SelectedValue.ToString(); /性别 user.birth = this.TB_Birth.Value; /生日,user.ProName = this.Drop_Province.SelectedValue.ToString(); /省份 user.CityName = this.Drop_City.SelectedValue.ToString();/城市 user.address = this.TB_Ad
网站客服QQ:2055934822
金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号