iview的DatePicker组件，设置起止时间范围，无法精确到小时？

Question

两个日期选择框，设置起止时间，时间可选范围是6个小时，譬如我选开始时间选择2019-4-17 00:00:00，结束时间可选只能是2019-4-17 00:00:00至2019-4-17 06:00:00，有一个问题就是当我开始时间选择2019-4-17 22:00:00时，第二个日期选择器可选时间范围是2019-4-18 00:00:00 至 2019-4-18 04:00:00，问题就是我无法选择2019-4-17 22:00:00 至 2019-4-17 23:59:59 中的任意一时间，同理我先选第二个选择框设置截止时间，设置开始时间时也会有同样的问题。

<template>
  <div id="app">
    <Row>
      <Col span="12">
        <DatePicker 
        type="datetime" 
        v-model="pointDTO.startTime" 
        :options="startOptions" 
        placeholder="Select date" 
        style="width: 200px"></DatePicker>
      </Col>
      <Col span="12">
        <DatePicker 
        type="datetime" 
        v-model="pointDTO.endTime" 
        :options="endOptions" 
        placeholder="Select date" 
        style="width: 200px"></DatePicker>
      </Col>
    </Row>
  </div>
</template>

<script>

export default {
  name: 'app',
  data() {
    return {
      pointDTO: {
        startTime: '',
        endTime: '',
      }
    }
  },
  components: {

  },
  methods: {
    getMsg(msg) {
      alert(msg);
    }
  },
  computed: {
    startOptions() {
      const THIS = this;
      return {
        disabledDate(date) {
          const dateVal = date.valueOf();
          if (!THIS.pointDTO.endTime) {
            return dateVal > Date.now();
          }

          return dateVal > THIS.pointDTO.endTime.valueOf() || dateVal < THIS.pointDTO.endTime.valueOf() - 21600000;
        },
      };
    },
    endOptions() {
      const THIS = this;
      return {
        disabledDate(date) {
          const dateVal = date.valueOf();

          if (!THIS.pointDTO.startTime) {
            return dateVal > Date.now();
          }

          return dateVal < THIS.pointDTO.startTime.valueOf() || dateVal > THIS.pointDTO.startTime.valueOf() + 21600000;
        },
      };
    },    
  },
}
</script>

Answer 1

你解决了吗？