当前位置: 首页 > news >正文

【098】基于SpringBoot+Vue实现的垃圾分类系统

系统介绍

视频演示

基于SpringBoot+Vue实现的垃圾分类系统

基于SpringBoot+Vue实现的垃圾分类系统设计了三种角色、分别是管理员、垃圾分类管理员、用户,实现了个人中心、用户管理、垃圾分类管理员管理、垃圾分类管理、垃圾类型管理、垃圾图谱管理、系统管理等功能

技术选型

开发工具:idea2020.3+Webstorm2020.3

运行环境:jdk1.8+maven3.6.0+MySQL5.7+nodejs14.21.3

服务端技术:Springboot+Mybatis-plus

前端技术:html+css+Layui+jQuery+bootstrap+Vue+axios+Element-UI

成果展示

文档展示

image-20241103210319779

管理员登陆

image-20241103205614785

用户管理

image-20241103205646663

垃圾分类管理员管理

image-20241103205739678

垃圾分类管理

image-20241103205756914

垃圾类型管理

image-20241103205811329

垃圾图谱管理

image-20241103205827026

系统管理

image-20241103205841982

前台首页

image-20241103210118018

源码展示

@RequestMapping("users")
@RestController
public class UserController{@Autowiredprivate UserService userService;@Autowiredprivate TokenService tokenService;/*** 登录*/@IgnoreAuth@PostMapping(value = "/login")public R login(String username, String password, String captcha, HttpServletRequest request) {UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));if(user==null || !user.getPassword().equals(password)) {return R.error("账号或密码不正确");}String token = tokenService.generateToken(user.getId(),username, "users", user.getRole());return R.ok().put("token", token);}/*** 注册*/@IgnoreAuth@PostMapping(value = "/register")public R register(@RequestBody UserEntity user){if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) !=null) {return R.error("用户已存在");}userService.insert(user);return R.ok();}/*** 退出*/@GetMapping(value = "logout")public R logout(HttpServletRequest request) {request.getSession().invalidate();return R.ok("退出成功");}/*** 密码重置*/@IgnoreAuth@RequestMapping(value = "/resetPass")public R resetPass(String username, HttpServletRequest request){UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));if(user==null) {return R.error("账号不存在");}user.setPassword("123456");userService.update(user,null);return R.ok("密码已重置为:123456");}/*** 列表*/@RequestMapping("/page")public R page(@RequestParam Map<String, Object> params,UserEntity user){EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();PageUtils page = userService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.allLike(ew, user), params), params));return R.ok().put("data", page);}/*** 列表*/@RequestMapping("/list")public R list( UserEntity user){EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();ew.allEq(MPUtil.allEQMapPre( user, "user")); return R.ok().put("data", userService.selectListView(ew));}/*** 信息*/@RequestMapping("/info/{id}")public R info(@PathVariable("id") String id){UserEntity user = userService.selectById(id);return R.ok().put("data", user);}/*** 获取用户的session用户信息*/@RequestMapping("/session")public R getCurrUser(HttpServletRequest request){Long id = (Long)request.getSession().getAttribute("userId");UserEntity user = userService.selectById(id);return R.ok().put("data", user);}
}

账号地址及其他说明

1、地址说明

管理员登录页:http://localhost:8081/

前台首页:http://localhost:8080/springboot574f8/front/index.html

2、账号说明

管理员:admin/admin

垃圾分类管理员: admin1/123456

用户:user1/123456

3、目录结构展示

image-20241103211210997

4、项目结构展示

image-20241103210902043
5、运行步骤

1、创建数据库、导入sql脚本
2、修改application.yml中的数据库配置文件,启动服务端
3、在源代码\admin目录下打开cmd,执行npm install或者yarn install下载依赖
4、下载完毕后启动前端npm run serve,访问端口

源码获取

源码编号:098

添加下方名片回复:098

相关文章:

【098】基于SpringBoot+Vue实现的垃圾分类系统

系统介绍 视频演示 基于SpringBootVue实现的垃圾分类系统 基于SpringBootVue实现的垃圾分类系统设计了三种角色、分别是管理员、垃圾分类管理员、用户&#xff0c;实现了个人中心、用户管理、垃圾分类管理员管理、垃圾分类管理、垃圾类型管理、垃圾图谱管理、系统管理等功能 …...

