iview 时间日期选择器限制开始时间不能小于当前系统日期时间，结束时间不能小于开始时间和当前系统日期时间时间

废话不多说直接上代码

html

 <div>
    <DatePicker
      :time-picker-options="{
        disabledHours: disabledHours,
        disabledMinutes: disabledMinutes,
        disabledSeconds: disabledSeconds,
      }"
      type="datetime"
      format="yyyy-MM-dd HH:mm:ss"
      placeholder="最新更新日期"
      :options="startOptions"
      v-model="formItem.beginTime"
      @on-change="hashchang"
    />

    ---

    <DatePicker
      :time-picker-options="{
        disabledHours: disabledHours1,
        disabledMinutes: disabledMinutes1,
        disabledSeconds: disabledSeconds1,
      }"
      @on-open-change="openc"
      @on-change="hashchangend"
      type="datetime"
      format="yyyy-MM-dd HH:mm:ss"
      placeholder="最后更新日期"
      :options="endOptions"
      v-model="formItem.endTime"
    />
  </div>

js

<script>
export default {
  data() {
    const _this = this;
    return {
      formItem: {},
      // 限制开始时间
      startOptions: {
        disabledDate: (date) => {
          return date && date.valueOf() < Date.now() - 86400000;
        },
      },
      endOptions: {
        // 指定终止日期
        disabledDate: (date) => {
          let data =
            this.formItem.beginTime == " "
              ? " "
              : new Date(_this.formItem.beginTime);
          return date < data - 86400000;
        },
      },
      // 开始时间
      disabledHours: [], // 审批不可选择时
      disabledMinutes: [], // 审批不可选择分
      disabledSeconds: [], // 审批不可选择秒
      // 结束时间
      disabledHours1: [], // 审批不可选择时
      disabledMinutes1: [], // 审批不可选择分
      disabledSeconds1: [], // 审批不可选择秒
    };
  },

  computed: {},
  created() {
    this.getTimePickerOptions();
  },
  mounted() {},
  methods: {
    // 开始时间处理
    hashchang(e) {
      this.formItem.endTime = "";
      this.disabledHours1 = [];
      this.disabledMinutes1 = [];
      this.disabledSeconds1 = [];
      let data = new Date(e).getHours();
      console.log(data, new Date().getHours());
      if (new Date(e).getDate() > new Date().getDate()) {
        this.disabledHours = [];
        this.disabledMinutes = [];
        this.disabledSeconds = [];
      } else {
        if (new Date(e).getHours() > new Date().getHours()) {
          this.disabledMinutes = [];
          this.disabledSeconds = [];
        } else {
          console.log(1111111111111);
          this.getTimePickerOptions();
        }
      }
      console.log(e);
    },
    getTimePickerOptions() {
      console.log(222222222222);
      let d = new Date();
      let hour = d.getHours();
      let minute = d.getMinutes();
      let second = d.getSeconds();

      for (let i = 0; i < hour; i++) {
        this.disabledHours[i] = i;
      }
      for (let i = 0; i < minute; i++) {
        this.disabledMinutes[i] = i;
      }
      for (let i = 0; i < second; i++) {
        this.disabledSeconds[i] = i;
      }
      console.log(this.disabledHours);
      console.log(this.disabledMinutes);
      console.log(this.disabledSeconds);
    },

    // 结束时间处理
    hashchangend(e) {
      console.log(
        new Date(e).getDate(),
        new Date(this.formItem.beginTime).getDate()
      );
      if (new Date(e).getDate() > new Date(this.formItem.beginTime).getDate()) {
        this.disabledHours1 = [];
        this.disabledMinutes1 = [];
        this.disabledSeconds1 = [];
      } else {
        if (
          new Date(e).getHours() > new Date(this.formItem.beginTime).getHours()
        ) {
          this.disabledMinutes1 = [];
          this.disabledSeconds1 = [];
        } else {
          console.log(33333333);
          this.getTimePickerOptions1();
        }
      }
    },
    openc(e) {
      console.log(e);

      this.getTimePickerOptions1();
    },
    getTimePickerOptions1() {
      let d = new Date(this.formItem.beginTime);

      let hour = d.getHours();
      let minute = d.getMinutes();
      let second = d.getSeconds();

      for (let i = 0; i < hour; i++) {
        this.disabledHours1[i] = i;
      }
      for (let i = 0; i < minute; i++) {
        this.disabledMinutes1[i] = i;
      }
      for (let i = 0; i < second; i++) {
        this.disabledSeconds1[i] = i;
      }
    },
  },
};
</script>

效果

开始时间：当前日期之前的日期和之前的时间不可选

结束时间：不小于当前选中时间