后台管理类项目的前后端全实现(Go + Vue)

1,650 阅读3分钟

前言

该项目实现了后台管理类项目的前后端,管理的是自己写的商城类微信小程序

  • 前端:HTML、JS、Vue、ElementUI
  • 后端:Go、Gin、GORM
  • 数据库:MySQL、Redis

项目仓库地址

前端仓库链接:后台管理项目前端

后端仓库链接:后台管理项目后端

项目介绍

实现的功能点:

  • 权限管理
    • 管理员注册
    • 管理员登录
    • 用户权限修改(普通管理员、超级管理员)
  • 商品管理
    • 商品列表(修改、删除)
    • 添加商品
    • 商品统计(图表统计)
  • 分类管理
    • 商品分类列表(修改、删除)
  • 商城普通用户管理
    • 用户管理(用户信息查看、修改)
    • 添加用户

该项目致力于打造一个简易实现的后台管理系统,采用现阶段流行技术实现,欢迎大家相互交流学习、欢迎点赞 👍 和 start✨。

技术选型

后端技术

技术说明官网
GoGo 语言go.dev/
GinGo (Golang) 编写的 Web 框架github.com/gin-gonic/g…
GORMGolang 的 ORM框架gorm.io/index.html
Swagger-UI文档生成工具github.com/swagger-api…

前端技术

技术说明官网
JavaScriptJavaScript语言www.javascript.com/
Vue前端框架vuejs.org/
Axios前端HTTP框架github.com/axios/axios
ElementUIUI组件库element.eleme.cn/#/zh-CN
Sass样式拓展语言sass-lang.com/

容器技术

技术说明官网
Docker容器www.docker.com/
Kubernetes容器编排引擎kubernetes.io/

数据库

技术说明官网
MySql关系型数据库www.mysql.com/
Redis非关系型数据库redis.io/

运行结果展示

管理员注册

实现了管理员的登录注册功能。每次用户登录,将用户信息缓存至 Redis 中,保证该用户的 24h 不用重新登录。

image.png

管理员信息管理,此部分为超级管理员的功能,允许超级管理员对普通管理员进行权限的修改、新增及删除操作。 image.png

image.png

商品管理

管理普通用户的所有商品,包含商品名称、商品分类、商品现价、商品原价、封面图等信息,并且能对信息进行修改和删除。其中的商品查询用到了分页功能。

image.png

上架商品功能,能给商品数据库中添加一件商品。 image.png

统计用户加购数量前十的商品。商品被加购的次数缓存在 Redis 中。 image.png

分类管理

商品分类信息管理,允许管理员对小程序首页的分类信息进行修改和删除。 image.png

商城普通用户管理

对于所有在微信小程序商城注册的用户,在管理员平台都能对其编辑、管理。 image.png

提供手动添加普通用户的功能。 image.png

数据库设计

管理员信息表:

admin_idusernamepassword
管理员用户id管理员用户名登录密码
intStringString

角色表:

idrole_idrole_name
id管理员角色对应的角色 id管理员角色
intintString

管理员-角色表(描述管理员与角色的对应情况):

idrole_idadmin_name
id管理员角色对应的角色 id管理员 id
intintint

用户表:

uidusernameaddressphonereceiver
用户id用户名收货地址列表联系电话收件人
intStringStringStringString

商品表:

product_idbannerpriceold_pricecategory_idunittitlesub_title
商品id主图价格原价分类单位商品名次标题
intStringDoubleDoubleintStringStringString

商品分类表:

category_idcategory
商品分类id商品种类名
intString

订单表:

orderIdaddressorderorder_timeuidstatus
订单id收货地址(可以在用户表中取)具体货物和数量下单时间(时间戳)对应的userId订单状态(0:待付款;1:待配送;2:待评价)
intStringListStringintint

商品-订单表:(用处:能记录商品被加购的次数,以及已经被出售的次数)

idproduct_idorder_id
主键商品id订单id
intintint

数据库表结构如下:

数据库表.png