<el-form-item label="起始日期" label-width="110px" prop="startDate">
<el-date-picker
v-model="ruleForm.startDate"
type="date"
placeholder="yyyy-mm-dd"
class="limitWidth"
:picker-options="pickerOptionsStart"
></el-date-picker>
</el-form-item>
<el-form-item label="结束日期" label-width="110px">
<el-date-picker
v-model="ruleForm.endDate"
type="date"
placeholder="yyyy-mm-dd"
class="limitWidth"
:picker-options="pickerOptionsEnd"
></el-date-picker>
</el-form-item>
data() {
return {
// 限制结束日期大于开始日期
pickerOptionsStart: {
disabledDate: time => {
let endDateVal = this.ruleForm.endDate
if (endDateVal) {
return time.getTime() > new Date(endDateVal).getTime()
}
}
},
pickerOptionsEnd: {
disabledDate: time => {
let beginDateVal = this.ruleForm.startDate
if (beginDateVal) {
return time.getTime() < new Date(beginDateVal).getTime()
}
}
},
ruleForm: {
startDate: '', // 开始日期
endDate: '', // 结束日期
}
}
}