element-plus [Bug Report] datetime-picker bug

7uhlpewt  于 2022-10-21  发布在  其他
关注(0)|答案(5)|浏览(351)

Element Plus version

1.0.2-beta.41

OS/Browsers version

chrome 87.0.4280.88

Vue version

3.0.0-beta.1

https://codepen.io/pen/

Steps to reproduce

1、双击某个日期,初始化开始时间和结束时间
2、选择开始时间,时分秒设置为当前时间之后任意一个时间,如果结束时期小于开始时间,结束时间将等于开始时间
3、选择结束时间,点击时分秒,此时,结束时间将莫名被重置为某个时间点,导致开始时间时分秒将被重置为当前结束日期的时分秒

<template>

  <div class="block">
    <span class="demonstration">默认</span>
    <el-date-picker
      v-model="value1"
      type="datetimerange"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期">
    </el-date-picker>
  </div>
  <div class="block">
    <span class="demonstration">带快捷选项</span>
    <el-date-picker
      v-model="value2"
      type="datetimerange"
      :shortcuts="shortcuts"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      align="right">
    </el-date-picker>
  </div>

</template>

<script>
  export default {
    data() {
      return {
        shortcuts: [{
          text: '最近一周',
          value: (() => {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
            return [start, end]
          })()
        }, {
          text: '最近一个月',
          value: (() => {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
            return [start, end]
          })()
        }, {
          text: '最近三个月',
          value: (() => {
            const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
            return [start, end]
          })()
        }],
        value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
        value2: ''
      };
    }
  };
</script>

<style>

</style>

What is Expected?

点击结束日期的时分秒,希望能以点击前的时分秒为准,否则将带来非常繁琐的反复选择操作

What is actually happening?

点击结束日期的时分秒,结束日期的时分秒自动被改变

kyks70gy

kyks70gy1#

Translation of this issue:

Element Plus version

1.0.2-beta.41

OS/Browsers version

chrome 87.0.4280.88

Vue version

3.0.0-beta.1

https://codepen.io/pen/

Steps to reproduce

  1. Double click a date to initialize the start date and end date
  2. Select the start date, and set the hour, minute and second to any time after the current time
  3. Select the end date and click hour, minute and second. The hour, minute and second of the start date will be reset to the hour, minute and second of the current end date
    < span class = "demonstration" > Default
    <el-date-picker

v-model="value1"
type="datetimerange"

Range separator = "to"
Start placeholder = "start date"

End placeholder = "end date" >

< span class = "demonstration" > with shortcut options
<el-date-picker

v-model="value2"
type="datetimerange"

:shortcuts="shortcuts"
Range separator = "to"

Start placeholder = "start date"
End placeholder = "end date"

align="right">

What is Expected?

Choose the hour, minute and second of the end date, do not want to change the hour, minute and second of the start date, it will bring very tedious repeated operation

What is actually happening?

Select the hour, minute and second of the end date to change the hour, minute and second of the start date

nzk0hqpo

nzk0hqpo2#

cc @0song can you take a look on this?

lp0sw83n

lp0sw83n3#

Can the problem be fixed as soon as possible?

iyfamqjs

iyfamqjs4#

Hasn't the problem been fixed?

lh80um4z

lh80um4z5#

The problem not yet fix ?

相关问题