基于Java+Springboot+Vue的二次元商城网站设计与实现

博主介绍擅长Java、微信小程序、Python、Android等,专注于Java技术领域和毕业项目实战

🍅文末获取源码联系🍅

👇🏻 精彩专栏推荐订阅👇🏻 不然下次找不到哟

Java项目精品实战案例(300套)
Java+小程序项目实战(200套)

目录

一、效果演示

二、前言介绍

三、主要技术

四、系统设计(部分)

4.1、主要功能模块设计

五、运行截图

5.1、后台功能

5.2.1、管理员登录界面

5.2.2、系统首页

5.2.3、会员管理

4.2.4、栏目管理

5.2.5、商品管理

5.2.6、评价管理

4.2.7、订单管理

5.3、前台功能

5.3.1、新用户注册登录

5.3.2、首页

5.3.3、商品分类

5.3.4、地址管理

5.3.5、订单管理

5.3.6、购物车管理

5.3.6、我喜欢的

六、库表设计

七、部分代码

 八、源码获取


一、效果演示

二、前言介绍

如今的社会是一个互联网化的社会,线下的一切商业活动几乎都被线上运转着,人类活动的圈子也大部分都在互联网上进行。如今,二次元文化也在随着数字传媒的发展而不断发展着,其有着主要的话语权的无非是现在的90后以及00后,这些用户逐渐的成为了二次元文化商品的主要消费群体,并且二次元所具有的时代特征是二次元文化娱乐的主要形式,二次元打破了时代的墙壁,进入了市场经济,同电子商务相结合起来。而如今,线下交易模式和线上营销相结合着,比如以前是报修人员通过线下联系网络故障维修人员来上门进行维修,线下的联系方式有打电话、上门告知,但随着时代的发展,这种方式已经不复存在,报修人员也有相关的报修平台,只要将需要报修的大概问题向报修平台进行提交,维修中心的人员就会马上进行反馈,自动上门进行维修,维修结束之后,报修人员可以对维修人员的处理结果进行反馈打分。而且进行线上报修还可以有相应的优惠活动参与,这样也节省了一部分维修资金。还有其他的各种活动也是,同时,大多数的线下活动也在同时进行着线上模式。

三、主要技术

技术名作用
SpringBoot后端框架
Vue前端框架
MySQL数据库

四、系统设计(部分)

4.1、主要功能模块设计

五、运行截图

5.1、后台功能

5.2.1、管理员登录界面

输入网址进入网站,将跳出二次元商城网站后台管理员的登录的界面,然后管理员输入账户名和密码进行登录。如下图所示:

图5.2.2.1a 登录界面

5.2.2系统首页

在系统管理中,展示了在此二次元商城中所注册的用户数量、在商城中所有上架的商品数量,以及成功下单的所有单数,是管理员对整个商城的受喜爱程度进行合理的估计以及制定后续的一个发展方向。

图5.2.2.1a 管理员列表

5.2.3、会员管理

图5.2.3.1a 会员管理列表

4.2.4、栏目管理

图4.2.4.1 栏目管理列表

图5.2.4.2 栏目编辑

5.2.5、商品管理

图5.2.5.1 商品管理列表

图5.2.5.2 商品添加

5.2.6、评价管理

图5.2.6.1a 评价管理列表

4.2.7、订单管理

4.2.7.1a 订单列表

5.3、前台功能

5.3.1、新用户注册登录

点击进入网站,在上方展示了二次元网站的所有功能模块,右侧为新用户注册以及用户登录的入口,点击从下方弹出输入框。

图5.3.1.1a 用户注册界面

5.3.2、首页

在登录成功进入之后,来到网站首页,在首页中,展示了本二次元网站的购物主题,背景模块以及文字的选择均是完全的贴合二次元商品的主题,给用户给予一种轻松愉快的感觉。在上方分两个模块展示,分别为商品分类与个人中心,点击个人中心,可基于首页下拉进入地址管理、订单列表、购物车管理、我喜欢的以及退出购物网站。 

图5.3.2.1a 首页

5.3.3、商品分类

图5.3.3.1a 商品界面

图5.3.3.1b 商品详情

图5.3.3.1c 商品加入购物车

5.3.4、地址管理

图5.3.4a 地址列表

图5.3.4b 地址添加

5.3.5、订单管理

图5.3.5.1a 商品订单号

