<template>
  <div class=" inline-block">
    <a-range-picker
      :placeholder="['起始日期', '结束日期']"
      :value="rangePickerValue"
      @change="onRangePickerChange"
    />
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import transferTimeStampToMoment from "@/utils/time/transfer"

export default Vue.extend({
  props: ['startTime', 'endTime'],
  computed:{
    rangePickerValue(): any {
      return this.startTime && this.endTime &&
        transferTimeStampToMoment(this.startTime, this.endTime) || undefined
    },
  },
  methods:{
    onRangePickerChange(value: any) {
      let startTime = undefined;
      let endTime = undefined;
      if (value.length === 0) {
          startTime = undefined
          endTime = undefined
      } else {
          const [firstM, secondM] = value
          firstM.hour(0)
          firstM.minute(0)
          firstM.second(0)
          secondM.hour(23)
          secondM.minute(59)
          secondM.second(59)

          startTime = firstM._d.getTime()
          endTime = secondM._d.getTime()
      }
      console.log(startTime)
      this.$emit('getNewTime',startTime,endTime)
    },
  }
})
</script>

<style scoped>
</style>