效果如下：
HTML代码部分：
<el-calendar v-model="value">
<!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
<template slot="dateCell" slot-scope="{date, data}">
<!-- 这里加了周六周天的判断(用于添加不同样式) -->
<!-- <div :class="(date.getDay()==6 || date.getDay()==0)?'weeked' :'notweeked'">{{ data.day.split('-').slice(2).join('-') }}</div> -->
<div>{{ data.day.split('-').slice(2).join('-') }}</div>
<!-- 数组循环 -->
<div class="cell" v-for="(item,index) in tableData" >
<!-- 加数据 -->
<div v-if="data.day == item.day">
<!-- 状态1 -->
<div style="margin: 5px 0;">
<el-tag v-if="item.isStatus1 === 0">待创建</el-tag>
<el-tag v-if="item.isStatus1 === 1">待提交</el-tag>
<el-tag v-if="item.isStatus1 === 2">待审核</el-tag>
<el-tag v-if="item.isStatus1 === 3">已审核</el-tag>
<el-tag v-if="item.isStatus1 === 4">退回</el-tag>
<el-tag v-if="item.isStatus1 === 5">重新审核</el-tag>
<el-tag v-if="item.isStatus1 === 6">月度审核</el-tag>
</div>
<!-- 状态2 -->
<div>
<el-tag v-if="item.isStatus2 === 0" type="success">正常</el-tag>
<el-tag v-if="item.isStatus2 === 1" type="danger">非正常</el-tag>
<el-tag v-if="item.isStatus2 === 2" type="warning">请假</el-tag>
<el-tag v-if="item.isStatus2 === 3" type="info">旷工</el-tag>
</div>
</div>
</div>
</template>
</el-calendar>数据模拟部分：
<script>
export default {
data() {
return {
value: new Date(),
tableData: [
{ day:'2024-09-05', isStatus1: 0, isStatus2: 1},
{ day:'2024-09-10', isStatus1: 4, isStatus2: 3},
{ day:'2024-09-11', isStatus1: 2, isStatus2: 1},
{ day:'2024-09-12', isStatus1: 3, isStatus2: 2},
{ day:'2024-09-13', isStatus1: 1, isStatus2: 4},
{ day:'2024-09-14', isStatus1: 0, isStatus2: 0},
],
}
},
created(){
},
methods: {
}
}
</script>至此完成！！！
测试有效！！！感谢支持！！！
