element-ui el-date-picker 控制区间的选
功能：
1.选择小时，控制日期区间不可以超过2天
2.选择天，控制日期区间不可以超过1个月
3.切换表格，不限制时间区间，都可查询
4.添加时间的快捷项 小时：最近两天 、天：最近一周/最近一个月
点击查询来进行控制：
diolagSearch() {
if (this.activeName === 'first') { //曲线
switch (this.HisType) { //小时/天的控制字段
case '小时':
if (new Date(this.timeDate[1]).getTime() - new Date(this.timeDate[0]).getTime() > (2 * 1000 * 60 * 60 * 24)) {
this.$message({
message: '警告时间不可以超过两天',
type: 'warning'
})
} else {
this.dialogParams.StartDate = this.timeDate[0]
this.dialogParams.EndDate = this.timeDate[1]
this.getDiolagHttp()
}
break
case '天':
if (new Date(this.timeDate[1]).getTime() - new Date(this.timeDate[0]).getTime() > (30 * 1000 * 60 * 60 * 24)) {
this.$message({
message: '警告时间不可以超过一个月',
type: 'warning'
})
} else {
this.dialogParams.StartDate = this.timeDate[0]
this.dialogParams.EndDate = this.timeDate[1]
this.getDiolagHttp()
}
break
}
} else {
this.dialogParams.StartDate = this.timeDate[0]
this.dialogParams.EndDate = this.timeDate[1]
this.getDiolagHttp()
}
this.stationShow = true //弹框不可以关闭
}
控制时间的快捷项：
watch: {
HisType: function(val) {
switch (val) {
case '小时':
this.pickerOptions = {
shortcuts: [
{
text: '最近两天',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 2)
picker.$emit('pick', [start, end])
}
}
]
}
this.timeFormat = 'yyyy-MM-dd HH:mm:ss' //默认的时间格式
this.dialogParams.HisType = 1 //请求参数字段的修改
break
case '天':
console.log(2)
this.pickerOptions = {
shortcuts: [
{
text: '最近一周',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', [start, end])
}
},
{
text: '最近一个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
picker.$emit('pick', [start, end])
}
}
]
}
this.timeFormat = 'yyyy-MM-dd'
this.dialogParams.HisType = 2
break
}
}
}
