mini-starter/web/tests/e2e/specs/admin/disability-person-company-query-enhanced.spec.ts

import { TIMEOUTS } from '../../utils/timeouts';
import { test, expect } from '../../utils/test-setup';
import { readFileSync } from 'fs';
import { join, dirname } from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const testUsers = JSON.parse(readFileSync(join(__dirname, '../../fixtures/test-users.json'), 'utf-8'));

/**
 * Story 15.3: 残疾人企业查询页面完善
 *
 * 验收标准:
 * 1. 页面包含"平台"筛选下拉框
 * 2. 平台下拉框包含所有可用平台选项
 * 3. 表格列与需求一致（姓名、性别、身份证号、残疾类别、残疾等级、所属企业、入职日期）
 * 4. 用户可以选择平台进行筛选
 * 5. 筛选后表格显示对应平台的残疾人信息
 * 6. 平台筛选与其他筛选条件可以组合使用
 * 7. 重置筛选条件功能正常工作
 */

test.describe('残疾人企业查询页面功能测试', () => {
  const PAGE_PATH = '/admin/disability-person-company-query';

  test.beforeEach(async ({ adminLoginPage, page }) => {
    await adminLoginPage.goto();
    await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
    await adminLoginPage.expectLoginSuccess();
    await page.goto(PAGE_PATH);
    // 等待页面加载完成
    await page.waitForSelector('[data-testid="disability-person-company-query"]', { timeout: TIMEOUTS.PAGE_LOAD });
  });

  test.describe('AC1: 页面包含平台筛选下拉框', () => {
    test('应该显示平台筛选条件', async ({ page }) => {
      console.debug('\n========== 测试：验证平台筛选条件存在 ==========');

      // 验证平台筛选 Label 存在 (使用 locator 精确定位)
      const platformLabel = page.locator('[data-testid="disability-person-company-query"]').getByText('平台', { exact: true });
      await expect(platformLabel).toBeVisible({ timeout: TIMEOUTS.ELEMENT_VISIBLE_SHORT });
      console.debug('✓ 平台筛选 Label 可见');

      // 验证平台筛选器组件存在
      const platformFilter = page.getByTestId('platform-filter');
      await expect(platformFilter).toBeVisible({ timeout: TIMEOUTS.ELEMENT_VISIBLE_SHORT });
      console.debug('✓ 平台筛选组件可见');

      console.debug('✅ 测试通过：平台筛选条件存在');
    });

    test('平台下拉框应该包含"全部平台"占位符', async ({ page }) => {
      console.debug('\n========== 测试：验证平台筛选占位符 ==========');

      const platformFilter = page.getByTestId('platform-filter');
      await expect(platformFilter).toBeVisible({ timeout: TIMEOUTS.ELEMENT_VISIBLE_SHORT });

      // 检查显示文本（Shadcn UI Select 在 generic 元素中显示占位符）
      const displayedText = await platformFilter.textContent();
      expect(displayedText).toContain('全部平台');
      console.debug('✓ 平台占位符文本正确:', displayedText);

      console.debug('✅ 测试通过：平台筛选占位符正确');
    });
  });

  test.describe('AC3: 表格列与需求一致', () => {
    test('表格应该包含所有必需的列', async ({ page }) => {
      console.debug('\n========== 测试：验证表格列定义 ==========');

      const table = page.getByTestId('results-table');
      await expect(table).toBeVisible();

      // 验证表头包含所有必需的列
      // 表格使用 cell role 而非 columnheader，所以使用 cell 来查找
      const expectedColumns = ['姓名', '性别', '身份证号', '残疾类别', '残疾等级', '所属企业', '入职日期'];

      for (const column of expectedColumns) {
        const header = table.getByRole('cell').filter({ hasText: column });
        await expect(header).toBeVisible();
        console.debug(`✓ 表格列可见: ${column}`);
      }

      // 验证列数量正确（获取第一行所有 cell）
      const firstRow = table.getByRole('row').first();
      const cells = firstRow.getByRole('cell');
      const cellCount = await cells.count();
      expect(cellCount).toBe(7);
      console.debug(`✓ 表格列总数正确: ${cellCount}`);

      console.debug('✅ 测试通过：表格列定义正确');
    });

    test('表格数据行应该包含所有字段', async ({ page }) => {
      console.debug('\n========== 测试：验证表格数据显示 ==========');

      const table = page.getByTestId('results-table');
      await expect(table).toBeVisible();

      // 等待数据加载
      await page.waitForTimeout(TIMEOUTS.SHORT);

      // 检查是否有数据
      const noDataRow = table.getByTestId('no-data-row');
      const hasData = await noDataRow.count() === 0;

      if (hasData) {
        // 获取第一行数据
        const firstRow = table.getByRole('row').nth(1); // 跳过表头
        const cells = firstRow.getByRole('cell');

        // 验证单元格数量
        const cellCount = await cells.count();
        expect(cellCount).toBe(7);
        console.debug(`✓ 数据行单元格数量正确: ${cellCount}`);

        // 验证入职日期格式（如果有数据）
        const joinDateCell = cells.nth(6); // 入职日期列
        const joinDateText = await joinDateCell.textContent();

        if (joinDateText && joinDateText !== '-') {
          // 验证日期格式 (例如：2026/1/20)
          const datePattern = /\d{4}\/\d{1,2}\/\d{1,2}/;
          expect(joinDateText).toMatch(datePattern);
          console.debug('✓ 入职日期格式正确:', joinDateText);
        }
      } else {
        console.debug('ℹ️ 当前无测试数据，跳过数据行验证');
      }

      console.debug('✅ 测试通过：表格数据显示正确');
    });
  });

  test.describe('AC4: 用户可以选择平台进行筛选', () => {
    test('应该能够选择平台筛选器', async ({ page }) => {
      console.debug('\n========== 测试：选择平台筛选器 ==========');

      const platformFilter = page.getByTestId('platform-filter');
      await expect(platformFilter).toBeVisible();

      // 点击平台筛选器打开下拉框
      await platformFilter.click();
      console.debug('✓ 平台筛选器已点击');

      // 等待下拉选项出现
      await page.waitForTimeout(TIMEOUTS.VERY_SHORT);

      // 检查是否有平台选项（如果有平台数据）
      const firstOption = page.getByRole('option').first();
      const hasOptions = await firstOption.count() > 0;

      if (hasOptions) {
        const optionText = await firstOption.textContent();
        console.debug('✓ 平台选项存在:', optionText);

        // 选择第一个平台
        await firstOption.click();
        console.debug('✓ 已选择平台');

        // 等待筛选生效
        await page.waitForTimeout(TIMEOUTS.VERY_SHORT);
      } else {
        console.debug('ℹ️ 当前无平台数据，跳过选项选择');
      }

      console.debug('✅ 测试通过：平台筛选器可交互');
    });
  });

  test.describe('AC5: 筛选后表格显示对应平台的残疾人信息', () => {
    test('选择平台后应该显示筛选结果', async ({ page }) => {
      console.debug('\n========== 测试：筛选结果验证 ==========');

      const platformFilter = page.getByTestId('platform-filter');
      const searchButton = page.getByTestId('search-button');
      const table = page.getByTestId('results-table');

      // 先获取初始行数
      await page.waitForTimeout(TIMEOUTS.SHORT);
      const initialRows = await table.getByRole('row').count();
      console.debug('初始数据行数:', initialRows);

      // 尝试选择平台
      await platformFilter.click();
      await page.waitForTimeout(TIMEOUTS.VERY_SHORT);

      const firstOption = page.getByRole('option').first();
      const hasOptions = await firstOption.count() > 0;

      if (hasOptions) {
        await firstOption.click();
        console.debug('✓ 已选择平台');

        // 点击查询按钮
        await searchButton.click();
        console.debug('✓ 查询按钮已点击');

        // 等待结果更新
        await page.waitForTimeout(TIMEOUTS.SHORT);

        // 验证表格仍然可见
        await expect(table).toBeVisible();
        console.debug('✓ 筛选后表格仍然可见');

        // 获取筛选后的行数
        const filteredRows = await table.getByRole('row').count();
        console.debug('筛选后数据行数:', filteredRows);
      } else {
        console.debug('ℹ️ 当前无平台数据，跳过筛选验证');
      }

      console.debug('✅ 测试通过：筛选功能正常工作');
    });
  });

  test.describe('AC6: 平台筛选与其他筛选条件组合使用', () => {
    test('平台筛选和性别筛选应该能组合使用', async ({ page }) => {
      console.debug('\n========== 测试：组合筛选验证 ==========');

      const platformFilter = page.getByTestId('platform-filter');
      const genderFilter = page.getByTestId('gender-filter');
      const searchButton = page.getByTestId('search-button');

      // 尝试设置组合筛选条件
      await platformFilter.click();
      await page.waitForTimeout(TIMEOUTS.VERY_SHORT);

      const hasPlatformOptions = await page.getByRole('option').count() > 0;

      if (hasPlatformOptions) {
        // 选择第一个平台
        await page.getByRole('option').first().click();
        console.debug('✓ 已选择平台');

        // 选择性别
        await genderFilter.click();
        await page.waitForTimeout(TIMEOUTS.VERY_SHORT);
        await page.getByRole('option', { name: '男' }).click();
        console.debug('✓ 已选择性别: 男');

        // 点击查询
        await searchButton.click();
        console.debug('✓ 查询按钮已点击');

        // 等待结果
        await page.waitForTimeout(TIMEOUTS.SHORT);

        console.debug('✅ 测试通过：组合筛选功能正常');
      } else {
        console.debug('ℹ️ 当前无平台数据，跳过组合筛选验证');
      }
    });
  });

  test.describe('AC7: 重置筛选条件功能', () => {
    test('点击重置按钮应该清空所有筛选条件', async ({ page }) => {
      console.debug('\n========== 测试：重置筛选条件 ==========');

      const platformFilter = page.getByTestId('platform-filter');
      const genderFilter = page.getByTestId('gender-filter');
      const resetButton = page.getByTestId('reset-button');

      // 先设置一些筛选条件
      await genderFilter.click();
      await page.waitForTimeout(TIMEOUTS.VERY_SHORT);
      await page.getByRole('option', { name: '女' }).click();
      console.debug('✓ 已选择性别: 女');

      await platformFilter.click();
      await page.waitForTimeout(TIMEOUTS.VERY_SHORT);

      const hasPlatformOptions = await page.getByRole('option').count() > 0;

      if (hasPlatformOptions) {
        await page.getByRole('option').first().click();
        console.debug('✓ 已选择平台');
      }

      // 点击重置按钮
      await resetButton.click();
      console.debug('✓ 重置按钮已点击');

      // 等待重置生效
      await page.waitForTimeout(TIMEOUTS.SHORT);

      // 验证性别筛选已重置（应该显示"全部"）
      await genderFilter.click();
      await page.waitForTimeout(TIMEOUTS.VERY_SHORT);
      const allOption = page.getByRole('option', { name: '全部' });
      await expect(allOption).toHaveAttribute('data-state', 'checked');
      console.debug('✓ 性别筛选已重置');

      console.debug('✅ 测试通过：重置筛选条件功能正常');
    });
  });

  test.describe('导出数据功能验证', () => {
    test('导出按钮应该在有数据时可点击', async ({ page }) => {
      console.debug('\n========== 测试：导出功能验证 ==========');

      const exportButton = page.getByTestId('export-button');
      await expect(exportButton).toBeVisible();
      console.debug('✓ 导出按钮可见');

      // 等待数据加载
      await page.waitForTimeout(TIMEOUTS.SHORT);

      // 检查按钮状态
      const isDisabled = await exportButton.isDisabled();
      console.debug('导出按钮禁用状态:', isDisabled);

      console.debug('✅ 测试通过：导出功能正常');
    });
  });
});