import { Page } from '@playwright/test';
import { DashboardPage } from './dashboard.page';

export class ReqPage extends DashboardPage {
    constructor(page: Page) {
        super(page);
    }

    get reqLoc() {
        return {
            inputSearch: this.genLoc(`//div[contains(@class, 'personal-search')]//input[@placeholder='Search...']`),
            msgNoCaseFound: this.genLoc(`//div[contains(text(),'No matching results found. Try again.') or contains(text(), 'Create a new request.')]`),
            pageTitle: this.genLoc(`//div[@id='root']//span[contains(text(), 'Requests')]`),
            nameResult: (caseName: number) => this.genLoc(`//table[contains(@class, 'table-business-client')]//a[contains(@class, 'cl-gray') and contains(text(), "${caseName}")]`),
            entriesDropdown: this.genLoc(`//input[@name="per_page"]`),
            pagingSummary: this.genLoc(`//p[@class="m-0 text-muted f-14 cl-gray info"]`),
            btnThreedot: this.genLoc(`//div[@class="cursor-pointer"]`),
            customizedColumnMenu: this.genLoc(`//span[contains(@class, 'dropdown-item') and normalize-space()='Customized Columns']`),
            modalCustomizedColumn: this.genLoc(`//div[contains(@class, 'modal-content') and .//h3[contains(text(),'Customized Columns')]]`),
            iconCloseModalCustomizedColumn: this.genLoc(`//div[contains(@class, 'modal-content')]//button[contains(@class, 'btn-close')]`),
            checkboxColumn: (columnLabel: string) =>
                this.genLoc(`//label[contains(., '${columnLabel}')]/preceding-sibling::input[@type='checkbox']`),
            btnApplyCustomizedColumn: this.genLoc(`//button[contains(text(),'Apply')]`),
            tableHeadingColumn: (name: string) =>
                this.genLoc(`//table//thead//th[contains(normalize-space(), '${name}')]`).first()
        };
    }

    async open() {
        await this.page.goto('/requests');
    }

    async fillReq(reqinfor: string) {
        await this.reqLoc.inputSearch.fill(reqinfor);
        await this.reqLoc.inputSearch.press('Enter')
    }

    selectEntriesPerPage = async (count: number) => {
        await this.reqLoc.entriesDropdown.fill(`${count}`);
        await this.reqLoc.entriesDropdown.press('Enter')
    };
}
