系统前台基本功能设计与实现培训资料.docx

1、系统前台基本功能设计与实现培训资料系统前台基本功能设计与实现系统前台基本功能设计与实现本节对系统前台主要功能设计进行详细的说明。5.4.1用户维护模块设计与实现由于网上购物必须保证用户的正确性、购物的安全性，需要对用户资料进行有效的管理，因此用户管理是电子商务网站的重要内容。它主要包括用户注册、登录和验证、用户注册资料的修改更新和用户注销等功能。1、会员注册(1)实现目标用户单击注册后需要输入会员登录名，性别，密码，重复密码，真实姓名，密码提示问题，提示问题答案，电话，Email地址，所在城市，住址，邮编，注册日期。用户只须填写一个Web表单。这里需要用户通过E_mail注册是考虑到两点：第一

2、，用户的E_mail是惟一的；第二，通过用户的E_mail可以很方便快捷的与用户取得联系。用户在提交注册信息后，系统会对注册页面填写的正确性进行检查。对于不符合要求的填写会给出必要的提示，并返回修改；对于符合要求的注册表单，用户提交信息后也要返回相应的欢迎信息，用户提交的正确注册信息将被存入系统的数据库中。界面的设计如图5-2所示。图5-2用户注册模块（2）实现过程所属页面名：Register.aspx页面设计如表5-1所示。表5-1用户注册主要控件信息列表名称类型含义LoginNameTextBox输入会员登录名TestButton检测会员名SexDropDownList选择性别PwdTex

3、tBox输入密码SecPwdTextBox输入重复密码TNameTextBox输入真实姓名QuePwdDropDownList选择密码问题AnsPwdTextBox输入密码提示答案TelTextBox输入电话EmailTextBox输入EmailCityDropDownList选择城市AddressTextBox输入住址PostCodeTextBox输入邮编RegisterButton注册CancelButton重置2、用户登录(1)用户登录程序流程描述当用户输入用户名和密码后首先要进行身份验证，如果用户存在，则成功登录，反之，如果用户不存在，提示错误信息“输入的用户名或密码不存在，请重新输入

4、”，返回登录界面重新输入用户名和密码。用户登录的程序流程图如图5-3所示。(2)实现目标对于本系统的购物过程而言，在用户浏览商品时，可以不进行登录，只有在使用购物车时，才需要登录，以完成整个购物过程。用户登录用于验证用户的用户名和密码，然后决定顾客进入系统进行操作，如进行用户修改的操作，购物车和结账的操作等。图5-3用户登录程序流程图 (3)实现过程所属页面名：MemberLogin.ascx登录验证的代码设计见附录2。表5-2用户登录主要控件信息列表名称类型含义MNameTextBox输入用户名MPwdTextBox输入密码LoginImageButton登录RegisterLinkButt

5、on注册FindpwdLinkButton找回密码3、修改个人信息(1)实现目标已注册的用户只要登录本系统后便可以通过单击菜单会员管理中的修改个人信息进行用户修改操作，在此页面中用户可以更改自己的详细信息，如可以修改密码、修改Email地址等个人信息。通过点击修改按钮完成修改操作。界面的设计如图5-4所示。图5-4用户修改模块(2)实现过程所属页面名：EditMInfo.aspx修改个人信息页面的控件信息同会员注册页面的控件信息基本一样。4、购物车模块的设计与实现(1)购物车程序流程描述用户选购商品后添加到购物车中，在购物车中进行查看，同时对不满意的商品可以进行删除，对要购买的商品可以调整数量

6、，移除商品和清空商品。用户决定购买商品后可以点击结账，填写收货人信息，选择支付方式。购物车流程图如图5-5所示。(2)实现目标用户购买商品的核心功能是购物车和订单提交。购物车模块的设计包括：顾客添加商品到购物车和顾客对购物车的管理，如更新购买的女性商品数量、清空购物车和将购物车中女性商品从购物车中移除等。购物车要具有持续性，而且不限制用户购买女性商品的数量，也就是购物车可以显示很多女性商品。界面的设计如图5-6所示。图5-5购物车程序流程图 (3)实现过程所属页面名：Shopping.aspx页面设计如表5-3所示。表5-3购物车主要控件列表名称类型含义gvOrderInfoGridView显

7、示购买商品的信息KeepBuyHyperLink继续购物商品CheckLinkButton结账MoneyLabel显示合计金额ClearLinkButton清空购物车 在购物车页面中，主要包括两部分：购物清单和对购物车操作的功能按钮。其中购物清单列出了购物车中所有商品的情况，包括商品的单价和总价钱。对购物车的操作按钮主要就是“继续购买”和“结账”。当点击继续购买时链接到GoodsInfo.aspx页面，在这个页面可能查看商品的详细信息，进而选择自己所要购买的商品；点击结账，有时您余额不足，可以直点击菜单会员管理中的会员充值，充值成功之后，继续进行，进入我的购物车，再点击结账，进入dingdan

8、.aspx页面填写收货人信息，之后进入支付方式界面，最后弹出一个成功购买商品的界面。界面的设计如图5-7、图5-8、图5-9所示的三幅图。图5-6实现购物车界面图5-7实现会员充值界面图5-8实现收货人详细信息界面图5-9实现支付方式界面5、修改密码要想修改密码就必须先进行登录，在界面中进行用户登录之后，选择菜单会员管理中的修改密码，输入旧密码、新密码，点击修改之后就会成功。修改密码界面如图5-10所示。图5-10实现修改密码界面5.4系统后台基本功能设计与实现5.4.1用户维护模块设计与实现1、登录和验证(1)管理员登录程序的描述及实现当管理员输入管理员姓名和管理员密码及验证码后，首先要进行

9、身份验证，如果管理员存在，则登录成功，反之，如果管理员不存在，提示错误信息“您输入的管理员姓名或密码错误，请重新输入”，返回管理员登录界面重新输入管理员姓名和密码。管理员登录界面如图5-11所示。2、后台管理页面的设计与实现 网上购物的后台管理主要由商品管理、会员管理、仓库管理、订单管理、后台管理、安全退出、账目处理、上传图片等构成，前六项都是通过点击HyperLink链接由IFRAME控件实现的，后两项是直接链接的页面。后台管理员页面如图5-12所示。图5-11实现后台登录界面图5-12实现后台管理界面3、账目处理在这个页面中可实现按天、按月、按年、按商品名称、按购物人对商品信息进行查询。账目处理的界面如图5-13所示。图5-13实现账目处理界面 4、订单管理后台生成的订单是这个用户买的所有商品的生成的一张订单。界面如图5-14所示。图5-14实现订单管理界面5、上传商品图面在这个页面上传的图片都存入到tb_Image表中，在EditGoods页面中选择上传之后的图片进行添加。上传商品图片的界面如图5-15所示。图5-15实现上传商品图片界面