import { test, expect, Page } from '@playwright/test';
import { strictEqual } from 'assert';
import exp from 'constants';

let page: Page;

test.beforeAll(async ({ browser }) => {
  page = await browser.newPage();
});

test.afterAll(async () => {
  if (page !== undefined) {
    await page.close();
  }
});

test('Login', async () => {
  // Login
  await page.goto('http://192.168.1.62:20101/');
  await expect(page).toHaveTitle(/^Sign in to /);
  await page.fill("input[name='username']", 'admin');
  await page.fill("input[name='password']", '1234');
  await page.click('id=kc-login');
  await page.waitForTimeout(2000);
  //   await page.click('id=acceptBtn');
});

test('Create Personnel พนักงาน ชาย', async () => {
  await page.click('id=menu-icon-personnel-management');
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'employeem');
  await page.click('id=select-user-type');
  await page.click('id=select-user-type_0');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_2');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'ธรรมรงด์');
  await page.fill('id=form-dialog-personnel-input-last-name', 'ดำรงธรรม');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Thamrong');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Dumrongtum');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeem@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='ชาย']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-17']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.fill('id=input-regis-no', '2822282222421');
  await page.click('id=input-start-date');
  await page.click("//div[text()='11']");
  await page.click('id=input-retire-date');
  await page.click("//div[text()='21']");

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  await page.waitForSelector;
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='ธรรมรงด์ ดำรงธรรม']",
  );

  const displayName = (await displayNameLocator.textContent())?.trim() || '';

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('ธรรมรงด์ ดำรงธรรม');
  console.log(displayName);

  console.log('ตรวจสอบการสร้างพนักงานชายถูกต้อง');
});

test('Create Personnel พนักงาน หญิง', async () => {
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'employeew');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_6');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'อารยา');
  await page.fill('id=form-dialog-personnel-input-last-name', 'มาลา');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Araya');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Mala');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='หญิง']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-16']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.fill('id=input-regis-no', '2822282222421');
  await page.click('id=input-start-date');
  await page.click("//div[text()='11']");
  await page.click('id=input-retire-date');
  await page.click("//div[text()='21']");

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='อารยา มาลา']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('อารยา มาลา');

  console.log('ตรวจสอบการสร้างพนักงานหญิงถูกต้อง');
});

test('Create Personnel พนักงานส่งเอกสาร หญิง', async () => {
  await page.click("(//div[@role='tab'])[3]");
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'courierw');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_6');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'มาตา');
  await page.fill('id=form-dialog-personnel-input-last-name', 'ลดา');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Mata');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Lada');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='หญิง']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-15']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.fill('id=input-regis-no', '2822282222421');
  await page.click('id=input-start-date');
  await page.click("//div[text()='11']");
  await page.click('id=input-retire-date');
  await page.click("//div[text()='21']");

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='มาตา ลดา']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('มาตา ลดา');

  console.log('ตรวจสอบการสร้างพนักงานส่งเอกสารหญิงถูกต้อง');
});

test('Create Personnel พนักงานส่งเอกสาร ชาย', async () => {
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'courierm');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_6');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'ธันวา');
  await page.fill('id=form-dialog-personnel-input-last-name', 'มานา');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Thanwa');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Mana');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='ชาย']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-14']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.fill('id=input-regis-no', '2822282222421');
  await page.click('id=input-start-date');
  await page.click("//div[text()='11']");
  await page.click('id=input-retire-date');
  await page.click("//div[text()='21']");

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='ธันวา มานา']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('ธันวา มานา');

  console.log('ตรวจสอบการสร้างพนักงานส่งเอกสารชายถูกต้อง');
});

test('Create Personnel ตัวแทน ชาย', async () => {
  await page.click("(//div[@role='tab'])[4]");
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'delegatem');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_8');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'อาคม');
  await page.fill('id=form-dialog-personnel-input-last-name', 'พลัง');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Akom');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Palang');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='ชาย']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-13']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.fill('id=input-discount-condition', 'ทดสอบข้อมูลการทำงาน');

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='อาคม พลัง']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('อาคม พลัง');

  console.log('ตรวจสอบการสร้างตัวแทนชายถูกต้อง');
});

test('Create Personnel ตัวแทน หญิง', async () => {
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'delegatew');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_10');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'สโรชา');
  await page.fill('id=form-dialog-personnel-input-last-name', 'มีนา');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Sarocha');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Mena');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='หญิง']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-12']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.fill('id=input-discount-condition', 'ทดสอบข้อมูลการทำงาน');

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='สโรชา มีนา']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('สโรชา มีนา');

  console.log('ตรวจสอบการสร้างตัวแทนหญิงถูกต้อง');
});

