// @ts-check
import { faker } from '@faker-js/faker/locale/zh_CN';
import { test, expect } from '@/fixtures/boss_common.js';
import { staffData } from '@/common/staff';
import { AppointmentOperation } from '@/pages/appointmentPage';
import { getNextAppointmentTime } from '@/utils/timeUtils';

test('使用预约单元格', async ({
                                  page,
                                  homeNavigation,
                                  createCustomer,
                                  appointmentPage,
                                  customerPage,
                                  popupContent,
                              }) => {
    const employee = staffData.firstStore.firstSector.employee_1;
    const appointmentTime = getNextAppointmentTime();
    const customer = createCustomer;

    /** 当前可预约时间定位器 */
    const $time = page.locator('.times_table td').filter({ hasText: appointmentTime });
    /** 顾客预约定位器 */
    const $customerAppointment = page.locator('.a_userInfo').filter({ hasText: customer.phone }).filter({ hasText: customer.username });

    await test.step('进行未指定预约', async () => {
        await homeNavigation.gotoModule('预约');

        // 将时间盒子滚动到当前窗口可见
        await page.getByRole('button', { name: /设\s置/ }).waitFor();
        await $time.scrollIntoViewIfNeeded();

        // 打开未指定预约单元格
        await appointmentPage.openAppointmentCell('未指定');
        // 新建预约
        await appointmentPage.operationAppointment(AppointmentOperation.ADD_APPOINT);
        // 选择顾客A
        await customerPage.searchCustomer(customer.phone);
        await customerPage.selectSearchCustomer(customer.phone);

        // 确认新建预约
        await page.getByRole('button', { name: '确认新建' }).click();
        await $customerAppointment.waitFor();
        await appointmentPage.openAppointmentDetail(customer.phone);
        await expect(page.getByText('未到店', { exact: true })).toBeVisible();
        await appointmentPage.closeAppointmentDetail();
    });

    await test.step('取消未指定预约', async () => {
        // 打开未指定预约单元格
        await appointmentPage.openAppointmentDetail(customer.phone);
        await page.getByRole('button', { name: '取消预约' }).click();
        await popupContent.confirm();
        await expect($customerAppointment).not.toBeVisible();
    });

    await test.step('指定员工进行预约', async () => {
        // 打开预约选择窗口
        await appointmentPage.openAppointmentCell(employee.name);

        // 新建预约
        await appointmentPage.operationAppointment(AppointmentOperation.ADD_APPOINT);
        await customerPage.searchCustomer(customer.phone);
        await customerPage.selectSearchCustomer(customer.phone);

        // 在预约窗口确认顾客信息
        await expect(page.locator('div.name_box div.phone')).toContainText(customer.phone);
        await expect(page.locator('div.user_box')).toContainText(employee.name);

        // 判断新建预约成功
        await page.getByRole('button', { name: '确认新建' }).click();
        await expect($customerAppointment).toBeVisible();
        await appointmentPage.openAppointmentDetail(customer.phone);
        await expect(page.locator('div.state')).toContainText('未到店');
        await page.getByRole('button', { name: '取消预约' }).click();
        await popupContent.confirm();
        await expect($customerAppointment).not.toBeVisible();
    });
});

test('占用预约单元格', async ({
                                  page,
                                  homeNavigation,
                                  createCustomer,
                                  appointmentPage,
                                  customerPage,
                                  popupContent,
                              }) => {
    // 获取当前可预约时间
    let appointmentTime = getNextAppointmentTime();
    // 创建顾客
    const customer = createCustomer;
    // 员工王芳
    const employee = staffData.firstStore.firstSector.employee_3;
    // 占用单元格备注
    const remark = '占用预约单元格' + faker.string.alpha(2);
    // 当前可预约时间定位器
    const $time = page.locator('.times_table td').filter({ hasText: appointmentTime });
    // 员工定位器
    const $employee = page.locator('.room_table .tr .name_th').filter({ hasText: employee.name });
    // 顾客预约定位器
    const $customerAppointment = page
        .locator('.a_userInfo')
        .filter({ hasText: customer.phone })
        .filter({ hasText: customer.username });
    const $$occupy = page.locator('.occupy');

    await test.step('占用单元格', async () => {
        // 进入预约模块
        await homeNavigation.gotoModule('预约');
        // 窗口滚动到员工、预约时间可见
        await $time.scrollIntoViewIfNeeded();
        await $employee.scrollIntoViewIfNeeded();
        // 长按目标位置
        await appointmentPage.openAppointmentCell(employee.name);
        // 进行占用单元格
        await appointmentPage.operationAppointment(AppointmentOperation.ADD_OCCUPY);
        // 占用成功
        await expect(page.locator('div.ant-message', { hasText: '占用成功' })).toBeVisible();
        await expect($$occupy.filter({ hasText: '占用' }).last()).toBeVisible();
    });

    await test.step('备注占用单元格', async () => {
        // 特殊等待，页面内容已变化，但是去操作时，变为上一个状态，只能等待再去操作
        await page.waitForTimeout(2000);
        // 打开占用操作窗口
        await $$occupy.filter({ hasText: '占用' }).last().click();
        // 进入添加备注
        await appointmentPage.operationAppointment(AppointmentOperation.ADD_REMARK);
        // 进行添加备注，确认添加备注成功
        await page.getByPlaceholder('请输入备注').fill(remark);
        await Promise.all([
            page.waitForResponse(res => res.url().includes('/reservation_num') && res.status() === 200),
            popupContent.confirm(),
        ]);
        // 判断备注后的单元格存在
        await expect($$occupy.filter({ hasText: remark })).toBeVisible();
    });

    await test.step('取消占用单元格', async () => {
        // 打开占用操作窗口
        await $$occupy.filter({ hasText: remark }).click();
        // 取消占用
        await appointmentPage.operationAppointment(AppointmentOperation.CANCEL_OCCUPY);
        // 判断取消占用成功
        await Promise.all([
            page.waitForResponse(res => res.url().includes('/reservation_num') && res.status() === 200),
            popupContent.confirm(),
        ]);
        await expect($$occupy.filter({ hasText: remark })).not.toBeVisible();
    });

    await test.step('取消占用后，能够进行预约', async () => {
        // 重新选择员工王芳，进行预约单元格
        await $employee.scrollIntoViewIfNeeded();
        await $time.scrollIntoViewIfNeeded();

        // 打开预约单元格
        await appointmentPage.openAppointmentCell(employee.name);

        // 选择顾客去创建预约
        await expect(async () => {
            await appointmentPage.operationAppointment(AppointmentOperation.ADD_APPOINT);
            await page.getByText('选择会员').waitFor({ timeout: 2000 });
        }).toPass();
        await customerPage.searchCustomer(customer.phone);
        await customerPage.selectSearchCustomer(customer.phone);

        // 在预约窗口确认顾客信息
        await expect(page.locator('div.name_box div.phone')).toContainText(customer.phone);
        await expect(page.locator('div.user_box')).toContainText(employee.name);
        // 新建后，确认新建成功
        await page.getByRole('button', { name: '确认新建' }).click();
        await expect($customerAppointment).toBeVisible();
        await appointmentPage.openAppointmentDetail(customer.phone);
        await page.getByRole('button', { name: '取消预约' }).click();
        await popupContent.confirm();
        await expect($customerAppointment).not.toBeVisible();
    });
});

