elementui中时间控件限制日期+选择不生效

时间:2024-04-01 13:16:51

当前时间只能选择两年之内的时间 + 只能选择30天之内的时间范围

其实这个功能只需要一个时间框,跟后台讨论 只能选择两年之内的时间,数据检索两个月之内的数据就可完美解决,只是无奈 有的 (沙币)不同意。
elementui中时间控件限制日期+选择不生效实现:

1.html

<el-date-picker
	v-model="resForm.nowDate"
	type="daterange"
	start-placeholder="开始日期"
	end-placeholder="结束日期"
	:picker-options="pickerOptions"
	@change="change">
</el-date-picker>

2.js

data() {
	let _this = this;
		return {
			pickerOptions: {
				disabledDate(time) {
				_this.resForm.setNowDate = _this.resForm.nowDate;
				// 设置选择一个月之前到今天的日期
				let curDate = (new Date()).getTime();
				let pre = new Date();
				let twoYears = pre.setFullYear(pre.getFullYear() - 2);
				// 到今天的时间 或者 小于2年之前的时间
				return time.getTime() > Date.now() || time.getTime() < twoYears;
		}
	}
},
methods: {
	change(time){
		let curDate = (new Date()).getTime();
		let oneMonths = 30 * 24 * 3600 * 1000;
		if (time[1] && time[0]) {
		if (time[1].getTime() - oneMonths > time[0].getTime()) {
			this.$notify({
				title: '提示',
				message: '日期间隔只能选取30天!',
				type: 'warning'
			});
		this.resForm.nowDate = this.resForm.setNowDate;
		}
		}
	}
}