选择开始时间:
选择结束时间:
DateTimePicker 组件:
```typescript
<template v-slot:start_time="{ form, formItemKey }">
<el-date-picker
v-model="form[formItemKey]"
type="datetime"
placeholder="选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptionsStart"
@change="startTimeStatus($event)"
default-time="00:00:00"
style="width:270px"
></el-date-picker>
</template>
<template v-slot:end_time="{ form, formItemKey }">
<el-date-picker
v-model="form[formItemKey]"
type="datetime"
placeholder="选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptionsEnd"
@change="endTimeStatus($event)"
default-time="23:59:59"
style="width:270px"
></el-date-picker>
</template>
```typescript
pickerOptionsStart: {
disabledDate: time => {
let endDateVal = this.end_time
if (endDateVal) {
return time.getTime() > new Date(endDateVal).getTime()
}
}
},
pickerOptionsEnd: {
disabledDate: time => {
let beginDateVal = this.start_time
if (beginDateVal) {
return time.getTime() < new Date(beginDateVal).getTime()
}
}
},
startTimeStatus(event) {
this.start_time = event
},
endTimeStatus(event) {
this.end_time = event
},