首页 > 其他分享 >时间范围输入上限限制及截取

时间范围输入上限限制及截取

时间:2024-11-21 15:46:09浏览次数:1  
标签:const dayjs 截取 30 上限 searchForm Date new 输入

<el-form-item
  label="时间范围"
  prop="time"
  width="200"
>
  <el-date-picker
     v-model="searchForm.time"
     type="datetimerange"
     start-placeholder="开始时间"
     end-placeholder="结束时间"
     value-format="YYYY-MM-DD HH:mm:ss"
     :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)]"
      @change="onDateChange"
   />
</el-form-item>
import dayjs from 'dayjs';

/* 设置时间范围 */
  const onDateChange = () => {
    // 如果时间范围大于30天
    if (searchForm.time.length > 0) {
      const [start, end] = searchForm.time;
      const startDate = new Date(start);
      const endDate = new Date(end);
      const diff = (endDate.getTime() - startDate.getTime()) / 1000 / 60 / 60 / 24;
      if (diff > 30) {
        $message(`时间范围不能超过30天,已为您做截取`, { type: 'warning' });
        const newEndDate = new Date(startDate);
        newEndDate.setDate(startDate.getDate() + 30);
        searchForm.time= [start, dayjs(newEndDate).format('YYYY-MM-DD HH:mm:ss')]; // 清空日期范围
      }
    }
    // 设置时间范围为最近30天
    if (searchForm.time.length === 0) {
      const today = new Date();
      const thirtyDaysAgo = new Date();
      today.setHours(23, 59, 59, 999);
      thirtyDaysAgo.setDate(today.getDate() - 29);
      thirtyDaysAgo.setHours(0, 0, 0, 0);
      searchForm.time= [
        dayjs(thirtyDaysAgo).format('YYYY-MM-DD HH:mm:ss'),
        dayjs(today).format('YYYY-MM-DD HH:mm:ss')
      ];
    }
  };

标签:const,dayjs,截取,30,上限,searchForm,Date,new,输入
From: https://www.cnblogs.com/yiping5/p/18560937

相关文章