docs(grid): [grid] fix tree-grid-insert-delete-update demo (#1495)

This commit is contained in:
gimmyhehe 2024-03-18 19:17:21 +08:00 committed by GitHub
parent 3e02ac1eb4
commit 8523a35980
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 17 additions and 8 deletions

View File

@ -18,9 +18,9 @@
</template> </template>
</tiny-grid-toolbar> </tiny-grid-toolbar>
</template> </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 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="area" title="区域" :editor="{ component: 'input', autoselect: true }"></tiny-grid-column>
<tiny-grid-column <tiny-grid-column
field="employees" field="employees"
@ -92,7 +92,7 @@ function copy(nodes1, nodes2) {
return res return res
} }
const increaseId = ref(30)
const tableData = ref([ const tableData = ref([
{ {
id: '1', id: '1',
@ -206,9 +206,11 @@ function insertEvent() {
const row = { const row = {
name: '新数据', name: '新数据',
isNew: true, isNew: true,
id: String(increaseId.value++),
children: [ children: [
{ {
name: '新数据-child' name: '新数据-child',
id: String(increaseId.value++)
} }
] ]
} }

View File

@ -10,7 +10,7 @@ test.describe('树表增删改功能', () => {
await page.locator('.tiny-grid-toolbar').click() await page.locator('.tiny-grid-toolbar').click()
await page.getByRole('button', { name: '确定' }).click() await page.getByRole('button', { name: '确定' }).click()
await expect(page.getByRole('cell', { name: 'zzcd' })).toBeVisible() 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 page.getByRole('button', { name: '移除选中' }).click()
await expect(page.getByRole('cell', { name: 'zzcd' })).not.toBeVisible() await expect(page.getByRole('cell', { name: 'zzcd' })).not.toBeVisible()
}) })
@ -18,7 +18,11 @@ test.describe('树表增删改功能', () => {
test('树表修改测试', async ({ page }) => { test('树表修改测试', async ({ page }) => {
page.on('pageerror', (exception) => expect(exception).toBeNull()) page.on('pageerror', (exception) => expect(exception).toBeNull())
await page.goto('grid-tree-table#tree-table-tree-grid-insert-delete-update') 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' }).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').first().click()
await page.getByRole('row', { name: '3 WWWW科技股份有限子公司 720' }).getByRole('textbox').fill('华南区ee') await page.getByRole('row', { name: '3 WWWW科技股份有限子公司 720' }).getByRole('textbox').fill('华南区ee')

View File

@ -18,9 +18,9 @@
</template> </template>
</tiny-grid-toolbar> </tiny-grid-toolbar>
</template> </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 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="area" title="区域" :editor="{ component: 'input', autoselect: true }"></tiny-grid-column>
<tiny-grid-column <tiny-grid-column
field="employees" field="employees"
@ -95,6 +95,7 @@ export default {
}, },
data() { data() {
return { return {
increaseId: 30,
tableData: [ tableData: [
{ {
id: '1', id: '1',
@ -209,8 +210,10 @@ export default {
const row = { const row = {
name: '新数据', name: '新数据',
isNew: true, isNew: true,
id: String(this.increaseId++),
children: [ children: [
{ {
id: String(this.increaseId++),
name: '新数据-child' name: '新数据-child'
} }
] ]