时间选择器:限制三年前和未来时间不可选以及时间范围为1周

109 阅读1分钟

时间选择器的使用

 <el-date-picker
    v-model="searchForm.timePeriod"
    type="datetimerange"
    :clearable="false"
    :start-placeholder="$t('hcp_eduInspect_start_time_name')"
    :end-placeholder="$t('hcp_eduInspect_end_time_name')"
    :picker-options="pickerOptions"
    />

时间限制

pickerOptions: {
        firstDayOfWeek: +sessionStorage.getItem("weekFirstDay"), //周第一天
        disabledDate: (time) => {
          let threeYear = new Date().setFullYear(new Date().getFullYear() - 3);
          return time.getTime() > new Date(moment(new Date()).endOf('day')).getTime() || time.getTime() < threeYear;
        },
        customValidation: (minDate, maxDate)=>{
          let start = minDate ? minDate.getTime() : new Date(moment(new Date()).startOf('day')).getTime();
          let end = maxDate ? maxDate.getTime() : new Date(moment(new Date()).endOf('day')).getTime();
          const oneMonth = new Date(moment(end).subtract(7, 'days').startOf('day')).getTime();
          return oneMonth < start;
        },
        customPrompt: this.$t('hcp_eduInspect_select_time_range_new1_msg')
      }

以此类推

// 1个月内
const oneMonth = new Date().setMonth(new Date(end).getMonth() - 1);
// 6个月内
const sixMonth = new Date().setMonth(new Date(end).getMonth() - 5);