import React, { useEffect } from "react";

interface ItemCompra {
  tipo_item_pendencia_compra_material: string;
  valor_pendencia_compra_material: string;
  qtd_pendencia_compra_material: string;
  origem_item_pendencia_compra_material: string;
  previsto_pendencia_compra_material: string;
  realizado_pendencia_compra_material: string;
}

interface CustoExtra {
  id_custo_extra: string;
  nome_custo_extra: string;
  value: string;
  tabelaPrecos: {
    de_custo_extra_tabela: number;
    ate_custo_extra_tabela: number;
    qtd_custo_extra_tabela: number;
  }[];
}

interface Proposta {
  status_proposta: string;
  modulosDigitado_proposta: number;
}
interface Precificacao {
  custos_extras: CustoExtra[];
  [key: string]: any;
}
interface Props {
  itensCompra: ItemCompra[];
  dadosCard: {
    propostas: Proposta[];
  };
  setItensCompra: any;
  dadosKit: any;
  proposta: any;
  precificacao: any;
  custosExtras: CustoExtra[];
}

const OrcamentoTabela: React.FC<Props> = ({
  itensCompra,
  dadosCard,
  custosExtras,
  dadosKit,
  proposta,
  setItensCompra,
  precificacao,
}) => {
  const qtdModulos =
    dadosCard.propostas.find((p) => p.status_proposta === "1")
      ?.modulosDigitado_proposta ?? 0;

  const precificacaoFormat: Precificacao = React.useMemo(() => {
    try {
      return JSON.parse(precificacao);
    } catch (e) {
      console.error("Erro ao parsear precificação:", e);
      return { custos_extras: [] };
    }
  }, [precificacao]);
  const custosExtrasIds = custosExtras.map((c) => c.id_custo_extra);

  const custosExtrasFiltrados = precificacaoFormat.custos_extras.filter(
    (custo) => custosExtrasIds.includes(custo.id_custo_extra)
  );
  const calcularValorTotal = (item: ItemCompra) => {
    const valor = item?.valor_pendencia_compra_material
      .replace(".", "")
      .replace(",", ".");
    const qtd = Number(item?.qtd_pendencia_compra_material);
    return (parseFloat(valor) * qtd).toLocaleString("pt-BR", {
      minimumFractionDigits: 2,
      maximumFractionDigits: 2,
    }) as never;
  };
  const calcularValorReal = (item: ItemCompra): number => {
    const tipo = item?.tipo_item_pendencia_compra_material;
    const qtd = Number(item?.qtd_pendencia_compra_material);
    const origem = item?.origem_item_pendencia_compra_material;

    if (tipo === "" || tipo === "0") return 0;
    if (origem === "kit") {
      const total = dadosKit.componentesKit
        .filter((kit: any) => kit.categoria === tipo)
        .reduce((acc: number, kit: any) => {
          // const qtd = parseFloat(kit.qtd_item || "0");
          const preco = parseFloat(kit.precoUnitario_item || "0");
          return acc + qtd * preco;
        }, 0);
      return total;
    }

    const custoExtra = custosExtrasFiltrados.find(
      (ce) => ce.id_custo_extra === tipo
    );
    if (custoExtra) {
      return +custoExtra.value;
    }

    return 0;
  };
  useEffect(() => {
    if (!dadosKit || !precificacao || itensCompra.length === 0) return;

    const precificacaoFormat = (() => {
      try {
        return JSON.parse(precificacao);
      } catch (e) {
        console.error("Erro ao parsear precificação:", e);
        return { custos_extras: [] };
      }
    })();

    const custosExtrasIds = custosExtras.map((c) => c.id_custo_extra);
    const custosExtrasFiltrados = precificacaoFormat.custos_extras.filter(
      (custo: any) => custosExtrasIds.includes(custo.id_custo_extra)
    );

    const calcularValorPrevisto = (item: any) => {
      const tipo = item?.tipo_item_pendencia_compra_material;
      const origem = item?.origem_item_pendencia_compra_material;
      const qtd = item?.qtd_pendencia_compra_material;

      if (tipo === "" || tipo === "0") return 0;
      if (origem === "kit") {
        return dadosKit.componentesKit
          .filter((kit: any) => kit.categoria === tipo)
          .reduce((acc: number, kit: any) => {
            // const qtd = parseFloat(kit.qtd_item || "0");
            const preco = parseFloat(kit.precoUnitario_item || "0");
            return acc + qtd * preco;
          }, 0);
      }

      const custoExtra = custosExtrasFiltrados.find(
        (ce: any) => ce.id_custo_extra === tipo
      );
      return custoExtra ? parseFloat(custoExtra.value || "0") : 0;
    };

    const itensAtualizados = itensCompra.map((item: any) => {
      const previsto = calcularValorPrevisto(item);
      const realizado = parseFloat(item.valor_pendencia_compra_material || "0");
      return {
        ...item,
        previsto_pendencia_compra_material: previsto,
        realizado_pendencia_compra_material: realizado,
      };
    });

    const hasChanges = itensCompra.some((item, idx) => {
      return (
        item.previsto_pendencia_compra_material !==
          itensAtualizados[idx].previsto_pendencia_compra_material ||
        item.realizado_pendencia_compra_material !==
          itensAtualizados[idx].realizado_pendencia_compra_material
      );
    });

    if (hasChanges) {
      setItensCompra(itensAtualizados);
    }
  }, [dadosKit, precificacao, custosExtras]);

  const getNomeItem = (item: ItemCompra): string => {
    const origem = item?.origem_item_pendencia_compra_material;
    const tipo = item?.tipo_item_pendencia_compra_material;
    if (tipo === "") return "";
    if (origem === "kit") {
      return tipo;
    }

    const custoExtra = custosExtras.find((ce) => ce.id_custo_extra === tipo);
    return custoExtra?.nome_custo_extra ?? "";
  };

  return (
    <div className="w-full border border-gray-300 rounded-md p-4 mb-4">
      <h3 className="text-lg font-bold mb-2">Orçamento</h3>
      <table className="w-full text-left border-collapse text-sm">
        <thead>
          <tr className="border-b font-semibold">
            <th className="p-1">Item</th>
            <th className="p-1">Qtd</th>
            <th className="p-1">Previsto</th>
            <th className="p-1">Real</th>
            <th className="p-1">Total</th>
          </tr>
        </thead>
        <tbody>
          {itensCompra.map((item, idx) => {
            const nome = getNomeItem(item);
            const valorPrevisto = calcularValorReal(item);
            const valorTotal = calcularValorTotal(item);
            return (
              <tr key={idx} className="border-b">
                <td className="p-1">{nome}</td>
                <td className="p-1">{item.qtd_pendencia_compra_material}</td>
                <td className="p-1">
                  R${" "}
                  {
                    valorPrevisto.toLocaleString("pt-BR", {
                      minimumFractionDigits: 2,
                      maximumFractionDigits: 2,
                    }) as never
                  }
                </td>
                <td className="p-1">
                  R$ {item.valor_pendencia_compra_material ?? 0}
                </td>
                <td className="p-1">R$ {valorTotal ?? 0}</td>
              </tr>
            );
          })}
        </tbody>
      </table>
    </div>
  );
};
export default OrcamentoTabela;