From 8523a359801b46c2431d448aca4c46fb606fd92d Mon Sep 17 00:00:00 2001
From: gimmyhehe <975402925@qq.com>
Date: Mon, 18 Mar 2024 19:17:21 +0800
Subject: [PATCH] docs(grid): [grid] fix tree-grid-insert-delete-update demo
 (#1495)

---
 .../tree-grid-insert-delete-update-composition-api.vue | 10 ++++++----
 .../tree-table/tree-grid-insert-delete-update.spec.js  |  8 ++++++--
 .../grid/tree-table/tree-grid-insert-delete-update.vue |  7 +++++--
 3 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update-composition-api.vue b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update-composition-api.vue
index 64ef7d3ac..de557a4fc 100644
--- a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update-composition-api.vue
+++ b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update-composition-api.vue
@@ -18,9 +18,9 @@
           </template>
         </tiny-grid-toolbar>
       </template>
-      <tiny-grid-column type="selection" width="100" tree-node></tiny-grid-column>
+      <tiny-grid-column type="selection" width="100"></tiny-grid-column>
       <tiny-grid-column type="index" width="80"></tiny-grid-column>
-      <tiny-grid-column field="name" title="公司名称"></tiny-grid-column>
+      <tiny-grid-column field="name" title="公司名称" tree-node></tiny-grid-column>
       <tiny-grid-column field="area" title="区域" :editor="{ component: 'input', autoselect: true }"></tiny-grid-column>
       <tiny-grid-column
         field="employees"
@@ -92,7 +92,7 @@ function copy(nodes1, nodes2) {
 
   return res
 }
-
+const increaseId = ref(30)
 const tableData = ref([
   {
     id: '1',
@@ -206,9 +206,11 @@ function insertEvent() {
   const row = {
     name: '新数据',
     isNew: true,
+    id: String(increaseId.value++),
     children: [
       {
-        name: '新数据-child'
+        name: '新数据-child',
+        id: String(increaseId.value++)
       }
     ]
   }
diff --git a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.spec.js b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.spec.js
index 3bff9e92a..bdc3134db 100644
--- a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.spec.js
+++ b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.spec.js
@@ -10,7 +10,7 @@ test.describe('树表增删改功能', () => {
     await page.locator('.tiny-grid-toolbar').click()
     await page.getByRole('button', { name: '确定' }).click()
     await expect(page.getByRole('cell', { name: 'zzcd' })).toBeVisible()
-    await page.getByRole('row', { name: '1 新数据' }).locator('path').nth(1).click()
+    await page.getByRole('row', { name: '1 新数据' }).locator('.tiny-grid-checkbox__icon').first().click()
     await page.getByRole('button', { name: '移除选中' }).click()
     await expect(page.getByRole('cell', { name: 'zzcd' })).not.toBeVisible()
   })
@@ -18,7 +18,11 @@ test.describe('树表增删改功能', () => {
   test('树表修改测试', async ({ page }) => {
     page.on('pageerror', (exception) => expect(exception).toBeNull())
     await page.goto('grid-tree-table#tree-table-tree-grid-insert-delete-update')
-    await page.getByRole('row', { name: '2 WWWW科技YX公司 华南区 500' }).getByRole('img').first().click()
+    await page
+      .getByRole('row', { name: '2 WWWW科技YX公司 华南区 500' })
+      .locator('.tiny-grid-tree-wrapper')
+      .first()
+      .click()
     await page.getByRole('row', { name: '3 WWWW科技股份有限子公司 华南区 720' }).getByText('华南区').first().click()
     await page.getByRole('row', { name: '3 WWWW科技股份有限子公司 720' }).getByRole('textbox').first().click()
     await page.getByRole('row', { name: '3 WWWW科技股份有限子公司 720' }).getByRole('textbox').fill('华南区ee')
diff --git a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.vue b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.vue
index d9d479aa1..1634f5b12 100644
--- a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.vue
+++ b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-insert-delete-update.vue
@@ -18,9 +18,9 @@
           </template>
         </tiny-grid-toolbar>
       </template>
-      <tiny-grid-column type="selection" width="100" tree-node></tiny-grid-column>
+      <tiny-grid-column type="selection" width="100"></tiny-grid-column>
       <tiny-grid-column type="index" width="80"></tiny-grid-column>
-      <tiny-grid-column field="name" title="公司名称"></tiny-grid-column>
+      <tiny-grid-column field="name" title="公司名称" tree-node></tiny-grid-column>
       <tiny-grid-column field="area" title="区域" :editor="{ component: 'input', autoselect: true }"></tiny-grid-column>
       <tiny-grid-column
         field="employees"
@@ -95,6 +95,7 @@ export default {
   },
   data() {
     return {
+      increaseId: 30,
       tableData: [
         {
           id: '1',
@@ -209,8 +210,10 @@ export default {
       const row = {
         name: '新数据',
         isNew: true,
+        id: String(this.increaseId++),
         children: [
           {
+            id: String(this.increaseId++),
             name: '新数据-child'
           }
         ]