import { ref, computed } from "vue";
import { defineStore } from "pinia";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import type { RequestItemsHistoryObject } from "@/modules/01_metadata/interface/request/person/Prefix";

const $q = useQuasar();
const mixin = useCounterMixin();
const { success, messageError, showLoader, hideLoader } = mixin;

export const useManageDataStore = defineStore("manage", () => {
  const dataPrefix = ref<RequestItemsHistoryObject[]>([]); //list data table
  const draftPrefix = ref<RequestItemsHistoryObject[]>([]); //list data table
  const storeIdVersion = ref<string>(""); //id data ใน mongodb
  const storeVersion = ref<string>("published"); //รายการข้อมูลล่าสุดได้เผยแพร่หรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
  interface manage {
    link: number;
    person: {
      name: string;
      prefix: { columns: String[] };
      blood: { columns: String[] };
      gender: { columns: String[] };
      religion: { columns: String[] };
      relationship: { columns: String[] };
      education: { columns: String[] };
      province: { columns: String[] };
      district: { columns: String[] };
      subDistrict: { columns: String[] };
    };
    organization: {
      name: string;
      organization: { columns: String[] };
      shortName: { columns: String[] };
      type: { columns: String[] };
      level: { columns: String[] };
      agency: { columns: String[] };
      governmentAgency: { columns: String[] };
      status: { columns: String[] };
      telInternal: { columns: String[] };
      telExternal: { columns: String[] };
      fax: { columns: String[] };
    };
    position: {
      name: string;
      path: { columns: String[] };
      executiveSide: { columns: String[] };
      type: { columns: String[] };
      line: { columns: String[] };
      pathSide: { columns: String[] };
      executive: { columns: String[] };
      level: { columns: String[] };
      status: { columns: String[] };
    };
    positionEmployee: {
      name: string;
      position: { columns: String[] };
      positionSide: { columns: String[] };
      group: { columns: String[] };
      line: { columns: String[] };
      level: { columns: String[] };
      status: { columns: String[] };
    };
    calendar: {
      name: string;
      tree: { columns: String[] };
      list: { columns: String[] };
    };
    insignia: {
      name: string;
      class: { columns: String[] };
      type: { columns: String[] };
      //   badge: { columns: String[] };
    };
  }

  const manageData = ref<manage>({
    link: 1,
    person: {
      name: "",
      prefix: { columns: [] },
      blood: { columns: [] },
      gender: { columns: [] },
      religion: { columns: [] },
      relationship: { columns: [] },
      education: { columns: [] },
      province: { columns: [] },
      district: { columns: [] },
      subDistrict: { columns: [] },
    },
    organization: {
      name: "",
      organization: { columns: [] },
      shortName: { columns: [] },
      type: { columns: [] },
      level: { columns: [] },
      agency: { columns: [] },
      governmentAgency: { columns: [] },
      status: { columns: [] },
      telInternal: { columns: [] },
      telExternal: { columns: [] },
      fax: { columns: [] },
    },
    position: {
      name: "",
      path: { columns: [] },
      executiveSide: { columns: [] },
      type: { columns: [] },
      line: { columns: [] },
      pathSide: { columns: [] },
      executive: { columns: [] },
      level: { columns: [] },
      status: { columns: [] },
    },
    positionEmployee: {
      name: "",
      position: { columns: [] },
      positionSide: { columns: [] },
      group: { columns: [] },
      line: { columns: [] },
      level: { columns: [] },
      status: { columns: [] },
    },
    calendar: {
      name: "",
      tree: { columns: [] },
      list: { columns: [] },
    },
    insignia: {
      name: "",
      class: { columns: [] },
      type: { columns: [] },
      //   badge: { columns: [] },
    },
  });

  const changeManageCurrentTab = (type: number, val: string) => {
    if (type == 1) manageData.value.person.name = val;
    if (type == 2) manageData.value.organization.name = val;
    if (type == 3) manageData.value.position.name = val;
    if (type == 4) manageData.value.positionEmployee.name = val;
    if (type == 5) manageData.value.calendar.name = val;
    if (type == 6) manageData.value.insignia.name = val;
    localStorage.setItem("manage", JSON.stringify(manageData.value));
  };

  const changeManageColumns = (type: number, tab: String, val: String[]) => {
    if (type == 1) {
      if (tab == "blood") manageData.value.person.blood.columns = val;
      if (tab == "district") manageData.value.person.district.columns = val;
      if (tab == "education") manageData.value.person.education.columns = val;
      if (tab == "gender") manageData.value.person.gender.columns = val;
      if (tab == "prefix") manageData.value.person.prefix.columns = val;
      if (tab == "province") manageData.value.person.province.columns = val;
      if (tab == "religion") manageData.value.person.religion.columns = val;
      if (tab == "relationship")
        manageData.value.person.relationship.columns = val;
      if (tab == "subDistrict")
        manageData.value.person.subDistrict.columns = val;
    }
    if (type == 2) {
      if (tab == "agency") manageData.value.organization.agency.columns = val;
      if (tab == "fax") manageData.value.organization.fax.columns = val;
      if (tab == "governmentAgency")
        manageData.value.organization.governmentAgency.columns = val;
      if (tab == "shortName")
        manageData.value.organization.shortName.columns = val;
      if (tab == "level") manageData.value.organization.level.columns = val;
      if (tab == "organization")
        manageData.value.organization.organization.columns = val;
      if (tab == "status") manageData.value.organization.status.columns = val;
      if (tab == "telExternal")
        manageData.value.organization.telExternal.columns = val;
      if (tab == "telInternal")
        manageData.value.organization.telInternal.columns = val;
      if (tab == "type") manageData.value.organization.type.columns = val;
    }
    if (type == 3) {
      if (tab == "executive") manageData.value.position.executive.columns = val;
      if (tab == "executiveSide")
        manageData.value.position.executiveSide.columns = val;
      if (tab == "level") manageData.value.position.level.columns = val;
      if (tab == "line") manageData.value.position.line.columns = val;
      if (tab == "path") manageData.value.position.path.columns = val;
      if (tab == "pathSide") manageData.value.position.pathSide.columns = val;
      if (tab == "status") manageData.value.position.status.columns = val;
      if (tab == "type") manageData.value.position.type.columns = val;
    }
    if (type == 4) {
      if (tab == "group") manageData.value.positionEmployee.group.columns = val;
      if (tab == "level") manageData.value.positionEmployee.level.columns = val;
      if (tab == "line") manageData.value.positionEmployee.line.columns = val;
      if (tab == "position")
        manageData.value.positionEmployee.position.columns = val;
      if (tab == "positionSide")
        manageData.value.positionEmployee.positionSide.columns = val;
      if (tab == "status")
        manageData.value.positionEmployee.status.columns = val;
    }
    if (type == 5) {
      if (tab == "tree") manageData.value.calendar.tree.columns = val;
      if (tab == "list") manageData.value.calendar.list.columns = val;
    }
    if (type == 6) {
      //   if (tab == "badge") manageData.value.insignia.badge.columns = val;
      if (tab == "class") manageData.value.insignia.class.columns = val;
      if (tab == "type") manageData.value.insignia.type.columns = val;
    }
    localStorage.setItem("manage", JSON.stringify(manageData.value));
  };

  const changeManageLink = (val: number) => {
    manageData.value.link = val;
    localStorage.setItem("manage", JSON.stringify(manageData.value));
  };

  if (localStorage.getItem("manage")) {
    const data = JSON.parse(localStorage.getItem("manage") || "{}");
    const isDataValid = Object.getOwnPropertyNames(manageData.value).every(
      (val1) => {
        const descriptor1 = Object.getOwnPropertyDescriptor(
          manageData.value,
          val1
        );
        return (
          descriptor1 &&
          descriptor1.configurable &&
          Object.getOwnPropertyNames(descriptor1.value).every((val2) => {
            return data[val1] && data[val1].hasOwnProperty(val2);
          })
        );
      }
    );

    if (isDataValid) {
      manageData.value = data;
    } else {
      localStorage.setItem("manage", JSON.stringify(manageData.value));
    }
  }

  const getPrefix = async (
    selector: boolean = false,
    newFetch: boolean = false
  ) => {
    if (dataPrefix.value.length === 0) {
      await fetchPrefix(true, selector);
      return {
        data: draftPrefix.value,
        version: storeVersion.value,
        idversion: storeIdVersion.value,
      };
    } else {
      if (newFetch) {
        await fetchPrefix(true, selector);
        return {
          data: draftPrefix.value,
          version: storeVersion.value,
          idversion: storeIdVersion.value,
        };
      } else {
        return {
          data: draftPrefix.value,
          version: storeVersion.value,
          idversion: storeIdVersion.value,
        };
      }
    }
  };

  const fetchPrefix = async (loader: boolean, selector: boolean) => {
    let apiPrefix = "";
    if (loader) {
      showLoader();
    }
    if (selector) {
      apiPrefix = config.API.prefix;
    } else {
      apiPrefix = config.API.listPrefixHistory;
    }
    await http
      .get(apiPrefix)
      .then((res) => {
        const data = res.data.result;
        let rows: RequestItemsHistoryObject[] = [];
        if (selector) {
          data.map((e: RequestItemsHistoryObject) => {
            rows.push({
              ...e,
            });
          });
        } else {
          storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
          storeIdVersion.value = data.id; //เลข id ใน mongodb

          data.items.map((e: RequestItemsHistoryObject) => {
            rows.push({
              ...e,
            });
          });
        }

        draftPrefix.value = rows;
        if (loader) {
          dataPrefix.value = rows;
        }
      })
      .catch((e) => {
        messageError($q, e);
      })
      .finally(() => {
        if (loader) {
          hideLoader();
        }
      });
  };

  return {
    dataPrefix,
    storeIdVersion,
    storeVersion,
    manageData,
    getPrefix,
    changeManageCurrentTab,
    changeManageLink,
    changeManageColumns,
  };
});