【024】Vue+Springboot+mysql员工考勤管理系统(多角色登录、请假、打卡)(含源码、数据库、运行教程、实验报告)

article/2025/10/9 0:21:31

前排提示：项目源码已放在文末
基于Vue+Springboot+mysql员工考勤管理系统(多角色登录、请假、打卡)
在这里插入图片描述

开发环境：Springboot+Mysql+Vue+Nodejs+Maven+JDK1.8
技术栈：spring-boot、mysql、mybatis-plus、druid连接池。
与【023】相比，【024】增加了轮播图功能，数据库的测试用例创建也比较清晰，而且有两份课设报告，绝对物超所值！
身份目录：
在这里插入图片描述

源码、数据库、课设获取：

百度云链接：https://pan.baidu.com/s/1qXJwWxwh2PUD-BnM9N9jjg 
提取码：6wsw

部分功能及代码介绍：
1.员工类型：部门经理、副总经理、总经理、人事人员、财务人员

<el-form-item label="员工角色"><el-select v-model="employer.role" placeholder="请选择员工类型"><el-option label="员工" value="0"></el-option><el-option label="部门经理" value="1"></el-option><el-option label="副总经理" value="2"></el-option><el-option label="总经理" value="3"></el-option><el-option label="人事人员" value="4"></el-option><el-option label="财务人员" value="5"></el-option></el-select>

2.打卡类型

             <el-button type="primary" @click="changeState(0)" :disabled='isHere'>上班打卡</el-button><el-button type="success" @click="changeState(1)" :disabled='!isHere'>下班打卡</el-button><el-button type="danger" @click="changeState(2)" :disabled='!isHere'>外出打卡</el-button><el-button type="warning" @click="changeState(3)" :disabled='isHere'>返回打卡</el-button>

3.请假类型：

formatType(row){if (row.type == 0) {return '事假';} else if (row.type == 1) {return '年假';} else if (row.type == 2) {return '婚假';} else if (row.type == 3) {return '产检';} else if (row.type == 4) {return '产假';} else if (row.type == 5) {return '哺乳';} else if (row.type == 6) {return '陪产';} else if (row.type == 7) {return '外出';} },

4.员工信息展示

<el-table:data="page"borderstyle="width: 100%"><el-table-columnprop="empId"label="员工ID"></el-table-column><el-table-columnprop="account"label="工号"></el-table-column><el-table-columnprop="name"label="姓名"></el-table-column><el-table-columnprop="gender"label="性别":formatter="formatGender"></el-table-column><el-table-columnprop="phone"label="手机号"></el-table-column><el-table-columnprop="role"label="职位":formatter="formatRole"></el-table-column>
</el-table>

部分报告截图：
在这里插入图片描述