fix(DatePicker): 修复DateRangePicker选择时的交互问题

[mikasayw]

🤔 这个 PR 的性质是？

• 日常 bug 修复
• 新特性提交
• 文档改进
• 演示代码改进
• 组件样式/交互改进
• CI/CD 改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 其他

🔗 相关 Issue

• fix DatePicker 日期选择器，多选日期交互bug #6142

💡 需求背景和解决方案

• 原因：如果是先选择结束日期后选择开始日期时用activeIndex.value值会永远进入首次点击的逻辑
  

  tdesign-vue-next/packages/components/date-picker/DateRangePicker.tsx

  Lines 181 to 182 in 8f191aa

  	// 首次点击不关闭、确保两端都有有效值并且无时间选择器时点击后自动关闭
  	if (!isFirstValueSelected.value || !activeIndex.value) {

• 解决：其实nextValue<Array>中选择第一次后一定有开始日期或结束日期，则下次点击必定是第二次选择且执行关闭逻辑

📝 更新日志

tdesign-vue-next

• fix(DatePicker): 修复DateRangePicker选择时的交互问题

@tdesign-vue-next/chat

@tdesign-vue-next/auto-import-resolver

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项。⚠️

• 文档已补充或无须补充
• 代码演示已提供或无须提供
• TypeScript 定义已补充或无须补充
• Changelog 已提供或无须提供

[tdesign-bot]

TDesign Component Site Preview Open

Component	Preview
tdesign-vue-next
@tdesign-vue-next/chat

[pkg-pr-new]

tdesign-vue-next-demo

npm i https://pkg.pr.new/Tencent/tdesign-vue-next/@tdesign-vue-next/auto-import-resolver@6143

npm i https://pkg.pr.new/Tencent/tdesign-vue-next@6143

npm i https://pkg.pr.new/Tencent/tdesign-vue-next/@tdesign-vue-next/chat@6143

commit: c8c2010

[Copilot]

Pull Request Overview

This PR fixes the logic for managing the date range picker's state during date selection by improving how the component tracks whether any value has been selected. The changes ensure that the picker properly determines when to keep the popup open or close it after user interaction.

• Removed the redundant !activeIndex.value condition from the popup close logic
• Changed isFirstValueSelected to check if any value exists (not just the first one) using nextValue.some((v) => !!v) instead of !!nextValue[0]

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The condition was simplified by removing || !activeIndex.value, but this changes the behavior when activeIndex.value is 0. Previously, when activeIndex.value was 0 (selecting start date), the condition would evaluate to true even if isFirstValueSelected.value was true, keeping the popup open. Now it will close the popup. Verify this behavior change is intentional, especially for the start date selection flow where activeIndex.value is 0.

Suggested change

	if (!isFirstValueSelected.value) {
	if (!isFirstValueSelected.value || !activeIndex.value) {

[mikasayw]

!activeIndex.value判断时，如果先选择endDate后选择startDate，会让使用者再次选择endDate，但此时使用者已经选择了完整了日期区间。这里不能使用activeIndex下标去判断，因为用户选择的先后行为是不可预期的。
186 行改为isFirstValueSelected.value = nextValue.some((v) => !!v)，那么不管使用者是先选择endDate or startDate，下次点击都会命中关闭逻辑。
@Wesley-0808

[Copilot]

The logic change from !!nextValue[0] to nextValue.some((v) => !!v) fundamentally changes the meaning of isFirstValueSelected. The variable name suggests it tracks whether the first value has been selected, but now it checks if any value is selected. This creates a semantic mismatch. When selecting the end date first (index 1), this will set isFirstValueSelected to true even though the first position (index 0) is empty. This could break the logic at lines 160-162 that uses !isFirstValueSelected.value to determine if it's a second modification, potentially preventing proper start/end date validation.

Suggested change

	isFirstValueSelected.value = nextValue.some((v) => !!v);
	isFirstValueSelected.value = !!nextValue[0];

[mikasayw]

tdesign-vue-next/packages/components/date-picker/DateRangePicker.tsx

Lines 156 to 162 in 8f191aa

	// 当两端都有有效值时更改 value
	if (notValidIndex === -1 && nextValue.length === 2) {
	// 二次修改时当其中一侧不符合上次区间规范时，清空另一侧数据
	if (
	!isFirstValueSelected.value &&
	parseToDayjs(nextValue[0], formatRef.value.format).isAfter(parseToDayjs(nextValue[1], formatRef.value.format))
	) {

这里的先行逻辑是startDate endDate都满足有效值，nextValue.some((v) => !!v)并不会影响此地方的逻辑。
popupVisible关闭时都会重置isFirstValueSelected.value = false，二次修改日期区间的首次点击也会验证此地方值的合理性逻辑。

[Wesley-0808]

copilot按变量名来理解了，不过确实，改了之后的 不符合变量名的语义

[mikasayw]

这么一想语意确实有歧义，我看到 isFirstValueSelected的当时注释写的是// 记录面板点击次数，两次后才自动关闭