任务一 网站项目分析与总体设计
学习目标
了解绿吧旅游用品交易平台的需求。
熟悉交易平台的基本模块。
能为该网站建立网站结构图。
能设计该网站的界面草图。
能设计该网站的数据库结构。
项目描述
绿吧旅游用品公司为了拓展电子商务业务，准备开发一个旅游用品综合交易平台，该平台能够提供公司商品的在线交易功能，并借助论坛、驴友相互晒游记、攻略、照片等功能来聚拢目标消费人群，培养网站文化，引导一种绿色、健康、又时尚的旅游生活方式。该公司提供的主要产品有冲锋衣裤、速干衣、polo衫、徒步鞋、溯溪鞋；登山包、徒步包、休闲包；帐篷、睡袋、便携式餐具、折叠桌椅等。
任务描述
本次任务需要充分了解平台的需求，能合理地设置网站的功能模块，绘制网站结构图、界面草图，并在此基础上设计相关的数据库系统。
任务分析与相关知识
1.常见交易平台的功能模块
分析目前常见的交易平台网站，如淘宝、京东、当当，会发现能够在线交易的网站一般都有如下模块：
1）购物车。
2）会员管理。
3）订单管理。
4）商品评价。
5）留言（站内信、即时留言等形式）。
结合绿吧公司的业务需求，应该为交易平台选择购物车、会员管理、订单管理、商品评价、站内信形式的留言管理等基本模块；同时为了建立用户之间的沟通渠道，应该交易平台添加论坛模块；为了营造一种宣传驴友健康、绿色生活方式的网站文化，建议为交易平台添加游记分享模块。
2.功能模块分析
结合绿吧旅游用品交易平台的定位，可以确定网站必须具备的模块和首页应该具备的基本内容，见表2-1-1。
表2-1-1 网站的基本模块及其功能
3.技术分析
本项目使用JSP技术实现上述模块的开发。通过项目一，我们已经了解JSP的核心技术：
1）脚本。
2）Servlet。
3）JavaBean。
4）JDBC。
5）MVC设计模式。
6）自定义标签的应用。
7）请求、响应、会话等Web对象。
这些技术同样是本项目的技术基础，项目二的实现思路如图2-1-1所示。
图2-1-1 项目二的实现技术框架
任务实施
1.绘制网站的基本结构图
结合网站的模块分析，可以确定网站的基本结构，如图2-1-2所示。
图2-1-2 项目二的网站基本结构图
2.设计网站的基本界面
结合网站结构设计及功能定位，可以绘制整个网站的页面原型，利用原型可以清晰地展示网站的结构、流程，便于企业需求方全面了解网站的设计思路，也能尽早暴露设计的缺陷和不足，便于网站设计人员在早期就能按照新的需求修改和改进网站的设计。结合原型设计可以完成整个网站项目的界面设计。
1）首页界面。首页效果如图2-1-3所示。
图2-1-3 首页（登录前）
在首页登录成功之后显示如图2-1-4所示效果。
图2-1-4 首页（登录后）
2）会员模块界面。在首页单击“注册”，进入如图2-1-5所示的用户注册页面。
图2-1-5 用户注册页面
从首页登录之后，单击“维护我的资料”，进入如图2-1-6所示页面。
图2-1-6 用户资料修改页面
如果单击了只有会员才能使用的功能（如商品的购买、购物车的浏览、发帖、写游记等），而当前浏览者又没有登录，就进入如图2-1-7所示页面。
图2-1-7 用户登录页面
3）商品模块界面。在首页单击产品图片，进入如图2-1-8所示页面（含对商品的评价）。
图2-1-8 单件商品浏览页面
在首页输入产品的“关键字”，选择“主类别”和“子类别”类型后，单击“搜索”按钮，或单击商品的分类，进入如图2-1-9所示页面。
图2-1-9 商品搜索结果页面
4）购物车模块界面。在页眉导航栏中单击“购物车”，进入如图2-1-10所示页面。
图2-1-10 购物车浏览页面
5）订单模块界面。在购物车浏览页面单击“去结算”按钮，进入如图2-1-11所示页面。
图2-1-11 订单预览页面
从首页登录之后，单击“我的历史订单”，进入如图2-1-12所示页面。
图2-1-12 用户的历史订单查看页面
6）商品评价模块界面。在用户的历史订单查看界面中单击“评价”，进入如图2-1-13所示页面。
图2-1-13 商品评价页面
7）留言模块界面。从首页登录之后，单击“我的留言”，进入如图2-1-14所示页面。
图2-1-14 用户留言查看页面
在用户留言查看页面中单击“我要留言”或“回复”，或在游记浏览页面单击“给作者留言”，可以进入如图2-1-15所示页面。
图2-1-15 发留言页面
8）游记模块界面。在页眉导航菜单中单击“分享游记”，进入如图2-1-16所示页面。
图2-1-16 游记分享页面
在游记分享页面中单击“more＞＞”，进入如图2-1-17所示页面。
图2-1-17 游记列表页面
在游记分享页面中单击游记标题或在游记列表页面单击游记的标题，进入如图2-1-18所示页面。
图2-1-18 游记浏览页面
在游记分享页面单击“我要发表游记”，进入如图2-1-19所示页面。
图2-1-19 游记发表页面
9）论坛模块界面。在页眉导航菜单中单击“说说话”，进入如图2-1-20所示页面。
图2-1-20 论坛首页页面
在论坛首页中单击“我要发帖”按钮，进入如图2-1-21所示页面。
图2-1-21 发新帖页面
在论坛首页中单击帖子的标题，进入如图2-1-22所示页面。
图2-1-22 帖子浏览页面
3.设计网站后台数据库的基本结构
根据网站界面原型，可以了解网站需要存储哪些数据。项目二需要的数据库的基本结构如图2-1-23所示。
图2-1-23 项目二数据库关系图
根据上图所示的数据库设计思路和网站对数据存储的具体需求，可以确定项目二后台数据库所有表的基本结构，见表2-1-2～表2-1-10。
表2-1-2 会员表
表2-1-3 产品表
表2-1-4 产品类型表
表2-1-5 订单表
表2-1-6 订单从表
表2-1-7 留言表
表2-1-8 论坛及游记类型表
表2-1-9 游记表
表2-1-10 帖子表
（续）
请读者根据表2-1-2～表2-1-10的数据库结构设计，完成构建GreenBar数据库的SQL脚本greenbar.sql。
在MySQL服务器中执行greenbar.sql，成功建立了项目二的测试数据库。
4.检查已经创建的数据库
在MySQL服务器控制台中执行如图2-1-24所示指令，检查是否成功创建GreenBar数据库，并在该数据库下建立了9个相关的表。
图2-1-24 检查项目二数据库
自我评价
