项目地址

前台小程序代码:a6678696/mall-wx: 微信小程序商城前台 (github.com)

后台管理系统代码:a6678696/mall-web: 微信小程序商城后台 (github.com)

服务端代码:a6678696/mall-admin: 微信小程序商城服务端 (github.com)

使用的技术

所属项目 技术 版本 说明
服务端 MySQL 5.6 数据库
Spring Boot 2.2.6.RELEASE 后端项目框架
Mybatis-Plus 3.5.3.1 持久层框架
Druid 1.2.15 数据库连接池
Gson 2.10 Java对象序列化/反序列化库
Commons IO 2.11.0 用于协助开发IO功能
Hutool 5.8.11 Java工具类库
java-jwt 4.2.1 Java推荐的JWT依赖
后台 Vite 4.0.0 前端构建工具
Vue.js 3.2.45 前端JavaScript框架
Vue Router 4.1.6 Vue.js 的官方路由
Axios 1.2.1 基于promise的网络请求库
Element Plus 2.2.26 基于 Vue 3.0 的桌面端组件库
VueQuill 1.0.1 富文本编辑器
前台 Vant Weapp 1.10.11 小程序 UI 组件库

功能介绍

前台小程序

  1. 查看推荐、新品、热卖、降价和分类商品
  2. 查看公告
  3. 查看商品详情、搜索商品
  4. 管理购物车的商品
  5. 提交、模拟支付、取消和查看订单,给订单确认收货
  6. 新增、修改和删除收货地址,设置默认收货地址
  7. 修改个人昵称和头像
  8. 评价已完成的订单商品,查看所有评价

后台管理系统

  1. 公告管理(添加、查看、修改、删除、查询)
  2. 用户管理(查询)
  3. 商品大类管理(添加、查看、修改、删除、查询)
  4. 商品小类管理(添加、查看、修改、删除、查询)
  5. 商品管理(添加、查看、修改、删除、查询、设置商品卡片图片、设置详情页轮播图图片、设置是否热卖、设置是否推荐、设置是否首页轮播)
  6. 订单管理(删除、查询)
  7. 评价管理(删除、查询)

图片展示

前台小程序

首页
image-20230101032747118
分类
image-20230101032850317
购物车
image-20230101032955540
我的
image-20230101033045354
搜索商品
image-20230101033128270
搜索结果
image-20230101033226839
商品详情
image-20230101033336406 image-20230101033411202
公告
image-20230101033502114
新品商品
image-20230101033640778
热卖商品
image-20230101033619008
降价商品
image-20230101033707668
分类商品
image-20230101033803290
确认订单
image-20230101033936306
全部订单
image-20230101034021486
订单详情
image-20230101034054736
收货地址管理
image-20230101034145024 image-20230101034218456 image-20230101034249935
修改昵称和头像
image-20230101034334329
查看我的评价
image-20230101034421714

后台管理系统

登录界面

image-20230101034545179

公告管理

image-20230101034623993

用户管理

image-20230101034647185

商品大类管理

image-20230101034747100

商品小类管理

image-20230101034838616

商品管理

image-20230101034908593

image-20230101035412594

订单管理

image-20230101035228530

评价管理

image-20230101035327193

部署时要修改的环境

说明

数据库文件和图片等资源都在服务端代码的myResources文件夹中

主要是修改服务端的的代码,服务端的端口默认是8080,不要修改,不然要去修改前台小程序端和后台管理系统请求的服务端端口(小程序代码修改名为 requestUtil.js 的文件,后台管理系统则修改axios.js这个文件)

要修改的地方

application.yml配置文件

最下面的图片存储地址都改成自己电脑上的,数据库的名称最好和我的命名一样(可以直接导入数据库文件)

FilePathConfig.java映射配置

将本地路径的映射改成自己电脑上的

CustomerController.java

/customer/login方法的settingFileLocation属性改为自己电脑上myConfig.setting这个文件的路径

myConfig.setting

在服务端代码的myResources文件夹中,appid和secret需要自己去小程序的开发管理后台中获取