时间选择器 结束时间精确到 23:59:59

 方法一

<script setup lang="ts">
  import { ref, watch } from 'vue';

  interface Props {
    start: string;
    end: string;
    format: string;
  }

  const props = withDefaults(defineProps<Props>(), {
    format: 'X',
    start: '',
    end: ''
  })

  const time = ref()
  watch(()=> props.start, (val)=> {
      console.log(val)
    if (val) {
        time.value = []
      time.value.push(props.start,props.end)
      console.log(time.value)
    }
  },{
    immediate: true
  })

  const emit = defineEmits(['update:start','update:end'])
  const changeDate = (val:string[]) => {
    if (props.format === 'X') {
      val[1] = (Number(val[1]) + 86399).toString()
    } else {
      val[1] = val[1].split(' ')[0] + ' ' + '23:59:59'
    }
    emit('update:start', val[0])
    emit('update:end', val[1])
  }
</script>

<template>
  <el-date-picker
    v-model="time"
    type="daterange"
    :value-format="format"
    range-separator="至"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    @change="changeDate">
  </el-date-picker>
</template>

引用 

<el-col :span="12">
   <el-form-item label="时间">
      <daterange v-model:start="start" v-model:end="end" />
   </el-form-item>
</el-col>

 方法二

<el-date-picker
  v-model="value"
  type="daterange"
  start-placeholder="Start date"
  end-placeholder="End date"
  :default-time="defaultTime"
/>

const defaultTime = ref<[Date, Date]>([
  new Date(2000, 1, 1, 0, 0, 0),
  new Date(2000, 2, 1, 23, 59, 59),
])