element时间选择器限制到时分秒_element date-picker 时间日期选择器 时间范围控制 开始时间不能大于结束时间（精确到时分秒）...

开始日期当天，时间只能选择此刻及后面的时间，

结束日期也选择当天的话，时间只能选择开始时间后面的时间，

如果不是当天时间默认0刻开始

1595815807(1).png

v-model="startTime"

type="datetime"

:picker-options="{

disabledDate: (time) => {

return dataTime.startTimeData(time)

},

selectableRange: this.startTimeRange,

}"

value-format="yyyy-MM-dd HH:mm:ss"

format="yyyy-MM-dd HH:mm:ss"

placeholder="开始时间"

>

v-model="endTime"

type="datetime"

:picker-options="{

disabledDate: (time) => {

return dataTime.endTimeData(time)

},

selectableRange: this.endTimeRange,

}"

value-format="yyyy-MM-dd HH:mm:ss"

format="yyyy-MM-dd HH:mm:ss"

placeholder="结束时间"

>

export default {

name: "Home",

data() {

return {

startTime: "",

endTime: "",

startTimeRange: null,

endTimeRange: null,

dataTime: {

// 开始时间范围限制

startTimeData: (time) => {

if (this.endTime != "") {

return time.getTime() < Date.now() || time.getTime() < this.endTime;

} else {

return time.getTime() < Date.now() - 8.64e7;

}

},

// 结束时间范围限制

endTimeData: (time) => {

return (

time.getTime() < this.startTime ||

time.getTime() < Date.now() - 8.64e7

);

},

},

};

},

watch: {

startTime: {

handler(newValue, oldValue) {

if (newValue) {

let nowDate = this.format(new Date(), "-");

let dt = nowDate.split(" ");

let st = "";

if (newValue.split(" ")[0] == dt[0]) {

// 是今天,选择 的时间开始为此刻的时分秒

st = dt[1];

} else {

// 明天及以后从0时开始

st = "00:00:00";

}

this.startTimeRange = st + " - 23:59:59";

//例如：如果今天此刻时间为10:41:40 则选择时间范围为： 10:41:40 - 23:59:59

//否则为：00:00:00- 23:59:59

}

},

},

endTime: {

handler(newValue, oldValue) {

if (newValue) {

let zt = this.startTime.split(" "); //开始日期

let st = "";

//如果开始日期和结束日期都选择当天

if (newValue.split(" ")[0] == zt[0]) {

st = zt[1];

} else {

st = "00:00:00";

}

this.endTimeRange = st + " - 23:59:59";

}

},

},

},

methods: {

// 时间补0

supplement(nn) {

return (nn = nn < 10 ? "0" + nn : nn);

},

// 转换时间格式

format(Date, str) {

var obj = {

Y: Date.getFullYear(),

M: Date.getMonth() + 1,

D: Date.getDate(),

H: Date.getHours(),

Mi: Date.getMinutes(),

S: Date.getSeconds(),

};

// 拼接时间 hh:mm:ss

var time =

" " +

this.supplement(obj.H) +

":" +

this.supplement(obj.Mi) +

":" +

this.supplement(obj.S);

// yyyy-mm-dd

if (str.indexOf("-") > -1) {

return (

obj.Y +

"-" +

this.supplement(obj.M) +

"-" +

this.supplement(obj.D) +

time

);

}

// yyyy/mm/dd

if (str.indexOf("/") > -1) {

return (

obj.Y +

"/" +

this.supplement(obj.M) +

"/" +

this.supplement(obj.D) +

time

);

}

},

},

};