From bc2c3a1f08f2685f2bc354e56dd1a202185daefa Mon Sep 17 00:00:00 2001
From: Zyf665 <1246271707@qq.com>
Date: Tue, 26 Nov 2024 15:06:20 +0800
Subject: [PATCH] fix:returns wrong dates onChange when manually change date
 time without pressing OK button

---
 src/PickerInput/hooks/useRangeValue.ts | 14 +++++------
 tests/new-range.spec.tsx               | 34 ++++++++++++++++++++++++++
 tests/range.spec.tsx                   | 29 ----------------------
 3 files changed, 41 insertions(+), 36 deletions(-)

diff --git a/src/PickerInput/hooks/useRangeValue.ts b/src/PickerInput/hooks/useRangeValue.ts
index bbd5f50c8..3087ee4df 100644
--- a/src/PickerInput/hooks/useRangeValue.ts
+++ b/src/PickerInput/hooks/useRangeValue.ts
@@ -4,7 +4,7 @@ import type { GenerateConfig } from '../../generate';
 import useSyncState from '../../hooks/useSyncState';
 import type { BaseInfo, FormatType, Locale, ReplaceListType } from '../../interface';
 import { formatValue, isSame, isSameTimestamp } from '../../utils/dateUtil';
-import { fillRangeValues } from '../../utils/miscUtil';
+import { fillIndex } from '../../utils/miscUtil';
 import type { RangePickerProps } from '../RangePicker';
 import type { ReplacedPickerProps } from '../SinglePicker';
 import useLockEffect from './useLockEffect';
@@ -301,11 +301,8 @@ export default function useRangeValue<ValueType extends DateType[], DateType ext
   });
 
   // ========================= Flush Submit =========================
-  const flushSubmit = useEvent((_: number, needTriggerChange: boolean) => {
-    const start = getCalendarValue()[0];
-    const end = getCalendarValue()[1];
-
-    const nextSubmitValue = fillRangeValues(submitValue(), start, end);
+  const flushSubmit = useEvent((index: number, needTriggerChange: boolean) => {
+    const nextSubmitValue = fillIndex(submitValue(), index, getCalendarValue()[index]);
     setSubmitValue(nextSubmitValue);
 
     if (needTriggerChange) {
@@ -337,7 +334,10 @@ export default function useRangeValue<ValueType extends DateType[], DateType ext
 
   // ============================ Check =============================
   function hasSubmitValue(index: number) {
-    return !!submitValue()[index];
+    return (
+      !!submitValue()[index] &&
+      isSame(generateConfig, locale, submitValue()[index], getCalendarValue()[index], picker)
+    );
   }
 
   // ============================ Return ============================
diff --git a/tests/new-range.spec.tsx b/tests/new-range.spec.tsx
index 41397ae44..05d404bb6 100644
--- a/tests/new-range.spec.tsx
+++ b/tests/new-range.spec.tsx
@@ -716,6 +716,40 @@ describe('NewPicker.Range', () => {
       expect(onChange).toHaveBeenCalledWith(expect.anything(), ['06:00:00', '11:00:00']);
     });
 
+    it('Field switch should be locked even when the field already has the values', () => {
+      const onChange = jest.fn();
+
+      const { container } = render(<DayRangePicker onChange={onChange} showTime />);
+      openPicker(container);
+      selectCell(15);
+      fireEvent.click(document.querySelector('ul').querySelector('li'));
+      fireEvent.click(document.querySelector('.rc-picker-ok button'));
+
+      selectCell(16);
+      fireEvent.click(document.querySelector('ul').querySelector('li'));
+      fireEvent.click(document.querySelector('.rc-picker-ok button'));
+
+      expect(onChange).toHaveBeenCalledWith(expect.anything(), [
+        '1990-09-15 00:00:00',
+        '1990-09-16 00:00:00',
+      ]);
+
+      onChange.mockReset();
+      openPicker(container, 0);
+      selectCell(1);
+      openPicker(container, 1);
+      expect(container.querySelectorAll('input')[0]).toHaveFocus();
+      expect(container.querySelectorAll('input')[1]).not.toHaveFocus();
+
+      fireEvent.click(document.querySelector('.rc-picker-ok button'));
+      selectCell(2);
+      fireEvent.click(document.querySelector('.rc-picker-ok button'));
+      expect(onChange).toHaveBeenCalledWith(expect.anything(), [
+        '1990-09-01 00:00:00',
+        '1990-09-02 00:00:00',
+      ]);
+    });
+
     it('double click to confirm if needConfirm', () => {
       const onChange = jest.fn();
 
diff --git a/tests/range.spec.tsx b/tests/range.spec.tsx
index 14c7741f4..791a7e501 100644
--- a/tests/range.spec.tsx
+++ b/tests/range.spec.tsx
@@ -1017,35 +1017,6 @@ describe('Picker.Range', () => {
     expect(document.querySelector('.rc-picker-month-panel')).toBeTruthy();
   });
 
-  it('returns right dates onChange when manually change date time without pressing OK button', () => {
-    const onChange = jest.fn();
-
-    const { container } = render(<DayRangePicker onChange={onChange} showTime />);
-    openPicker(container);
-    selectCell(15);
-    fireEvent.click(document.querySelector('ul').querySelector('li'));
-    fireEvent.click(document.querySelector('.rc-picker-ok button'));
-
-    selectCell(16);
-    fireEvent.click(document.querySelector('ul').querySelector('li'));
-    fireEvent.click(document.querySelector('.rc-picker-ok button'));
-
-    expect(onChange).toHaveBeenCalledWith(expect.anything(), [
-      '1990-09-15 00:00:00',
-      '1990-09-16 00:00:00',
-    ]);
-
-    onChange.mockReset();
-    openPicker(container, 0);
-    selectCell(1);
-    openPicker(container, 1);
-    selectCell(2);
-    fireEvent.click(document.querySelector('.rc-picker-ok button'));
-    expect(onChange).toHaveBeenCalledWith(expect.anything(), [
-      '1990-09-01 00:00:00',
-      '1990-09-02 00:00:00',
-    ]);
-  });
   describe('reorder onChange logic', () => {
     it('datetime should reorder in onChange if start is after end in same date', () => {
       const onChange = jest.fn();