feat: 名称修改

罗广辉

2025-10-11 02409bfbe15f22fc3b5dccadabfd860a660a49d9

 src/views/wel/components/calendarBox.vue

@@ -1,10 +1,12 @@
<template>
  <div class="calenBox">
    <el-calendar ref="calendar" v-model="currentMonth" >
    <el-calendar ref="calendar" v-model="currentMonth"  :class="{
    'five-rows': weeksNeeded === 5,
    'six-rows': weeksNeeded === 6
  }">
      <template #header="{ date }">
        <div>
          <img :src="caleft" alt="" @click="selectDate('prev-month')" />
         
          <el-date-picker
            v-model="currentMonth"
            type="month"
@@ -38,7 +40,6 @@
    </el-calendar>
  </div>
</template>

<script setup>
import dayjs from 'dayjs';
import { ref, watch, onMounted, nextTick } from 'vue';
@@ -48,7 +49,6 @@
import ev2 from '@/assets/images/workbench/ev2.svg';
import caleft from '@/assets/images/workbench/caleft.png';
import caright from '@/assets/images/workbench/caright.png';

const router = useRouter();
const calendar = ref();
const events = ref({});
@@ -74,14 +74,14 @@
const handleMonthChange = val => {
  const selectedMonth = new Date(val);
  currentMonth.value = selectedMonth;
  

  // 如果是当前月份，则选中当天；否则不选中
  if (isCurrentMonth(selectedMonth)) {
    selectedDate.value = new Date();
  } else {
    selectedDate.value = null;
  }
  

  // 强制更新日历视图
  nextTick(() => {
    updateCalendarSelection();
@@ -145,7 +145,7 @@
  if (isCurrentMonth(currentMonth.value) && selectedDate.value) {
    const currentDay = dayjs(selectedDate.value).date();
    const calendarCells = document.querySelectorAll('.el-calendar-table td');
    

    calendarCells.forEach(cell => {
      const day = parseInt(cell.querySelector('.date-number').textContent);
      if (day === currentDay) {
@@ -173,7 +173,7 @@
    nextTick(() => {
      updateCalendarSelection();
    });
    

    getJobEventBar();
  },
  { deep: true, immediate: true }
@@ -206,6 +206,20 @@
  }
};

const weeksNeeded = computed(() => {
  const date = dayjs(currentMonth.value);
  const firstDay = date.startOf('month').day(); // 0-6 (周日到周六)
  const days = date.daysInMonth();

  // 强制 2025 年 6 月显示六行
   //if (date.year() === 2025 && date.month() === 5) {
   //  return 6;
  // }

  // 其他月份按原逻辑计算
  return Math.ceil((firstDay + days) / 7);
})
const isSixRows = computed(() => weeksNeeded.value > 5);
onMounted(() => {
  // 初始化时如果是当前月份，选中当天；否则不选中
  if (isCurrentMonth(currentMonth.value)) {
@@ -213,11 +227,11 @@
  } else {
    selectedDate.value = null;
  }
  

  nextTick(() => {
    updateCalendarSelection();
  });
  

  getJobEventBar();
});
</script>
@@ -265,7 +279,7 @@
  }
  .el-calendar-table .el-calendar-day {
    box-sizing: border-box;
    padding: 0.8rem;
    padding: 0.4rem 0.8rem 0.8rem 0.8rem;
    background: #f5f7fa;
    border-radius: 6px 6px 6px 6px;
    border: 1px solid #efefef;
@@ -317,12 +331,16 @@
      font-size: 14px;
      color: #363636;
    }
    .el-calendar-table .el-calendar-day {
      height: pxToVh(88) !important;
    }

 &.five-rows .el-calendar-table .el-calendar-day {
    height: pxToVh(92) !important;
  }

  &.six-rows .el-calendar-table .el-calendar-day {
    height: pxToVh(78) !important;
  }
    // 选中日期样式
    .el-calendar-table td.is-selected {
    .el-calendar-table td.is-selected.is-today {
      .el-calendar-day {
        outline: 2px solid #409eff;
        outline-offset: -2px;
@@ -336,7 +354,7 @@
    .el-calendar-table td.is-selected {
      background-color: transparent;
    }
    

  }

  .event-item {