Ver Fonte

Implement mergeWithSelectedOptions function in LiveGiftStatisticsPage for improved option handling

- Added a new utility function to merge selected options with available options, ensuring that previously selected values are retained even if they are not present in the new options.
- Updated the state management for room and gift listing options to utilize the new merging logic, enhancing data integrity and user experience.
- Adjusted dependencies in useEffect hooks to include form state, improving reactivity to form changes.
0es há 5 dias atrás
pai
commit
f230fe9409
1 ficheiros alterados com 21 adições e 8 exclusões
  1. 21 8
      src/app/(dashboard)/statistics/live-gift/page.tsx

+ 21 - 8
src/app/(dashboard)/statistics/live-gift/page.tsx

@@ -87,6 +87,21 @@ function toDownloadFileName(prefix: string): string {
   return `${prefix}_${ts}.xlsx`;
 }
 
+function mergeWithSelectedOptions(
+  previousOptions: { label: string; value: string }[],
+  nextOptions: { label: string; value: string }[],
+  selectedValues: string[],
+): { label: string; value: string }[] {
+  const nextMap = new Map(nextOptions.map((item) => [item.value, item]));
+  const previousMap = new Map(previousOptions.map((item) => [item.value, item]));
+  selectedValues.forEach((value) => {
+    if (!nextMap.has(value) && previousMap.has(value)) {
+      nextMap.set(value, previousMap.get(value) as { label: string; value: string });
+    }
+  });
+  return Array.from(nextMap.values());
+}
+
 const LiveGiftStatisticsPage: React.FC = () => {
   const { message } = App.useApp();
   const [form] = Form.useForm<SearchFormValues>();
@@ -142,10 +157,9 @@ const LiveGiftStatisticsPage: React.FC = () => {
               ? `${item.roomNum} - ${item.roomTitle}`
               : item.roomNum,
           }));
+        const selectedRoomNums = (form.getFieldValue("roomNums") || []) as string[];
         setRoomOptions((prev) => {
-          const optionMap = new Map(prev.map((item) => [item.value, item]));
-          options.forEach((item) => optionMap.set(item.value, item));
-          return Array.from(optionMap.values());
+          return mergeWithSelectedOptions(prev, options, selectedRoomNums);
         });
       } catch (error) {
         console.error("Failed to load room options:", error);
@@ -154,7 +168,7 @@ const LiveGiftStatisticsPage: React.FC = () => {
         setRoomSearchLoading(false);
       }
     },
-    [message],
+    [form, message],
   );
 
   const handleRoomSearch = useCallback(
@@ -188,10 +202,9 @@ const LiveGiftStatisticsPage: React.FC = () => {
             label: `${name}(${price}钻石)`,
           };
         });
+      const selectedListingIds = (form.getFieldValue("listingIds") || []) as string[];
       setGiftListingOptions((prev) => {
-        const optionMap = new Map(prev.map((item) => [item.value, item]));
-        options.forEach((item) => optionMap.set(item.value, item));
-        return Array.from(optionMap.values());
+        return mergeWithSelectedOptions(prev, options, selectedListingIds);
       });
     } catch (error) {
       console.error("Failed to load gift listing options:", error);
@@ -199,7 +212,7 @@ const LiveGiftStatisticsPage: React.FC = () => {
     } finally {
       setGiftListingSearchLoading(false);
     }
-  }, [message]);
+  }, [form, message]);
 
   const handleGiftListingSearch = useCallback(
     (keyword: string) => {