文章目录
- 一、网站功能需求
- 二、网站设计思路
- 三、网站运行效果
- 四、网站实现步骤
- (一)创建数据库与表
- (二)创建Maven项目 - SSMSimonShop
- (三)在pom.xml文件里添加相关依赖
- (四)创建日志属性文件 - log4j.properties
- (五)创建数据库配置属性文件 - jdbc.properties
- (六)给项目添加Web功能
- (七)配置Tomcat服务器
- (八)创建实体类
- (九)创建映射器接口
- (十)创建服务类
- (十一)创建控制器
- (十二)创建映射器配置文件
- (十三)创建Spring配置文件 - spring-config.xml
- (十四)创建Spring MVC配置文件 - spring-mvc-config.xml
- (十五)编辑Web部署描述文件 - web.xml
- (十六)准备图片资源
- (十七)创建样式文件 - main.css
- (十八)创建脚本文件 - check.js
- (十九)创建页面
- (二十)启动服务器,查看效果
- (二十一)待完成功能
- 五、利用Bootstrap框架改进网站界面
一、网站功能需求
-
在西蒙购物网站中,我们实施了严格的权限控制机制以确保用户和管理员的操作安全。首先,只有成功注册并登录的用户才能享有完整的购物功能,包括查看商品类别、浏览商品详情、进行选购、生成订单以及查看自己的订单历史。这些措施旨在保护用户的个人信息和交易记录,同时也能提供个性化的购物体验。
-
另一方面,我们设立了独立的后台管理系统,仅供具有管理员权限的用户访问。管理员拥有全方位的管理权限,包括用户管理、类别管理、商品管理和订单管理。他们可以审核用户信息、添加或修改商品类别、上架或调整商品信息、处理订单状态等操作,以确保网站的正常运营和优质服务。这种分层的权限管理模式不仅提高了工作效率,也保障了网站数据的安全性和完整性。总的来说,西蒙购物网站通过精细的权限控制和高效的后台管理,为用户提供了一个安全、便捷且丰富的在线购物环境。
二、网站设计思路
1、设计模式
分层架构:展现层(JSP)<——>控制层(Controller)<——>业务层(Service)<——>数据映射层(Mapper)<——>数据库(DB)
2、网站前台
- 在"SSMSimonShop"购物网站的前台操作流程如下:
-
登录
- 用户首先需要通过登录页面(login.jsp)输入其注册时的用户名和密码进行身份验证。系统会检查输入的信息是否与数据库中的用户信息匹配,若匹配成功,则用户登录成功,否则将提示登录失败。
-
显示商品类别
- 登录成功的用户会被重定向到主页或者商品类别页面(showCategory.jsp)。在这个页面中,用户可以看到所有可用的商品类别,如电子产品、服装、家居用品等。用户可以通过点击相应的类别链接来查看该类别的商品信息。
-
显示某类商品信息
- 当用户点击某一商品类别后,系统会跳转到显示该类别商品的页面(showProduct.jsp)。在这个页面中,用户可以浏览该类别下的所有商品,包括商品名称、图片、价格、描述等详细信息。用户还可以根据自己的需求进行排序、筛选或搜索商品。
-
查看购物车
- 在浏览商品的过程中,用户可以选择将感兴趣的商品添加到购物车。用户可以通过点击导航栏中的“购物车”链接进入购物车页面(showCart.jsp)。在这个页面中,用户可以查看已添加到购物车的商品列表,包括商品数量、单价和总价。用户还可以在此页面中修改商品数量或删除商品。
-
生成订单
- 当用户确认购物车中的商品无误后,可以点击“结算”按钮进入生成订单页面(makeOrder.jsp)。在这个页面中,用户需要填写收货地址、选择配送方式和支付方式等信息,并再次确认订单详情。确认无误后,用户可以提交订单。
-
支付
- 订单提交后,系统会跳转到支付页面。在这个页面中,用户可以选择合适的支付方式进行付款,如信用卡、支付宝、微信支付等。完成支付后,系统会更新订单状态并发送订单确认邮件或短信给用户。
-
注册
- 对于未注册的用户,网站提供了注册功能。用户可以通过点击注册链接(register.jsp)进入注册页面,填写必要的个人信息并设置用户名和密码进行注册。注册成功后,用户可以直接登录并开始购物。注册和登录功能构成了一个闭环,确保只有注册用户才能进行购物操作,从而保护用户的权益和网站的安全性。
3、网站后台
- 在"SSMSimonShop"购物网站的后台管理系统中,管理员具有以下四大管理功能:
-
用户管理:
管理员可以通过用户管理模块来查看、添加、修改和删除用户。具体操作如下:- 查看用户:管理员可以查看所有注册用户的详细信息,包括用户名、邮箱、电话、地址等。
- 添加用户:管理员可以手动添加新的用户账户,输入必要的用户信息并设置初始密码。
- 修改用户:管理员可以修改已存在用户的个人信息,如更新电话号码或修改地址等。
- 删除用户:在必要的情况下,管理员可以删除不再活跃或违规的用户账户。
-
类别管理:
管理员可以通过类别管理模块来管理商品类别,包括查看、添加、修改和删除类别。具体操作如下:- 查看类别:管理员可以查看所有已定义的商品类别及其详细信息。
- 添加类别:管理员可以根据需要添加新的商品类别,为商品分类提供更多的选择。
- 修改类别:管理员可以修改现有商品类别的名称、描述或其他相关信息。
- 删除类别:如果某个商品类别不再使用或需要调整,管理员可以将其删除。
-
商品管理:
管理员可以通过商品管理模块来管理所有上架的商品,包括查看、添加、修改和删除商品。具体操作如下:- 查看商品:管理员可以查看所有上架商品的详细信息,如名称、图片、价格、库存等。
- 添加商品:管理员可以添加新的商品到系统中,填写商品的各项属性并上传相关图片。
- 修改商品:管理员可以修改已上架商品的任何信息,如更新价格、更改描述或调整库存等。
- 删除商品:如果某个商品不再销售或需要下架,管理员可以将其从系统中删除。
-
订单管理:
管理员可以通过订单管理模块来处理用户的订单请求,包括查看、审核和删除订单。具体操作如下:- 查看订单:管理员可以查看所有用户的订单详情,包括订单号、购买商品、总价、支付状态等。
- 审核订单:当用户提交订单后,管理员需要对订单进行审核,确认订单信息无误后方可进行后续处理。
- 删除订单:在特殊情况下,如订单错误或用户取消订单,管理员可以删除相应的订单记录。
通过以上四个管理模块,管理员能够全面掌控"SSMSimonShop"购物网站的运营情况,及时处理用户需求和业务变化,确保网站的正常运行和优质服务。同时,这些管理功能也体现了网站的数据管理和权限控制机制,保障了网站数据的安全性和完整性。
4、购物流程图
三、网站运行效果
- 操作演示
四、网站实现步骤
西蒙购物网站开发说明
- 本项目是一个名为"SSMSimonShop"的在线购物网站。以下为详细的开发步骤:
- 数据库设计与创建:
○ 创建数据库:名为"simonshop"的数据库用于存储网站的所有数据。
○ 创建用户表:t_user,用于存储用户信息。
○ 创建商品类别表:t_category,用于存储商品类别信息。
○ 创建商品表:t_product,用于存储商品信息。
○ 创建订单表:t_order,用于存储用户的订单信息。 - 项目初始化:
○ 创建Maven项目:名为"SSMSimonShop"的Java项目。
○ 在pom.xml文件中添加相关依赖,包括Spring、MyBatis、MySQL等。 - 配置日志和数据库连接:
○ 创建日志属性文件:log4j.properties,用于配置日志输出。
○ 创建数据库配置属性文件:jdbc.properties,用于存储数据库连接信息。 - 添加Web功能:
○ 给项目添加Web功能,使其成为一个Web应用程序。 - 配置服务器:
○ 配置Tomcat服务器,以便在本地运行和测试网站。 - 创建实体类:
○ 根据数据库表结构,创建对应的实体类,包括User、Category、Product和Order。 - 创建映射器接口和配置文件:
○ 创建UserMapper、CategoryMapper、ProductMapper和OrderMapper接口,用于定义数据库操作方法。
○ 创建对应的映射器配置文件(如UserMapper.xml等),编写SQL语句。 - 创建服务类:
○ 创建UserService、CategoryService、ProductService和OrderService类,封装业务逻辑。 - 创建控制器:
○ 创建UserController、CategoryController、ProductController和OrderController,处理前端请求并调用服务类方法。 - 创建Spring配置文件:
○ 创建spring-config.xml和spring-mvc-config.xml,配置Spring和Spring MVC。 - 编辑Web部署描述文件:
○ 编辑web.xml,配置Servlet和Filter。 - 准备图片资源和样式脚本文件:
○ 准备网站所需的图片资源。
○ 创建main.css样式文件和check.js脚本文件,用于页面布局和功能实现。 - 创建页面:
○ 创建前台页面,包括登录页(login.jsp)、注册页(register.jsp)、显示类别页(showCategory.jsp)、显示商品页(showProduct.jsp)、显示购物车页(showCart.jsp)、生成订单页(makeOrder.jsp)和显示订单页(showOrder.jsp)。
○ 创建后台管理页面,包括主页面(management.jsp)、左面板(left.jsp)、顶面板(top.jsp)、主面板(main.jsp)、查看用户页(showUser.jsp)和待做页(todo.jsp)。 - 启动服务器,查看效果:
○ 启动Tomcat服务器,访问网站,检查页面布局和功能是否正常。 - 待完成功能:
○ 根据需求和规划,继续开发和完善网站的其他功能。
以上就是"SSMSimonShop"网站的开发说明,涵盖了从数据库设计到页面实现的全过程。在开发过程中,应遵循模块化、分层和松耦合的原则,以保证代码的可读性和可维护性。同时,要注意网站的安全性和用户体验,确保网站的稳定运行和用户满意度。
(一)创建数据库与表
1、创建数据库 - simonshop
2、创建用户表 - t_user
- 创建用户表结构
CREATE TABLE `t_user` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`username` varchar(20) NOT NULL,
`password` varchar(20) DEFAULT NULL,
`telephone` varchar(11) DEFAULT NULL,
`register_time` timestamp NULL DEFAULT NULL ON UPDATE CURRENT_TIMESTAMP,
`popedom` int(11) DEFAULT NULL COMMENT '0:管理员;1:普通用户',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8;
- 在用户表里插入记录
INSERT INTO `t_user` VALUES ('1', 'admin', '12345', '15734345678', '2023-12-24 08:40:35', '0'),
('2', '胡平原', '11111', '13956567889', '2023-12-24 09:51:43', '1'),
('3', '温志军', '22222', '13956678907', '2023-12-24 09:52:36', '1'),
('4', '涂文艳', '33333', '15890905678', '2023-12-24 09:52:56', '1');
3、创建商品类别表 - t_category
- 创建商品类别表结构
CREATE TABLE `t_category` (
`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '商品类别标识符',
`name` varchar(100) NOT NULL COMMENT '商品类别名称',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8;
- 在商品类别表里插入记录
INSERT into `t_category` VALUES("1","家用电器"),("2","床上用品"),("3","文具用品"),("4","休闲食品");
4、创建商品表 - t_product
- 创建商品表结构
CREATE TABLE `t_product` (
`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '商品标识符',
`name` varchar(200) NOT NULL COMMENT '商品名称',
`price` double DEFAULT NULL COMMENT '商品单价',
`add_time` timestamp NULL DEFAULT NULL ON UPDATE CURRENT_TIMESTAMP,
`category_id` int(11) DEFAULT NULL COMMENT '商品类别标识符',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=16 DEFAULT CHARSET=utf8;
- 在商品表里插入记录
INSERT INTO `t_product` VALUES ('1', '容声电冰箱', '2000', '2023-12-20 09:54:41', '1'),
('2', '松下电视', '5000', '2023-12-20 09:54:35', '1'),
('3', '红岩墨水', '3', '2023-12-20 09:56:05', '3'),
('4', '海尔洗衣机', '1000', '2023-11-30 08:58:09', '1'),
('5', '新宇电饭煲', '1200', '2023-12-20 09:55:11', '1'),
('6', '英雄微波炉', '600', '2023-12-20 09:55:39', '1'),
('7', '红双喜席梦思', '700', '2023-11-28 08:59:38', '2'),
('8', '旺仔牛奶糖', '24.4', '2023-12-20 10:00:11', '4'),
('9', '西蒙枕头', '100', '2023-12-20 09:56:57', '2'),
('10', '甜甜毛毯', '400', '2023-12-20 09:57:26', '2'),
('11', '永久钢笔', '50', '2023-12-20 09:57:30', '3'),
('12', '硬面抄笔记本', '5', '2023-12-20 09:57:53', '3'),
('13', '晨光橡皮擦', '0.5', '2023-11-30 09:02:40', '3'),
('14', '美的空调', '3000', '2023-11-03 09:03:02', '1'),
('15', '迷你深海鱼肠', '14.4', '2023-12-02 10:01:14', '4');
5、创建订单表 - t_order
- 创建订单表结构
CREATE TABLE `t_order` (
`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '订单标识符',
`username` varchar(20) DEFAULT NULL COMMENT '用户名',
`telephone` varchar(11) DEFAULT NULL COMMENT '电话号码',
`total_price` double DEFAULT NULL COMMENT '总金额',
`delivery_address` varchar(50) DEFAULT NULL COMMENT '送货地址',
`order_time` timestamp NULL DEFAULT NULL ON UPDATE CURRENT_TIMESTAMP COMMENT '下单时间',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=3 DEFAULT CHARSET=utf8;
- 在订单表里插入记录
INSERT INTO `t_order` VALUES ('1', '郑晓红', '13956567889', '2000', '泸职院人大学院', '2016-12-25 17:12:36'),
('2', '温志军', '13956678907', '1000', '泸职院智能制造学院', '2016-12-02 17:12:17');
6、查看表记录
- 查看用户记录
- 查看类别表记录
- 查看商品表
- 查看订单表
(二)创建Maven项目 - SSMSimonShop
(三)在pom.xml文件里添加相关依赖
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0
http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>net.hw.shop</groupId>
<artifactId>SSMSimonShop</artifactId>
<version>1.0-SNAPSHOT</version>
<properties>
<!-- spring.version -->
<spring.version>5.2.9.RELEASE</spring.version>
</properties>
<dependencies>
<!--Spring核心-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${spring.version}</version>
</dependency>
<!--Spring Bean-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-beans</artifactId>
<version>${spring.version}</version>
</dependency>
<!--Spring容器-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>${spring.version}</version>
</dependency>
<!--Spring测试-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-test</artifactId>
<version>${spring.version}</version>
</dependency>
<!--Spring数据库支持-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>${spring.version}</version>
</dependency>
<!--数据库驱动工具包-->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.49</version>
</dependency>
<!--数据库连接池框架-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.1.24</version>
</dependency>
<!--持久层框架-->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.5.5</version>
</dependency>
<!--提供MyBatis与Spring整合的支持-->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>2.0.5</version>
</dependency>
<!--日志框架-->
<dependency>
<groupId>log4j</groupId>
<artifactId>log4j</artifactId>
<version>1.2.17</version>
</dependency>
<!--Spring AOP-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-aop</artifactId>
<version>${spring.version}</version>
</dependency>
<!--AspectJ支持-->
<dependency>
<groupId>aspectj</groupId>
<artifactId>aspectjrt</artifactId>
<version>1.5.4</version>
</dependency>
<dependency>
<groupId>org.aspectj</groupId>
<artifactId>aspectjweaver</artifactId>
<version>1.9.6</version>
<scope>runtime</scope>
</dependency>
<!--单元测试-->
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.13</version>
<scope>test</scope>
</dependency>
<!--Spring Web-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>${spring.version}</version>
</dependency>
<!--Spring MVC-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>${spring.version}</version>
</dependency>
<!--JSP标准标签库-->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<!--Servlet-->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>3.1.0</version>
<scope>provided</scope>
</dependency>
</dependencies>
</project>
(四)创建日志属性文件 - log4j.properties
log4j.rootLogger=WARN, stdout, logfile
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern=%d %p [%c] - %m%n
log4j.appender.logfile=org.apache.log4j.FileAppender
log4j.appender.logfile.File=target/spring.log
log4j.appender.logfile.layout=org.apache.log4j.PatternLayout
log4j.appender.logfile.layout.ConversionPattern=%d %p [%c] - %m%n
(五)创建数据库配置属性文件 - jdbc.properties
log4j.rootLogger=WARN, stdout, logfile
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern=%d %p [%c] - %m%n
log4j.appender.logfile=org.apache.log4j.FileAppender
log4j.appender.logfile.File=target/spring.log
log4j.appender.logfile.layout=org.apache.log4j.PatternLayout
log4j.appender.logfile.layout.ConversionPattern=%d %p [%c] - %m%n
- 说明:jdbc.url有时可能还需设置编码和时区