STM32CUBEIDE FreeRTOS操作教程(八):queues多队列

STM32CUBEIDE FreeRTOS操作教程&#xff08;八&#xff09;&#xff1a;queues多队列 STM32CUBE开发环境集成了STM32 HAL库进行FreeRTOS配置和开发的组件&#xff0c;不需要用户自己进行FreeRTOS的移植。这里介绍最简化的用户操作类应用教程。以STM32F401RCT6开发板为例&#…...

SIGNAL TAP使用记录

一、首先编译工程 二、打开signal tap&#xff0c;并设置抓取时钟以及采样深度 二、点击set up&#xff0c;然后双击空白处&#xff0c;会弹出右侧窗口&#xff0c;点击filter选择pre_synthesis&#xff0c;这里选择综合前的信号观测&#xff0c;要确保左侧窗口内的信号是黑色…...

基于vue3和elementPlus的el-tree组件,实现树结构穿梭框,支持数据回显和懒加载

一、功能 功能描述 数据双向穿梭&#xff1a;支持从左侧向右侧转移数据&#xff0c;以及从右侧向左侧转移数据。懒加载支持&#xff1a;支持懒加载数据&#xff0c;适用于大数据量的情况。多种展示形式&#xff1a;右侧列表支持以树形结构或列表形式展示。全选与反选&#xf…...

彻底理解链表(LinkedList)结构

目录 比较操作结构封装单向链表实现面试题 循环链表实现 双向链表实现 链表&#xff08;Linked List&#xff09;是一种线性数据结构&#xff0c;由一组节点&#xff08;Node&#xff09;组成&#xff0c;每个节点包含两个部分&#xff1a;数据域&#xff08;存储数据&#xff…...

TON 区块链开发的深入概述#TON链开发#DAPP开发#交易平台#NFT#Gamefi链游

区块链开发领域发展迅速&#xff0c;各种平台为开发人员提供不同的生态系统。其中一个更有趣且越来越相关的区块链是TON&#xff08;开放网络&#xff09;区块链。TON 区块链最初由 Telegram 构思&#xff0c;旨在提供快速、安全且可扩展的去中心化应用程序 (dApp)。凭借其独特…...

Hive专栏概述

Hive专栏概述 Hive“出身名门”&#xff0c;是最初由Facebook公司开发的数据仓库工具。它简单且容易上手&#xff0c;是深入学习Hadoop技术的一个很好的切入点。专栏内容包括&#xff1a;Hive的安装和配置&#xff0c;其核心组件和架构&#xff0c;Hive数据操作语言&#xff0c…...

鼠标悬停后出现小提示框实现方法

大家在网页上会经常看到某些图标或文字&#xff0c;当鼠标悬停后会在四周某个位置出现一个简短的文字提示&#xff0c;这种提示分为两种&#xff0c;一种是提示固定的文字&#xff0c;例如放在qq图标上&#xff0c;会显示固定的文字“QQ”&#xff1b;第二种是显示鼠标所在标签…...

计算机视觉常用数据集Foggy Cityscapes的介绍、下载、转为YOLO格式进行训练

我在寻找Foggy Cityscapes数据集的时候花了一番功夫&#xff0c;因为官网下载需要用公司或学校邮箱邮箱注册账号&#xff0c;等待审核通过后才能进行下载数据集。并且一开始我也并不了解Foggy Cityscapes的格式和内容是什么样的&#xff0c;现在我弄明白后写下这篇文章&#xf…...

css中的样式穿透

1. >>> 操作符 <style scoped> /* 影响子组件的样式 */ .parent >>> .child {color: red; } </style>注意&#xff1a;>>> 操作符在某些预处理器&#xff08;如Sass&#xff09;中可能无法识别&#xff0c;因为它不是标准的CSS语法。 …...

MMCA:多模态动态权重更新,视觉定位新SOTA | ACM MM‘24 Oral

