<el-date-picker
v-model="date"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions"
type="datetimerange"
align="right"
start-placeholder="开始日期"
end-placeholder="结束日期"
clearable
>
</el-date-picker>
限制范围为前后一周:
pickerOptions: {
// 设置不能选择的日期
onPick: ({ maxDate, minDate }) => {
this.choiceDate0 = minDate.getTime();
if (maxDate) {
this.choiceDate0 = "";
}
},
disabledDate: (time) => {
let choiceDateTime = new Date(this.choiceDate0).getTime();
const minTime = new Date(choiceDateTime) - 6 * 24 * 60 * 60 * 1000;
const maxTime =
new Date(choiceDateTime).getTime() + 6 * 24 * 60 * 60 * 1000;
const min = minTime;
const newDate =
new Date(new Date().toLocaleDateString()).getTime() +
24 * 60 * 60 * 1000 -
1;
const max = newDate < maxTime ? newDate : maxTime;
//如果已经选中一个日期 则 返回 该日期前后一周时间可选
if (this.choiceDate0) {
return time.getTime() < min || time.getTime() > max;
}
//若一个日期也没选中 则 返回 当前日期以前日期可选
return time.getTime() > newDate;
},
},
限制范围为前后一个月
pickerOptions: {
// 设置不能选择的日期
onPick: ({ maxDate, minDate }) => {
this.choiceDate0 = minDate.getTime();
if (maxDate) {
this.choiceDate0 = "";
}
},
disabledDate: (time) => {
let choiceDateTime = new Date(this.choiceDate0).getTime();
const minTime = new Date(choiceDateTime).setMonth(
new Date(choiceDateTime).getMonth() - 1
);
const maxTime = new Date(choiceDateTime).setMonth(
new Date(choiceDateTime).getMonth() + 1
);
const min = minTime;
const newDate =
new Date(new Date().toLocaleDateString()).getTime() +
24 * 60 * 60 * 1000 -
1;
const max = newDate < maxTime ? newDate : maxTime;
//如果已经选中一个日期 则 返回 该日期前后一个月时间可选
if (this.choiceDate0) {
return time.getTime() < min || time.getTime() > max;
}
//若一个日期也没选中 则 返回 当前日期以前日期可选
return time.getTime() > newDate;
},
},