基于Springboot+vue的人事管理系统(源代码+数据库+8000字文档) 054_人力资源vue源码-程序员宅基地

技术标签： spring boot 人事管理系统 java vue mybatis springboot

部分代码地址
https://gitee.com/ynwynwyn/hrm-public

基于Springboot+vue的人事管理系统(源代码+数据库+8000字文档)

一、系统介绍

本项目前后端分离开发
本项目分为管理员与普通用户两种角色

管理员角色包含以下功能：

首页
Echarts图表，个人考勤、员工基本信息
系统管理
文件管理，员工管理，部门管理，部门管理
权限管理
角色管理，菜单管理
薪资管理
五险一金，参保城市，工资管理
考勤管理
请假审批，考勤表现

用户角色包含以下功能：

个人信息
修改密码，修改个人信息
请假管理
请假申请

二、所用技术

前端技术栈
Vue、Axios、ElementUI、Vue-Router、Vuex、ECharts
后端技术栈
Spring Boot、JWT、MyBatis-Plus、MySQL、Hutool

三、环境介绍

基础环境 :IDEA/eclipse, JDK 1.8, Mysql5.7及以上,Node.js(14),Maven

所有项目以及源代码本人均调试运行无问题可支持远程调试运行

四、项目截图

文档目录

在这里插入图片描述

系统设计

业务用例

在这里插入图片描述

超级管理员拥有对所有菜单的访问权限，进行一系列的管理操作。而普通员工只能进行查看和修改个人信息，以及修改密码，请假。另外超级管理员可以为普通员工分配一些角色，进而改变员工的访问权限。

功能结构

在这里插入图片描述

本系统主要分四个模块，分别是系统管理和权限管理、薪资管理、考勤管理，系统管理主要用于日常事务管理管理，权限管理，用于控制员工的访问权限，薪资管理主要是对员工的五险一金以及社保数据的修改和添加，考勤管理主要是对员工的日常打卡进行记录和统计。

系统展示

首页

在这里插入图片描述

首页主要展示当前登录员工的一些基本信息，员工当前月的考勤数据，以及当日员工迟到、早退、旷工等情况。

请假

在这里插入图片描述

在请假面板中，员工可以进行请假。在左侧的请假记录中查看以往的请假记录，或对当前未被审核的申请进行撤销。

在这里插入图片描述

管理员可以对员工的请假进行审批，比如通过或驳回。员工申请请假之后，等待管理员进行审批，如管理员审批通过，则将员工休假时间段的考勤状态设置为休假。

五险一金

在这里插入图片描述

社保模块主要展示了员工的社保情况，可以对员工的社保进行调整。

工资管理

在这里插入图片描述

显示员工当月的工资情况，以及当月的考勤罚款情况。可以导出员工当月的工资报表。

考勤管理

在这里插入图片描述
考勤管理实现了考勤数据的批量导入与导出，以及员工考勤状态的查询和修改。

考勤数据导入模板

通过导入员工的考勤记录表，系统就会根据员工所在部门规定的上班时间进行比对，判断员工是否迟到、早退、旷工。（这是数据导入的模板，需要按照此格式填写数据。系统只会读取上下班时间的时间部分，系统以考勤日期作为打卡日期）。

另外，介绍一下考勤规制：

若考勤日期对应的是周末，则不判读员工考勤状态，默认为休假。
若考勤日期对应的是员工请假的日期，则员工考勤状态设为休假。
若员工的四个打卡时间，只要有一个为空，则员工考勤状态设为旷工。
若员工既迟到又早退，则员工考勤状态设为旷工。
若员工迟到，则员工考勤状态设为迟到。
若员工早退，则员工考勤状态设为早退。
若不是以上任何情况，则员工考勤状态设为正常。

五、浏览地址

项目启动成功之后，访问http://localhost:8080/login

管理员账号：admin 密码：12345
员工账号：staff_2 密码：12345

六、安装教程

项目配置

前端

在.env文件中

# 修改端口号，此端口号与在application.yml中配置的端口号相同
VUE_APP_PORT = 8888

后端

在application.yml中进行相关的配置

# 这是后端项目的运行端口，可自行修改
server:
  port: 8888

# 修改数据源，若MySql数据库版本较低，此处应该是com.mysql.jdbc.Driver
driver-class-name: com.mysql.cj.jdbc.Driver

