一、使用Date TimePicker
<el-date-picker
v-model="timeRange"
type="datetimerange"
align="right"
:default-time='defaultTime'
value-format="yyyy-MM-dd HH:mm:dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
@change="handleChangeTime"
:clearable="false"
></el-date-picker>
二、定义变量
data () {
return {
selectDate: '',
defaultTime: ['00:00:00', '23:59:59'],
timeRange: [],
pickerOptions: {
onPick: ({ maxDate, minDate }) => {
this.selectDate = minDate.getTime()
if (maxDate) {
this.selectDate = ''
}
},
disabledDate: (time) => {
if (this.selectDate !== '') {
const one = (15 * 24 * 3600 - 1) * 1000 // 00:00:00 到23:59:59
const minTime = this.selectDate - one
const maxTime = this.selectDate + one
return time.getTime() < minTime || time.getTime() > maxTime
}
}
}
}
}
网友评论