import { handleSweetAlert } from "@/components/Modal/SweetAlertConfirm";
import ReactTable from "@/components/ReactTable/ReactTable";
import { listarInclinacoesTelhado } from "@/requests/common/InclinacoesTelhado/listarInclinacoesTelhado";
import { listarOrientacoesSolares } from "@/requests/common/OrientacoesSolares/listarInclinacoesTelhado";
import { cadastrarPerdaMedia } from "@/requests/CRUD/PerdasMedias/cadastrarPerdaMedia";
import { deletarPerdaMedia } from "@/requests/CRUD/PerdasMedias/deletarPerdaMedia";
import { editarPerdaMedia } from "@/requests/CRUD/PerdasMedias/editarPerdaMedia";
import { listarPerdasMedias } from "@/requests/CRUD/PerdasMedias/listarPerdasMedias";
import { useState } from "react";
import { FieldValues } from "react-hook-form";
import { IoTrashOutline } from "react-icons/io5";
import FormPerdasMedias from "./FormPerdasMedias";

const PerdasMediasComponent = () => {
  const [orientacoes, setOrientacoes] = useState<any[]>([]);
  const [inclinacoes, setInclinacoes] = useState<any[]>([]);

  const columns = [
    {
      header: "Código",
      accessorKey: "id_perda",
    },
    {
      header: "Status",
      accessorKey: "status_perda",
    },
    {
      header: "% Perda",
      accessorKey: "valor_perda",
    },
    {
      header: "Orientação",
      accessorKey: "orientacao_perda",
    },
    {
      header: "Inclinação",
      accessorKey: "inclinacao_perda",
    },
  ];

  async function formatarPerdasMedias(arr: any[]) {
    let orientacoesList: any[] = [];
    let inclinacoesList: any[] = [];

    if (orientacoes.length === 0) {
      orientacoesList = await listarOrientacoesSolares().then((res) => {
        setOrientacoes(res);
        return res;
      });
    } else {
      orientacoesList = orientacoes;
    }

    if (inclinacoes.length === 0) {
      inclinacoesList = await listarInclinacoesTelhado().then((res) => {
        setInclinacoes(res);
        return res;
      });
    } else {
      inclinacoesList = inclinacoes;
    }

    return arr.map((perda) => {
      // Formatar orientação
      if (perda["orientacao_perda"]) {
        const orientacao = orientacoesList.find(
          (o) => o.id_orientacao === perda["orientacao_perda"]
        );
        perda["orientacao_perda"] = orientacao
          ? `${orientacao.sigla_orientacao} - ${orientacao.nome_orientacao}`
          : perda["orientacao_perda"];
      }

      // Formatar inclinação
      if (perda["inclinacao_perda"]) {
        const inclinacao = inclinacoesList.find(
          (i) => i.id_inclinacao === perda["inclinacao_perda"]
        );
        perda["inclinacao_perda"] = inclinacao
          ? `${inclinacao.valor_inclinacao}%`
          : perda["inclinacao_perda"];
      }

      // Formatar valor da perda
      if (perda["valor_perda"]) {
        perda["valor_perda"] = `${perda["valor_perda"]}%`;
      }

      return perda;
    });
  }

  const onSubmitFunction = async (data: FieldValues) => {
    return cadastrarPerdaMedia(data);
  };

  const onEditFunction = async (data: FieldValues) => {
    return editarPerdaMedia(data);
  };

  const deleteFunction = async (id_perda: string) => {
    return deletarPerdaMedia({ id_perda });
  };

  return (
    <ReactTable
      columns={columns}
      listFunction={listarPerdasMedias}
      formatFunction={formatarPerdasMedias}
      idCol="id_perda"
      isActiveCol="status_perda"
      canEdit
      canDesactive
      editFunction={onEditFunction}
      createFunction={onSubmitFunction}
      Form={(props) => (
        <FormPerdasMedias
          {...props}
          orientacoes={orientacoes}
          inclinacoes={inclinacoes}
        />
      )}
      pageName="Perdas Médias"
      actionButtons={(rowData: any, updateTable: any, setIsLoading: any) => [
        {
          className: "bg-danger text-white",
          onClick: (e: any) => {
            handleSweetAlert(
              {
                icon: "error",
                title: "Deletar Perda Média",
                html: `Tem certeza que deseja <b>Deletar</b> a Perda Média <b>${rowData.valor_perda}</b>?`,
              },
              () => {
                setIsLoading(true);
                deleteFunction(rowData.id_perda)
                  .then(() => updateTable())
                  .finally(() => setIsLoading(false));
              }
            );
          },
          content: <IoTrashOutline />,
        },
      ]}
    />
  );
};

export default PerdasMediasComponent;