hlk_autotest/tests/pages/report/reportPage.ts

import { expect, type Locator, type Page } from '@playwright/test';
import { waitSpecifyApiLoad } from '@/utils/utils.js';

type subReportPage = {
    name: string;
    url: string[];
};

export type reportData = {
    name: string;
    value?: number;
    lastValue?: number;
    index?: number;
    content?: reportDataInfo[];
};

export type reportDataInfo = {
    name: string;
    value: number;
    lastValue: number;
    index: number;
};

export class ReportPage {
    page: Page;
    private subPages: subReportPage[] = [
        { name: '业绩汇总表', url: ['/21'] },
        { name: '业绩明细表', url: ['/5'] },
        { name: '项目销耗存表', url: ['/22'] },
        { name: '销售消耗汇总表', url: ['/23'] },
        { name: '顾客消费分析表', url: ['/24'] },
        { name: '储值卡卡金变动表', url: ['/6'] },
        { name: '开支汇总表', url: ['/7'] },
        { name: '顾客分诊明细表', url: ['/101'] },
    ];
    private $closeCustomReportPage: Locator;
    private $closeRecommendReportPage: Locator;

    /**
     * 报表模块
     */
    constructor(page: Page) {
        this.page = page;
        this.$closeCustomReportPage = this.page
            .locator('div')
            .filter({ hasText: /^自定义报表$/ })
            .locator('svg');
        this.$closeRecommendReportPage = this.page
            .locator('div')
            .filter({ hasText: /^推荐报表$/ })
            .locator('svg');
    }

    /**
     * @param subPageName 报表名称
     * - 业绩汇总表
     * - 业绩明细表
     * - 项目销耗存表
     * - 销售消耗汇总表
     * - 顾客消费分析表
     * - 储值卡卡金变动表
     * - 开支汇总表
     * - 顾客分诊明细表
     */
    gotoSubPage = async (subPageName: string) => {
        const subPage = this.subPages.find(e => e.name === subPageName);
        if (!subPage) {
            throw new Error(`子页面 ${subPageName} 不存在`);
        }
        await Promise.all([
            this.page.locator('.m-report_recommend .item').filter({ hasText: subPage.name }).click(),
            waitSpecifyApiLoad(this.page, subPage.url),
        ]);
        await expect(this.page.locator('span').filter({ hasText: '推荐报表' })).toBeVisible();
    };

    /**
     * 关闭自定义表格
     */
    closeCustomReportPage = async () => {
        await this.$closeCustomReportPage.click();
    };

    /**
     * 关闭推荐表格
     */
    closeRecommendReportPage = async () => {
        await this.$closeRecommendReportPage.click();
    };

    /**
     * 对比报表历史数据
     * @param mainClassName 主类名称
     * @param secondaryClassName 次类名称
     * @param reportData 报表数据
     * @param expected 期望值
     */
    toBeReportDataAsExpected = (
        mainClassName: string,
        secondaryClassName: string,
        reportData: reportData[],
        expected: number,
    ) => {
        const mainClass = reportData.find(e => e.name === mainClassName);

        if (!mainClass) {
            throw new Error('mainClass值不对');
        }

        if (
            secondaryClassName === '' ||
            (mainClass?.content?.length === 0 && typeof mainClass.content === 'undefined')
        ) {
            if (mainClass.value === undefined || mainClass.lastValue === undefined) {
                throw new Error(`mainClass：${mainClassName} 的值或 lastValue 未定义`);
            }
            expect.soft(mainClass.value - mainClass.lastValue).toBe(expected);
        } else {
            if (!mainClass.content) {
                throw new Error(`mainClass：${mainClass.content}`);
            }
            const secondaryClass = mainClass.content.find(e => e.name === secondaryClassName);

            if (!secondaryClass) {
                throw new Error(`secondaryClass：${secondaryClassName}`);
            }

            expect.soft(secondaryClass.value! - secondaryClass.lastValue!).toBe(expected);
        }
    };

    /**
     * 打开自定义报表页面
     * @param subReportPageName
     * - 业绩汇总表
     * - 业绩明细表
     * - 项目销耗存表
     * - 销售消耗汇总表
     * - 顾客消费分析表
     * - 存储卡卡金变动表
     * - 开支汇总表
     * - 顾客分诊明细表
     */
    openCustomReportPage = async (subReportPageName: string) => {
        const subReportPage = this.subPages.find(e => e.name === subReportPageName);
        if (!subReportPage) {
            throw new Error(`子页面 ${subReportPageName} 不存在`);
        }

        await this.page
            .locator('.m-report_recommend .item')
            .filter({ hasText: `${subReportPageName}` })
            .locator('.opreate')
            .click();
    };

    /**
     * 删除自定义报表
     * @param reportName 自定义报表名称
     */
    deleteCustomReportPage = async (reportName: string) => {
        await this.page
            .locator('.m-report_custorm .item')
            .filter({ has: this.page.getByText(reportName) })
            .locator('.arrow')
            .click(); // 点击箭头
        await this.page.getByRole('menuitem', { name: '删除' }).click(); // 点击删除
        await this.page.getByRole('button', { name: /确\s认/ }).click(); // 点击确认
    };

    deleteAllCustomReportPage = async () => {
        const $$item = this.page.locator('.m-report_custorm .item');
        const itemsCount = await this.page.locator('.m-report_custorm .item').count(); // 获取所有符合条件的元素

        for (let i = 0; i < itemsCount; i++) {
            await $$item.first().locator('.arrow').click(); // 点击箭头
            await this.page.getByRole('menuitem', { name: '删除' }).click(); // 点击删除
            await this.page.getByRole('button', { name: /确\s认/ }).click(); // 点击确认
        }
    };
}