test.describe('预约状态', () => {
    test('预约-挂单-结算', async ({ page, homeNavigation, createCustomer, appointmentPage, customerPage, billSet }) => {
        const employee = staffData.firstStore.firstSector.employee_4;
        const project = { no: '100018', name: '苹果精萃护理', shortName: '精萃护理', price: 980 };
        const appointmentTime = getNextAppointmentTime();
        const customer = createCustomer;

        // 当前可预约时间定位器
        const $time = page.locator('.times_table td').filter({ hasText: appointmentTime });
        // 员工定位器
        const $employee = page.locator('.room_table .tr .name_th').filter({ hasText: employee.name });
        // 顾客预约定位器
        const $customerAppointment = page
            .locator('div.a_userInfo')
            .filter({ hasText: customer.phone })
            .filter({ hasText: customer.username });

        await test.step('进行创建预约', async () => {
            await homeNavigation.gotoModule('预约');
            await $time.scrollIntoViewIfNeeded();
            await $employee.scrollIntoViewIfNeeded();
            // 打开预约单元格，进行预约
            await appointmentPage.openAppointmentCell(employee.name, undefined, 10);
            await appointmentPage.operationAppointment(AppointmentOperation.ADD_APPOINT);
            await customerPage.searchCustomer(customer.phone);
            await customerPage.selectSearchCustomer(customer.phone);
            await expect(page.locator('div.name_box div.phone')).toContainText(customer.phone);
            await expect(page.locator('div.user_box')).toContainText(employee.name);
            await page.getByRole('button', { name: '确认新建' }).click();
            await expect($customerAppointment).toBeVisible();
        });

        await test.step('判断预约，状态为未到店', async () => {
            await appointmentPage.openAppointmentDetail(customer.phone);
            await expect(page.locator('div.state')).toContainText('未到店');
        });

        await test.step('进行挂单，状态为已开单', async () => {
            // 预约进行挂单
            await page.getByRole('button', { name: '到店开单' }).click();
            await page
                .locator('div.project_list')
                .filter({ hasText: project.name })
                .filter({ hasText: project.no })
                .click();
            await Promise.all([
                page.waitForResponse(res => res.url().includes('/bill') && res.status() === 200),
                page.locator('div.hold_bill', { hasText: '挂单' }).click(),
            ]);

            await homeNavigation.gotoModule('预约');

            await appointmentPage.openAppointmentDetail(customer.phone);
            await expect(page.locator('div.state')).toContainText('已开单');
        });

        await test.step('进行结算，状态为已结算', async () => {
            await page.getByRole('button', { name: /取\s单/ }).click();
            await page.locator('div.pay_btn', { hasText: /结\s算/ }).click();
            // 取消推送消费提醒和结算签字
            await page.getByLabel('推送消费提醒').uncheck();
            await page.getByLabel('结算签字').uncheck();
            await page.locator('div.paymentInfoItem', { hasText: '现金' }).click();
            // 结算
            const [response] = await Promise.all([
                page.waitForResponse(res => res.url().includes('/bill') && res.status() === 200 && res.request().method() === 'POST'),
                page.getByRole('button', { name: /结\s算/ }).click(),
            ]);
            const billNo = (await response.json())?.content?.billNo;
            billSet.add(billNo);

            await page.waitForResponse(async res => {
                if (
                    res.url().includes('/bill_status') &&
                    res.status() === 200 &&
                    res.request().method() === 'GET'
                ) {
                    const responseBody = await res.json(); // 等待解析 JSON
                    return responseBody?.content?.status === 'SETTLED';
                }
                return false;
            });

            // 处理结算后的弹窗
            await page.addLocatorHandler(page.getByRole('button', { name: '我知道了' }), async () => {
                await page.getByRole('button', { name: '我知道了' }).click();
                await expect(page.getByRole('button', { name: '我知道了' })).not.toBeVisible();
                await page.reload();
                await homeNavigation.gotoModule('预约');
            });

            // 进入预约模块
            await homeNavigation.gotoModule('预约');
            await appointmentPage.openAppointmentDetail(customer.phone);
            await expect(page.locator('div.state')).toContainText('已结算');
        });
    });
});