fix: fix checkbox and radio state update when change row index #1712

VisActor · May 17, 2024 · 98bb289 · 98bb289
1 parent e56bb5d
commit 98bb289
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 1 deletion.
diff --git a/common/changes/@visactor/vtable/fix-checkbox-coloun-order_2024-05-17-07-56.json b/common/changes/@visactor/vtable/fix-checkbox-coloun-order_2024-05-17-07-56.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@visactor/vtable",
+      "comment": "fix: fix checkbox and radio state update when change row index #1712",
+      "type": "none"
+    }
+  ],
+  "packageName": "@visactor/vtable"
+}
diff --git a/packages/vtable/src/state/cell-move/index.ts b/packages/vtable/src/state/cell-move/index.ts
@@ -175,6 +175,7 @@ export function endMoveCol(state: StateManager) {
         )
       ) {
         state.table.changeRecordOrder(moveContext.sourceIndex, moveContext.targetIndex);
+        state.changeCheckboxAndRadioOrder(moveContext.sourceIndex, moveContext.targetIndex);
       }
       // clear columns width and rows height cache
       if (moveContext.moveType === 'column') {

diff --git a/packages/vtable/src/state/checkbox/checkbox.ts b/packages/vtable/src/state/checkbox/checkbox.ts
@@ -225,3 +225,19 @@ export function setCellCheckboxState(col: number, row: number, checked: boolean,
     }
   }
 }
+
+export function changeCheckboxOrder(sourceIndex: number, targetIndex: number, state: StateManager) {
+  const { checkedState, table } = state;
+  if (table.internalProps.transpose) {
+    sourceIndex = table.getRecordShowIndexByCell(sourceIndex, 0);
+    targetIndex = table.getRecordShowIndexByCell(targetIndex, 0);
+  } else {
+    sourceIndex = table.getRecordShowIndexByCell(0, sourceIndex);
+    targetIndex = table.getRecordShowIndexByCell(0, targetIndex);
+  }
+  if (sourceIndex !== targetIndex) {
+    const sourceRecord = checkedState[sourceIndex];
+    checkedState[sourceIndex] = checkedState[targetIndex];
+    checkedState[targetIndex] = sourceRecord;
+  }
+}
diff --git a/packages/vtable/src/state/radio/radio.ts b/packages/vtable/src/state/radio/radio.ts
@@ -138,3 +138,19 @@ export function setCellRadioState(col: number, row: number, index: number | unde
     radio?._handlePointerUp();
   }
 }
+
+export function changeRadioOrder(sourceIndex: number, targetIndex: number, state: StateManager) {
+  const { radioState, table } = state;
+  if (table.internalProps.transpose) {
+    sourceIndex = table.getRecordShowIndexByCell(sourceIndex, 0);
+    targetIndex = table.getRecordShowIndexByCell(targetIndex, 0);
+  } else {
+    sourceIndex = table.getRecordShowIndexByCell(0, sourceIndex);
+    targetIndex = table.getRecordShowIndexByCell(0, targetIndex);
+  }
+  if (sourceIndex !== targetIndex) {
+    const sourceRecord = radioState[sourceIndex];
+    radioState[sourceIndex] = radioState[targetIndex];
+    radioState[targetIndex] = sourceRecord;
+  }
+}
diff --git a/packages/vtable/src/state/state.ts b/packages/vtable/src/state/state.ts
@@ -37,8 +37,9 @@ import { getIconAndPositionFromTarget } from '../scenegraph/utils/icon';
 import type { BaseTableAPI, HeaderData } from '../ts-types/base-table';
 import { debounce } from '../tools/debounce';
 import { updateResizeColumn } from './resize/update-resize-column';
-import { setRadioState, syncRadioState } from './radio/radio';
+import { changeRadioOrder, setRadioState, syncRadioState } from './radio/radio';
 import {
+  changeCheckboxOrder,
   initCheckedState,
   initLeftRecordsCheckState,
   setCheckedState,
@@ -1364,4 +1365,13 @@ export class StateManager {
   ) {
     return syncRadioState(col, row, field, radioType, indexInCell, isChecked, this);
   }
+
+  changeCheckboxAndRadioOrder(sourceIndex: number, targetIndex: number) {
+    if (this.checkedState.length) {
+      changeCheckboxOrder(sourceIndex, targetIndex, this);
+    }
+    if (this.radioState.length) {
+      changeRadioOrder(sourceIndex, targetIndex, this);
+    }
+  }
 }