# 因为此项目涉及到了文件上传与下载，此路径用来存储上传的文件。
files:
  upload:
    path: E:/project/idea/hrm/file/ # 修改为自己的路径

项目启动

新建数据库，将数据库文件执行

克隆代码到本地，在vue-elementui-hrm目录下

# 下载依赖
npm install 

# 启动
npm run serve

启动后端项目
项目启动成功之后，访问http://localhost:8080/login

账号：admin
密码：12345

本文链接：https://blog.csdn.net/2303_76227485/article/details/128665773

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

c# 调用c++ lib静态库_c#调用lib-程序员宅基地

文章浏览阅读2w次，点赞7次，收藏51次。四个步骤1.创建C++ Win32项目动态库dll 2.在Win32项目动态库中添加外部依赖项 lib头文件和lib库3.导出C接口4.c#调用c++动态库开始你的表演...①创建一个空白的解决方案，在解决方案中添加 Visual C++ , Win32 项目空白解决方案的创建：添加Visual C++ , Win32 项目这......_c#调用lib

deepin/ubuntu安装苹方字体-程序员宅基地

文章浏览阅读4.6k次。苹方字体是苹果系统上的黑体，挺好看的。注重颜值的网站都会使用，例如知乎：font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, W..._ubuntu pingfang

html表单常见操作汇总_html表单的处理程序有那些-程序员宅基地

文章浏览阅读159次。表单表单概述表单标签表单域按钮控件demo表单标签表单标签基本语法结构<form action="处理数据程序的url地址“ method=”get|post“ name="表单名称”></form><!--method将表单中的数据传送给服务器处理，get方式直接显示在url地址中，数据可以被缓存，且长度有限制；而post方式数据隐藏传输，_html表单的处理程序有那些

PHP设置谷歌验证器（Google Authenticator）实现操作二步验证_php otp 验证器-程序员宅基地

文章浏览阅读1.2k次。使用说明:开启Google的登陆二步验证（即Google Authenticator服务）后用户登陆时需要输入额外由手机客户端生成的一次性密码。实现Google Authenticator功能需要服务器端和客户端的支持。服务器端负责密钥的生成、验证一次性密码是否正确。客户端记录密钥后生成一次性密码。下载谷歌验证类库文件放到项目合适位置(我这边放在项目Vender下面)https://github.com/PHPGangsta/GoogleAuthenticatorPHP代码示例://引入谷_php otp 验证器

【Python】matplotlib.plot画图横坐标混乱及间隔处理_matplotlib更改横轴间距-程序员宅基地

文章浏览阅读4.3k次，点赞5次，收藏11次。matplotlib.plot画图横坐标混乱及间隔处理_matplotlib更改横轴间距

docker — 容器存储_docker 保存容器-程序员宅基地

文章浏览阅读2.2k次。①Storage driver 处理各镜像层及容器层的处理细节，实现了多层数据的堆叠，为用户提供了多层数据合并后的统一视图②所有 Storage driver 都使用可堆叠图像层和写时复制（CoW）策略③docker info 命令可查看当系统上的 storage driver主要用于测试目的，不建议用于生成环境。_docker 保存容器

随便推点

网络拓扑结构_网络拓扑csdn-程序员宅基地

文章浏览阅读834次，点赞27次，收藏13次。网络拓扑结构是指计算机网络中各组件（如计算机、服务器、打印机、路由器、交换机等设备）及其连接线路在物理布局或逻辑构型上的排列形式。这种布局不仅描述了设备间的实际物理连接方式，也决定了数据在网络中流动的路径和方式。不同的网络拓扑结构影响着网络的性能、可靠性、可扩展性及管理维护的难易程度。_网络拓扑csdn

JS重写Date函数，兼容IOS系统_date.prototype 将所有 ios-程序员宅基地

文章浏览阅读1.8k次，点赞5次，收藏8次。IOS系统Date的坑要创建一个指定时间的new Date对象时，通常的做法是：new Date("2020-09-21 11:11:00")这行代码在 PC 端和安卓端都是正常的，而在 iOS 端则会提示 Invalid Date 无效日期。在IOS年月日中间的横岗许换成斜杠，也就是new Date("2020/09/21 11:11:00")通常为了兼容IOS的这个坑，需要做一些额外的特殊处理，笔者在开发的时候经常会忘了兼容IOS系统。所以就想试着重写Date函数，一劳永逸，避免每次ne_date.prototype 将所有 ios