今天教大家如何设计一个图书商城 , 基于目前主流的技术:前端vue,后端springboot。 同时还带来的项目的部署教程。 视频演示 图片演示 一. 系统概述 商城是一款比较庞大的系统,需要有商品中心,库存中心,订单中心,收货地址和运费管理。先看下我们要实现的商城有哪些功能: 1. 商品分类管理。 2. 商品管理。 3.库存管理。 4.订单管理。
写的页面有点丑陋,不过五脏俱全,基础部分的内容都有涉及,有几次大的优化,可能还有些不足的地方,还望大家指点一下。
实体店书店人流量稀少,实体店书籍销量逐年下跌,网上图书商城是图书销售行中的必然结果。 网上商城明显有许多优势,一是即降低书店的销售成本,二是利用网络交易,使人们不必局限于特定地点,特定时间,拿起手中网络设备随时随地即可以浏览书籍最新信息,随时下单购买。 购书者在网上商城很轻松就能获取到图书的详情信息,购物体验大幅上升。 传统销售渠道的发展和补充,即网上销售图书也是未来图书销售的趋势。 该图书商城系统基于java的SSM技术的开发,以及其他提高开发效率的插件。该商城是24小时营业的网络虚拟平台,为人们提供更加便捷的服务,以及更佳的购物体验。 卖家用户:可以添加要进行上架售卖的图书,修改图书信息、删除图书、搜索图书、查看图书详细信息、修改图书状态即是否上架,然后需超级管理员审核通过才会在商城进行上架。
写的页面有点丑陋,不过五脏俱全,基础部分的内容都有涉及,有几次大的优化,可能还有些不足的地方,还望大家指点一下。
td width="4%">
低价专区
公共营养师
旅行圣经
小学图书馆 p> 东野圭吾 加西亚·马尔克斯 曹文轩 @图书商城 2.商城介绍
2.1.项目介绍
商城是一个全品类的电商购物网站(B2C)。 可以品论已购买商品
管理员可以在后台管理商品的上下架、促销活动
管理员可以监控商品销售状况
客服可以在后台处理退款操作
希望未来3到5年可以支持千万用户的使用
2.2.系统架构
2.2.1.架构图
商城架构缩略图 2.2.2.系统架构解读
整个商城可以分为两部分:后台管理系统、前台门户系统。 网络书城购物系统由用户端,管理员端两大模块组成,各个模块下边又有许多小模块组成,每个模块的作用各不相同,但彼此之间又存在一定关系,通过分析上述模块之间的联系以及系统需求,可得到系统的功能架构,本功能的流程如图2-1所示: https://blog.csdn.net/linzhiqiang0316/article/details/82317132
课程开始之前我们先回忆一下商城app搜索的口子一般有哪些,商城首页一般会有一个搜索 商城首页搜索
?
如上图所示,这个入口的搜索范围是最大的,为什么这么说呢,后面大家就知道了。为了提高我们用户的体验,所以一般不会在首页直接弹出输入键盘,而是跳转到一个新的页面,如下所示:
? 分类页面搜索
分类页面搜索其实本质上面和商城首页搜索没有任何区别,只是放置的位置不一样而已。 总结
今天内容相对而言会比较简单,但是越是简单的内容越是重要,在我们商城应用讲完之后,就要开始我们商品实现技术架构的课程了,比如搜索技术架构就有相当多的内容了,比如聚合、高亮、排序、权重、组合查询、数据同步等等之类的内容 一、图书列表展示功能
1.1 实现分页功能
提到展示图书列表,就不得不提到分页了
分页时,数据是如何展示的呢
第1页:显示1-10 条的数据
第2页:显示11-20 条的数据
第3页:显示 21-30 二、修改图书列表功能
2.1约定前后端交互接口
1.进入修改页面,需要显示当前 Id 图书的信息
[请求]
/book/queryBookById? ID,获取当前图书的信息
2.点击修改按钮,修改图书信息
[请求]
/book/updateBook
Content-Type: application/x-www-form-urlencoded 三、逻辑删除图书
删除图书分为
逻辑删除(update):
从逻辑上进行删除,数据并没有真实删除
物理删除(delete语句):
数据真实删除。 到这里其实这个图书管理系统的功能就基本实现完成了。
不过对于这个图书管理系统。
我们没有进行登录也可以进行操作。
因此我们下一篇文章会详细讲解强制登录功能。 前两天有读者提出了书中的两处表述问题,还是非常感谢!
第一处是书中69页:
原文是:
在浏览器中提供/hello2和/hello接口分别进行访问,当访问/hello接口时...
修改后是:
在浏览器中提供/hello2和/hello接口分别进行访问,当访问/hello2接口时...
第二处是247页的代码片段,这里发现是拷贝错了,原文是:
@GetMapping("/hello")
public void hello() {
try {
jobLauncher.run(job, nu 推荐语:本书由Python pandas项目创始人Wes McKinney亲笔撰写,详细介绍利用Python进行操作、处理、清洗和规整数据等方面的具体细节和基本要点。 DX开发的入门级图书。 精通direct3d图形及动画程序设计:这本书也是国人写的,很多人都说是翻译的DX文档,但是我认为这本书是关于DX最好的入门图书了,讲解比较清楚,例子丰富,堪称DX开发百科全书,DX的入门级碧波图书。 目前已经出了多个版本了,学习OpenGL的必备图书。
3、网络技术:在线游戏必然离不开网络,我没有发现特别经典的图书,只推荐一本对我很有帮助的书。 算法导论:本书是经典算法图书,但是我一直没有读完,感觉太厚给自己的压力太大,而且本书讲解了太多的算法基础理论,学术性质太浓厚,老是看的想睡觉,但是作为算法的经典图书,这里还是推荐一下。 SQL查询初学者指南:关于SQL查询的入门级图书。 我们使用到的技术:
前端:”是自己在网上找的代码
后端
IDEA
Maven
MySQL+Mybatis
SSM
实现的功能:
用户登录
添加图书
显示图书列表
更新图书
删除图书
批量删除图书
强制登录 第三步实现用户登录功能
第四步实现添加图书功能
第五步实现显示图书列表功能
第六步实现更新图书功能
第七步实现删除图书功能
第八步实现批量删除图书
第九步实现强制登录
第十步加上统一功能 预览整体项目
首页
登录进去
可以进行翻页
添加图书
批量删除
修改图书
删除图书
一、建立数据库
1.1配置数据库 & 日志
server: UTF-8
[参数]
bookName=图书1&author=作者1&count=23&price=36&publish=出版社1&status=1
[响应]
"成功添加图书" //失败信息 返回“”表示图书添加成功。否则,返回失败信息。 图书列表案例
静态列表效果
基于数据实现模板效果
处理每行的操作按钮
1、 提供的静态数据
数据存放在vue 中 data 属性中
var vm = new Vue({ -添加图书
*/
var vm = new Vue({
el: '#app',
data: {
id: '',
name: '', -添加图书
*/
var vm = new Vue({
el: '#app',
data: {
flag: false,
id: -添加图书
*/
var vm = new Vue({
methods: {
deleteBook: function(id){
// 删除图书 图书的总数就是计算数组的长度
-- 轮播 -->
有读者指出第五章JPA多数剧源配置一节,按照书中的源码无法实现效果,启动时会报错,我刚开始想着不可能,因为书中所有案例我都是本地运行没问题才把代码拷贝到书上去的,所以应该没有问题,后来还是这位细心的读者通过查看书的配套源码,发现了端倪: 1.图书列表
静态列表效果
基于数据实现模板效果
处理每行的操作按钮(禁止默认行为)
1、 提供的静态数据
数据存放在vue 中 data 属性中
var vm = new Vue 实现表单的静态效果
添加图书表单域数据绑定
添加按钮事件绑定
实现添加业务逻辑
准备数据库
新建数据库 bookmanager,然后创建两张表:图书表 book 和 预约图书表 appointment;
-- 建数据库
CREATE DATABASE `bookmanager`; -- 创建图书表
CREATE TABLE `book` (
`book_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '图书ID',
`name id
* @return 对应 id 的图书
* @description 根据图书 id 查找对应图书
* @date 2020/7/23 16:04
* @ id
* @param studentId 学生 id
* @return
* @description 通过主键查询预约图书记录,并且携带图书实体
* @date ,下一步我们就可以对其进行优化,并编写 service 层和 controller 层代码了,详情可见 图书管理系统实战(二)[1]
参考资料
[1]图书管理系统实战(二): https://blog.csdn.net 前言
前一篇文章 图书管理系统实战(一)[1] 中,我们已经编写了 pojo、dao 层以及配置 dao 层对应的 mapper,从现在开始,我们开始编写 service 层和 controller 层 2. service 层
2.1 预约业务操作码
在正式编写 service 层之前,我们先定义一个预约图书操作返回码的数据字段,用于反馈给客户信息;
返回码 说明
1 预约成功
0 预约失败
-1 预约重复 ID
* @return 对应 ID 的图书
* @description 根据图书 id 查询图书
* @date 2020/7/24 11:41
* @author * @description 获取图书列表
* @date 2020/7/24 11:41
* @author cunyu1943
* @version 1.0 */
List<Book> getList();
/**
* @param bookId 图书 id
* @param studentId 学生 准备数据库
新建数据库 bookmanager,然后创建两张表:图书表 book 和 预约图书表 appointment;
-- 建数据库
CREATE DATABASE `bookmanager`; -- 创建图书表
CREATE TABLE `book` (
`book_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '图书ID',
`name id
* @return 对应 id 的图书
* @description 根据图书 id 查找对应图书
* @date 2020/7/23 16:04
* @ id
* @param studentId 学生 id
* @return
* @description 通过主键查询预约图书记录,并且携带图书实体
* @date ,下一步我们就可以对其进行优化,并编写 service 层和 controller 层代码了,详情可见 图书管理系统实战(二)商城项目-商城介绍
【毕设项目推荐】基于协同过滤算法Spring Boot +Vue的图书商城系统
【商城应用】商城搜索流程
<基于Spring图书管理系统②(图书列表+删除图书+更改图书)(非强制登录版本完结)>
图书勘误-2
【Python图书优惠】
游戏开发图书推荐--我读过的技术经典图书
<Spring图书管理系统①(登录+添加图书)>
图书列表案例
基于HTML电商购物项目的设计与实现——html+css+javascript+jquery+bootstarp响应式图书商城
图书勘误-1
图书列表案例
图书管理
图书管理系统(三)图书管理系统实战(1)
图书管理系统(四)图书管理系统实战(2)
图书管理系统(三)图书管理系统实战(一)