From f9cab6a3cf789b476af368c996b025601eb9d6f9 Mon Sep 17 00:00:00 2001
From: HQ-Lin <a154571896@gmail.com>
Date: Tue, 13 Sep 2022 18:48:04 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=94=AF=E6=8C=81=E4=BA=8C=E6=AC=A1?=
 =?UTF-8?q?=E6=9B=B4=E6=94=B9=E6=97=B6=E9=97=B4=E9=80=89=E6=8B=A9=E5=99=A8?=
 =?UTF-8?q?=E6=97=B6=E5=8F=AF=E5=8D=95=E6=AC=A1=E5=8F=98=E6=9B=B4=E6=97=A5?=
 =?UTF-8?q?=E6=9C=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/date-picker/DateRangePicker.tsx      | 44 +++++++++++++++---------
 src/date-picker/DateRangePickerPanel.tsx |  2 +-
 src/date-picker/hooks/useRange.ts        |  7 ----
 3 files changed, 28 insertions(+), 25 deletions(-)

diff --git a/src/date-picker/DateRangePicker.tsx b/src/date-picker/DateRangePicker.tsx
index 6c435fb42..5fc398eaf 100644
--- a/src/date-picker/DateRangePicker.tsx
+++ b/src/date-picker/DateRangePicker.tsx
@@ -55,7 +55,6 @@ export default defineComponent({
       // 面板展开重置数据
       if (visible) {
         isSelected.value = false;
-        isFirstValueSelected.value = false;
         cacheValue.value = formatDate(value.value || [], {
           format: formatRef.value.format,
           targetFormat: formatRef.value.format,
@@ -85,6 +84,13 @@ export default defineComponent({
           year.value = value.value.map((v: string) => parseToDayjs(v || new Date(), formatRef.value.format).year());
           month.value = value.value.map((v: string) => parseToDayjs(v || new Date(), formatRef.value.format).month());
         }
+      } else {
+        isHoverCell.value = false;
+        isFirstValueSelected.value = false;
+        inputValue.value = formatDate(value.value, {
+          format: formatRef.value.format,
+          targetFormat: formatRef.value.format,
+        });
       }
     });
 
@@ -147,8 +153,8 @@ export default defineComponent({
       // 确保两端都是有效值
       const notValidIndex = nextValue.findIndex((v) => !v || !isValidDate(v, formatRef.value.format));
 
-      // 首次点击不关闭、确保两端都有有效值并且无时间选择器时点击后自动关闭
-      if (notValidIndex === -1 && nextValue.length === 2 && !props.enableTimePicker && isFirstValueSelected.value) {
+      // 当两端都有有效值时更改 value
+      if (notValidIndex === -1 && nextValue.length === 2) {
         onChange?.(
           formatDate(nextValue, {
             format: formatRef.value.format,
@@ -159,14 +165,16 @@ export default defineComponent({
             trigger: 'pick',
           },
         );
-        isFirstValueSelected.value = false;
-        popupVisible.value = false;
-      } else if (notValidIndex !== -1) {
-        activeIndex.value = notValidIndex;
+      }
+
+      // 首次点击不关闭、确保两端都有有效值并且无时间选择器时点击后自动关闭
+      if (!isFirstValueSelected.value) {
+        let nextIndex = notValidIndex;
+        if (nextIndex === -1) nextIndex = activeIndex.value ? 0 : 1;
+        activeIndex.value = nextIndex;
         isFirstValueSelected.value = true;
       } else {
-        activeIndex.value = activeIndex.value ? 0 : 1;
-        isFirstValueSelected.value = true;
+        popupVisible.value = false;
       }
     }
 
@@ -261,8 +269,8 @@ export default defineComponent({
 
       const notValidIndex = nextValue.findIndex((v) => !v || !isValidDate(v, formatRef.value.format));
 
-      // 首次点击不关闭、确保两端都有有效值并且无时间选择器时点击后自动关闭
-      if (notValidIndex === -1 && nextValue.length === 2 && isFirstValueSelected.value) {
+      // 当两端都有有效值时更改 value
+      if (notValidIndex === -1 && nextValue.length === 2) {
         onChange?.(
           formatDate(nextValue, {
             format: formatRef.value.format,
@@ -275,14 +283,16 @@ export default defineComponent({
         );
         year.value = nextValue.map((v) => dayjs(v, formatRef.value.format).year());
         month.value = nextValue.map((v) => dayjs(v, formatRef.value.format).month());
-        popupVisible.value = false;
-        isFirstValueSelected.value = false;
-      } else if (notValidIndex !== -1) {
-        activeIndex.value = notValidIndex;
+      }
+
+      // 首次点击不关闭、确保两端都有有效值并且无时间选择器时点击后自动关闭
+      if (!isFirstValueSelected.value) {
+        let nextIndex = notValidIndex;
+        if (nextIndex === -1) nextIndex = activeIndex.value ? 0 : 1;
+        activeIndex.value = nextIndex;
         isFirstValueSelected.value = true;
       } else {
-        activeIndex.value = activeIndex.value ? 0 : 1;
-        isFirstValueSelected.value = true;
+        popupVisible.value = false;
       }
     }
 
diff --git a/src/date-picker/DateRangePickerPanel.tsx b/src/date-picker/DateRangePickerPanel.tsx
index 0209f536b..a9e708804 100644
--- a/src/date-picker/DateRangePickerPanel.tsx
+++ b/src/date-picker/DateRangePickerPanel.tsx
@@ -113,7 +113,7 @@ export default defineComponent({
       if (props.enableTimePicker) return;
 
       // 首次点击不关闭、确保两端都有有效值并且无时间选择器时点击后自动关闭
-      if (nextValue.length === 2 && !props.enableTimePicker && isFirstValueSelected.value) {
+      if (nextValue.length === 2 && isFirstValueSelected.value) {
         onChange?.(
           formatDate(nextValue, {
             format: formatRef.value.format,
diff --git a/src/date-picker/hooks/useRange.ts b/src/date-picker/hooks/useRange.ts
index 782668a6d..82ad26fab 100644
--- a/src/date-picker/hooks/useRange.ts
+++ b/src/date-picker/hooks/useRange.ts
@@ -121,13 +121,6 @@ export default function useRange(props: TdDateRangePickerProps, { emit }: any) {
         popupVisible.value = true;
         return;
       }
-      if (!visible) {
-        isHoverCell.value = false;
-        inputValue.value = formatDate(value.value, {
-          format: formatRef.value.format,
-          targetFormat: formatRef.value.format,
-        });
-      }
 
       popupVisible.value = visible;
     },