二手商城系统+SpringBoot + Vue (前后端分离)
大家好,今天给大家带来一个超级简单的 二手商城系统。大家可用学习下系统的设计和源码风格。
视频演示
二手商城
图片演示
技术栈
后端
技术框架:JDK8+SpringBoot2 + Mybatis-Plus
数据库:Mysql8
前端
- Vue.js 2.6.10 - 主要的前端框架
- Vue Router 3.0.3 - 前端路由管理
- Vuex 3.0.1 - 状态管理
UI 组件库
- Element UI 2.15.1 - UI组件库,提供丰富的组件
HTTP请求处理
- Axios 0.21.1 - HTTP客户端,用于与后端API通信
- Vue-Axios 3.2.4 - Vue的Axios插件
系统功能概述
整个系统分为 管理员, 商家端, 用户端 三大角色,每个角色有着不同的功能。
管理员账号信息: wjz / 123456
商家账号 , 用户账号 可以自己注册,审核。
管理员端
审核用户
根据用户,商家两种类型查询平台的所有用户和商家,然后可以对刚注册的商家和用户进行审核,审核支持通过和拒绝。通过后商家和用户方可登录成功。
审核商品
查询平台内商家商家上架的待审核的商品,注意,审核通过和拒绝的不在列表内展示,然后可以对商品进行通过和拒绝,通过后商品方可在前端展示和被购买。
商家等级管理
查询审核通过的商家,然后可以修改商家的等级字段。
充值操作
根据用户名进行搜索用户, 然后可以任意修改用户的余额,用户只有足够的余额才能下单购买商品。
交易管理
查询平台的交易订单数据。
商家端
首页
商家端首页是商品展示,有三大板块。“待审核商品”,“已下架商品”,“全部商品” 。每个商品项支持修改商品属性:“商品名称”,“价格”,‘新旧程度“,”商品图片“等信息。
首页还有上架商品的功能,上架商品后,等待管理员审核通过。
我的订单
展示用户在当前商家下的订单, 用户刚下单,成为代发货状态, 会在商家端的订单列表展示,然后支持发货操作,发货后,订单处理运输中状态。用户端可以退款和收获操作,收获后,订单变成已经完成状态。
商家信息
展示商家的余额和等级字段。
登录/注册
用户端
首页
用户在首页可以进行商品搜索, 轮播图查看,展示平台内最新上架的商品。然后点击就可以进入商品详情购买。商品还支持类目进行搜索。
我的订单
展示用户在当前商家下的订单, 用户刚下单,成为代发货状态, 会在商家端的订单列表展示,然后支持发货操作,发货后,订单处理运输中状态。用户端可以退款和收获操作,收获后,订单变成已经完成状态。
我的钱包
展示用户的余额和积分字段。
购物车
展示用户添加到购物车的商品, 支持批量删除购物车和下单操作。
商品评价
登录/注册
系统部署
执行sql
用户需要自己安装好mysql数据库,注意,必须是mysql8 ,否则代码运行会出错。
然后用navicate等连接工具,连接到mysql服务,然后新建一个 hadluo-gc 数据库, 然后执行 “hadluo-gc.sql” 里面的表创建和数据导入。
前端部署
vue项目部署
前端的项目必须没有中文,否则启动会报错!!
安装node , 版本:v22.12.0 , 安装完成后。 进入到项目 hadluo-vue 目录下,这个项目是vue的前端, 右键,运行cmd,运行下面命令:
npm run serve
由于我已经跟你npm install好了,所以你无需执行,直接run就可以了!!
到此前端项目部署完成。
启动后端项目
将maven设置的settings.xml改成你自己的配置。
然后刷新maven,等待项目下载依赖包完成。。。。。
然后部署后端 , 打开idea, 导入maven工程 hadluo-server。
打开resources目录, 修改 application.yml 配置文件,主要修改下面几个信息:
数据库信息(注意改成你的地址)
spring:datasource:username: rootpassword: qq123456url: jdbc:mysql://127.0.0.1:3306/hadluo-sstore?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC
图片存储信息(可以不用动)
# 文件图片存储 filestore: D:\ftp\hadluo-sstore
然后启动 main 启动类 :SecondStoreApplication.class
浏览器访问
http://localhost:8080
管理员账号信息: wjz / 123456
商家账号 , 用户账号 可以自己注册,审核。
注意每个账号需要不同的浏览器打开(或者你浏览器开无恒模式),否则会串token数据。