import { defineStore } from "pinia";
import { ref } 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"


const mixin = useCounterMixin();
const { date2Thai, showLoader, hideLoader } = mixin;
export const useLeavelistDataStore = defineStore("leave", () => {
    //TABMENU
    const tab = ref<string>("1");
    const amounttab1 = ref<number>(0)
    const amounttab2 = ref<number>(0)
    //ข้อมูลในตาราง
    const mainData = ref<any>([])
    const rows = ref<DataRows[]>([])
    const columns = ref<QTableProps["columns"]>([]);
    const visibleColumns = ref<string[]>([]);
    const loadTable = ref<boolean>(false)
    async function fetchList(data: DataRows[]) {
        let datalist = data.map((e: DataRows) => ({
            leaveType: e.leaveType,
            name: e.name,
            Date: e.Date,
            status: convertSatatus(e.status)
        }))
        tab.value !== "1" ? mainData.value = datalist : mainData.value = datalist.filter((e) => e.status === "อยู่ระหว่างกำเนินการ")
        const filteramounttab1 = datalist.filter((e) => e.status === "อยู่ระหว่างกำเนินการ")
        amounttab1.value = filteramounttab1.length
        amounttab2.value = datalist.length
        await fetchOption()
        await searchDataFn(selectType.value, selectStatus.value)


    }
    //filter table
    const selectYear = ref<string>('all')
    const selectType = ref<string>('all')
    const selectStatus = 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") {
            rows.value = mainData.value
        } else if (selectYear.value !== "all" && type == "all" && status == "all") {
            console.log("ค้นหาจากปี");
        } else if (selectYear.value == "all" && type !== "all" && status == "all") {
            console.log("ค้นหาจากประเภท");
            rows.value = mainData.value.filter((e: any) => e.leaveType === type)
        } else if (selectYear.value == "all" && type == "all" && status !== "all") {
            console.log("ค้นหาจากสถานะ");
            rows.value = mainData.value.filter((e: any) => e.status === status)
        } else if (selectYear.value !== "all" && type !== "all" && status == "all") {
            console.log("ค้นหาจากปีและประเภท");
        } else if (selectYear.value !== "all" && type == "all" && status !== "all") {
            console.log("ค้นหาจากปีและสถานะ");
        } else if (selectYear.value == "all" && type !== "all" && status !== "all") {
            console.log("ค้นหาจากประเภทและสถานะ");
            rows.value = mainData.value.filter((e: any) => e.leaveType === type && e.status === status)
        } else (console.log("ค้นหาจากทั้งหมด"))
        setTimeout(function () {
            loadTable.value = false
        }, 500);

    }
    function clearFilter() {
        selectYear.value = "all"
        selectType.value = "all"
        selectStatus.value = "all"
        filterTable.value = ''
    }

    function fetchOption() {
        let data = []
        data = mainData.value
        const double_leaveType = [
            ...new Set(data.map((item: any) => item.leaveType)),
        ];
        // หา optionType
        optionTypeMain.value = [{ id: "all", name: "ทั้งหมด" }];
        for (let i = 1; i <= double_leaveType.length; i++) {
            const type = double_leaveType[i - 1];
            if (typeof type === 'string') {
                const listtype: DataOption = {
                    id: type,
                    name: type,
                };
                optionTypeMain.value.push(listtype)
                optionType.value = optionTypeMain.value
            }
        }
        // หา optionStatus
        const double_status = [
            ...new Set(data.map((item: any) => item.status)),
        ];
        optionStatusMain.value = [{ id: "all", name: "ทั้งหมด" }];
        for (let i = 1; i <= double_status.length; i++) {
            const status = double_status[i - 1];
            if (typeof status === 'string') {
                const liststatus: DataOption = {
                    id: status,
                    name: status,
                };
                optionStatusMain.value.push(liststatus);
                optionStatus.value = optionStatusMain.value
            }
        }
    }
    // filter option
    function filterOption(val: string, update: any, type: string) {
        let data: DataOption[] = []
        let filter: DataOption[] = []
        if (type == "type") {
            data = optionTypeMain.value
        } else if (type == "status") {
            data = optionStatusMain.value
        }
        if (val == "") {
            update(() => {
                filter = data;
            });
        } else {
            update(() => {
                filter = data.filter(
                    (e) => e.name.search(val) !== -1
                );
            });
        }
        if (filter) {
            if (type == "type") {
                optionType.value = filter
            } else if (type == "status") {
                optionStatus.value = filter
            }
        }
    }


    // convertSatatus
    function convertSatatus(val: string) {
        switch (val) {
            case "1":
                return "ใหม่"
            case "2":
                return "อยู่ระหว่างกำเนินการ"
            case "3":
                return "อนุมัติ"
        }
    }
    return {
        tab,
        amounttab1,
        amounttab2,
        //ข้อมูลในตาราง
        rows,
        fetchList,
        loadTable,
        columns,
        visibleColumns,

        //filter table
        filterTable,
        selectYear,
        selectType,
        selectStatus,
        optionYear,
        optionType,
        optionStatus,
        clearFilter,
        searchDataFn,
        filterOption,


    };
})