import Button from "@/components/Forms/Button";
import React, { useEffect, useState } from "react";
// import { listarFabricantes } from "@/requests/CRUD/Fabricante/listarFabricantes";
import { listarDistribuidores } from "@/requests/CRUD/Distribuidores/listarDistribuidores";

import { baixarAwsContent } from "@/requests/common/Aws/baixarAws";
import { listarCamposPersonalizados } from "@/requests/CRUD/CamposPersonalizados/listarCamposPersonalizados";
import { listarComponentesKitByKitId } from "@/requests/CRUD/ColetaDados/cadastroColetaDados";
import { listarDistribuidoresNativos } from "@/requests/CRUD/Distribuidores/listarDistribuidoresNativos";
import { listarCustosExtras } from "@/requests/CRUD/Politica/listarCustosExtras";
import { useScreenContext } from "@/src/contexts/ScreenContext";
import { GetForm } from "@/utils";
import equal from "fast-deep-equal";
import { useMemo } from "react";
import { toast } from "react-toastify";
import CamposPersonalizados from "../../campos_personalizados";
import ItemPendenciaCompraMaterial from "./ItemPendenciaCompraMaterial";
const criarItemCompraPadrao = (id_coleta_cliente: string) => ({
  cod_coleta_pendencia_compra_material: id_coleta_cliente,
  data_pendencia_compra_material: "",
  numero_pedido_pendencia_compra_material: "",
  fornecedor_pendencia_compra_material: "",
  descricao_pendencia_compra_material: "",
  valor_pendencia_compra_material: "",
  tipo_item_pendencia_compra_material: "",
  observacao_pendencia_compra_material: "",
  anexos: [],
});
interface CustoExtra {
  id_custo_extra: string;
  nome_custo_extra: string;
  descricaoProposta_custo_extra: string;
  value: string;
}
interface Precificacao {
  custos_extras: CustoExtra[];
  [key: string]: any;
}
const PendenciaCompraMaterial = ({ dadosCard, onSubmitFunction }: any) => {
  const [distribuidores, setDistribuidores] = useState<any[]>([]);
  const [custosExtras, setCustosExtras] = useState<any[]>([]);
  const [dadosKit, setDadosKit] = useState<any[]>([]);
  const [camposPersonalizados, setCamposPersonalizados] = useState<any[]>([]);
  const [itensCompra, setItensCompra] = useState<any[]>([
    criarItemCompraPadrao(dadosCard.id_coleta_cliente),
  ]);
  const [precificacao, setPrecificacao] = useState<any>([]);
  const [handleSubmits, setHandleSubmits] = useState<any[]>([]);

  const validateNewHandleSubmits = (
    value: any[] | ((prev: any[]) => any[]),
  ) => {
    // 1. Resolve o valor (se for função, executa; se não, usa o valor direto)
    const nextValue =
      typeof value === "function" ? value(handleSubmits) : value;

    // 2. Executa a sua lógica de validação
    const isValid =
      nextValue?.length != handleSubmits?.length &&
      !equal(nextValue, handleSubmits);
    if (isValid) {
      setHandleSubmits(nextValue);
    }
  };
  const [isLoading, setIsLoading] = useState(false);
  const [keyListItens, setKeyListItens] = useState(0);
  const [openModalVisualizaItens, setOpenModalVisualizaItens] = useState(false);
  const [
    openModalVisualizaItensComprados,
    setOpenModalVisualizaItensComprados,
  ] = useState(false);
  const { isMobile } = useScreenContext();

  const { handleSubmit, ...form } = GetForm();

  const propostaAprovada = useMemo(() => {
    return dadosCard?.propostas.find((p: any) => p.status_proposta === "1");
  }, [dadosCard?.propostas]);

  useEffect(() => {
    // Evita execução se propostaAprovada não está definida
    if (!propostaAprovada) return;

    const fetchData = async () => {
      try {
        const [dist, distNativos, kit, custos, precificacaoData] =
          await Promise.all([
            listarDistribuidores(),
            listarDistribuidoresNativos(),
            listarComponentesKitByKitId(propostaAprovada.kit_proposta),
            listarCustosExtras({
              tipo_negocio: dadosCard.tipoNegocio_coleta,
              id_loja: dadosCard.id_loja_coleta,
            }),
            baixarAwsContent(
              propostaAprovada.caminho_resultadoPrecificacao_proposta,
            ),
          ]);

        setDistribuidores([
          ...distNativos,
          ...dist.filter((d: any) => d.isFornecedor_distribuidor === 0),
        ]);
        setDadosKit(kit);
        setCustosExtras(custos);
        setPrecificacao(precificacaoData);
      } catch (error) {
        console.error("Erro ao carregar dados:", error);
        toast.error("Erro ao carregar dados necessários.");
      }
    };

    fetchData();
  }, [
    propostaAprovada?.kit_proposta,
    propostaAprovada?.caminho_resultadoPrecificacao_proposta,
    dadosCard?.tipoNegocio_coleta,
    dadosCard?.id_loja_coleta,
  ]);

  // Campos personalizados
  useEffect(() => {
    listarCamposPersonalizados().then((res) => {
      const ativos = res.filter(
        (item: any, idx: number, arr: any[]) =>
          item.status_campo_personalizado === "1" &&
          idx ===
            arr.findIndex(
              (t: any) =>
                t.id_campo_personalizado === item.id_campo_personalizado,
            ),
      );
      setCamposPersonalizados(ativos);
    });
  }, []);
  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),
  );
  useEffect(() => {
    const itensForm = form.control._formValues?.itensCompra;
    if (
      !itensForm ||
      JSON.stringify(itensCompra) !== JSON.stringify(itensForm)
    ) {
      form.setValue("itensCompra", itensCompra);
    }
  }, [itensCompra]);

  const onSubmitFormPendenciaCompraMaterial = async (e: any) => {
    setIsLoading(true);
    try {
      await Promise.all(
        handleSubmits.map(
          (handleSubmitItem) =>
            new Promise((resolve, reject) =>
              handleSubmitItem((data: any) => resolve(true))(e).finally(() =>
                reject(false),
              ),
            ),
        ),
      );

      const camposPersonalizadosValidos = Object.fromEntries(
        Object.entries(form.control._formValues).filter(([key, value]) => {
          const isCampoPersonalizado = /_campo_personalizado(?:~\d+)?$/.test(
            key,
          );
          const isValid =
            (typeof value === "string" && value.trim() !== "") ||
            (Array.isArray(value) &&
              value.length > 0 &&
              value.every(
                (item) =>
                  typeof item === "object" &&
                  item !== null &&
                  "value" in item &&
                  (typeof item.value === "string"
                    ? item.value.trim() !== ""
                    : true),
              ));
          return isCampoPersonalizado && isValid;
        }),
      );

      await onSubmitFunction(itensCompra, camposPersonalizadosValidos);
    } catch (err) {
      toast.error("Erro ao salvar dados.");
      console.error(err);
    } finally {
      setIsLoading(false);
    }
  };

  const addNovoItem = () => {
    setItensCompra((prev) => [
      criarItemCompraPadrao(dadosCard.id_coleta_cliente),
      ...prev,
    ]);
    setKeyListItens((prev) => prev + 1);
  };

  const camposCustomFiltrados = camposPersonalizados.filter(
    (a: any) =>
      a.cadaTopico_campo_personalizado === "2" &&
      a.local_campo_personalizado === "5",
  );
  const salvarCamposPersonalizados = () => {
    // ("Vai ser salvo aqui ");
  };
  return (
    <div key={keyListItens}>
      {camposPersonalizados?.filter(
        (a: any) =>
          a.cadaTopico_campo_personalizado === "2" &&
          a.local_campo_personalizado === "5",
      ).length > 0 && (
        <div
          className={`border block p-2 mb-2 pt-5 relative rounded-md border-stroke`}
        >
          <span className="px-1 absolute -top-3 bg-white">
            Campos Personalizados
          </span>
          <CamposPersonalizados
            formulario={form}
            localCampo="5"
            eachTopic="2"
            manualCampos={camposPersonalizados?.filter(
              (a: any) =>
                a.cadaTopico_campo_personalizado === "2" &&
                a.local_campo_personalizado === "5",
            )}
            tipoNegocio={dadosCard?.tipoNegocio_coleta}
            idLoja={dadosCard?.id_loja_coleta}
            dataCard={dadosCard}
            pendenciaID={9}
          />
        </div>
      )}
      <div className="flex flex-col gap-2 max-h-[65vh] overflow-auto">
        {camposPersonalizados &&
          itensCompra.map((itemCompra, indexItem) => {
            return (
              <>
                <ItemPendenciaCompraMaterial
                  key={indexItem}
                  camposPersonalizados={camposPersonalizados}
                  distribuidores={distribuidores}
                  itemCompra={itemCompra}
                  indexItem={indexItem}
                  itensCompra={itensCompra}
                  setItensCompra={setItensCompra}
                  salvarCamposPersonalizados={salvarCamposPersonalizados}
                  setKeyListItens={setKeyListItens}
                  setHandleSubmits={validateNewHandleSubmits}
                  dadosCard={dadosCard}
                  form={form}
                />
              </>
            );
          })}
      </div>
      <div className="w-full flex justify-end pt-3">
        <Button
          type="submit"
          // onClick={handleSubmit(onSubmitFormPendenciaCompraMaterial)}
          onClick={onSubmitFormPendenciaCompraMaterial}
          loading={isLoading}
        >
          Liberar para Compras
        </Button>
      </div>
    </div>
  );
};

export default PendenciaCompraMaterial;