图5.3.5.1b 商品评价

5.3.6、购物车管理

图5.3.6.1a 购物管理

 图5.3.6.1b 价格总计

图5.3.6.1c 商品支付

5.3.6我喜欢的

图5.3.6.1a 我喜欢的商品界面

这里功能太多就不一一截图展示了

六、库表设计

/*
SQLyog Ultimate v13.1.1 (64 bit)
MySQL - 10.5.9-MariaDB : Database - shop
*********************************************************************
*/

/*!40101 SET NAMES utf8 */;

/*!40101 SET SQL_MODE=''*/;

/*!40014 SET @OLD_UNIQUE_CHECKS=@@UNIQUE_CHECKS, UNIQUE_CHECKS=0 */;
/*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */;
/*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */;
/*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */;
CREATE DATABASE /*!32312 IF NOT EXISTS*/`shop` /*!40100 DEFAULT CHARACTER SET utf8mb4 */;

USE `shop`;

/*Table structure for table `address` */

DROP TABLE IF EXISTS `address`;

CREATE TABLE `address`
(
    `id`      int(11) NOT NULL AUTO_INCREMENT,
    `user_id` int(11) NOT NULL,
    `name`    varchar(45) DEFAULT NULL COMMENT '姓名',
    `phone`   varchar(45) DEFAULT NULL COMMENT '手机',
    `address` text        DEFAULT NULL COMMENT '地址',
    `code`    varchar(45) DEFAULT NULL COMMENT '邮编',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='地址';

/*Data for the table `address` */

/*Table structure for table `cart` */

DROP TABLE IF EXISTS `cart`;

CREATE TABLE `cart`
(
    `id`       int(11) NOT NULL AUTO_INCREMENT,
    `user_id`  int(11) NOT NULL,
    `goods_id` int(11) NOT NULL,
    `sum`      int(11) DEFAULT NULL COMMENT '数量',
    `attr`     text    DEFAULT NULL COMMENT '属性json',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='购物车';

/*Data for the table `cart` */

/*Table structure for table `category` */

DROP TABLE IF EXISTS `category`;

CREATE TABLE `category`
(
    `id`   int(11) NOT NULL AUTO_INCREMENT,
    `name` varchar(45) DEFAULT NULL COMMENT '名称',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='栏目';

/*Data for the table `category` */

/*Table structure for table `comment` */

DROP TABLE IF EXISTS `comment`;

CREATE TABLE `comment`
(
    `id`         int(11) NOT NULL AUTO_INCREMENT,
    `created_at` datetime    DEFAULT NULL,
    `user_id`    int(11) NOT NULL,
    `goods_id`   int(11) NOT NULL,
    `title`      varchar(45) DEFAULT NULL COMMENT '标题',
    `content`    text        DEFAULT NULL COMMENT '内容',
    `rating`     int(11)     DEFAULT NULL COMMENT '评分',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='评论';

/*Data for the table `comment` */

/*Table structure for table `goods` */

DROP TABLE IF EXISTS `goods`;

CREATE TABLE `goods`
(
    `id`          int(11) NOT NULL AUTO_INCREMENT,
    `title`       varchar(45)    DEFAULT NULL COMMENT '标题',
    `content`     text           DEFAULT NULL COMMENT '内容',
    `price`       decimal(10, 2) DEFAULT NULL COMMENT '价格',
    `inventory`   int(11)        DEFAULT NULL COMMENT '库存数量',
    `attr`        text           DEFAULT NULL COMMENT '属性json',
    `created_at`  datetime       DEFAULT NULL,
    `category_id` int(11) NOT NULL,
    `pic`         varchar(245)   DEFAULT NULL,
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='商品';

/*Data for the table `goods` */

/*Table structure for table `like` */

DROP TABLE IF EXISTS `like`;

CREATE TABLE `like`
(
    `id`       int(11) NOT NULL AUTO_INCREMENT,
    `user_id`  int(11) DEFAULT NULL,
    `goods_id` int(11) DEFAULT NULL,
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4;

/*Data for the table `like` */

/*Table structure for table `order` */

DROP TABLE IF EXISTS `order`;

CREATE TABLE `order`
(
    `id`         int(11) NOT NULL AUTO_INCREMENT,
    `created_at` datetime       DEFAULT NULL,
    `user_id`    int(11) NOT NULL,
    `total`      decimal(10, 2) DEFAULT NULL COMMENT '总价',
    `address`    text           DEFAULT NULL COMMENT '地址',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='订单';

/*Data for the table `order` */

/*Table structure for table `order_item` */

DROP TABLE IF EXISTS `order_item`;

CREATE TABLE `order_item`
(
    `id`       int(11) NOT NULL AUTO_INCREMENT,
    `sum`      int(11) DEFAULT NULL COMMENT '数量',
    `goods_id` int(11) NOT NULL,
    `order_id` int(11) NOT NULL,
    `goods`    text    DEFAULT NULL COMMENT '商品快照',
    `attr`     text    DEFAULT NULL COMMENT '已选属性json',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  DEFAULT CHARSET = utf8mb4 COMMENT ='订单项';

/*Data for the table `order_item` */

/*Table structure for table `user` */

DROP TABLE IF EXISTS `user`;

CREATE TABLE `user`
(
    `id`         int(11) NOT NULL AUTO_INCREMENT,
    `username`   varchar(45) DEFAULT NULL COMMENT '用户名',
    `password`   varchar(45) DEFAULT NULL COMMENT '密码',
    `created_at` datetime    DEFAULT NULL,
    `type`       int(11)     DEFAULT NULL COMMENT '类型',
    `email`      varchar(45) DEFAULT NULL COMMENT '邮箱',
    PRIMARY KEY (`id`)
) ENGINE = InnoDB
  AUTO_INCREMENT = 2
  DEFAULT CHARSET = utf8mb4 COMMENT ='用户';

/*Data for the table `user` */

insert into `user`(`id`, `username`, `password`, `created_at`, `type`, `email`)
values (1, 'admin', 'e10adc3949ba59abbe56e057f20f883e', '2021-03-11 14:54:36', 2, 'admin@qq.com');

/*!40101 SET SQL_MODE = @OLD_SQL_MODE */;
/*!40014 SET FOREIGN_KEY_CHECKS = @OLD_FOREIGN_KEY_CHECKS */;
/*!40014 SET UNIQUE_CHECKS = @OLD_UNIQUE_CHECKS */;
/*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;

七、部分代码

package com.my.shop.controller;


import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.my.shop.constant.MyPage;
import com.my.shop.dto.MyMsg;
import com.my.shop.entity.Comment;
import com.my.shop.exception.MyException;
import com.my.shop.service.ICommentService;
import com.my.shop.service.IGoodsService;
import io.swagger.annotations.Api;
import io.swagger.v3.oas.annotations.Operation;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpServletRequest;
import javax.validation.Valid;

/**
 * <p>
 * 评论 前端控制器
 * </p>
 *
 * @author yl
 * @since 2021-03-10
 */
@RestController
@RequestMapping("/user/comment")
@Api(tags = "用户评论")
public class CommentController {

    @Autowired
    private ICommentService commentService;

    @Autowired
    private IGoodsService goodsService;

    @RequestMapping(method = RequestMethod.GET, path = "/list")
    @Operation(summary = "列表")
    public MyMsg list(@RequestParam(required = false, defaultValue = "0") Long userId,
                      @RequestParam(required = false, defaultValue = "0") Long goodsId,
                      @RequestParam(required = false, defaultValue = "1") Integer page) {
//        HttpSession session = request.getSession();
//        User user = (User) session.getAttribute(User.USER_SESSION_NAME);

        Page<Comment> page1 = new Page<>(page, MyPage.PAGE_NUM);

        QueryWrapper<Comment> commentQueryWrapper = new QueryWrapper<>();
        if (userId > 0) {
            commentQueryWrapper.eq("user_id", userId);
        }

        if (goodsId > 0) {
            commentQueryWrapper.eq("goods_id", goodsId);
        }


        Page<Comment> page2 = commentService.page(page1, commentQueryWrapper);

        return new MyMsg(MyMsg.SUCCESS, "成功", page2);
    }

    @RequestMapping(method = RequestMethod.GET, path = "/{id}")
    @Operation(summary = "详细")
    public MyMsg get(@PathVariable Integer id) {
        Comment comment = commentService.getById(id);
        return new MyMsg(MyMsg.SUCCESS, "成功", comment);
    }

    @RequestMapping(method = RequestMethod.POST, path = "/")
    @Operation(summary = "新增")
    public MyMsg get(@RequestBody @Valid Comment comment, HttpServletRequest request) throws MyException {
//        HttpSession session = request.getSession();
//        User user = (User) session.getAttribute(User.USER_SESSION_NAME);
//
//        comment.setUserId(user.getId());

        if (goodsService.getById(comment.getGoodsId()) == null) {
            throw new MyException("商品不存在");
        }

        if (commentService.save(comment)) {
            return new MyMsg(MyMsg.SUCCESS, "成功");
        } else {
            return new MyMsg(MyMsg.FAIL, "失败");
        }
    }
}

 八、源码获取

大家点赞、收藏、关注、评论啦 、如果想要交流,关于技术讨论,可以找我~

精彩专栏推荐订阅:下方专栏👇🏻👇🏻👇🏻👇🏻

Java项目精品实战案例(300套)

Java+小程序项目实战(200套)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/27286.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

YOLO系列理论合集(YOLOv1~v3SPP)

前言&#xff1a;学习自霹雳吧啦Wz YOLOV1 论文思想 1、将一幅图像分成SxS个网格(grid cell),如果某个object的中心落在这个网格中&#xff0c;则这个网格就负责预测这个object。 2、每个网格要预测B个bounding box&#xff0c;每个bounding box除了要预测位置&#xff08;…

基于NE555芯片的简单延时电路和方波信号发生器

简单延时电路 NE555芯片是一种经典的计时器集成电路&#xff0c;常用于电子设计中的定时和延时功能。下面是一个简单的NE555延时电路的详细分析和讲解&#xff1a; NE555芯片是一个多功能的集成电路&#xff0c;主要由比较器、RS触发器、RS锁存器以及输出驱动器等组成。它可以工…

Mysql进阶【3】论述Mysql优化

1.通过explain查看sql的详细信息 Mysql的sql优化企业里边主要是对慢sql进行优化&#xff0c;对语句进行优化&#xff0c;对索引进行优化 通过explain查看sql的详细信息&#xff0c;并且分析sql语句存在的问题&#xff0c;比如有没有使用到索引、使用了索引还是慢是不是索引设…

机器学习笔记 - EANet 外部注意论文简读及代码实现

一、论文简述 论文作者提出了一种新的轻量级注意力机制&#xff0c;称之为外部注意力。如图所示&#xff0c;计算自注意力需要首先通过计算自查询向量和自关键字向量之间的仿射关系来计算注意力图&#xff0c;然后通过用该注意力图加权自值向量来生成新的特征图。外部关注的作用…

智慧加油站解决方案,提高加油区和卸油区的安全性和效率

英码科技智慧加油站解决方案是一个综合应用了AI智能算法的视觉分析方案&#xff0c;旨在提高加油区和卸油区的安全性和效率。 加油区算法&#xff1a; 吸烟检测&#xff1a;通过AI算法分析视频流&#xff0c;检测是否有人在加油区域吸烟&#xff0c;以防止火灾风险。 打电话…

STM32开发——串口通讯(非中断+中断)

目录 1.串口简介 2.非中断接收发送字符 3.中断接收字符 1.串口简介 通过中断的方法接受串口工具发送的字符串&#xff0c;并将其发送回串口工具。 串口发送/接收函数&#xff1a; HAL_UART_Transmit(); 串口发送数据&#xff0c;使用超时管理机制HAL_UART_Receive(); 串口…

案例26:基于Springboot校园社团管理系统开题报告

博主介绍&#xff1a;✌全网粉丝30W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专…

苹果MacOS系统傻瓜式本地部署AI绘画Stable Diffusion教程

Stable Diffusion的部署对小白来说非常麻烦&#xff0c;特别是又不懂技术的人。今天分享两个一键傻瓜式安装包&#xff0c;对小白来说非常有用。下面两个任选一个安装就可以。 一、DiffusionBee 简单介绍 DiffusionBee是基于stable diffusion的一个安装包&#xff0c;有图形…

python文字转语音(pyttsx3+flask)

提示&#xff1a;文章结尾有全部代码 目录 前言一、Flaskpyttsx基本使用Flask导入Flask框架配置基础环境初始Flask代码 pyttsx3库基本使用导入pyttsx3初始化pyttsx3文字转语音运行 二、具体实现1.引入库 总结 前言 本文主要讲解如何用python的pyttsx3库flask框架&#xff0c;手…

有了IP地址,还需要MAC地址嘛?二选一可否?

概要 在计算机网络中&#xff0c;IP地址和MAC地址是两个最基本的概念。IP地址在互联网中是用于标识主机的逻辑地址&#xff0c;而MAC地址则是用于标识网卡的物理地址。虽然它们都是用于标识一个设备的地址&#xff0c;但是它们的作用和使用场景是不同的。 IP地址是在网络层&am…

数据结构之树与二叉树——算法与数据结构入门笔记(五)

本文是算法与数据结构的学习笔记第五篇&#xff0c;将持续更新&#xff0c;欢迎小伙伴们阅读学习。有不懂的或错误的地方&#xff0c;欢迎交流 引言 前面章节介绍的都是线性存储的数据结构&#xff0c;包括数组、链表、栈、队列。本节带大家学习一种非线性存储的数据结构&…

chatgpt赋能python:Python分词:从原理到实践

Python分词&#xff1a;从原理到实践 分词是自然语言处理中的关键步骤之一&#xff0c;它是指将一句话或一段文本分成若干个词语&#xff08;token&#xff09;并进行标注。Python作为一种非常流行的编程语言&#xff0c;具备强大的文本处理能力&#xff0c;而分词也是它的强项…

chatgpt赋能python:Python如何切换中文

Python 如何切换中文 Python 是一种广泛使用的编程语言&#xff0c;被用于多种目的&#xff0c;包括数据分析、机器学习、Web 应用程序等。在使用 Python 进行开发时&#xff0c;需要处理不同的语言&#xff0c;其中中文也是包括在内的。对于需要切换中文的情况&#xff0c;本…

学生考试作弊检测系统 yolov8

学生考试作弊检测系统采用yolov8网络模型人工智能技术&#xff0c;学生考试作弊检测系统过在考场中安装监控设备&#xff0c;对学生的作弊行为进行实时监测。当学生出现作弊行为时&#xff0c;学生考试作弊检测系统将自动识别并记录信息。YOLOv8 算法的核心特性和改动可以归结为…

关于数据生成二维码保存和解密删除二维码

文章目录 前言一、pom配置依赖二、文件引入1.BufferedImageLuminanceSource2.QRCodeUtil3.MyPicConfig4.UploadUtils三、测试前言 所需文件: MyPicConfig 主要解决上传图片实时刷新BufferedImageLuminanceSource 算法文件QRCodeUtil 生成二维码工具类UploadUtils 主要解决上传…

软考A计划-系统架构师-官方考试指定教程-(13/15)

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例 &#x1f449;关于作者 专注于Android/Unity和各种游戏开发技巧&#xff0c;以及各种资源分享&am…

【Java基础学习打卡03】计算机中数据的表示、存储与处理

目录 前言一、数据的表示1.数据与信息2.计算机中的数据3.计算机中数据的单位 二、数据的存储三、数据的处理1.进位计数值2.进制间转换 四、字符编码总结 前言 本小节主要介绍在计算机中数据的表示、存储与处理。要知道计算机内部使用二进制数据&#xff0c;也就是0和1组成的数…

2.3 YARN伪分布式集群搭建

任务目的 重点掌握 YARN 集群的相关配置学会启动和关闭 YARN 集群的两种方式能够使用 jps 命令查看进程的启动情况能够通过 UI 查看 YARN 集群的运行状态任务清单 任务1:YARN 集群主要配置文件讲解任务2:YARN 集群测试任务步骤 任务1:YARN 集群主要配置文件讲解 1.1 配置环…

【新版】系统架构设计师 - 计算机系统基础知识

个人总结&#xff0c;仅供参考&#xff0c;欢迎加好友一起讨论 文章目录 架构 - 计算机系统基础知识考点摘要计算机系统计算机硬件组成浮点数Flynn分类法CISC与RISC流水线技术超标量流水线存储系统层次化存储结构CacheCache的命中率Cache的页面淘汰主存编址磁盘管理&#xff08…

Linux 信号

文章目录 1. 信号1.1 前言1.2 信号的位置1.3 接口1.3.1 sigset_t1.3.2 信号集操作接口1.3.3 signal1.3.4 sigprocmask1.3.5 sigpending 2. 信号的处理2.1 内核态和用户态2.2 信号的监测和处理 1. 信号 1.1 前言 在 Linux 中&#xff0c;信号是一种用于进程之间的通信机制&…