在线环保网站 Vue.js+SpringBoot

76 阅读5分钟

淘宝店铺搜索:点创微科

在线环保网站 Vue.js+SpringBoot

本项目为前几天收费帮学妹做的一个项目,在工作环境中基本使用不到,但是很多学校把这个当作编程入门的项目来做,故分享出本项目供初学者参考

一、项目描述

基于springboot + vue实现的在线环保网站

本项目是一个基于Spring Boot后端技术和vue端技术构建的在线环保网站。

该平台旨在为用户提供一个方便快捷的在线环保环境。

整个系统采用RESTful API进行前后端交互,确保数据的安全性和一致性。

前端:http://localhost:8080/huanbaowangzhan/front/pages/login/login.html

用户账号密码:用户1/123456

后端:http://localhost:8081/

账号密码:admin/123456

二、项目功能

用户端功能模块

首页

用户登录网站后首先看到的页面,会展示一些重要的环保信息、最新动态、热门话题等内容,起到引导用户浏览其他功能模块的作用。

濒危生物 用户可以在这里查看濒危生物的相关信息,如生物的种类、特征、生存环境、濒危原因等,还可以浏览其他用户对濒危生物的留言和收藏情况,增加对濒危生物保护的关注度。

论坛 可能是关于环保主题的讨论区,用户可以发表自己的观点、分享经验、提问或回答问题,与其他用户进行交流互动,共同探讨环保相关的话题。

环保健康 提供与环保健康相关的内容,比如如何在日常生活中保持健康的生活方式,同时减少对环境的影响,或者介绍一些环保产品对健康的益处等,还包括用户对环保健康的留言和收藏功能。

环境保护 介绍环境保护的各种措施、方法和案例,用户可以了解如何参与环境保护活动,以及环境保护的重要性等,同样有留言和收藏功能。

环境保护法 展示与环境保护相关的法律法规,帮助用户了解自己的权利和义务,增强环保法律意识,也可能提供一些关于环境保护法的解读和案例分析等内容。

公告信息 发布网站的最新公告、通知等,如活动信息、功能更新、重要提示等,让用户及时了解网站的动态。

个人中心 用户可以管理自己的个人信息,如修改密码、查看自己的收藏记录等,还可以设置一些个人偏好,方便用户更好地使用网站。

管理端功能模块

首页

个人中心

修改密码:管理员可以在这里修改自己的登录密码,保障账户的安全。

个人信息:管理员可以查看和修改自己的个人信息,如姓名、联系方式等。

管理员管理 对管理员账号进行管理,包括添加新管理员、删除管理员、分配权限等操作,确保后台管理的有序进行。

濒危生物管理

濒危生物管理:管理员可以添加、编辑、删除濒危生物的信息,确保网站上展示的内容准确、完整。 濒危生物留言管理:查看和管理用户在濒危生物页面留下的留言,可以回复、删除或置顶留言等。 濒危生物收藏管理:查看用户对濒危生物的收藏情况,了解用户对不同濒危生物的关注程度。

基础数据管理

地区管理:添加、编辑、删除网站中涉及的地区信息,如国家、省份、城市等,用于分类和统计相关数据。

环保健康类型管理:对环保健康相关的内容进行分类管理,方便用户查找和浏览。

保护法类型管理:对环境保护法进行分类管理,便于用户更好地查找和学习相关法律法规。

公告类型管理:对公告信息进行分类管理,如活动公告、系统公告等,方便用户筛选查看。

论坛管理 对用户在品论坛中发表的内容进行审核、管理,如删除违规帖子、封禁恶意用户、置顶优质帖子等,维护论坛的良好秩序。

环保健康管理

环保健康管理:管理环保健康相关的文章、视频等内容,确保内容的质量和准确性。

环保健康留言管理:查看和管理用户在环保健康页面的留言,及时回复用户的疑问或建议。

环保健康收藏管理:查看用户对环保健康内容的收藏情况,了解用户的需求和兴趣点。

环境保护管理

环境保护管理:管理环境保护相关的文章、案例等内容,更新和维护该模块的信息。

环境保护留言管理:处理用户在环境保护页面的留言,解答用户的问题,增强用户参与度。

环境保护收藏管理:查看用户对环境保护内容的收藏情况,分析用户对不同环境保护主题的关注程度。

环境保护法管理

管理环境保护法相关的法律法规、解读文章等内容,确保信息的准确性和权威性。

公告信息管理 发布、编辑、删除公告信息,确保用户能够及时获取网站的重要通知和动态。

用户管理 对注册用户进行管理,包括查看用户信息、禁言或封禁违规用户、管理用户权限等,维护网站的正常秩序。

轮播图信息 管理网站首页的轮播图,添加、编辑、删除轮播图的内容,展示网站的重点内容或重要活动,吸引用户的注意力

三、运行环境

运行环境开发工具:idea2024.1

运行环境:jdk1.8+maven3.6.0+MySQL5.7(此配置为本人调试所用,仅供参考)

四、项目技术

服务端技术:springboot

前端技术:vue(v13.7.0)

以上系统源码经过技术整理与调试,确保能正常运行

五、项目截图

1751346843-7c27c608527e73f.png

1751346847-ab8797761b6e46f.png

1751346855-16d519113a1a4e3.png

1751346857-c94c907f881b025.png

1751346866-cdc14fbf0ea3285.png

1751346868-3f6c5242d47fc77.png

1751346873-291118dc2ef57b5.png

1751346879-e460abdc1b113fd.png

1751346881-1ecc6fd97c1b76d.png

1751346913-3d9208f67396169.png

1751346918-a149fcdb651e102.png

1751346922-53b467765747311.png

1751346926-25ed3a5928ac1f3.png

1751346929-73583c45f6d5359.png

1751346932-96768d196d9099d.png

1751346934-9f6c535db1cacc3.png

1751346937-756dcb21a21f623.png

1751346941-863a548954b11aa.png

1751346949-f69fa1a80f40a8d.png

1751346951-3e73ce340ada7e7.png

1751346953-add88a1c48ab191.png

1751346955-e5dd0e1ac74147b.png

1751346956-e6e902c0b99171e.png

1751346960-1c5d9267cdca689.png

1751346963-488629d55c54fca.png

1751346965-49c30f7d29b9383.png

1751346969-576458a2fc66691.png

0c6f25b0fc054fd88c8dd70eac55b61f~tplv-73owjymdk6-jj-mark-v1_0_0_0_0_5o6Y6YeR5oqA5pyv56S-5Yy6IEAg6Z2S6Z2S5a2m5aeQ_q75.webp