fix(grid): fix insert rowIndex error

examples/sites/demos/pc/app/grid/filter/simple-date-filter.spec.ts

@@ -13,7 +13,7 @@ test('简化版筛选面板 - 时间日期菜单', async ({ page }) => {
   await page.getByRole('button', { name: '确定' }).nth(1).click()
   await page.waitForTimeout(200)
   await page.locator('.tiny-date-editor').nth(1).click()
-  await page.getByRole('textbox', { name: '选择日期' }).nth(1).fill('2023-11-19')
+  await page.getByRole('textbox', { name: '选择日期' }).fill('2023-11-19')
   await page.getByRole('button', { name: '确定' }).nth(1).click()
   await page.getByRole('button', { name: '确定' }).first().click()
   await expect(page.getByRole('cell', { name: 'Elisa Menez' }).getByText('Elisa Menez')).toBeVisible()

packages/theme-saas/src/grid/table.less

@@ -1446,7 +1446,7 @@
     .tiny-grid-header__column {
       @apply sticky;
       /* --tiny-color-fill-8 真实对应 rgba(31, 85, 181, .05) */
-      background-color: var(--tiny-color-fill-8-solid, #f4f6fb);
+      background-color: var(--tiny-color-fill-8, #f4f6fb);
     }
 
     .tiny-grid-header__column:last-child {

packages/vue/src/grid/src/composable/useNormalData.ts

@@ -64,7 +64,16 @@ export const useNormalData = ({ props, tableFullColumn }) => {
   })
 
   hooks.watch(rawDataVersion, () => {
-    // 设置数据查找缓存，对数据进行备份，深度克隆
+    const { optimizeOpts } = $table
+    const { scrollY } = optimizeOpts
+    const _rawData = rawData.value || []
+    const tableFullData = Array.isArray(_rawData) ? _rawData.slice(0) : []
+
+    // 设置全量数据，行虚滚标记
+    $table.tableFullData = tableFullData
+    $table.scrollYLoad = scrollY && scrollY.gt > 0 && scrollY.gt <= tableFullData.length
+
+    // 设置数据映射和查找缓存
     $table.updateCache(true, props.saveSource === 'deep')
     // 处理表格数据刷新
     $table.handleDataChange()

packages/vue/src/grid/src/edit/src/methods.ts

@@ -139,6 +139,7 @@ export default {
       newRecords
     })
 
+    this.updateCache()
     this.handleTableData(true)
     this.checkSelectionStatus()
     this.updateFooter()
@@ -212,6 +213,7 @@ export default {
     })
 
     // 修改缓存
+    this.updateCache()
     this.handleTableData(true)
     this.checkSelectionStatus()
     this.updateFooter()

packages/vue/src/grid/src/table/src/methods.ts

@@ -288,16 +288,11 @@ const Methods = {
   },
   // 全量加载表格数据
   loadTableData(datas, notRefresh) {
-    const { editStore, height, maxHeight, lastScrollLeft, lastScrollTop, optimizeOpts } = this
-    const { scrollY } = optimizeOpts
-    const tableFullData = isArray(datas) ? datas.slice(0) : []
-    const scrollYLoad = scrollY && scrollY.gt > 0 && scrollY.gt <= tableFullData.length
+    const { editStore, height, maxHeight, lastScrollLeft, lastScrollTop, scrollYLoad } = this
 
     editStore.insertList = []
     editStore.insertMap = new Map()
     editStore.removeList = []
-    // 设置全量数据，行虚滚标记
-    Object.assign(this, { tableFullData, scrollYLoad })
 
     if (scrollYLoad && !(height || maxHeight)) {
       error('ui.grid.error.scrollYHeight')
@@ -331,15 +326,13 @@ const Methods = {
     this.rawDataVersion += 1
   },
   getOriginRow(row) {
-    const { srcIdMap, idRawMap } = this.backupInfos
-
-    return srcIdMap.has(row) ? idRawMap.get(srcIdMap.get(row)) : null
+    const rowid = getRowid(this, row)
+    return rowid ? this.rowidCacheMap.get(rowid) : null
   },
   setOriginRow(row, record) {
-    const { srcIdMap, idRawMap } = this.backupInfos
-
-    if (srcIdMap.has(row) && record) {
-      idRawMap.set(srcIdMap.get(row), record)
+    const rowid = getRowid(this, row)
+    if (rowid && record) {
+      this.rowidCacheMap.set(rowid, record)
     }
   },
   reloadRow(row, record, field) {
@@ -408,8 +401,7 @@ const Methods = {
   },
   /** 设置数据查找缓存，对数据进行备份，深度克隆  */
   updateCache(backup = false, deepCopy = false) {
-    const { rawData, treeConfig, treeOrdered, editConfig, saveSource = false } = this
-    const newArray = isArray(rawData) ? rawData.slice(0) : []
+    const { tableFullData, treeConfig, treeOrdered, editConfig, saveSource = false } = this
     const rowKey = getRowkey(this)
     const { children: childrenKey, temporaryIndex = '_$index_' } = treeConfig || {}
     const isTreeOrderedFalse = treeConfig && !treeOrdered
@@ -420,7 +412,7 @@ const Methods = {
 
     /* 标记RID和非顺序树表行index */
     eachTree(
-      newArray,
+      tableFullData,
       (row, index, _array, _path, parent) => {
         let rowId = getRowid(this, row)
 
@@ -452,29 +444,21 @@ const Methods = {
       treeConfig
     )
 
+    // 可编辑表格默认开启备份，非可编辑表格在开启saveSource时也可备份
     if (backup && (editConfig || saveSource)) {
       /* 在空闲帧任务中备份数据 */
       requestIdleCallback(() => {
-        const srcIdMap = new WeakMap()
-        const idRawMap = new Map()
-
-        eachTree(
-          newArray,
-          (row) => {
-            const rowId = getRowid(this, row)
-            // 这里构造一个普通对象，用于后续整体复制。树表结构字段设置为null，避免子行被复制多次。
-            const copyRow = childrenKey ? { ...row, [childrenKey]: null } : { ...row }
-
-            srcIdMap.set(row, rowId)
-            idRawMap.set(rowId, copyRow)
-          },
-          treeConfig
-        )
-
-        this.backupInfos = {
-          srcIdMap,
-          idRawMap: (isVue2 && deepCopy) || !isVue2 ? this.cloneMapAndUnwrap(idRawMap) : idRawMap
-        }
+        const rowidCacheMap = new Map()
+        // 默认浅层复制，在设置saveSource为deep时开启深层复制
+        const callback = (row) =>
+          rowidCacheMap.set(
+            getRowid(this, row),
+            clone(childrenKey ? { ...row, [childrenKey]: null } : { ...row }, deepCopy)
+          )
+
+        eachTree(tableFullData, callback, treeConfig)
+
+        this.rowidCacheMap = rowidCacheMap
       })
     }
   },

packages/vue/src/grid/src/table/src/table.ts

@@ -567,7 +567,6 @@ export default defineComponent({
       fullColumnMap: new Map(),
       fullDataRowIdData: {},
       fullDataRowMap: new Map(),
-      backupInfos: { srcIdMap: new WeakMap(), idRawMap: new Map() },
       // 最后滚动位置
       lastScrollLeft: 0,
       lastScrollTop: 0,
@@ -786,6 +785,7 @@ export default defineComponent({
       unbindEvent($table)
 
       $table._tileInfo = $table._graphInfo = null
+      $table.rowidCacheMap = null
     })
 
     hooks.onActivated(() => {
@@ -807,6 +807,8 @@ export default defineComponent({
     const tableListeners = getListeners(attrs, listeners)
 
     const markColumnIndex = hooks.ref(0)
+
+    const rowidCacheMap = new Map()
     return {
       slots,
       tableListeners,
@@ -842,7 +844,8 @@ export default defineComponent({
       tiledLength,
       rawDataVersion,
       rawData,
-      markColumnIndex
+      markColumnIndex,
+      rowidCacheMap
     }
   },
   render() {