mini-starter/web/tests/e2e/specs/admin/order-create.spec.ts

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'));

/**
 * 辅助函数：在创建订单对话框中选择残疾人
 * @param page Playwright Page 对象
 * @returns 是否成功选择了残疾人
 */
async function selectDisabledPersonForOrder(page: Parameters<typeof test>[0]['prototype']): Promise<boolean> {
  // 点击"选择残疾人"按钮
  const selectPersonButton = page.getByRole('button', { name: '选择残疾人' });
  await selectPersonButton.click();

  // 等待残疾人选择对话框出现
  await page.waitForSelector('[role="dialog"]', { state: 'visible', timeout: 5000 });

  // 尝试选择第一个可用的残疾人
  let hasData = false;
  try {
    // 查找残疾人列表中的第一行复选框
    const firstCheckbox = page.locator('table tbody tr').first().locator('input[type="checkbox"]').first();
    await firstCheckbox.waitFor({ state: 'visible', timeout: 3000 });
    await firstCheckbox.check();
    console.debug('✓ 已选择第一个残疾人');
    hasData = true;
  } catch (error) {
    console.debug('没有可用的残疾人数据');
    hasData = false;
  }

  if (hasData) {
    // 有数据时，点击确认按钮关闭选择对话框
    const confirmButton = page.getByRole('button', { name: /^(确定|确认|选择)$/ });
    await confirmButton.click().catch(() => {
      console.debug('没有找到确认按钮，尝试关闭对话框');
      page.keyboard.press('Escape');
    });
  } else {
    // 没有数据时，关闭空对话框
    await page.keyboard.press('Escape').catch(() => {
      console.debug('无法关闭对话框，可能已经自动关闭');
    });
  }

  // 等待选择对话框关闭
  await page.waitForTimeout(500);

  return hasData;
}

