import { defineStore } from "pinia";
import { ref, onMounted } from "vue";
import { useCounterMixin } from "@/stores/mixin";

import type { DataOption } from "@/modules/09_leave/interface/index/Main";
import type { QTableProps } from "quasar";
import type { DataRows } from "@/modules/09_leave/interface/response/leave";
import type { ListsData } from "@/modules/09_leave/interface/request/leave";

const mixin = useCounterMixin();
const { date2Thai, showLoader, hideLoader } = mixin;
export const useLeavelistDataStore = defineStore("leave", () => {
  //TABMENU
  const amounttab1 = ref<number>(0);
  const amounttab2 = ref<number>(0);
  //ข้อมูลในตาราง
  const mainData = ref<any>([]);
  const rows = ref<DataRows[]>([]);
  const selectStatus = ref<string>("PENDING");
  const columns = ref<QTableProps["columns"]>([]);
  const visibleColumns = ref<string[]>([]);
  const loadTable = ref<boolean>(false);
  const leaveOp = [
    { id: "all", name: "ทั้งหมด" },
    { id: "leave1", name: "ลากิจส่วนตัว" },
    { id: "leave2", name: "ลาป่วย" },
  ];
  const statusOp = [
    { id: "all", name: "ทั้งหมด" },
    { id: "NEW", name: "ใหม่" },
    { id: "PENDING", name: "อยู่ระหว่างดำเนินการ" },
    { id: "APPROVE", name: "อนุมัติ" },
    { id: "REJECT", name: "ไม่อนุมัติ" },
  ];
  const leaveOps = ref<any>(leaveOp);
  const statusOps = ref<any>(statusOp);
  async function fetchList(data: ListsData[]) {
    let datalist = data.map((e: ListsData) => ({
      id: e.id,
      leaveType: e.leaveType,
      name: e.name,
      Date: date2Thai(e.Date),
      status: e.status,
    }));
    console.log(datalist);
    mainData.value = datalist;
    const filteramounttab1 = datalist.filter((e) => e.status === "PENDING");
    amounttab1.value = filteramounttab1.length;
    amounttab2.value = datalist.length;
    await searchDataFn(selectType.value, selectStatus.value);
  }
  //filter table
  const selectYear = ref<string>("all");
  const selectType = ref<string>("all");

  const optionYear = ref<DataOption[]>([{ id: "all", name: "ทั้งหมด" }]);
  const optionType = ref<DataOption[]>([]);
  const optionStatus = ref<DataOption[]>([]);
  const optionTypeMain = ref<DataOption[]>([]);
  const optionStatusMain = ref<DataOption[]>([]);
  const filterTable = ref<string>("");
  function searchDataFn(type: string, status: string) {
    // selectYear.value = selectYear.value || "all"
    type = type || "all";
    status = status || "all";
    // showLoader()
    loadTable.value = true;
    if (selectYear.value == "all" && type == "all" && status == "all") {
      console.log(1);
      rows.value = mainData.value.map((e: any) => ({
        id: e.id,
        leaveType: convertLeave(e.leaveType),
        name: e.name,
        Date: date2Thai(e.Date),
        status: convertSatatus(e.status),
      }));
    } else if (selectYear.value !== "all" && type == "all" && status == "all") {
      console.log(2);
    } else if (selectYear.value == "all" && type !== "all" && status == "all") {
      console.log(3);
      rows.value = mainData.value
        .filter((e: any) => e.leaveType === type)
        .map((e: any) => ({
          id: e.id,
          leaveType: convertLeave(e.leaveType),
          name: e.name,
          Date: date2Thai(e.Date),
          status: convertSatatus(e.status), // แปลงค่า status เมื่อเป็น "PENDING"
        }));
    } else if (selectYear.value == "all" && type == "all" && status !== "all") {
      console.log(4);
      console.log(status);
      rows.value = mainData.value
        .filter((e: any) => e.status === status)
        .map((e: any) => ({
          id: e.id,
          leaveType: convertLeave(e.leaveType),
          name: e.name,
          Date: date2Thai(e.Date),
          status: convertSatatus(e.status), // แปลงค่า status เมื่อเป็น "PENDING"
        }));
    } else if (
      selectYear.value !== "all" &&
      type !== "all" &&
      status == "all"
    ) {
      console.log(5);
    } else if (
      selectYear.value !== "all" &&
      type == "all" &&
      status !== "all"
    ) {
      console.log(6);
    } else if (
      selectYear.value == "all" &&
      type !== "all" &&
      status !== "all"
    ) {
      console.log(7);
      console.log(type);
      rows.value = mainData.value
        .filter((e: any) => e.leaveType === type && e.status === status)
        .map((e: any) => ({
          id: e.id,
          leaveType: convertLeave(e.leaveType),
          name: e.name,
          Date: date2Thai(e.Date),
          status: convertSatatus(e.status), // แปลงค่า status เมื่อเป็น "PENDING"
        }));
    } else console.log("ค้นหาจากทั้งหมด");
    setTimeout(function () {
      loadTable.value = false;
    }, 500);
  }
  function clearFilter() {
    selectYear.value = "all";
    selectType.value = "all";
    selectStatus.value = "all";
    filterTable.value = "";
  }

  // filter option
  function filterOption(val: string, update: any, name: string) {
    update(() => {
      const needle = val.toLowerCase();
      if (name === "type") {
        leaveOps.value = leaveOp.filter(
          (v: any) => v.name.toLowerCase().indexOf(needle) > -1
        );
      } else if (name === "status") {
        statusOps.value = statusOp.filter(
          (v: any) => v.name.toLowerCase().indexOf(needle) > -1
        );
      }
    });
  }

  // convertSatatus
  function convertSatatus(val: string) {
    switch (val) {
      case "NEW":
        return "ใหม่";
      case "PENDING":
        return "อยู่ระหว่างดำเนินการ";
      case "APPROVE":
        return "อนุมัติ";
      case "REJECT":
        return "ไม่อนุมัติ";
    }
  }
  function convertLeave(val: string) {
    switch (val) {
      case "leave1":
        return "ลากิจส่วนตัว";
      case "leave2":
        return "ลาป่วย";
      case "leave3":
        return "ลาคลอดบุตร";
      case "leave4":
        return "ลาไปช่วยเหลือภริยาที่คลอดบุตร";
      case "leave5":
        return "ลาพักผ่อน";
    }
  }
  function convertLeaveDaytype(val: string) {
    switch (val) {
      case "allday":
        return "ลาทั้งวัน";
      case "halfmorning":
        return "ลาครึ่งวันเช้า";
      case "halfafternoon":
        return "ลาครึ่งวันบ่าย";
    }
  }

  return {
    amounttab1,
    amounttab2,
    //ข้อมูลในตาราง
    rows,
    fetchList,
    loadTable,
    columns,
    visibleColumns,

    //filter table
    filterTable,
    selectYear,
    selectType,
    selectStatus,
    optionYear,
    optionType,
    optionStatus,
    clearFilter,
    searchDataFn,
    filterOption,
    leaveOp,
    statusOp,
    leaveOps,
    statusOps,
    //
    convertLeave,
    convertLeaveDaytype,
  };
});