From f03b3fbc36f39cdfb2c3c30cd967948ab4abab3e Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Mon, 16 Jun 2025 10:22:19 +0800
Subject: [PATCH] feat:个人工作台铺满

---
 src/views/wel/components/calendarBox.vue |   58 ++++++++++++++++++++++++++++++++++------------------------
 1 files changed, 34 insertions(+), 24 deletions(-)

diff --git a/src/views/wel/components/calendarBox.vue b/src/views/wel/components/calendarBox.vue
index 3590300..20ce47e 100644
--- a/src/views/wel/components/calendarBox.vue
+++ b/src/views/wel/components/calendarBox.vue
@@ -69,14 +69,12 @@
   return date.getDate();
 };
 
-
 // 获取对应日期的事件
 const getEvents = dateString => {
   return events.value[dateString] || [];
 };
 const monthRange = getCurrentMonthRange();
 params.value = monthRange;
-
 
 const getJobEventBar = () => {
   getCalen(params.value).then(res => {
@@ -107,36 +105,48 @@
 </script>
 <style lang="scss">
 .calenBox {
+ height: 630px;
+  .el-calendar {
+    height: 100%; // 日历填充容器
+    // 标题样式
+    &__title {
+      font-weight: bold;
+      font-size: 14px;
+      color: #363636;
+    }
 
- .el-button-group>.el-button:not(:first-child):not(:last-child) {
-    border-radius: 0;
+    // 日历主体
+    &__body {
+      height: 98%; // 关键:继承父高度
+      
+      .el-calendar-table {
+        height: 90% !important; // 百分比生效
+      }
+    }
+
+    // 选中日期样式
+    .el-calendar-table td.is-selected {
+      background-color: #f0f7ff;
+      border: 2px solid #409eff;
+      border-radius: 4px;
+      
+      .date-number {
+        font-weight: bold;
+        color: #409eff;
+      }
+    }
+  }
+
+  // 隐藏按钮组中间按钮
+  .el-button-group > .el-button:not(:first-child):not(:last-child) {
     display: none;
-}
-  .el-calendar__title {
-    font-weight: bold;
-    font-size: 14px;
-    color: #363636;
-  }
-
-  .el-calendar-table td.is-selected {
-    background-color: #f0f7ff;
-    border: 2px solid #409eff;
-    border-radius: 4px;
-  }
-  .el-calendar-table td.is-selected .date-number {
-    font-weight: bold;
-    color: #409eff;
-  }
-
-  .el-calendar-table td.is-selected .events {
-    // padding: 2px;
   }
 }
 </style>
 <style lang="scss" scoped>
 .calenBox {
   margin-top: 17px;
-  height: 567px;
+  height: 630px;
   overflow: hidden;
   .event-item {
     font-size: 12px;

--
Gitblit v1.9.3