1、处理时间后面时间不能大于前面的时间,前面时间大于等于当前日期
<DatePicker
v-model="formData.startTime"
type="datetime"
format="yyyy-MM-dd"
placeholder="请选择"
:options="startTimeOption"
@on-change="beginDate"
></DatePicker>
<DatePicker
v-model="formData.endTime"
type="datetime"
format="yyyy-MM-dd"
:editable="false"
placeholder="请选择"
:disabled="isEndTimeDisabled"
:options="endTimeOption"
@on-change="endDate"
></DatePicker>
data() {
return {
endTimeOption: {
disabledDate(date) {
let rd = this.formData.startTime
return date.valueOf() < rd
}
},
startTimeOption: {
disabledDate(date) {
return date && date.valueOf() < Date.now() - 86400000
}
},
isEndTimeDisabled: true
}
method() {
beginDate(date) {
// 时间转换
// this.formData.startTime = date
if (this.formData.startTime) {
if (this.formData.startTime > this.formData.endTime) {
this.formData.endTime = ''
}
this.isEndTimeDisabled = false
} else {
this.formData.endTime = ''
this.isEndTimeDisabled = true
}
},
endDate(date) {
// 时间转换
// this.formData.endTime = date
},
}
}
2、取年且不能超过当前年处理
<DatePicker
v-model="formData.taskYear"
type="year"
placeholder="请选择计划年份"
style="width: 100%"
clearable
:editable="false"
:options="endTimeOption"
@on-change="onDetePickerChange"
/>
data() {
let self = this
return {
endTimeOption: {
disabledDate(date) {
let nowDate = new Date()
let year = nowDate.getFullYear()
return date.getFullYear() < year
}
}
}
method() {
onDetePickerChange(date) {
this.formData.taskYear = date
}
}
验证规则
startTime: [ { required: true, message: '注意:请选择开工时间' } ], endTime: [ { required: true, message: '注意:请选择竣工时间' } ],
后端时间加上注解东八区
@JsonFormat(pattern = "yyyy-MM-dd", timezone = "GMT+8") @DateTimeFormat(pattern = "yyyy-MM-dd")