import { Page, Locator, expect } from '@playwright/test'; export class RoleManagementPage { readonly page: Page; readonly table: Locator; readonly createRoleButton: Locator; readonly refreshButton: Locator; readonly successMessage: Locator; readonly errorMessage: Locator; readonly pagination: Locator; constructor(page: Page) { this.page = page; this.table = page.locator('.ant-table').first(); this.createRoleButton = page.getByRole('button', { name: '新增角色' }); this.refreshButton = page.getByRole('button', { name: '刷新' }); this.successMessage = page.locator('.ant-message-success'); this.errorMessage = page.locator('.ant-message-error'); this.pagination = page.locator('.ant-pagination'); } async goto() { await this.page.goto('/roles'); await this.page.waitForLoadState('networkidle'); await this.table.waitFor({ state: 'visible', timeout: 15000 }).catch(() => {}); await expect(this.page).toHaveURL(/.*roles/); } async waitForTableReady() { await this.table.waitFor({ state: 'visible', timeout: 10000 }); await this.page.waitForFunction( () => document.querySelectorAll('.ant-table-tbody > tr').length > 0, { timeout: 5000 } ).catch(() => {}); } async clickCreateRole() { await this.createRoleButton.click(); await this.page.waitForTimeout(500); } async fillRoleForm(roleData: { roleName: string; roleKey: string; roleSort?: number; status?: string; }) { const modal = this.page.locator('.ant-modal').filter({ hasText: /新增角色|编辑角色/ }); await modal.locator('.ant-form-item').filter({ hasText: '角色名称' }).locator('input').fill(roleData.roleName); await modal.locator('.ant-form-item').filter({ hasText: '角色标识' }).locator('input').fill(roleData.roleKey); if (roleData.roleSort !== undefined) { const sortInput = modal.locator('.ant-form-item').filter({ hasText: '排序' }).locator('.ant-input-number input'); await sortInput.clear(); await sortInput.fill(String(roleData.roleSort)); } if (roleData.status) { const statusSelect = modal.locator('.ant-form-item').filter({ hasText: '状态' }).locator('.ant-select'); await statusSelect.click(); await this.page.waitForTimeout(300); const statusText = roleData.status === 'ACTIVE' ? '正常' : '禁用'; await this.page.locator('.ant-select-dropdown').locator('.ant-select-item').filter({ hasText: statusText }).first().click(); } } async selectPermissions(permissionLabels: string[]) { const modal = this.page.locator('.ant-modal').filter({ hasText: /新增角色|编辑角色/ }); const treeSelect = modal.locator('.ant-form-item').filter({ hasText: '权限' }).locator('.ant-tree-select'); await treeSelect.click(); await this.page.waitForTimeout(300); for (const label of permissionLabels) { const checkbox = this.page.locator('.ant-tree-select-dropdown .ant-tree-treenode').filter({ hasText: label }).locator('.ant-tree-checkbox'); if (await checkbox.count() > 0 && !(await checkbox.isChecked())) { await checkbox.click(); } } } async submitForm() { const modal = this.page.locator('.ant-modal').filter({ hasText: /新增角色|编辑角色/ }); await modal.getByRole('button', { name: /确\s*定/ }).click(); await this.page.waitForTimeout(1000); } async cancelForm() { const modal = this.page.locator('.ant-modal').filter({ hasText: /新增角色|编辑角色/ }); await modal.getByRole('button', { name: /取\s*消/ }).click(); } async editRole(rowNumber: number) { const row = this.table.locator('tbody tr').nth(rowNumber - 1); await row.locator('.ant-btn').filter({ has: this.page.locator('.anticon-edit') }).click(); await this.page.waitForTimeout(500); } async deleteRole(rowNumber: number) { const row = this.table.locator('tbody tr').nth(rowNumber - 1); await row.locator('.ant-btn').filter({ has: this.page.locator('.anticon-delete') }).click(); await this.page.waitForTimeout(300); } async confirmDelete() { await this.page.locator('.ant-popconfirm').getByRole('button', { name: /确\s*定/ }).click(); await this.page.waitForTimeout(1000); } async cancelDelete() { await this.page.locator('.ant-popconfirm').getByRole('button', { name: /取\s*消/ }).click(); } async waitForSuccessMessage(timeout = 10000): Promise { try { await this.successMessage.waitFor({ state: 'visible', timeout }); return true; } catch { return false; } } async getRoleCount(): Promise { return this.table.locator('tbody tr').count(); } async containsText(text: string): Promise { return this.table.getByText(text).count() > 0; } async reload() { await this.refreshButton.click(); await this.page.waitForLoadState('networkidle'); } }