来源&#xff1a;晓飞的算法工程笔记 公众号&#xff0c;转载请注明出处 论文: Visual Grounding with Multi-modal Conditional Adaptation 论文地址&#xff1a;https://arxiv.org/abs/2409.04999论文代码&#xff1a;https://github.com/Mr-Bigworth/MMCA 创新点 提出了多模…...

linux同步执行命令脚本 (xcall)

linux同步执行命令脚本 (xcall) 1、在/usr/local/bin目录下 创建xcall文件 vim /usr/local/bin/xcall2、输入内容 #!/bin/bash # 获取控制台指令 判断指令是否为空 pcount$# if((pcount0)); thenecho "command can not be null !"exit fifor host in bigdata01 …...

opencv - py_imgproc - py_grabcut GrabCut 算法提取前景

文章目录 使用 GrabCut 算法进行交互式前景提取目标理论演示 使用 GrabCut 算法进行交互式前景提取 目标 在本章中 我们将了解 GrabCut 算法如何提取图像中的前景我们将为此创建一个交互式应用程序。 理论 GrabCut 算法由英国剑桥微软研究院的 Carsten Rother、Vladimir K…...

ChatGPT多模态命名实体识别

ChatGPT多模态命名实体识别 ChatGPT辅助细化知识增强&#xff01;![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/025e651de3ef440a90cbe05fa9971409.png)一、研究背景二、模型结构和代码任务流程第一阶段&#xff1a;辅助精炼知识启发式生成第二阶段&#xff1a;基于…...

04-Dubbo的通信协议

04-Dubbo的通信协议 Dubbo 支持的通信协议 Dubbo 框架提供了自定义的高性能 RPC 通信协议&#xff1a; 基于 TCP 的 Dubbo2 协议 基于 HTTP/2 的 Triple 协议 Dubbo 框架是不和任何通信协议绑定的&#xff0c;对通信协议的支持非常灵活&#xff0c;支持任意的第三方协议&#x…...

开源数据库 - mysql - innodb源码阅读 - 线程启动

