<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