zhgdyun/src/views/projectFront/laborManage/allAttendanceManage.vue
2025-08-22 18:04:55 +08:00

104 lines
2.8 KiB
Vue

<template>
<!-- 业务中心 -->
<div class="business whiteBlock">
<div class="business">
<el-menu
:default-active="activeIndex"
@select="handleSelect"
class="business-menu-demo"
mode="horizontal"
text-color="#262D47"
active-text-color="#5181F6"
>
<el-menu-item index="1">考勤总览</el-menu-item>
<el-menu-item index="2">考勤日报</el-menu-item>
<el-menu-item index="3">考勤月报</el-menu-item>
<el-menu-item index="4">打卡记录</el-menu-item>
</el-menu>
<!-- <InspectionLedger
v-if="activeIndex == '1'"
style="width: 100%; height: calc(100% - 49px)"
></InspectionLedger> -->
<AttendanceOverview
v-permission="{
key: 'attendanceOverview',
menuPath: '/project/labor/allAttendanceManage',
}"
v-if="activeIndex == '1'"
style="width: 100%; height: calc(100% - 49px)"
></AttendanceOverview>
<DayAttendanceReport
v-permission="{
key: 'dayAttendanceReport',
menuPath: '/project/labor/allAttendanceManage',
}"
v-if="activeIndex == '2'"
style="width: 100%; height: calc(100% - 49px)"
></DayAttendanceReport>
<MonthAttendanceReport
v-permission="{
key: 'monthAttendanceReport',
menuPath: '/project/labor/allAttendanceManage',
}"
v-if="activeIndex == '3'"
style="width: 100%; height: calc(100% - 49px)"
></MonthAttendanceReport>
<PunchCardRecord
v-permission="{
key: 'punchCardRecord',
menuPath: '/project/labor/allAttendanceManage',
}"
v-if="activeIndex == '4'"
style="width: 100%; height: calc(100% - 49px)"
></PunchCardRecord>
</div>
</div>
</template>
<script>
import AttendanceOverview from "./allAttendanceManageComponents/attendanceOverview.vue";
import DayAttendanceReport from "./allAttendanceManageComponents/dayAttendanceReport.vue";
import MonthAttendanceReport from "./allAttendanceManageComponents/monthAttendanceReport.vue";
import PunchCardRecord from "./allAttendanceManageComponents/punchCardRecord.vue";
export default {
name: "business",
components: {
AttendanceOverview,
DayAttendanceReport,
MonthAttendanceReport,
PunchCardRecord,
},
data() {
return {
activeIndex: "1",
};
},
methods: {
handleSelect(key, keyPath) {
// console.log(key, keyPath);
this.activeIndex = key;
},
},
};
</script>
<style lang="less" scoped>
.business {
width: 100%;
height: 100%;
}
.business-menu-demo {
height: 49px;
width: 100%;
line-height: 49px;
background-color: transparent;
.el-menu-item {
height: 49px;
line-height: 49px;
}
}
.el-menu.el-menu--horizontal {
border-bottom-color: @borderColor;
}
</style>