test('Create Personnel เอเจนซี่ หญิง', async () => {
  await page.click("(//div[@role='tab'])[5]");
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'agencyw');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_2');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'ธิดา');
  await page.fill('id=form-dialog-personnel-input-last-name', 'งามตา');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Thida');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Yamta');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='หญิง']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-11']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.click('id=input-source-nationality');
  await page.click("(//div[@role='option'])[1]");
  await page.click('id=input-import-nationality');
  await page.click("(//div[@role='option'])[1]");
  await page.click('id=select-trainig-place');
  await page.click("//span[text()='สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก']");
  await page.fill('id=input-checkpoint', 'แม่สอด');
  await page.fill('id=input-checkpoint-en', 'Maesod');

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='ธิดา งามตา']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('ธิดา งามตา');

  console.log('ตรวจสอบการสร้างเอเจนซี่หญิงถูกต้อง');
});

test('Create Personnel เอเจนซี่ ชาย', async () => {
  await page.click('id=btn-add');
  await page.click('id=btn-add-personne');

  // กรอกข้อมูลพื้นฐานของบุคคลากร
  await page.click("//i[@aria-hidden='false']");
  await page.waitForSelector('id=select-hq-id', {
    state: 'visible',
  });
  await page.click('id=select-hq-id');
  await page.click("//span[normalize-space(text())='CMO00000']");

  await page.waitForSelector('id=select-br-id', { state: 'visible' });
  await page.click('id=select-br-id');
  await page.click('id=select-br-id_4');
  await page.fill('id=input-username', 'agencym');
  await page.click('id=select-user-role');
  await page.click('id=select-user-role_8');
  // await page.click("//div[@role='option']");

  // กรอกชื่อข้อมูลพื้นฐาน
  await page.fill('id=input-citizen-id', '1282262422820');
  await page.click("//label[@for='form-dialog-personnel-select-prefix-name']");
  await page.click('id=form-dialog-personnel-select-prefix-name_0');
  await page.fill('id=form-dialog-personnel-input-first-name', 'อันดา');
  await page.fill('id=form-dialog-personnel-input-last-name', 'ธรรมา');
  await page.fill('id=form-dialog-personnel-input-first-name-en', 'Aunda');
  await page.fill('id=form-dialog-personnel-input-last-name-en', 'Thamma');
  await page.fill('id=form-dialog-personnel-input-telephone', '08422622282');
  await page.fill('id=form-dialog-personnel-input-email', 'employeew@mail.com');

  // เลือกเพศ
  await page.click('id=form-dialog-personnel-select-gender');
  await page.click("//span[text()='ชาย']");

  // เลือกวันเกิด
  await page.click('id=form-dialog-personnel-input-birth-date');
  await page.click("(//button[@class='dp__btn dp__month_year_select'])[2]");
  await page.click("//div[text()='2561']");
  await page.click("//div[text()='8']");

  // วันออกบัตร วันที่หมออายุ
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-issue'])[1]",
  );
  await page.click("//div[@id='2024-09-02']");
  await page.click(
    "(//input[@id='form-dialog-personnel-input-citizen-expire'])[1]",
  );
  await page.click("//div[@id='2024-09-10']/div[1]");

  // กรอกที่อยู่
  await page.fill('id=drawer-info-personnel-input-address-no', '20/1');
  await page.click('id=drawer-info-personnel-select-province');
  await page.waitForSelector('id=drawer-info-personnel-select-province_6', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-province_6');
  await page.click('id=drawer-info-personnel-select-district');
  await page.waitForSelector('id=drawer-info-personnel-select-district_2', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-district_2');
  await page.click('id=drawer-info-personnel-select-sub-district');
  await page.waitForSelector('id=drawer-info-personnel-select-sub-district_1', {
    state: 'visible',
  });
  await page.click('id=drawer-info-personnel-select-sub-district_1');

  // กรอกที่อยู่ภาษาอังกฤษ
  await page.fill('id=drawer-info-personnel-input-address-en', '20/01');

  // กรอกข้อมูลการทำงาน
  await page.click('id=input-source-nationality');
  await page.click("(//div[@role='option'])[1]");
  await page.click('id=input-import-nationality');
  await page.click("(//div[@role='option'])[1]");
  await page.click('id=select-trainig-place');
  await page.click("//span[text()='สถานที่อบรมแรงงานเมียนมา-แม่สอด จ.ตาก']");
  await page.fill('id=input-checkpoint', 'แม่สอด');
  await page.fill('id=input-checkpoint-en', 'Maesod');

  // กดปุ่มเพื่อสร้างบุคคลากร
  await page.click('id=btn-info-basic-save');
  await page.waitForTimeout(2000);

  // ดึงข้อมูลจาก Locator และนำ .textContent() เพื่อดึงมาแต่ข้อความจริง ๆ
  const displayNameLocator = page.locator(
    "//div[normalize-space(text())='อันดา ธรรมา']",
  );
  const displayName = (await displayNameLocator.textContent())?.trim();

  // ตรวจสอบข้อมูลที่ดึงออกมา
  expect(displayName).toBe('อันดา ธรรมา');

  console.log('ตรวจสอบการสร้างเอเจนซี่ชายถูกต้อง');
});