基于springboot+vue开发的校园食堂评价系统【源码+sql+可运行】【50809】

<article itemscope="itemscope" itemtype="http://schema.org/Article" data-entry-id="7536319090877693993" data-draft-id="7536157649580359716" data-original-type="0" class="article" data-v-61fb5e44="" data-v-539963b4="">

基于springboot+vue开发的校园食堂评价系统【源码+sql+可运行】【50809】.zip

下载地址：

环境准备：

• JDK1.8+
• maven3.6+
• nodejs14+
• mysql5.6+

技术栈

• 后台：springboot+mybatisPlus
• 前台：vue3+elementUi+Axios+Vite
• 开发工具: idea、navicate

功能列表

前台（用户端）

• 账号: 注册、登录（JWT 持久化，本地存储）

• 导航: 显示用户名、登录/退出；仅当角色为 ADMIN 时展示“后台管理”入口

• 首页/食堂列表: 搜索（名称/位置）、分页；卡片网格自适应列，桌面端宽屏适配

• 食堂详情: 基本信息、位置/简介展示；综合评分统计；菜品列表；发布评价（评分、可选菜品、内容）；评价列表卡片化展示、相对时间、分页

• 我的评价: 查看本人评价、删除评价；响应式网格卡片、分页

• 请求与鉴权: 全局请求拦截（自动附带 Bearer Token）、统一返回码处理

• UI/样式: 统一主题（圆角卡片、阴影、品牌渐变）、响应式布局、桌面端大屏优化

后台（管理端）

• 访问控制: 路由守卫与菜单权限，只有 ADMIN 可进入后台各页

• 布局与导航: 左侧菜单（食堂管理/菜品管理/评价管理）、顶部工具区，统一留白/高度占满

• 食堂管理: 列表、创建、编辑、删除；高表格自适应高度占满视口

• 菜品管理: 列表、按食堂筛选、关键字搜索、创建、编辑、删除；高表格自适配

• 评价管理: 列表、按用户/食堂/菜品筛选、删除；评分展示、分页；高表格自适配

• UI/样式: 统一卡片化风格、栅格与内边距规范，尽量利用全屏宽高显示内容

项目使用步骤

前置条件

• 已安装 JDK 11+、Maven 3.8+、Node.js 18+（含 npm）

• 数据库已可用（/src/main/resources/application.yml 默认连 MySQL，必要时先改成你自己的连接与账号）

启动后端（Spring Boot）

• 开发运行（推荐）：

• Windows PowerShell:

• cd backend

• mvn spring-boot:run

• 或打包运行：

• cd backend

• mvn -DskipTests package

• java -jar target/canteen-eval-backend-1.0.0.jar

• 默认端口：8080（可在 application.yml 修改）

启动前端（Vite + Vue 3）

• 开发运行：

• cd frontend

• npm i

• npm run dev

• 访问：http://localhost:5173

• 已配置代理到后端 http://localhost:8080（见 frontend/vite.config.js）

账号

• 管理员：用户名：admin，密码：admin123

• 说明：

• 如登录失败且数据库存在旧管理员，可删掉后端会自动重建：DELETE FROM users WHERE username='admin'; 重启后端即可。

• 生产前端构建：cd frontend && npm run build（产物在 dist/，可用 Nginx/静态服务器托管）

界面展示：

cover_0.jpg

cover_1.jpg

cover_2.jpg

cover_3.jpg

cover_4.jpg

cover_5.jpg

cover_6.jpg