import { test, expect } from '@playwright/test';
import { LoginPage } from './pages/LoginPage';
import { DictionaryManagementPage } from './pages/DictionaryManagementPage';

test.describe('字典管理E2E测试', () => {
  let loginPage: LoginPage;
  let dictPage: DictionaryManagementPage;

  test.beforeEach(async ({ page }) => {
    loginPage = new LoginPage(page);
    dictPage = new DictionaryManagementPage(page);

    await loginPage.goto();
    await loginPage.login('admin', 'admin123');
    await expect(page).toHaveURL(/.*dashboard/);
  });

  test.afterEach(async ({ page }) => {
    await loginPage.logout();
  });

  test('字典管理页面导航', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
      await expect(page).toHaveURL(/.*dict/);
    });

    await test.step('验证页面元素可见', async () => {
      await expect(dictPage.table).toBeVisible();
      await expect(dictPage.addButton).toBeVisible();
      await expect(dictPage.searchInput).toBeVisible();
    });
  });

  test('创建字典类型', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('创建新字典类型', async () => {
      const dictName = `测试字典_${Date.now()}`;
      const dictType = `TEST_DICT_${Date.now()}`;
      
      await dictPage.addDictionary(dictName, dictType);
      
      await dictPage.verifyTableContains(dictName);
    });
  });

  test('编辑字典类型', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('编辑现有字典类型', async () => {
      const oldName = '用户状态';
      const newName = `用户状态_已修改_${Date.now()}`;
      
      await dictPage.editDictionary(oldName, newName);
      
      await dictPage.verifyTableContains(newName);
    });
  });

  test('删除字典类型', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('删除字典类型', async () => {
      const dictName = `测试字典_${Date.now()}`;
      const dictType = `TEST_DICT_${Date.now()}`;
      
      await dictPage.addDictionary(dictName, dictType);
      await dictPage.verifyTableContains(dictName);
      
      await dictPage.deleteDictionary(dictType);
      await dictPage.verifyTableNotContains(dictName);
    });
  });

  test('搜索字典类型', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('搜索字典类型', async () => {
      const dictName = '用户状态';
      
      await dictPage.searchDictionary(dictName);
      await dictPage.verifyTableContains(dictName);
    });

    await test.step('清除搜索', async () => {
      await dictPage.clearSearch();
      const rowCount = await dictPage.getTableRowCount();
      expect(rowCount).toBeGreaterThan(0);
    });
  });

  test('字典管理分页功能', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('验证表格数据加载', async () => {
      const rowCount = await dictPage.getTableRowCount();
      expect(rowCount).toBeGreaterThan(0);
    });
  });

  test('字典管理响应式布局', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('验证桌面端布局', async () => {
      await page.setViewportSize({ width: 1280, height: 720 });
      await expect(dictPage.table).toBeVisible();
      await expect(dictPage.addButton).toBeVisible();
    });

    await test.step('验证平板端布局', async () => {
      await page.setViewportSize({ width: 768, height: 1024 });
      await expect(dictPage.table).toBeVisible();
      await expect(dictPage.addButton).toBeVisible();
    });

    await test.step('验证移动端布局', async () => {
      await page.setViewportSize({ width: 375, height: 667 });
      await expect(dictPage.table).toBeVisible();
    });
  });

  test('字典管理权限验证', async ({ page }) => {
    await test.step('导航到字典管理页面', async () => {
      await dictPage.goto();
    });

    await test.step('验证添加按钮可见性', async () => {
      await expect(dictPage.addButton).toBeVisible();
    });

    await test.step('验证编辑和删除按钮可见性', async () => {
      const rows = await dictPage.table.locator('.el-table__row').count();
      if (rows > 0) {
        await expect(dictPage.table).toBeVisible();
      }
    });
  });
});