El DateTimePicker 日期时间选择器调用接口传参

使用format指定输入框的格式。 使用value-format指定绑定值的格式，所以value-format绑定格式要和接口定义的一样。clearable点击清除后日期值就变成null,这时候传参就要注意。直接传null可能接口就报错了

<script setup>
const getData = () => {
  fetchExploreReportHistory({
    id: props.clickRow.id,
    pageNumber: form.pageNumber,
    pageSize: form.pageSize,
    // clearable 清除 form.dateRangeValue就为null了
    startTime: form.dateRangeValue?.length ? form.dateRangeValue[0] : '',
    endTime: form.dateRangeValue?.length ? form.dateRangeValue[1] : '',
  }).then(res => {
    let list = res.data.list || []
    for (let i in list) {
      list[i].numbers = (form.pageNumber - 1) * form.pageSize + Number(i) + 1
      list[i].result = metadataReportProbeResultList.find(
        item => item.value === list[i].result
      ).label
    }
    tableData.value = list

    form.total = res.data?.total ? Number(res.data?.total) : 0
  })
}

const handleSearch = () => {
  form.pageNumber = 1
  getData()
}

const handleReset = () => {
  console.log('form.date', form.dateRangeValue)
  form.dateRangeValue = []
  form.pageNumber = 1
  handleSearch()
}
</script>

<template>
  <!-- clearable 默认为true -->
  <el-date-picker
    v-model="form.dateRangeValue"
    type="datetimerange"
    start-placeholder="执行开始时间"
    end-placeholder="执行结束时间"
    format="YYYY-MM-DD HH:mm:ss"
    value-format="YYYY-MM-DD HH:mm:ss"
    date-format="YYYY/MM/DD ddd"
    time-format="A hh:mm:ss"
  />
</template>