import { test, expect } from '@playwright/test'

test.describe('紫微排盘功能E2E测试', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto('/#/pages/ziwei/index')
    await page.waitForLoadState('networkidle')
  })

  test.describe('TC-ZIWEI-001: 排盘表单', () => {
    test('应该显示出生信息表单', async ({ page }) => {
      const birthForm = page.locator('[data-test="birth-form"]')
      await expect(birthForm).toBeVisible()
    })

    test('应该显示排盘按钮', async ({ page }) => {
      const generateBtn = page.locator('[data-test="generate-btn"]')
      await expect(generateBtn).toBeVisible()
    })

    test('未选择日期时排盘按钮应可点击但不执行', async ({ page }) => {
      const generateBtn = page.locator('[data-test="generate-btn"]')
      await expect(generateBtn).toBeVisible()
      await generateBtn.click()
      const chartResult = page.locator('.chart-result')
      await expect(chartResult).not.toBeVisible()
    })
  })

  test.describe('TC-ZIWEI-002: 排盘流程', () => {
    test('应该能够选择出生日期并排盘', async ({ page }) => {
      const picker = page.locator('picker').first()
      await picker.click()
      await page.waitForTimeout(500)

      const dateInput = page.locator('input[type="date"], .picker-value').first()
      if (await dateInput.isVisible()) {
        await dateInput.fill('1990-01-15')
      }

      const generateBtn = page.locator('[data-test="generate-btn"]')
      await generateBtn.click()
      await page.waitForTimeout(2000)

      const chartResult = page.locator('.chart-result')
      const isVisible = await chartResult.isVisible().catch(() => false)
      if (isVisible) {
        await expect(chartResult).toBeVisible()
      }
    })

    test('排盘后应该显示宫位卡片', async ({ page }) => {
      const picker = page.locator('picker').first()
      await picker.click()
      await page.waitForTimeout(500)

      const dateInput = page.locator('input[type="date"], .picker-value').first()
      if (await dateInput.isVisible()) {
        await dateInput.fill('1990-06-20')
      }

      const generateBtn = page.locator('[data-test="generate-btn"]')
      await generateBtn.click()
      await page.waitForTimeout(2000)

      const palaceCards = page.locator('.palace-card')
      const count = await palaceCards.count()
      if (count > 0) {
        expect(count).toBeGreaterThan(0)
      }
    })

    test('排盘后应该显示三方四正分析', async ({ page }) => {
      const picker = page.locator('picker').first()
      await picker.click()
      await page.waitForTimeout(500)

      const dateInput = page.locator('input[type="date"], .picker-value').first()
      if (await dateInput.isVisible()) {
        await dateInput.fill('1985-03-10')
      }

      const generateBtn = page.locator('[data-test="generate-btn"]')
      await generateBtn.click()
      await page.waitForTimeout(2000)

      const analysisSection = page.locator('.analysis-section')
      const isVisible = await analysisSection.isVisible().catch(() => false)
      if (isVisible) {
        await expect(analysisSection).toBeVisible()
      }
    })
  })

  test.describe('TC-ZIWEI-003: 性别切换', () => {
    test('应该能够切换性别', async ({ page }) => {
      const femaleOption = page.locator('.gender-option:has-text("女")')
      await femaleOption.click()
      await expect(femaleOption).toHaveClass(/active/)

      const maleOption = page.locator('.gender-option:has-text("男")')
      await maleOption.click()
      await expect(maleOption).toHaveClass(/active/)
    })
  })

  test.describe('TC-ZIWEI-004: 响应式设计', () => {
    test('移动端应该正常显示', async ({ page }) => {
      await page.setViewportSize({ width: 375, height: 667 })
      await page.reload()
      await page.waitForLoadState('networkidle')

      const birthForm = page.locator('[data-test="birth-form"]')
      await expect(birthForm).toBeVisible()
    })

    test('桌面端应该正常显示', async ({ page }) => {
      await page.setViewportSize({ width: 1920, height: 1080 })
      await page.reload()
      await page.waitForLoadState('networkidle')

      const birthForm = page.locator('[data-test="birth-form"]')
      await expect(birthForm).toBeVisible()
    })
  })
})