elementui限制开始与结束日期天数最多可选择31天

最新推荐文章于 2024-05-24 15:42:10 发布

Agwenbi

最新推荐文章于 2024-05-24 15:42:10 发布

阅读量3.2k

点赞数 2

分类专栏： Vue

本文链接：https://blog.csdn.net/Ag_wenbi/article/details/90515902

版权

Vue 专栏收录该内容

65 篇文章 3 订阅

订阅专栏

<el-date-picker
  v-model="typeValueTime"
  v-show="datetype == '3'"
  type="datetimerange"
  format="yyyy-MM-dd HH:00:00"
  placeholder="选择日期"
  :picker-options="pickerOptions2"
  align="center"
  range-separator="至"
  start-placeholder="开始日期"
  end-placeholder="结束日期"
  :editable="false"
  :clearable="false"
  :default-time="['00:00:00', '23:00:00']"
></el-date-picker>

data(){
    return{
        pickerMinDate:"",
        pickerOptions2:{
            onPick: ({ maxDate, minDate }) => {
                this.pickerMinDate = minDate.getTime();
                if (maxDate) {
                    this.pickerMinDate = '';
                }
            },
            disabledDate:(time)=> {
                if (this.pickerMinDate !== '') {
                    let one = 30 * 24 * 3600 * 1000
                    let minTime = this.pickerMinDate - one
                    let maxTime = this.pickerMinDate + one
                    if(maxTime > new Date()){
                        maxTime = new Date();
                    }
                    return time.getTime() < minTime || time.getTime() > maxTime
                }
                return time.getTime() > Date.now();
            },
            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]);
                }
             }]
        }
    }
}