import { Page, Locator } from '@playwright/test';
import { BasePage } from './BasePage';

export class AboutPage extends BasePage {
  readonly page: Page;

  constructor(page: Page) {
    super(page);
    this.page = page;
  }

  get breadcrumb(): Locator {
    return this.page.locator('nav[aria-label="breadcrumb"]');
  }

  get pageHeader(): Locator {
    return this.page.locator('h1');
  }

  get valuesSection(): Locator {
    return this.page.locator('div:has(h2:has-text("核心价值观"))').first();
  }

  get milestonesSection(): Locator {
    return this.page.locator('div:has(h2:has-text("发展历程"))').first();
  }

  get contactSection(): Locator {
    return this.page.locator('div:has(h2:has-text("联系我们"))').first();
  }

  get statCards(): Locator {
    return this.page.locator('[class*="text-3xl"][class*="text-[#C41E3A]"]');
  }

  async navigateToAbout(): Promise<void> {
    await this.navigate('/about');
  }

  async verifyBreadcrumb(): Promise<boolean> {
    return await this.breadcrumb.isVisible();
  }

  async verifyPageHeader(): Promise<boolean> {
    const header = await this.pageHeader.textContent();
    return header?.includes('关于我们') || false;
  }

  async verifyValuesSection(): Promise<boolean> {
    return await this.valuesSection.isVisible();
  }

  async verifyMilestonesSection(): Promise<boolean> {
    return await this.milestonesSection.isVisible();
  }

  async verifyContactSection(): Promise<boolean> {
    return await this.contactSection.isVisible();
  }

  async getStatValues(): Promise<string[]> {
    const stats = await this.statCards.allTextContents();
    return stats;
  }

  async scrollToValuesSection(): Promise<void> {
    await this.scrollToElement(this.valuesSection);
  }

  async scrollToMilestonesSection(): Promise<void> {
    await this.scrollToElement(this.milestonesSection);
  }

  async scrollToContactSection(): Promise<void> {
    await this.scrollToElement(this.contactSection);
  }
}