ElemeFE / element

A Vue.js 2.0 UI Toolkit for Web
https://element.eleme.io/
MIT License
54.04k stars 14.63k forks source link

[Bug Report] 当给date-picker组件设置selectableRange属性后 此刻按钮再次点击失效 #22622

Open tuin77 opened 11 months ago

tuin77 commented 11 months ago

Element UI version

2.15.13

OS/Browsers version

Mac/Chrome版本 115.0.5790.98

Vue version

2.7.14

Reproduction Link

https://codepen.io/ping-the-sans/pen/PoxyaKE

Steps to reproduce

选择日期时间点击确定后 再次点击日期选择器 点击此刻按钮

What is Expected?

数据变成当前时间 弹窗关闭

What is actually happening?

异常 未选择当前时间 数据未改变 弹窗未关闭 没有任何反应

tuin77 commented 11 months ago

期望输出日期:image format格式:value-format="yyyy-MM-dd HH:mm" selectableRange:10:00 - 23:59 组件位置:packages/date-picker/src/panel/date.vue 调试发现 错误位置:点击此刻后触发changeToNow 函数判断此刻时间是否在selectableRange出错
错误原因:checkDateWithinRange 根据format 生成的可选择时间范围与预期不符 limitTimeRange中根据参数date,ranges:'00:00:00 - 23:59:59',format:"yyyy-MM-dd HH:mm" 生成时间范围["2023-01-01 09:49:00","2023-01-01 23:59:59" ] 这里format不应采用传入日期的绑定值的格式

tuin77 commented 11 months ago

@webvs2 期待您的回复

webvs2 commented 11 months ago

我将查看该问题

webvs2 commented 11 months ago

jioyan

请检查picker-options的逻辑,这阻止了此刻的变化,当进行第一次watch的时候,startTimeRange便限制了当前的时间。而new Date(new Date().toLocaleDateString()).getTime()将小于此刻的time.getTime(),尝试修改逻辑,并关闭该问题。

tuin77 commented 11 months ago

@webvs2 感谢回复 已移除selectableRange、disabledDate相关逻辑简化测试用例 仅设置format="yyyy-MM-dd HH:mm" selectableRange: '00:00:00 - 23:59:59' 此刻点击依然无效 https://codepen.io/yanqi2020/pen/YzRBQpN

webvs2 commented 11 months ago

我于本地复现该问题的新示例,抱歉,在组件内部似乎出现了问题😭,这需要一些时间来调试,如果定义为bug后将予以修复并通知你,请暂时去除selectableRange,或者分开小时和日期来实现效果。请保持关注~~

1442916418 commented 3 weeks ago

解决了吗?

tuin77 commented 2 weeks ago

解决了吗?

跟产品沟通隐藏了此刻按钮

1442916418 commented 2 weeks ago

解决了吗?

跟产品沟通隐藏了此刻按钮

用了一个很笨的方法,手动修改了 此刻 按钮的事件方法

参考