线程启动源码 /** Start up the InnoDB service threads which are independent of DDL recovery.*/void srv_start_threads() {if (!srv_read_only_mode) {/* Before 8.0, it was master thread that was doing periodicalcheckpoints (every 7s). Since 8.0, it is the log …...

在美团外卖上抢券 Python来实现

在美团外卖上抢券的 Python 实现 在如今的互联网时代&#xff0c;自动化脚本已经成为了许多用户生活中不可或缺的工具。尤其是在购物、抢券等场景中&#xff0c;自动化脚本能够帮助我们节省大量的时间和精力。今天&#xff0c;我们将一起探索如何使用 Python 编写一个简单的脚…...

【ONLYOFFICE 文档 8.2 版本深度测评】功能革新与用户体验的双重飞跃

引言 在数字化办公的浪潮中&#xff0c;ONLYOFFICE 文档以其强大的在线协作功能和全面的办公套件解决方案&#xff0c;赢得了全球用户的青睐。随着 8.2 版本的发布&#xff0c;ONLYOFFICE 再次证明了其在办公软件领域的创新能力和技术实力。 一.协作编辑 PDF&#xff1a;团队合…...

npm入门教程18:npm发布npm包

一、准备工作 注册npm账号&#xff1a; 前往npm官网注册一个账号。注册过程中需要填写个人信息&#xff0c;并完成邮箱验证。 安装Node.js和npm&#xff1a; 确保你的计算机上已安装Node.js和npm。Node.js的安装包中通常包含了npm。你可以通过运行node -v和npm -v命令来检查它…...

VueSSR详解 VueServerRenderer Nutx

SSR Vue中的SSR&#xff08;Server-Side Rendering&#xff0c;服务器端渲染&#xff09;是一种将页面的渲染工作从客户端转移到服务器端的技术。以下是对Vue中SSR的详细解释&#xff1a; 一、SSR的工作原理 在传统的客户端渲染&#xff08;CSR&#xff09;中&#xff0c;页面的…...

阵列信号处理笔记(2):波数域解析、阵列流形可视化与频率响应设计

1. 波数域解析&#xff1a;空域频率的物理意义 波数域是理解阵列信号处理的关键视角。简单来说&#xff0c;波数&#xff08;k&#xff09;相当于空域中的"频率"&#xff0c;就像时域中的角频率&#xff08;ω&#xff09;描述信号随时间变化的快慢一样&#xff0c;波…...

SingleFile CLI:5分钟掌握终极网页批量下载神器

SingleFile CLI&#xff1a;5分钟掌握终极网页批量下载神器 【免费下载链接】SingleFile Web Extension for saving a faithful copy of a complete web page in a single HTML file 项目地址: https://gitcode.com/gh_mirrors/si/SingleFile SingleFile CLI是一个强大的…...

如何用淘金币自动化脚本每天节省20分钟?完整指南揭秘

如何用淘金币自动化脚本每天节省20分钟&#xff1f;完整指南揭秘 【免费下载链接】taojinbi 淘宝淘金币自动执行脚本&#xff0c;包含蚂蚁森林收取能量&#xff0c;芭芭农场全任务&#xff0c;解放你的双手 项目地址: https://gitcode.com/gh_mirrors/ta/taojinbi 淘金币…...

从零到一:基于STM32与MAX30102构建可穿戴健康监测原型

1. 硬件选型与原理分析 第一次接触MAX30102传感器时&#xff0c;我被它小巧的体积和强大的功能震撼到了。这个比指甲盖还小的芯片&#xff0c;居然能同时测量心率和血氧饱和度&#xff0c;这让我对可穿戴设备有了全新的认识。选择STM32F103作为主控&#xff0c;主要是看中它丰富…...

基于CircuitPython的嵌入式传感器数据可视化系统设计与实现

1. 项目概述 如果你手头有一块Adafruit CLUE开发板&#xff0c;上面集成了温度、湿度、气压、颜色、加速度计等一大堆传感器&#xff0c;你可能会想&#xff1a;怎么才能最直观地看到这些传感器数据的变化呢&#xff1f;是盯着串口监视器里不断滚动的数字&#xff0c;还是把它们…...

Cursor插件开发实战:基于LSP与静态分析的代码导航增强

1. 项目概述&#xff1a;一个为开发者“减负”的Cursor插件如果你和我一样&#xff0c;日常开发重度依赖Cursor这款AI驱动的代码编辑器&#xff0c;那你肯定也经历过这样的时刻&#xff1a;面对一个陌生的代码库&#xff0c;想快速了解某个函数、类或者变量的定义位置&#xff…...

Bash脚本集成AI:实现自然语言到命令行的自动化运维工具

1. 项目概述&#xff1a;当Bash脚本遇见AI&#xff0c;自动化运维的新范式最近在GitHub上看到一个挺有意思的项目&#xff0c;叫“Hezkore/bash-ai”。光看名字&#xff0c;你可能会有点懵&#xff1a;Bash脚本和AI&#xff0c;这两个看似八竿子打不着的玩意儿&#xff0c;怎么…...

四旋翼无人机安全控制:CBF与双相对度系统实践

1. 四旋翼无人机安全控制的核心挑战四旋翼无人机在复杂环境中的自主飞行面临诸多安全挑战。当无人机在充满障碍物的空间执行任务时&#xff0c;传统控制方法往往难以同时满足轨迹跟踪精度和实时避障需求。我曾参与过一个物流仓库巡检项目&#xff0c;无人机在狭窄货架间穿行时&…...

为什么预训练再好的VLA,在新任务上普通SFT 并不好用?CapVector给出了原因和方案

Vision-Language-Action&#xff08;VLA&#xff09;模型现在已经很强了。 但一个很现实的问题是&#xff1a; 预训练再充分的 VLA&#xff0c;到了新任务上&#xff0c;普通 SFT 往往并不好用。 很多工作发现&#xff1a; 训练收敛慢少量 demonstration 不够泛化能力并没有…...

【技术实战】从ATE测试平台构建到电源芯片动态性能精准评估

1. ATE测试平台基础搭建指南 第一次接触ATE&#xff08;Automatic Test Equipment&#xff09;时&#xff0c;我和很多工程师一样被它的复杂配置吓到。但实际拆解后发现&#xff0c;搭建测试平台就像组装乐高积木&#xff0c;关键是要理解每个模块的作用。以我们测试Buck电源芯…...