element-时间选择器--常用时间规则

1、结束时间大于开始时间

pickerOptions0: {
        disabledDate: time => {
          if (this.queryForm.operateEndTime !== null) {
            return (
              new Date(this.queryForm.operateEndTime).getTime() < time.getTime()
            )
          }
        }
      },
pickerOptions1: {
        disabledDate: time => {
          if (this.queryForm.operateStartTime !== null) {
            return (
              new Date(this.queryForm.operateStartTime).getTime() > time.getTime()
            )
          }
        }
      }

 2、结束时间大于或等于开始时间

 pickerOptions0: {
        disabledDate: time => {
          if (this.queryForm.operateEndTime) {
            return time.getTime() > new Date(this.queryForm.operateEndTime).getTime()
          }
        }
      },
  pickerOptions1: {
        disabledDate: time => {
          if (this.queryForm.operateStartTime) {
            return (
              time.getTime() <
              new Date(this.queryForm.operateStartTime).getTime() - 86400000
            )
          }
        }
      },

3、开始时间及结束时间大于等于今天且结束时间大于或等于开始时间

    pickerOptions0: {
        //结束时间不能大于开始时间
        disabledDate: time => {
          if (this.form.activityEnd) {
            return (
              time.getTime() < Date.now() - 8.64e7 ||
              time.getTime() > new Date(this.form.activityEnd).getTime()
            )
          } else {
            //还没有选择结束时间的时候，让他只能选择今天之后的时间包括今天
            return time.getTime() < Date.now() - 8.64e7
          }
        }
      },
    pickerOptions1: {
        disabledDate: time => {
          if (this.form.activityBegin) {
            return (
              time.getTime() < Date.now() - 8.64e7 ||
              time.getTime() <
                new Date(this.form.activityBegin).getTime() -
                  1 * 24 * 60 * 60 * 1000
            ) //可以选择同一天
          } else {
            return time.getTime() < Date.now() - 8.64e7
          }
        }
      },

4、快捷时间选择（当日、一周内、一月内、全部）

 main.js中引入moment时间组件

import moment from 'moment'
Vue.prototype.$moment = moment

 

      pickerOptions: {
        shortcuts: [{
          text: '当日',
          onClick: picker => {
            picker.$emit('pick', [new Date(), new Date()])
          }
        }, {
          text: '一周内',
          onClick: picker => {
            const start = this.$moment(this.$moment().week(this.$moment().week()).startOf('week').add(1, 'days').valueOf()).format('YYYY-MM-DD')
            const end = this.$moment(this.$moment().week(this.$moment().week()).endOf('week').add(1, 'days').valueOf()).format('YYYY-MM-DD')
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '一月内',
          onClick: picker => {
            const start = this.$moment(this.$moment().month(this.$moment().month()).startOf('month').valueOf()).format('YYYY-MM-DD')
            const end = this.$moment(this.$moment().month(this.$moment().month()).endOf('month').valueOf()).format('YYYY-MM-DD')
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '全部',
          onClick: picker => {
            picker.$emit('pick', ['', ''])
          }
        }]
      },