hrms-user/src/modules/05_leave/store.ts

import { defineStore } from "pinia";
import { ref, computed } from "vue";
import type { QTableProps } from "quasar";
import type {
  FormLeavetMainData,
  OptionData,
  formListLeaveData,
} from "@/modules/05_leave/interface/index/main";
import { useCounterMixin } from "@/stores/mixin";

export const useLeaveStore = defineStore("Leave", () => {
  const tabValue = ref<string>("calendar");
  const typeLeave = ref<string | undefined>("");
  const mixin = useCounterMixin();
  const { date2Thai } = mixin;
  const LeaveType = ref<string | null>("0");
  const LeaveStatus = ref<string | null>("0");
  const fiscalYearyear = ref<Number | null>(new Date().getFullYear());
  const rows = ref<formListLeaveData[]>([]);
  const DataMainOrig = ref<formListLeaveData[]>([]); // ข้อมูลหลักดั้งเดิม

  async function fecthList(data: formListLeaveData[]) {
    let datalist: formListLeaveData[] = data.map((e: any) => ({
      no: e.no,
      type: e.type,
      status: e.status,
      date: e.date,
      year: e.year,
    }));
    rows.value = datalist;
    DataMainOrig.value = datalist;
  }

  const DataMainUpdate = ref<formListLeaveData[]>([]); // ข้อมูลเปลี่ยนแปลง
  const DataMain = (val: formListLeaveData[]) => (DataMainOrig.value = val);
  const DataUpdate = (
    filterType: string,
    filterStatus: string,
    filterYear: string
  ) => {
    DataMainUpdate.value = [];

    if (filterType === "" && filterStatus === "" && filterYear === "") {
      DataMainUpdate.value = DataMainOrig.value;
    } else if (filterType !== "" && filterStatus === "" && filterYear === "") {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) => item.type === filterType
      );
    } else if (
      filterType !== "" &&
      filterStatus !== "" &&
      filterYear === null
    ) {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) =>
          item.type === filterType && item.status === filterStatus
      );
    } else if (filterType !== "" && filterStatus === "" && filterYear !== "") {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) =>
          item.type === filterType && item.year === filterYear
      );
    } else if (filterType === "" && filterStatus !== "" && filterYear === "") {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) => item.status === filterStatus
      );
    } else if (filterType === "" && filterStatus === "" && filterYear !== "") {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) => item.year === filterYear
      );
    } else if (
      filterType === "" &&
      filterStatus !== "" &&
      filterYear !== null
    ) {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) =>
          item.status === filterStatus && item.year === filterYear
      );
    } else if (filterType !== "" && filterStatus !== "" && filterYear === "") {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) =>
          item.status === filterStatus && item.type === filterType
      );
    } else if (
      filterType !== "" &&
      filterStatus !== "" &&
      filterYear !== null
    ) {
      DataMainUpdate.value = DataMainOrig.value.filter(
        (item: formListLeaveData) =>
          item.type === filterType &&
          item.status === filterStatus &&
          item.year === filterYear
      );
    } else if (
      filterType == "0" &&
      filterStatus == "0" &&
      filterYear !== null
    ) {
      DataMainUpdate.value = DataMainOrig.value;
    }
  };

  //--------------|ฟิลเตอร์|--------------------------------------//
  const searchFilterTable = async () => {
    console.log("test");

    rows.value = [];

    if (LeaveType.value !== undefined && LeaveType.value !== null) {
      await DataUpdate(
        LeaveType.value === "0" ? "all" : LeaveType.value!,
        LeaveStatus.value === "0" ? "all" : LeaveStatus.value!,
        fiscalYearyear.value === 0 ? "all" : fiscalYearyear.value?.toString()!
      );
      let filteredData = DataMainOrig.value;

      if (LeaveType.value !== "0") {
        filteredData = filteredData.filter(
          (item: formListLeaveData) => item.type === LeaveType.value
        );
      }
      if (LeaveStatus.value !== "0") {
        filteredData = filteredData.filter(
          (item: formListLeaveData) => item.status === LeaveStatus.value
        );
      }
      if (fiscalYearyear.value !== 0) {
        filteredData = filteredData.filter(
          (item: formListLeaveData) =>
            item.year === fiscalYearyear.value?.toString()
        );
      }
      const dataArr: formListLeaveData[] = filteredData.map((e: any) => ({
        no: e.no,
        type: convertType(e.type) || "",
        status: convertStatus(e.status) || "",
        date: date2Thai(new Date(e.date)),
        year: e.year !== undefined ? e.year : "",
      }));
      rows.value = dataArr;
    }
  };

  /**
   *ฟังก์ชั่นเลือก selector ที่ใช่ในการฟิลเตอร์
   * @param val ค่าที่ต้องการฟิลเตอร์
   * @param update  อัพเดทค่า
   * @param refData ดาต้าที่ต้องการฟิลเตอร์
   */
  const filterSelector = (val: any, update: Function, refData: string) => {
    switch (refData) {
      case "fiscalyearOP":
        update(() => {
          fiscalyearOP.value = fiscalyearOP.value.filter(
            (v: any) => v.name.indexOf(val) > -1
          );
        });
        break;
      case "LeaveTypeOption":
        update(() => {
          typeOptions.value = typeOptions.value.filter(
            (v: any) => v.name.indexOf(val) > -1
          );
        });
        break;
      case "LeaveStatusOption":
        update(() => {
          statusOptions.value = statusOptions.value.filter(
            (v: any) => v.name.indexOf(val) > -1
          );
        });
        break;
      default:
        break;
    }
  };

  /** filter ปี */
  const fiscalyearOP = ref<OptionData[]>([
    { id: "0", name: "ทั้งหมด" },
    { id: "1", name: "2566" },
    { id: "2", name: "2567" },
    { id: "2", name: "2568" },
  ]);

  /**
   *ฟังก์ชั่นค้นหาแสดง option ของประเภทการลา
   * @param val ค่าที่เเสดง
   * @returns option ทั้งหมด
   */
  function convertType(val: string) {
    if (val == "0") return "ทั้งหมด";
    else return options.value.find((x) => x.id == val)?.name;
  }

  /** รายการประเภทการลาของ ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน*/
  const optionsSpecific = ref([
    { id: "s0", name: "ลาไปศึกษาต่อ" },
    { id: "s1", name: "ลาฝึกอบรม" },
    { id: "s2", name: "ลาปฎิบัติการวิจัย" },
    { id: "s3", name: "ลาดูงาน" },
  ]);

  /** รายการประเภทการลาของ ลาอุปสมบทหรือลาประกอบพิธีฮัจย์ฯ*/
  const optionsOrdination = ref([
    { id: "0", name: "ลาอุปสมบท" },
    { id: "1", name: "ลาประกอบพิธีฮัจย์ฯ" },
  ]);

  /** รายการข้อมูลประเภทใบลา */
  const options = ref<OptionData[]>([
    { id: "1", name: "ลาป่วย" },
    { id: "2", name: "ลากิจส่วนตัว" },
    { id: "3", name: "ลาคลอดบุตร" },
    { id: "4", name: "ลาไปช่วยเหลือภริยาที่คลอดบุตร" },
    { id: "5", name: "ลาพักผ่อน" },
    { id: "6", name: "ลาอุปสมบทหรือลาประกอบพิธีฮัจย์ฯ" },
    { id: "7", name: "ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล" },
    { id: "8", name: "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน" },
    { id: "9", name: "ลาไปปฎิบัติงานในองค์การระหว่างประเทศ" },
    { id: "10", name: "ลาติดตามคู่สมรส" },
    { id: "11", name: "ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ" },
  ]);

  /** filter ประเภทการลา */
  const typeOptions = ref<OptionData[]>([
    { id: "0", name: "ทั้งหมด" },
    ...options.value,
  ]);

  /** สถานะของการลา */
  const statusOptions = ref<OptionData[]>([
    { id: "0", name: "ทั้งหมด" },
    { id: "1", name: "อนุมัติ" },
    { id: "2", name: "ไม่อนุมัติ" },
    { id: "3", name: "อยู่ระหว่างดำเนินการ" },
    { id: "4", name: "ใหม่" },
  ]);

  /**
   *ฟังก์ชั่นค้นหาแสดง option ของสถานะ
   * @param val ค่าที่เเสดง
   * @returns option ทั้งหมด
   */
  function convertStatus(val: string) {
    if (val == "0") return "ทั้งหมด";
    else return statusOptions.value.find((x) => x.id == val)?.name;
  }

  /** data table filter & column ของรายการลา */
  const visibleColumns = ref<String[]>(["no", "type", "date", "status"]);
  const columns = ref<QTableProps["columns"]>([
    {
      name: "no",
      align: "left",
      label: "ลำดับ",
      sortable: true,
      field: "no",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px; width:5%;",
    },
    {
      name: "type",
      align: "left",
      label: "ประเภทการลา",
      sortable: true,
      field: "type",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px; width:15%;",
    },
    {
      name: "date",
      align: "left",
      label: "วันที่ยื่นใบลา",
      sortable: true,
      field: "date",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px; width:15%;",
    },
    {
      name: "status",
      align: "left",
      label: "สถานะ",
      sortable: true,
      field: "status",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px; width:10%;",
    },
  ]);

  /**
   *ฟังก์ชั่นแปลงประเภทแบบฟอร์มลา
   * @param item ประเภทแบบฟอร์ม
   * @param subitem ประเภทแบบฟอร์มย่อย
   */
  function typeConvert(item: string, subitem: any) {
    // console.log('first',item)
    if (item !== "6" && item !== "8") {
      typeLeave.value = convertSubtitle(item);
    } else if (item === "6") {
      typeLeave.value = convertSubtitleInfo(subitem);
    } else if (item === "8") {
      typeLeave.value = convertSubtitleInfo2(subitem);
    }
  }

  /**
   *ฟังก์ชั่นแปลงประเภทแบบฟอร์มลา ลาอุปสมบท/ลาประกอบพิธีฮัจย์
   * @param val ค่า string
   * @returns ส่งค่าที่แปลงแล้ว
   */
  function convertSubtitle(val: string) {
    return options.value.find((x) => x.id == val)?.name;
  }

  /**
   *ฟังก์ชั่นแปลงประเภทแบบฟอร์มลา ลาอุปสมบท/ลาประกอบพิธีฮัจย์ ย่อย
   * @param val ค่า string
   * @returns ส่งค่าที่แปลงแล้ว
   */
  function convertSubtitleInfo(val: string) {
    return optionsOrdination.value.find((x) => x.id == val)?.name;
  }

  /**
   *ฟังก์ชั่นแปลง ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน
   * @param val ค่า string
   * @returns ส่งค่าที่แปลงแล้ว
   */
  function convertSubtitleInfo2(val: string) {
    return optionsSpecific.value.find((x) => x.id == val)?.name;
  }

  return {
    tabValue,
    typeOptions,
    optionsSpecific,
    statusOptions,
    DataMain,
    DataMainUpdate,
    DataUpdate,
    DataMainOrig,
    visibleColumns,
    columns,
    rows,
    LeaveType,
    LeaveStatus,
    fecthList,
    filterSelector,
    searchFilterTable,
    fiscalyearOP,
    fiscalYearyear,
    options,
    optionsOrdination,
    typeConvert,
    typeLeave,
  };
});