一、需求:
- 起始日期截止日期区间不得重叠
- 截止日期需在当前年月的月范围内
- 截止日期 > 起始日期
<el-form-item label="截止日期" :label-width="labelAddPX" required>
<el-date-picker
v-model="addEditItemForm.promZzl04"
:picker-options="pickerEndOptions"
type="date"
placeholder="选择日期"
value-format="timestamp">
</el-date-picker>
</el-form-item>
mounted() {
this.pickerEndOptions = {
disabledDate: (time) => {
let end = new Date(new Date(this.addEditItemForm.promZzl03).getTime() + 24 * 60 * 60 * 1000 - 1);
end.setMonth(end.getMonth() + 1);
end.setDate(0);
return time.getTime() < new Date(this.addEditItemForm.promZzl03).getTime() + 3600 * 1000 * 24 || time.getTime() > end.getTime();
},
};
},
需求二、
<el-form-item label="活动开始时间" :label-width="'100px'" required>
<el-date-picker v-model="addEditForm.promAbn03" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期时间" style="width: 185px" :picker-options="pickerStartOptions">
</el-date-picker>
</el-form-item>
<el-form-item label="活动结束时间" :label-width="'100px'" required>
<el-date-picker v-model="addEditForm.promAbn04" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间" :picker-options="pickerEndOptions" style="width: 185px">
</el-date-picker>
</el-form-item>
//放data里会报错,放mounted处理
mounted() {
this.pickerStartOptions = {
disabledDate: (time) => {
if (this.addEditForm.promAbn04 !== '') {
return time.getTime() > new Date(this.addEditForm.promAbn04).getTime();
}
},
};
this.pickerEndOptions = {
disabledDate: (time) => {
return time.getTime() < new Date(this.addEditForm.promAbn03).getTime();
},
};
},