对当前日期进行按年、按月、按日的取值

 对当前日期进行按年、按月、按日的取值。

其规则为：

按年 为当前日期到来年同一日期的前一天（2024-12-01到2025-11-30）。

按月 为当前日期到下个月的同一日期的前一天 （2024-12-01 到 2024-12-31）。

按日  为当前日期到下一日（2024-12-01 到 2024-12-02）

实验多种方式 ，要么引入组件 要么拆分重组 很麻烦，最后试了个方法觉得挺简便的， 记录下来。

组件用的是vue3的 DatePicker 日期选择器 

      <div style="display: flex; width: 100%; justify-content: space-between">
                <el-date-picker
                  v-model="form.StartTime" 
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                  type="date"
                  placeholder="开始日期"
                  @change="changeEnterprise"
                />
                <div>—</div>
                <el-date-picker
                  v-model="form.EndTime"
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                  type="date"
                  placeholder="结束日期"
                  disabled
                />
              </div>

组件改写选择开始时间，结束时间自动计算。 

   <el-select v-model="form.report" placeholder="请选择时间类型" @change="changeType">
                <el-option v-for="dict in bus_report_type" :key="dict.value" :label="dict.label" :value="dict.value" />
// 此段代码是字典表取值 转译成假数据
 <el-option key="0" label="按年" value="0">
 <el-option key="1" label="按月" value="1">
 <el-option key="2" label="按日" value="2">
              </el-select>

 选完时间类型后，显示结束时间。

//根据类型查周期
const changeEnterprise = () => {
  if (form.value.Type) {
    const dataTime = new Date(form.value.StartTime);
    if (form.value.Type == 0) {
      // 增加一年
      dataTime.setFullYear(dataTime.getFullYear() + 1);
      // 减去一天
      dataTime.setDate(dataTime.getDate() - 1);
    }
    if (form.value.Type == 1) {
      // 增加一个月
      dataTime.setMonth(dataTime.getMonth() + 1);
      // 减去一天
      dataTime.setDate(dataTime.getDate() - 1);
    }
    if (form.value.Type == 2) {
      // 增加一天
      dataTime.setDate(dataTime.getDate() + 1);
    }
    // 格式化日期为 YYYY-MM-DD 字符串
    const year = dataTime.getFullYear();
    const month = String(dataTime.getMonth() + 1).padStart(2, '0'); // 月份从0开始，所以需要+1，并且补零
    const day = String(dataTime.getDate()).padStart(2, '0'); // 日期可能也需要补零

    form.value.EndTime = `${year}-${month}-${day}`;
    console.log('startDate', dataTime, form.value.EndTime);
  } else {
    form.value.Type = null;
  }
};

附加一个设置 dateTime 的默认值为当前月的第一天到最后一天 

// 获取当前日期
const currentDate = new Date();

// 获取当前月的第一天
const firstDay = new Date(currentDate.getFullYear(), currentDate.getMonth());

// 获取当前月的最后一天
const lastDay = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
 
// 将日期格式化为 YYYY-MM-DD
const formatDate = (date) => {
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0');
  const day = String(date.getDate()).padStart(2, '0');
  return `${year}-${month}-${day}`;
};

// 设置 dateTime 的默认值为当前月的第一天到最后一天
const dateTime = ref([formatDate(firstDay), formatDate(lastDay)]);