test.describe.serial('创建订单测试', () => {
  test.beforeEach(async ({ adminLoginPage, orderManagementPage }) => {
    // 以管理员身份登录后台
    await adminLoginPage.goto();
    await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
    await adminLoginPage.expectLoginSuccess();
    await orderManagementPage.goto();
  });

  test.describe('基本创建订单', () => {
    test('应该能创建只填写必填字段的订单', async ({ orderManagementPage, page }) => {
      // 生成唯一订单名称
      const orderName = `测试订单_${Date.now()}`;

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写必填字段
      await page.getByLabel(/订单名称|名称/).fill(orderName);
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 选择残疾人（必填）
      const hasDisabledPerson = await selectDisabledPersonForOrder(page);

      if (hasDisabledPerson) {
        // 有残疾人数据时，提交表单并验证
        const result = await orderManagementPage.submitForm();

        // 验证创建成功
        expect(result.hasSuccess).toBe(true);
        expect(result.hasError).toBe(false);

        // 等待对话框关闭
        await orderManagementPage.waitForDialogClosed();

        // 验证订单出现在列表中
        await expect(async () => {
          const exists = await orderManagementPage.orderExists(orderName);
          expect(exists).toBe(true);
        }).toPass({ timeout: 5000 });
      } else {
        // 没有残疾人数据时，跳过测试验证
        // 注意：完整的订单创建流程需要残疾人数据
        console.debug('没有残疾人数据，跳过订单创建验证');
        await orderManagementPage.cancelDialog();
      }
    });

    test('应该显示创建成功的提示消息', async ({ orderManagementPage, page }) => {
      const orderName = `测试订单_${Date.now()}`;

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写必填字段
      await page.getByLabel(/订单名称|名称/).fill(orderName);
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 选择残疾人（必填）
      const hasDisabledPerson = await selectDisabledPersonForOrder(page);

      if (hasDisabledPerson) {
        // 有残疾人数据时，提交表单并验证成功消息
        const result = await orderManagementPage.submitForm();

        // 验证成功消息
        expect(result.successMessage).toBeDefined();
        expect(result.successMessage?.length).toBeGreaterThan(0);
        console.debug('创建订单成功消息:', result.successMessage);
      } else {
        // 没有数据时跳过验证
        console.debug('没有残疾人数据，跳过成功消息验证');
        await orderManagementPage.cancelDialog();
      }
    });
  });

  test.describe('创建订单并选择平台', () => {
    test('应该能创建订单时选择平台', async ({ orderManagementPage, page }) => {
      const orderName = `测试订单_平台_${Date.now()}`;

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写必填字段
      await page.getByLabel(/订单名称|名称/).fill(orderName);
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 选择平台（使用 selectRadixOption 工具）
      try {
        // 点击平台下拉框（通过文本定位）
        const platformTrigger = page.locator('[data-testid="platform-search-select"]');
        if (await platformTrigger.count() > 0) {
          await platformTrigger.click({ force: true });
          // 等待平台选项列表出现
          const platformOption = page.getByRole('option').first();
          await platformOption.waitFor({ state: 'visible', timeout: 3000 });
          // 选择第一个可用平台
          await platformOption.click();
        } else {
          console.debug('平台选择器未找到，跳过平台选择');
        }
      } catch (error) {
        console.debug('平台选择器无可用选项，跳过平台选择:', error);
      }

      // 选择残疾人（必填）
      const hasDisabledPerson = await selectDisabledPersonForOrder(page);

      if (hasDisabledPerson) {
        // 提交表单
        const result = await orderManagementPage.submitForm();

        // 验证创建成功
        expect(result.hasSuccess).toBe(true);
        expect(result.hasError).toBe(false);

        // 等待对话框关闭
        await orderManagementPage.waitForDialogClosed();

        // 验证订单出现在列表中
        await expect(async () => {
          const exists = await orderManagementPage.orderExists(orderName);
          expect(exists).toBe(true);
        }).toPass({ timeout: 5000 });
      } else {
        console.debug('没有残疾人数据，跳过平台选择测试验证');
      }
    });
  });

  test.describe('创建订单并选择公司', () => {
    test('应该能创建订单时选择公司', async ({ orderManagementPage, page }) => {
      const orderName = `测试订单_公司_${Date.now()}`;

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写必填字段
      await page.getByLabel(/订单名称|名称/).fill(orderName);
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 选择公司（使用 data-testid 定位）
      try {
        const companyTrigger = page.locator('[data-testid="company-search-select"]');
        if (await companyTrigger.count() > 0) {
          await companyTrigger.click({ force: true });
          // 等待公司选项列表出现
          const companyOption = page.getByRole('option').first();
          await companyOption.waitFor({ state: 'visible', timeout: 3000 });
          // 选择第一个可用公司
          await companyOption.click();
        } else {
          console.debug('公司选择器未找到，跳过公司选择');
        }
      } catch (error) {
        console.debug('公司选择器无可用选项，跳过公司选择:', error);
      }

      // 选择残疾人（必填）
      const hasDisabledPerson = await selectDisabledPersonForOrder(page);

      if (hasDisabledPerson) {
        // 提交表单
        const result = await orderManagementPage.submitForm();

        // 验证创建成功
        expect(result.hasSuccess).toBe(true);
        expect(result.hasError).toBe(false);

        // 等待对话框关闭
        await orderManagementPage.waitForDialogClosed();

        // 验证订单出现在列表中
        await expect(async () => {
          const exists = await orderManagementPage.orderExists(orderName);
          expect(exists).toBe(true);
        }).toPass({ timeout: 5000 });
      } else {
        console.debug('没有残疾人数据，跳过公司选择测试验证');
      }
    });
  });

  test.describe('创建订单并选择渠道', () => {
    test('应该能创建订单时选择渠道', async ({ orderManagementPage, page }) => {
      const orderName = `测试订单_渠道_${Date.now()}`;

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写必填字段
      await page.getByLabel(/订单名称|名称/).fill(orderName);
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 选择渠道（使用 data-testid 定位）
      try {
        const channelTrigger = page.locator('[data-testid="channel-search-select"]');
        if (await channelTrigger.count() > 0) {
          await channelTrigger.click({ force: true });
          // 等待渠道选项列表出现
          const channelOption = page.getByRole('option').first();
          await channelOption.waitFor({ state: 'visible', timeout: 3000 });
          // 选择第一个可用渠道
          await channelOption.click();
        } else {
          console.debug('渠道选择器未找到，跳过渠道选择');
        }
      } catch (error) {
        console.debug('渠道选择器无可用选项，跳过渠道选择:', error);
      }

      // 选择残疾人（必填）
      const hasDisabledPerson = await selectDisabledPersonForOrder(page);

      if (hasDisabledPerson) {
        // 提交表单
        const result = await orderManagementPage.submitForm();

        // 验证创建成功
        expect(result.hasSuccess).toBe(true);
        expect(result.hasError).toBe(false);

        // 等待对话框关闭
        await orderManagementPage.waitForDialogClosed();

        // 验证订单出现在列表中
        await expect(async () => {
          const exists = await orderManagementPage.orderExists(orderName);
          expect(exists).toBe(true);
        }).toPass({ timeout: 5000 });
      } else {
        console.debug('没有残疾人数据，跳过渠道选择测试验证');
      }
    });
  });

  test.describe('创建完整订单（所有字段）', () => {
    test('应该能填写所有字段创建订单', async ({ orderManagementPage, page }) => {
      const orderName = `测试订单_完整_${Date.now()}`;

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写所有字段
      await page.getByLabel(/订单名称|名称/).fill(orderName);
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 尝试选择平台
      try {
        const platformTrigger = page.locator('[data-testid="platform-search-select"]');
        if (await platformTrigger.count() > 0) {
          await platformTrigger.click({ force: true });
          const platformOption = page.getByRole('option').first();
          await platformOption.waitFor({ state: 'visible', timeout: 3000 });
          await platformOption.click();
        } else {
          console.debug('平台选择器未找到');
        }
      } catch {
        console.debug('平台选择器无可用选项');
      }

      // 尝试选择公司
      try {
        const companyTrigger = page.locator('[data-testid="company-search-select"]');
        if (await companyTrigger.count() > 0) {
          await companyTrigger.click({ force: true });
          const companyOption = page.getByRole('option').first();
          await companyOption.waitFor({ state: 'visible', timeout: 3000 });
          await companyOption.click();
        } else {
          console.debug('公司选择器未找到');
        }
      } catch {
        console.debug('公司选择器无可用选项');
      }

      // 尝试选择渠道
      try {
        const channelTrigger = page.locator('[data-testid="channel-search-select"]');
        if (await channelTrigger.count() > 0) {
          await channelTrigger.click({ force: true });
          const channelOption = page.getByRole('option').first();
          await channelOption.waitFor({ state: 'visible', timeout: 3000 });
          await channelOption.click();
        } else {
          console.debug('渠道选择器未找到');
        }
      } catch {
        console.debug('渠道选择器无可用选项');
      }

      // 选择残疾人（必填）
      const hasDisabledPerson = await selectDisabledPersonForOrder(page);

      if (hasDisabledPerson) {
        // 提交表单
        const result = await orderManagementPage.submitForm();

        // 验证创建成功
        expect(result.hasSuccess).toBe(true);
        expect(result.hasError).toBe(false);

        // 等待对话框关闭
        await orderManagementPage.waitForDialogClosed();

        // 验证订单出现在列表中
        await expect(async () => {
          const exists = await orderManagementPage.orderExists(orderName);
          expect(exists).toBe(true);
        }).toPass({ timeout: 5000 });
      } else {
        console.debug('没有残疾人数据，跳过完整订单测试验证');
      }
    });
  });

  test.describe('表单验证测试', () => {
    test('应该能尝试提交表单', async ({ orderManagementPage, page }) => {
      // 注意：这个测试验证表单提交的基本流程
      // 完整的订单创建需要残疾人数据

      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写基本字段
      await page.getByLabel(/订单名称|名称/).fill('表单验证测试');
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 验证对话框仍然打开（未提交）
      const dialog = page.locator('[role="dialog"]');
      await expect(dialog).toBeVisible();

      // 关闭对话框
      await orderManagementPage.cancelDialog();
    });

    test('应该能取消创建订单操作', async ({ orderManagementPage, page }) => {
      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写一些字段
      await page.getByLabel(/订单名称|名称/).fill('取消测试订单');
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 验证对话框是打开的
      const dialog = page.locator('[role="dialog"]');
      await expect(dialog).toBeVisible();

      // 取消对话框
      await orderManagementPage.cancelDialog();

      // 验证对话框已关闭
      await expect(dialog).not.toBeVisible();

      // 验证订单没有出现在列表中
      const exists = await orderManagementPage.orderExists('取消测试订单');
      expect(exists).toBe(false);
    });

    test('应该能通过关闭对话框取消创建', async ({ orderManagementPage, page }) => {
      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 填写一些字段
      await page.getByLabel(/订单名称|名称/).fill('关闭测试订单');
      await page.getByLabel(/预计开始日期|开始日期/).fill('2025-01-15');

      // 验证对话框是打开的
      const dialog = page.locator('[role="dialog"]');
      await expect(dialog).toBeVisible();

      // 点击对话框外的遮罩层或按 ESC 键关闭
      await page.keyboard.press('Escape');

      // 等待对话框关闭
      await orderManagementPage.waitForDialogClosed();

      // 验证订单没有出现在列表中
      const exists = await orderManagementPage.orderExists('关闭测试订单');
      expect(exists).toBe(false);
    });
  });

  test.describe('对话框元素验证', () => {
    test('应该显示创建订单对话框的所有字段', async ({ orderManagementPage, page }) => {
      // 打开创建对话框
      await orderManagementPage.openCreateDialog();

      // 验证对话框存在
      const dialog = page.locator('[role="dialog"]');
      await expect(dialog).toBeVisible();

      // 验证必填字段存在
      await expect(page.getByLabel(/订单名称|名称/)).toBeVisible();
      await expect(page.getByLabel(/预计开始日期|开始日期/)).toBeVisible();

      // 验证选择残疾人按钮存在
      await expect(page.getByRole('button', { name: '选择残疾人' })).toBeVisible();

      // 验证提示文本存在
      await expect(page.getByText(/创建订单时必须至少选择一名残疾人/)).toBeVisible();

      // 验证可选字段存在（在对话框内查找，使用 first() 避免匹配多个元素）
      await expect(dialog.getByText('平台').first()).toBeVisible();
      await expect(dialog.getByText('公司').first()).toBeVisible();
      await expect(dialog.getByText('渠道').first()).toBeVisible();

      // 验证按钮存在
      await expect(page.getByRole('button', { name: '创建' })).toBeVisible();
      await expect(page.getByRole('button', { name: '取消' })).toBeVisible();

      // 关闭对话框
      await orderManagementPage.cancelDialog();
    });
  });
});