"use client";
import React, { useMemo } from "react";
import SearchBox, { Criterion } from "../SearchBox";
import { useTranslation } from "react-i18next";
import { ProjectResult } from "@/app/api/projects";
import { fetchMonthlyWorkHoursReport, fetchProjectCashFlowReport, fetchProjectResourceOverconsumptionReport } from "@/app/api/reports/actions";
import { downloadFile } from "@/app/utils/commonUtil";
import { BASE_API_URL } from "@/config/api";
import { ProjectResourceOverconsumptionReportFilter, ProjectResourceOverconsumptionReportRequest } from "@/app/api/reports";
import { StaffResult } from "@/app/api/staff";
import { TeamResult } from "@/app/api/team";
import { Customer } from "@/app/api/customer";

interface Props {
    team: TeamResult[]
    customer: Customer[]
}

type SearchQuery = Partial<Omit<ProjectResourceOverconsumptionReportFilter, "id">>;
type SearchParamNames = keyof SearchQuery;

const ResourceOverconsumptionReport: React.FC<Props> = ({ team, customer }) => {
    const { t } = useTranslation("report");
    const teamCombo = team.map(t => `${t.name} - ${t.code}`)
    const custCombo = customer.map(c => `${c.name} - ${c.code}`)
    const statusCombo = ["Overconsumption", "Potential Overconsumption"]
    // const staffCombo = staffs.map(staff => `${staff.name} - ${staff.staffId}`)
    // console.log(staffs)

    const searchCriteria: Criterion<SearchParamNames>[] = useMemo(
        () => [
            { 
                label: t("Team"), 
                paramName: "team", 
                type: "select", 
                options: teamCombo, 
                needAll: true
            },
            { 
                label: t("Client"), 
                paramName: "customer", 
                type: "select", 
                options: custCombo, 
                needAll: true
            },
            { 
                label: t("Status"), 
                paramName: "status", 
                type: "select", 
                options: statusCombo, 
                needAll: true
            },
            { 
                label: t("lowerLimit"), 
                paramName: "lowerLimit", 
                type: "number",
            },
        ],
        [t],
    );

return (
    <>
    <SearchBox
        formType={"download"}
        criteria={searchCriteria}
        onSearch={async (query: any) => {
            let index = 0
            let postData: ProjectResourceOverconsumptionReportRequest = {
                status: "All",
                lowerLimit: 0.9
            }
            if (query.team.length > 0 && query.team.toLocaleLowerCase() !== "all") {
                index = teamCombo.findIndex(team => team === query.team)
                postData.teamId = team[index].id
            } 
            if (query.customer.length > 0 && query.customer.toLocaleLowerCase() !== "all") {
                index = custCombo.findIndex(customer => customer === query.customer)
                postData.custId = customer[index].id
            }
            if (Boolean(query.lowerLimit)) {
                postData.lowerLimit = query.lowerLimit/100
            }
            postData.status = query.status
            console.log(postData)
            const response = await fetchProjectResourceOverconsumptionReport(postData)
            if (response) {
                downloadFile(new Uint8Array(response.blobValue), response.filename!!)
            }
        }
    }
    />
</>
    )
}

export default ResourceOverconsumptionReport