Java项目:前后端分离疫情防疫平台设计和实现(java+springmvc+VUE+node.js+mybatis+mysql+springboot+redis+jsp)
源码获取:博客首页 "资源" 里下载!
主要技术:Java、springmvc、VUE、node.js、mybatis、mysql、tomcat、jquery、layui、bootstarp、JavaScript、html、css、jsp、log4j等一些常见的基本技术。
主要模块功能有:
管理员用户登录:用户登录。
用户信息: 用户信息数据的列表查看、修改和删除、用户绑定角色来显示对应的菜单显示。
角色管理:角色信息数据的列表查看、修改和删除、每个角色可以设置不同菜单显示、超级管理员拥有最高权限。
菜单管理: 菜单信息数据的列表查看、修改和删除、可以通过用户角色来设置
菜单权限:根据用户绑定角色、角色绑定菜单显示、以及基础菜单的添加、修改和删除操作。
实时疫情状态:通过echarts图标来模拟实现数据驱动标识、实时显示疫情分布图和感染人员信息等。
历史行程管理:每日登记管理:外出报备管理:复工申请管理:审核信息管理:
通知公告管理:管理员发布一些通知公告信息以及管理查看等
这个系统主要功能截图如下:
登录之后进入系统首页:目前系统主要功能如下
用户管理模块:用户添加、修改、删除、查询等基本操作
角色管理模块、通过用户绑定角色、角色控制菜单显示、灵活控制菜单。
前端VUE代码添加菜单:
<template><div class="mod-menu"><el-form :inline="true" :model="dataForm"><el-form-item><el-button v-if="isAuth('sys:menu:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button></el-form-item></el-form><el-table :data="dataList" row-key="menuId" border style="width: 100%; "><el-table-column prop="name" header-align="center" min-width="150" label="名称" ></el-table-column><el-table-column prop="parentName" header-align="center" align="center" width="120" label="上级菜单"></el-table-column><el-table-column header-align="center" align="center" label="图标"><template slot-scope="scope"><icon-svg :name="scope.row.icon || ''"></icon-svg></template></el-table-column><el-table-column prop="type" header-align="center" align="center" label="类型"><template slot-scope="scope"><el-tag v-if="scope.row.type === 0" size="small">目录</el-tag><el-tag v-else-if="scope.row.type === 1" size="small" type="success">菜单</el-tag><el-tag v-else-if="scope.row.type === 2" size="small" type="info">按钮</el-tag></template></el-table-column><el-table-column prop="orderNum" header-align="center" align="center" label="排序号"></el-table-column><el-table-column prop="url" header-align="center" align="center" width="150" :show-overflow-tooltip="true" label="菜单URL"></el-table-column><el-table-columnprop="perms"header-align="center"align="center"width="150":show-overflow-tooltip="true"label="授权标识"></el-table-column><el-table-columnfixed="right"header-align="center"align="center"width="150"label="操作"><template slot-scope="scope"><el-button v-if="isAuth('sys:menu:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.menuId)">修改</el-button><el-button v-if="isAuth('sys:menu:delete')" type="text" size="small" @click="deleteHandle(scope.row.menuId)">删除</el-button></template></el-table-column></el-table><!-- 弹窗, 新增 / 修改 --><add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update></div>
</template><script>import AddOrUpdate from './menu-add-or-update'import { treeDataTranslate } from '@/utils'export default {data () {return {dataForm: {},dataList: [],dataListLoading: false,addOrUpdateVisible: false}},components: {AddOrUpdate},activated () {this.getDataList()},methods: {// 获取数据列表getDataList () {this.dataListLoading = truethis.$http({url: this.$http.adornUrl('/sys/menu/list'),method: 'get',params: this.$http.adornParams()}).then(({data}) => {this.dataList = treeDataTranslate(data, 'menuId')this.dataListLoading = false})},// 新增 / 修改addOrUpdateHandle (id) {this.addOrUpdateVisible = truethis.$nextTick(() => {this.$refs.addOrUpdate.init(id)})},// 删除deleteHandle (id) {this.$confirm(`确定对[id=${id}]进行[删除]操作?`, '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {this.$http({url: this.$http.adornUrl(`/sys/menu/delete/${id}`),method: 'post',data: this.$http.adornData()}).then(({data}) => {if (data && data.code === 0) {this.$message({message: '操作成功',type: 'success',duration: 1500,onClose: () => {this.getDataList()}})} else {this.$message.error(data.msg)}})}).catch(() => {})}}}
</script>
菜单添加修改列表层操作:
历史行程数据管理:添加修改删除等操作
用户每日健康打卡列表数据展示以及添加打卡信息:
员工出行外出报备管理申请:
员工复工申请:
管理员审核:
通知公告模块:
数据库连接:
spring:datasource:type: com.alibaba.druid.pool.DruidDataSourcedruid:driver-class-name: com.mysql.jdbc.Driverurl: jdbc:mysql://localhost:3306/renren_fast?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghaiusername: rootpassword: 123456initial-size: 10max-active: 100min-idle: 10max-wait: 60000pool-prepared-statements: truemax-pool-prepared-statement-per-connection-size: 20time-between-eviction-runs-millis: 60000min-evictable-idle-time-millis: 300000#Oracle需要打开注释#validation-query: SELECT 1 FROM DUALtest-while-idle: truetest-on-borrow: falsetest-on-return: falsestat-view-servlet:enabled: trueurl-pattern: /druid/*#login-username: admin#login-password: adminfilter:stat:log-slow-sql: trueslow-sql-millis: 1000merge-sql: falsewall:config:multi-statement-allow: true##多数据源的配置
#dynamic:
# datasource:
# slave1:
# driver-class-name: com.microsoft.sqlserver.jdbc.SQLServerDriver
# url: jdbc:sqlserver://localhost:1433;DatabaseName=renren_security
# username: sa
# password: 123456
# slave2:
# driver-class-name: org.postgresql.Driver
# url: jdbc:postgresql://localhost:5432/renren_security
# username: renren
# password: 123456
数据库连接:
spring:datasource:type: com.alibaba.druid.pool.DruidDataSourcedruid:driver-class-name: com.mysql.jdbc.Driverurl: jdbc:mysql://localhost:3306/renren_fast?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghaiusername: rootpassword: 123456initial-size: 10max-active: 100min-idle: 10max-wait: 60000pool-prepared-statements: truemax-pool-prepared-statement-per-connection-size: 20time-between-eviction-runs-millis: 60000min-evictable-idle-time-millis: 300000#Oracle需要打开注释#validation-query: SELECT 1 FROM DUALtest-while-idle: truetest-on-borrow: falsetest-on-return: falsestat-view-servlet:enabled: trueurl-pattern: /druid/*#login-username: admin#login-password: adminfilter:stat:log-slow-sql: trueslow-sql-millis: 1000merge-sql: falsewall:config:multi-statement-allow: true##多数据源的配置
#dynamic:
# datasource:
# slave1:
# driver-class-name: com.microsoft.sqlserver.jdbc.SQLServerDriver
# url: jdbc:sqlserver://localhost:1433;DatabaseName=renren_security
# username: sa
# password: 123456
# slave2:
# driver-class-name: org.postgresql.Driver
# url: jdbc:postgresql://localhost:5432/renren_security
# username: renren
# password: 123456
前后端代码结构:
一些设计报告和文档描述参考:
好了、就介绍到这了、这个前后端分离(springboot +vue)项目功能比较齐全完善。
源码获取:博客首页 "资源" 里下载!
Java项目:前后端分离疫情防疫平台设计和实现(java+springmvc+VUE+node.js+mybatis+mysql+springboot+redis+jsp)相关推荐
- 基于JAVA springboot+VUE前后端分离疫情防疫平台设计实现
- Java项目:前后端分离网上手机商城平台系统设计和实现(java+vue+redis+springboot+mysql+ssm)
源码获取:博客首页 "资源" 里下载! 主要模块设计如下: 前后端主要技术:Java springboot springMVC mybatis mysql vue jqu ...
- 基于java Springboot+Vue+shiro前后端分离疫情防疫管理系统设计和实现2.0
目录 研究背景 主要特性功能: 视频效果演示 : 主要功能截图: 系统首页: 疫情数据分布图模拟: 用户管理: 角色控制: 菜单权限: 每日健康打卡: 历史出行数据: 外出报备申请: 外出请假审核: ...
- java毕业设计前后端分离健身房管理系统源码+lw文档+mybatis+系统+mysql数据库+调试
java毕业设计前后端分离健身房管理系统源码+lw文档+mybatis+系统+mysql数据库+调试 java毕业设计前后端分离健身房管理系统源码+lw文档+mybatis+系统+mysql数据库+调 ...
- Jeecg-Boot 2.0.0 版本发布,基于Springboot+Vue 前后端分离快速开发平台
Jeecg-Boot 2.0.0 版本发布,前后端分离快速开发平台 Jeecg-Boot项目简介 源码下载 升级日志 Issues解决 v1.1升级到v2.0不兼容地方 系统截图 Jeecg-Boot ...
- 计算机课程设计-基于ssm+vue的物资管理系统(前后端分离)-物资出库入库管理系统java代码
计算机课程设计-基于ssm+vue的物资管理系统(前后端分离)-物资出库入库管理系统java代码 注意:该项目只展示部分功能,如需了解,评论区咨询即可. 作者:IT跃迁谷 1.开发环境 开发语言:Ja ...
- Java Web前后端分离项目—后端servlet实例
关与作者更多博客请访问云里云外开源社区 文章目录 一.闲谈 二.json字符串的接受和发送 json的发送 json的接收 三.内网穿透或服务上云服务器 四.跨域 背景(为什么) 如何跨域 五.对接出 ...
- Java项目:网上电商项目(前后端分离+java+vue+Springboot+ssm+mysql+maven+redis)
源码获取:博客首页 "资源" 里下载! 一.项目简述 本系统功能包括: 一款基于Springboot+Vue的电商项目,前后端分离项目,前台后台都有,前台商品展示购买,购物车分类, ...
- 基于Vue+nodejs实现的前后端分离疫情防控系统
作者主页:编程指南针 简介:Java领域优质创作者.CSDN博客专家 Java项目.简历模板.学习资料.面试题库.技术互助 文末获取源码 本项目主要实现校园/公司/各类组织疫情防控管理,个人健康上报 ...
最新文章
- 没有任何基础的可以学python吗-今天就来告诉你,没有编程基础的人适不适合学python...
- WF 4.0 之持久化操作一:SqlServer方式的存储
- extremeComponents(ec)源码分析
- 使用Stream流的方式,遍历集合,对集合中的数据进行过滤
- SWF反编译神器ASV2013功能展示(下)
- LOJ:相框(欧拉回路、分类讨论)
- 小身材大用途,用PrimusUI驾驭你的页面
- Android Studio 添加javah工具
- 算法1——迪杰斯特拉算法
- 这些年,阿里巴巴技术大牛们曾经写过哪些书籍!
- Python与MySQL交互——简易用户注册登录
- android cad插件下载,CAD看图大师下载
- pointer-events用法
- MyEclipse启动加速与优化
- 通往天堂的选择问题 python_意识体革命
- php使用PdfParser搭配tcpdf解析pdf文件
- 互联网晚报 | 2月16日 星期三 | 小米回应裁员10%传闻;中国冬奥军团金牌数和奖牌数创新高;马斯克捐赠57亿美元特斯拉股票...
- PAT 1046 划拳
- 初学Java入门介绍
- Java将字符串分割为数组