"use client";

import Breadcrumb from "@/components/Breadcrumbs/Breadcrumb";
import Button from "@/components/Forms/Button";
import Container from "@/components/Forms/Container";
import Divider from "@/components/Forms/Divider";
import Input from "@/components/Forms/Input";
import ModalComponente from "@/components/Modal/ModalComponente";
import StepperEtapa from "@/components/Stepper/Stepper";
import LoaderSun from "@/components/common/Loader/LoaderSun";
import DadosGerais from "@/pages/CXESCRM005/DadosGerais";
import ObservacaoColeta from "@/pages/CXESCRM005/Observacao";
import { listarUcsColeta } from "@/requests/CRM/UCs/listarUcsColeta";
import {
  enviarLinkProposta,
  enviarLinkPropostaEmail,
} from "@/requests/CRM/enviarProposta";
import { TiposTelhadoProps } from "@/requests/CRUD/CategoriasTelhado/categoriaTelhadoType";
import {
  listarCategoriasTelhados,
  listarImgCategoriasTelhados,
} from "@/requests/CRUD/CategoriasTelhado/listarCategoriaTelhado";
import { cadastrarColetaDados } from "@/requests/CRUD/ColetaDados/cadastroColetaDados";
import { addConclusaoPendencia } from "@/requests/CRUD/ConclusaoPendencia/conclusaoPendencia";
import { listarDistribuidores } from "@/requests/CRUD/Distribuidores/listarDistribuidores";
import { listarDistribuidoresNativos } from "@/requests/CRUD/Distribuidores/listarDistribuidoresNativos";
import { listarEstruturas } from "@/requests/CRUD/EstruturaFixacao/listarEstruturaFixacao";
import {
  listarFabricantes,
  listarFabricantesLinkados,
} from "@/requests/CRUD/Fabricante/listarFabricantes";
import { listarParametros } from "@/requests/CRUD/ParametrosComerciais/listarParametros";
import { listarTarifasEnergia } from "@/requests/CRUD/TarifaEnergia/listarTarifasEnergia";
import { listarTiposTelhados } from "@/requests/CRUD/TiposTelhados/listarTiposTelhados";
import { listarUsuarioPeloId } from "@/requests/CRUD/Usuario/listarUsuarios";
import {
  ICidade,
  listarCidadesComEstado,
} from "@/requests/common/EstadosCidades/estadosCidades";
import { listarInclinacoesTelhado } from "@/requests/common/InclinacoesTelhado/listarInclinacoesTelhado";
import { listarOrientacoesSolares } from "@/requests/common/OrientacoesSolares/listarInclinacoesTelhado";
import { listarPerdasMedias } from "@/requests/common/PerdasMedias/listarPerdasMedias";
import { listarTiposInstalacao } from "@/requests/common/TiposInstalacao/listarTiposInstalacao";
import { useProposalContext } from "@/src/contexts/ProposalContext";
import { useScreenContext } from "@/src/contexts/ScreenContext";
import { useSocketContext } from "@/src/contexts/SocketContext";
import { useAuth } from "@/src/contexts/authContext";
import { useKanbanContext } from "@/src/contexts/kanbanContext";
import { IValueLabel } from "@/types/formInterfaces";
import {
  FormatFields,
  GetForm,
  calcularAnosEMeses,
  formatarValor,
  getDateTimeBrasil,
} from "@/utils";
import { ApexOptions } from "apexcharts";
import "katex/dist/katex.min.css";

import {
  buscaDadosAmpliacao,
  buscaDadosClienteAmpliacao,
} from "@/requests/CRUD/ColetaDados/editarColeta";
import { listarItensKitsPorTipo } from "@/requests/CRUD/ColetaDados/listarItenskitsDiversos";
import { listarItensCompostos } from "@/requests/CRUD/ItemComposto/listarItem";
import {
  listarPropostaColeta,
  listarPropostasDados,
} from "@/requests/CRUD/Propostas/listarPropostas";
import { obterDistribuicaoModulos } from "@/requests/CRUD/Propostas/obterDistribuicaoModulos";
import {
  listarItensKitTabelaPreco,
  listarTabelasPrecosComponentes,
} from "@/requests/CRUD/TabelaPreco/tabelaPreco";
import { obterTarifaEnergia } from "@/requests/CRUD/TarifaEnergia/obterTarifaEnergia";
import { baixarAwsContent } from "@/requests/common/Aws/baixarAws";
import { useLoja } from "@/src/contexts/lojaContext";
import {
  calcularConsumoBaseUcs,
  obterPorcentagemAumentoConsumo,
} from "@/utils/calcularConsumoComAumento";
import { calcMonthly } from "@/utils/calcules";
import {
  nomeLegivel,
  validarCamposPersonalizadosObrigatorios,
} from "@/utils/validarCamposPersonalizados";
import { isArray } from "lodash";
import { Info } from "lucide-react";
import dynamic from "next/dynamic";
import { useRouter } from "next/router";
import { Fragment, useEffect, useState } from "react";
import { FieldValues } from "react-hook-form";
import { BiLogoWhatsapp } from "react-icons/bi";
import { BsArrowLeftShort, BsFileEarmarkPdf } from "react-icons/bs";
import { HiOutlineMail } from "react-icons/hi";
import { toast } from "react-toastify";
import * as yup from "yup";
import ComponentesProposta from "./ComponentesProposta";
import DadosGeraisAmpliacao from "./DadosGeraisAmpliacao";
import DistribuicaoModulos from "./DistribuicaoModulos";
import FormELB from "./FormELB";
import FormPropostaDrive from "./FormProposta.old";
import KitsProposta from "./KitsProposta";
import MarkupCustosExtrasProposta from "./MarkupCustosExtrasProposta";
import PrecificacaoProposta from "./PrecificacaoProposta";
import ResumoColeta from "./ResumoColeta";
import ResumoProposta from "./ResumoProposta";
import {
  IOrigemDadosDefault,
  origemDadosConfiguracaoGeral,
  origemDadosDeProposta,
} from "@/utils/origemDadosDefault";

const ReactApexChart = dynamic(() => import("react-apexcharts"), {
  ssr: false,
});
declare global {
  interface Window {
    Apex?: any;
  }
}
interface ChartState {
  series: Array<{ name: string; data: number[] }>;
}

const LoaderDadosGerais = () => {
  return (
    <div className="w-full h-[500px] flex flex-col justify-center items-center">
      <LoaderSun />
    </div>
  );
};

const rsi_table = [
  { title: "Ano", value: "ano", type: "year" },
  { title: "Geração anual [kWh]", value: "geracao_anual", type: "kWh" },
  { title: "Consumo direto [kWh]", value: "consumo_direto", type: "kWh" },
  { title: "Tarifa Energia Evitada", value: "tarifa_energia" },
  { title: "Receita Energia Evitada", value: "receita_energia" },
  { title: "Energia Injetada [kWh]", value: "energia_injetada", type: "kWh" },
  { title: "Tarifa SCEE", value: "tarifa_scee" },
  { title: "Receita SCEE", value: "receita_scee" },
  { title: "Receita Bruta", value: "receita_bruta" },
  { title: "Operação e Manutenção", value: "opex" },
  { title: "Seguro", value: "seguro" },
  { title: "Receita Líquida", value: "receita_liquida" },
  { title: "Fluxo de Caixa", value: "fluxo_caixa" },
];

const ColetaDados = ({
  inCard,
  dadosCliente,
  idColeta,
  dadosCard,
  buscaPropostas,
  tarifaEnergia,
  propostaHelte,
  loja,
  setActiveStepPendencias,
  activeStepPendencias,
  setDadosCard,
}: any) => {
  const [isLoaded, setIsLoaded] = useState(false);
  const [isLoadedResumo, setIsLoadedResumo] = useState(false);
  const baseSchema = yup
    .object()
    .shape({})
    .test(
      "custom-required",
      "Campo obrigatório não preenchido",
      function (value: any) {
        const keys = Object.keys(value).filter(
          (key) =>
            value["required_" + key] && (!value[key] || value[key] === "")
        );
        if (keys.length > 0) {
          return this.createError({
            path: keys[0],
            message: "Este campo é obrigatório",
          });
        }
        return true;
      }
    );

  const schemas = [
    baseSchema,
    baseSchema,
    baseSchema,
    baseSchema,
    baseSchema,
    baseSchema,
  ];
  const [stepAtual, setStepAtual] = useState(0);
  const [yupSchema, setYupSchema] = useState<(typeof schemas)[0]>(schemas[0]);
  const [mostrarPdf, setMostrarPdf] = useState(false);
  const [dadosGerados, setDadosGerados] = useState(false);
  const [loadingEmail, setLoadingEmail] = useState(false);
  const [isLoadingWhatsApp, setIsLoadingWhatsApp] = useState(false);
  const [edicaoDados, setEdicaoDados] = useState(false);
  const [isLoading, setIsLoading] = useState(false);
  const [dadosProposta, setDadosProposta] = useState<any>();
  const [lastProposalInfo, setLastProposalInfo] = useState<any>([]);
  const [proposta, setProposta] = useState<any>();
  const [showResumo, setShowResumo] = useState(false);
  const [cidades, setCidades] = useState<IValueLabel[]>([]);
  const [openModalEmail, setOpenModalEmail] = useState(false);
  const [openModalNumeroProposta, setOpenModalNumeroProposta] = useState(false);
  const [propostasColetaAtual, setPropostasColetaAtual] = useState<any[]>([]);
  const [ultimaPropostaGerada, setUltimaPropostaGerada] = useState<any>();
  // Rastreia de onde vieram os DADOS DEFAULT usados nesta geração de proposta.
  // "CONFIGURACAO_GERAL" = Política de Preço / Política de Comissão / Custos Extras
  // lidos das configurações vigentes no momento da geração.
  // "PROPOSTA_EXISTENTE" = parâmetros copiados do JSON de uma proposta anterior,
  // portanto alterações posteriores nas Políticas NÃO estão refletidas.
  const [origemDadosDefault, setOrigemDadosDefault] =
    useState<IOrigemDadosDefault>(() => origemDadosConfiguracaoGeral());
  const { ...form } = GetForm(yupSchema, setYupSchema);
  const handleSubmit = form.handleSubmit;
  const [fabricantesDistribuidor, setFabricantesDistribuidor] = useState<any[]>(
    []
  );
  const { nome, idCliente } = form.control._formValues;
  const formValues = form.control._formValues;
  let camposPersonalizadosSearch: any = null;
  let camposPersonalizadosFormat: any = null;

  if (formValues) {
    camposPersonalizadosSearch = Object.fromEntries(
      Object.entries(formValues).filter(
        ([key, value]) =>
          (key.endsWith("_campo_personalizado") || key.endsWith("_cp")) &&
          ((typeof value === "string" && value.trim() !== "") ||
            (Array.isArray(value) &&
              value.every((v) => typeof v === "string" && v.trim() !== "")))
      )
    );

    camposPersonalizadosFormat = Object.fromEntries(
      Object.entries(camposPersonalizadosSearch).map(([key, value]) => [
        key.split("^")[1] || key,
        value,
      ])
    );
  }

  const route = useRouter();
  const [potenciasJaProcessadas, setPotenciasJaProcessadas] = useState<
    number[]
  >([]);
  const { lojaAtual } = useLoja();
  const [state, setState] = useState<ChartState>({ series: [] });
  const [options, setOptions] = useState<ApexOptions>({});
  const [openModalWhatsApp, setOpenModalWhatsApp] = useState(false);
  const [distribuidores, setDistribuidores] = useState<any[]>([]);
  const [distribuidoresNativos, setDistribuidoresNativos] = useState<any[]>([]);
  const [fabricantes, setFabricantes] = useState<any[]>([]);
  const [fabricantesLinks, setFabricantesLinks] = useState<any[]>([]);
  const [activeStep, setActiveStep] = useState(0);
  const [itensCompostos, setItensCompostos] = useState<any>([]);
  const [itensKitTabelaPreco, setItensKitTabelaPreco] = useState<any[]>([]);
  const [tabelasPrecos, setTabelasPrecos] = useState<any[]>([]);
  const [itensComp, setItensComp] = useState<any>([]);
  const [stringboxes, setStringboxes] = useState<any>([]);
  const [nextStepAction, setNextStepAction] = useState<any>();
  const [dadosAmpliacao, setDadosAmpliacao] = useState<any>([]);
  const { isMobile } = useScreenContext();

  const [apexOptionsGraficoGeracao, setApexOptionsGraficoGeracao] =
    useState<ApexOptions>({});
  const [apexSeriesGraficoGeracao, setApexSeriesGraficoGeracao] = useState<
    { name: string; data: number[] }[]
  >([]);

  const [id_coleta, setId_coleta] = useState();
  const [imgTelhados, setImgTelhados] = useState([]);
  const [activeStepBtn, setActiveStepBtn] = useState(false);
  const { valuesSession, usuario } = useAuth();
  const { session } = valuesSession();
  const id_usuario = session.id_usuario;
  const { handleSubmit: handleWhatsApp, ...formWhatsApp } = GetForm();

  const [defaultValues, setDefaultValues] = useState<any>();
  const [perdasMedias, setPerdasMedias] = useState<any[]>([]);
  const [tiposInstalacao, setTiposInstalacao] = useState<any[]>([]);
  const [categoriasTelhados, setCategoriasTelhados] = useState<
    TiposTelhadoProps[]
  >([]);

  const [inclinacoes, setInclinacoes] = useState<any[]>([]);
  const [orientacoes, setOrientacoes] = useState<any[]>([]);
  const [telhados, setTelhados] = useState<any[]>([]);
  const [estruturas, setEstruturas] = useState<any[]>([]);

  const [ucs, setUcs] = useState<any[]>([]);
  const [vedndedorNegocio, setVedndedorNegocio] = useState<any>();
  const [supervisorNegocio, setSupervisorNegocio] = useState<any>();

  const { handleSubmit: handleEmail, ...formEmail } = GetForm();
  const { handleSubmit: handleNumeroProposta, ...formNumeroProposta } =
    GetForm();

  const [rsiProposta, setRsiProposta] = useState<any>({});

  const { reListarDadosKanban, listarDadosKanban } = useKanbanContext();
  const { relacionarDadosProposta } = useProposalContext();
  const { notificarNotificacao } = useSocketContext();
  const { desformatarNumeros, formatarNumero, formatarNumeroPreciso } =
    FormatFields;
  const [dots, setDots] = useState(0);

  const [isSavingProposal, setIsSavingProposal] = useState(false);
  const [statusSavingProposta, setStatusSavingProposta] = useState();
  useEffect(() => {
    if (!isSavingProposal) return;
    const id = setInterval(() => {
      setDots((d) => (d + 1) % (3 + 1));
    }, 400);
    return () => clearInterval(id);
  }, [isSavingProposal]);

  const dotsStr = ".".repeat(dots);

  // ─── VALIDAÇÃO DE CAMPOS PERSONALIZADOS OBRIGATÓRIOS ─────────────────────
  /**
   * Verifica se todos os campos personalizados obrigatórios do step atual
   * estão preenchidos. Exibe toast com o nome do campo faltante e retorna
   * false se houver algum vazio.
   */
  const validarCamposObrigatoriosDoStep = () => {
    const data = form.control._formValues;
    const { valido, camposVazios } =
      validarCamposPersonalizadosObrigatorios(data);

    if (!valido) {
      camposVazios.forEach((campo: any) => {
        toast.error(
          `O campo "${nomeLegivel(campo)}" é obrigatório e não foi preenchido.`
        );
      });
      return false;
    }
    return true;
  };
  // ─────────────────────────────────────────────────────────────────────────

  const submitFormFunction = async () => {
    // ── Valida campos personalizados obrigatórios antes de gerar PDF ──
    if (!validarCamposObrigatoriosDoStep()) {
      return;
    }

    const data = form.control._formValues;

    const { escolha_negocio, nome_negocio } = form.control._formValues;
    if (!inCard && !escolha_negocio) {
      if (escolha_negocio == "" || escolha_negocio?.value == "") {
        const dados = { id_usuario, data };
        const res = await cadastrarColetaDados(dados).catch((err) => {
          setIsLoading(false);
        });

        if (res.status) {
          setId_coleta(res.body);
          form.setValue(
            "escolha_negocio" as never,
            { label: nome_negocio, value: res.body } as never
          );
          // setIsLoading(true);
          generateProposalPdf(data);
        }
      } else {
        setId_coleta(escolha_negocio.value);
        // setIsLoading(true);
        generateProposalPdf(data);
      }
    } else {
      setId_coleta(idColeta || escolha_negocio?.value);

      // setIsLoading(true);
      generateProposalPdf(data);
    }
    if (id_usuario != 2022) {
      addConclusaoPendencia({
        id_coleta: dadosCard.id_coleta_cliente,
        id_etapa: dadosCard.id_lista,
        id_pendencia: "3",
      }).then((res) => {});
    }
  };
  const [tarifasEnergia, setTarifasEnergia] = useState<any>();
  const [dadosDeJsonProposta, setDadosDeJsonProposta] = useState<any>();
  const [inversoresBD, setInversoresBD] = useState([]);
  useEffect(() => {
    const data = form.control._formValues;

    async function listAllParams() {
      return Promise.all([
        listarUsuarioPeloId(dadosCard.responsaveis["Vendedor"]).then((res) =>
          setVedndedorNegocio(res)
        ),
        listarUsuarioPeloId(dadosCard.responsaveis["Supervisor"]).then((res) =>
          setSupervisorNegocio(res)
        ),

        listarTarifasEnergia().then((res) => {
          const filtred = res.find((tarifa: any) => {
            const isSubgrupoB3 = tarifa.subgrupo_tarifa == "B3";
            const isClassificacaoInvalid =
              tarifa.classificacao_tarifa != 1 &&
              tarifa.classificacao_tarifa != 3;

            const filterB3 = isSubgrupoB3 && isClassificacaoInvalid;
            const filterOthers =
              tarifa.classificacao_tarifa ==
              (dadosCard.tipoNegocio_coleta === "3"
                ? 1
                : data.classificacao_proposta);

            return (
              tarifa.concessionaria_tarifa ==
                (dadosCard.tipoNegocio_coleta === "3"
                  ? dadosCard.concessionaria_coleta
                  : data.id_concessionaria_proposta) &&
              (dadosCard.tipoNegocio_coleta === "3"
                ? dadosCard.concessionaria_coleta
                : data.id_concessionaria_proposta) &&
              tarifa.subgrupo_tarifa ==
                (dadosCard.tipoNegocio_coleta === "3"
                  ? dadosCard.subgrupo_coleta
                  : data.subgrupo_proposta) &&
              (dadosCard.tipoNegocio_coleta === "3"
                ? dadosCard.subgrupo_coleta
                : data.subgrupo_proposta) &&
              tarifa.grupo_tarifa ==
                (dadosCard.tipoNegocio_coleta === "3"
                  ? dadosCard.grupo_coleta
                  : data.grupo_proposta) &&
              (isSubgrupoB3 ? filterB3 : filterOthers)
            );
          });

          form.setValue(
            "preco_tarifa" as never,
            filtred?.preco_fixo_tarifa as never
          );
          form.setValue(
            "preco_aplicacao_tarifa" as never,
            filtred?.preco_aplicacao_tarifa as never
          );
          form.setValue("fiob_tarifa" as never, filtred?.fiob_tarifa as never);
        }),
        listarParametros().then(async (res) => {
          setDefaultValues(res);

          if (
            inCard &&
            dadosCard.tipoNegocio_coleta !== "3" &&
            res?.sugestaoDadosProposta_parametro === "1"
          ) {
            const propostasExistentes = await listarPropostaColeta(
              dadosCard.id_coleta_cliente
            ).catch(() => []);

            if (
              Array.isArray(propostasExistentes) &&
              propostasExistentes.length > 0
            ) {
              const ultima = propostasExistentes.reduce((max: any, p: any) =>
                +p.id_proposta > +max.id_proposta ? p : max
              );
              setPropostasColetaAtual(propostasExistentes);
              setUltimaPropostaGerada(ultima);
              formNumeroProposta.setValue(
                "numero_proposta" as never,
                ultima.id_proposta as never
              );
              setOpenModalNumeroProposta(true);
            }
          }
        }),
        listarItensKitsPorTipo("17").then((res) => {
          setItensCompostos(res);
        }),
        listarItensKitsPorTipo("8").then((res) => {
          setInversoresBD(res);
        }),
        listarItensCompostos().then((res) => {
          setItensComp(res);
        }),
        listarItensKitTabelaPreco().then((res) => {
          setItensKitTabelaPreco(Array.isArray(res) ? res : []);
        }),
        listarTabelasPrecosComponentes().then((res) => {
          setTabelasPrecos(Array.isArray(res) ? res : []);
        }),
        listarItensKitsPorTipo("13").then(setStringboxes),
        listarPerdasMedias().then((res) => {
          form.setValue("perdasMedias", res);
          setPerdasMedias(res);
        }),
        obterTarifaEnergia({
          id_concessionaria: dadosCard?.concessionaria_coleta,
          grupo: dadosCard?.grupo_coleta,
          subgrupo: dadosCard?.subgrupo_coleta,
          tipo_fatura: dadosCard?.perfil_consumo_coleta,
        }).then(setTarifasEnergia),
        dadosCard.tipoNegocio_coleta === "3" &&
          (buscaDadosAmpliacao({ id_coleta: dadosCard.id_coleta_cliente }).then(
            (res) => {
              setDadosAmpliacao(res);
            }
          ),
          dadosCard.cod_coleta !== null &&
            buscaDadosClienteAmpliacao({
              cod_coleta: dadosCard.cod_coleta,
            }).then(async (res) => {
              const distribuicao = await obterDistribuicaoModulos(
                res.id_proposta
              );
              setLastProposalInfo({ ...res, ampliacao: distribuicao });
            })),

        (async () => {
          const promises: Promise<any>[] = [
            listarUcsColeta(dadosCard.id_coleta_cliente),
          ];
          if (dadosCard.tipoNegocio_coleta === "3") {
            promises.push(listarUcsColeta(dadosCard?.cod_coleta));
          }

          const responses = await Promise.all(promises);
          let todasUcs: any[] = [];

          let ucsColeta: any[] = [];
          responses.forEach((res, idx) => {
            const ucsBeneficiarias = res.filter((uc: any) => {
              if (uc.isGeradora_uc_coleta != "0") {
                ucsColeta.push({ ...uc });
              }
              return uc.isGeradora_uc_coleta == "0";
            });

            ucsColeta = [...ucsColeta, ...ucsBeneficiarias];
          });
          ucsColeta.sort((a, b) => {
            if (
              a.isGeradora_uc_coleta === "1" &&
              b.isGeradora_uc_coleta !== "1"
            )
              return -1;
            if (
              a.isGeradora_uc_coleta !== "1" &&
              b.isGeradora_uc_coleta === "1"
            )
              return 1;
            return 0;
          });
          const ucsForm = ucsColeta.map((uc: any, index: number) => ({
            ...uc,
            id_uc_coleta: uc.id_uc_coleta,
            uc: !uc.numero_uc_coleta ? "" : uc.numero_uc_coleta,
            nome:
              uc.isGeradora_uc_coleta == "1"
                ? "UG " + (!uc.numero_uc_coleta ? "" : uc.numero_uc_coleta)
                : "UB " + (!uc.numero_uc_coleta ? "" : uc.numero_uc_coleta),
            key: index,
            valor: uc.valor,
            tipoValor: +uc.valor == +uc.valor ? "Média" : "Mensal",
          }));

          form.setValue("ucs" as never, ucsForm as never);
          setUcs(ucsForm);
        })(),
        listarTiposInstalacao().then((res) => setTiposInstalacao(res)),
        listarCategoriasTelhados().then((res) => setCategoriasTelhados(res)),
        listarOrientacoesSolares().then((res) => setOrientacoes(res)),
        listarInclinacoesTelhado().then((res) => setInclinacoes(res)),
        listarEstruturas().then((arr: any) =>
          setEstruturas(
            arr.filter((estrutura: any) => estrutura.status_estrutura == 1)
          )
        ),
        listarTiposTelhados().then((res) =>
          setTelhados(res.filter((telhado: any) => telhado.status_telhado == 1))
        ),
        listarDistribuidores().then((res) =>
          setDistribuidores(
            res.filter(
              (distribuidor: any) => distribuidor.isNativo_distribuidor == "0"
            )
          )
        ),
        listarDistribuidoresNativos().then((res) =>
          setDistribuidoresNativos(
            res.filter(
              (distribuidor: any) => distribuidor.id_distribuidor != "3"
            )
          )
        ),

        listarFabricantesLinkados().then(setFabricantesLinks),
        listarFabricantes().then((res) =>
          setFabricantes(
            res.filter((fabricante: any) => fabricante.status_fabricante == 1)
          )
        ),
      ]);
    }
    if (inCard) {
      listAllParams().finally(() => setIsLoaded(true));

      const ghi_mensal_arr = dadosCard?.ghi_mensal_coleta;
      if (ghi_mensal_arr) {
        const ghiMensalArr = isArray(ghi_mensal_arr)
          ? ghi_mensal_arr
          : ghi_mensal_arr.split(",");

        const media_irradiacao_mensal =
          ghiMensalArr?.reduce(
            (acc: number, curr: number) => (acc += +curr),
            0
          ) / ghiMensalArr?.length;

        form.setValue("irradiacao_mensal" as never, ghiMensalArr as never);
        form.setValue(
          "media_irradiacao_mensal" as never,
          media_irradiacao_mensal as never
        );
      }

      form.setValue(
        "perfil_consumo_proposta" as never,
        // dadosCard.perfil_consumo_coleta as never
        dadosCard.perfil_consumo_simultaneidade as never
      );
      form.setValue(
        "id_perfil_consumo_proposta" as never,
        dadosCard.perfil_consumo_coleta as never
      );
      form.setValue(
        "valor_simultaneidade_proposta" as never,
        dadosCard.simultaneidade_coleta as never
      );
      form.setValue(
        "disjuntor_proposta" as never,
        dadosCard.disjuntor_coleta as never
      );
      form.setValue(
        "tipoLigacao_proposta" as never,
        dadosCard.tipoLigacao_coleta as never
      );
      const arrayTipo = [
        { value: "1", label: "Monofásico" },
        { value: "2", label: "Bifásico" },
        { value: "3", label: "Trifásico" },
      ];
      form.setValue(
        "nome_tipoLigacao_proposta" as never,
        arrayTipo.find(
          (ligacao) => ligacao.value == dadosCard.tipoLigacao_coleta
        )?.label as never
      );
      form.setValue(
        "concessionaria_proposta" as never,
        // dadosCard.concessionaria_coleta as never
        dadosCard.nome_concessionaria as never
      );
      form.setValue(
        "id_concessionaria_proposta" as never,
        dadosCard.concessionaria_coleta as never
      );
      form.setValue("grupo_proposta" as never, dadosCard.grupo_coleta as never);
      form.setValue(
        "subgrupo_proposta" as never,
        dadosCard.subgrupo_coleta as never
      );
      form.setValue(
        "classificacao_proposta" as never,
        dadosCard.classificacao_coleta as never
      );

      form.setValue("nome" as never, dadosCliente.nome_cliente as never);
      form.setValue("cidade" as never, dadosCliente.cidade_cliente as never);
      form.setValue("cpfcnpj_cliente", dadosCliente.cpfcnpj_cliente);
      form.setValue(
        "cidadeInCard" as never,
        dadosCliente.cidade_cliente as never
      );
      form.setValue(
        "telefone" as never,
        dadosCliente.telefone1_cliente as never
      );
      form.setValue(
        "escolha_negocio" as never,
        {
          label: dadosCard.nome_negocio_coleta,
          value: dadosCard.id_coleta_cliente,
        } as never
      );
    }
    listarCidadesComEstado().then((arr) => {
      setCidades(
        arr.map((estado: ICidade) => ({
          label: `${estado.nome_cidade} - ${estado.estado_cidade}`,
          value: `${estado.id_cidade}`,
        }))
      );
    });
    listarImgCategoriasTelhados().then((res: any) => {
      setImgTelhados(res);
    });

    return () => {
      buscaPropostas();
    };
  }, []);

  useEffect(() => {
    if (lastProposalInfo?.caminhoJson_proposta) {
      baixarAwsContent(lastProposalInfo.caminhoJson_proposta).then((res) => {
        setDadosDeJsonProposta(JSON.parse(res));
      });
    }
  }, [lastProposalInfo]);

  const handleDownload = () => {
    const link = document.createElement("a");
    link.href = dadosProposta.linkProposta;

    link.setAttribute(
      "download",
      dadosProposta.caminho_proposta?.split("/").pop()
    );
    link.setAttribute("target", "_blank");
    link.click();
  };

  const enviarLink = (data: any) => {
    return enviarLinkProposta(data).then((e) => {
      reListarDadosKanban();
      window.open(e["Whatsapp"]);
    });
  };

  const onSubmitWhatsApp = (data: FieldValues) => {
    setIsLoadingWhatsApp(true);

    data["id_usuario"] = session.id_usuario;

    const loadingLink = new Promise((resolve, reject) => {
      enviarLink(data)
        .then(() => {
          setOpenModalWhatsApp(false);
          notificarNotificacao();
          resolve("Concluídio");
        })
        .catch((err) => {
          reject(err);
        })
        .finally(() => {
          setIsLoadingWhatsApp(false);
        });
    });

    toast
      .promise(loadingLink, {
        pending: {
          render(data: any) {
            return "Aguarde";
          },
        },
        success: {
          render(data: any) {
            return "Link criado!";
          },
        },
        error: {
          render(data: any) {
            return data.data;
          },
        },
      })
      .finally(() => setIsLoadingWhatsApp(false));
  };

  const botoes = [
    {
      label: "Editar dados",
      icon: <BsArrowLeftShort size={24} />,
      className:
        "bg-primary max-sm:w-full flex items-center  rounded-md mr-5 py-2",
      onClick: () => {
        setMostrarPdf(false);
        setEdicaoDados(true);
      },
      mostrar: !inCard,
    },
    {
      label: "Enviar por Whatsapp",
      icon: <BiLogoWhatsapp size={isMobile ? 17 : 24} />,
      className:
        "bg-success  max-sm:mb-2 max-sm:px-2 max-sm:!text-xs flex items-center rounded-md py-2",
      onClick: () => {
        const dados: any = {
          caminho_proposta: dadosProposta.caminho_proposta,
          aprovacao_cliente: dadosProposta.aprovacao_cliente,
          coleta_proposta: dadosProposta.coleta_proposta,
          id_proposta: dadosProposta.id_proposta,
          status_proposta: dadosProposta.status_proposta,
          id_cliente: dadosCliente["id_cliente"],
          id_card: dadosCard.id,
        };
        for (const key in dados) {
          formWhatsApp.setValue(key as never, dados[key] as never);
        }

        formWhatsApp.setValue(
          "whatsapp_cliente" as never,
          dadosCliente.telefone1_cliente as never
        );
        setOpenModalWhatsApp(true);
      },
      mostrar: true && statusSavingProposta === 1,
    },
    {
      label: "Enviar por E-mail",
      icon: <HiOutlineMail size={isMobile ? 17 : 24} />,
      className:
        "bg-primary max-sm:!text-xs max-sm:!mt-2 flex max-sm:px-2 items-center max-sm:my-2 rounded-md py-2 gap-1",
      onClick: () => {
        setOpenModalEmail(true);
      },
      mostrar: true && statusSavingProposta === 1,
    },
    {
      label: "Baixar PDF",
      icon: <BsFileEarmarkPdf size={isMobile ? 17 : 20} />,
      className:
        "bg-danger max-sm:!text-xs max-sm:px-2 flex items-center max-sm:my-2 rounded-md py-2 gap-1",
      onClick: handleDownload,
      mostrar: true && statusSavingProposta === 1,
    },
    {
      label: "Salvar PDF Novamente",
      icon: <BsFileEarmarkPdf size={isMobile ? 17 : 20} />,
      className:
        "bg-danger max-sm:!text-xs max-sm:px-2 flex items-center animate-pulse max-sm:my-2 rounded-md py-2 gap-1",
      onClick: handleDownload,
      mostrar: true && statusSavingProposta === 0,
    },
  ];
  const calcTotalConsumo = () => {
    let mediaConsumoMedioBeneficiariaLet = 0;
    let mediaConsumoMensalBeneficiariaLet = 0;

    ucs
      .filter((a: any) => a.isAmpliacao_uc_coleta !== "1")
      .map((ucBeneficiaria) => {
        if (ucBeneficiaria.tipoValor === "Média") {
          mediaConsumoMedioBeneficiariaLet += Number(ucBeneficiaria.valor) || 0;
        } else if (Array.isArray(ucBeneficiaria.valor)) {
          const valoresNumericos = ucBeneficiaria.valor
            .map((mes: any) => parseFloat(mes))
            .filter((val: any) => !isNaN(val));

          const media =
            valoresNumericos.reduce((acc: any, cur: any) => acc + cur, 0) /
            (valoresNumericos.length || 1);

          mediaConsumoMensalBeneficiariaLet += media;
        }
      });

    const consumoTotal =
      mediaConsumoMedioBeneficiariaLet + mediaConsumoMensalBeneficiariaLet;
    return String(Math.round(consumoTotal));
  };
  async function generateProposalPdf(data: any) {
    let chartInstance: any;
    let chartGeracaoInstance: any;

    if (dadosCard.tipoNegocio_coleta !== "3") {
      chartInstance = window.Apex?._chartInstances.find(
        (chart: any) => chart.id === "LineGraph1_"
      );
      chartGeracaoInstance = window.Apex?._chartInstances.find(
        (chart: any) => chart.id === "GraficoGeracao_"
      );
    }
    setIsLoading(true);
    if (
      String(dadosCard.tipoNegocio_coleta) === "3" ||
      (chartInstance && chartGeracaoInstance)
    ) {
      try {
        let chartRsiLet = "";
        let chartGeracaoLet = "";
        if (dadosCard.tipoNegocio_coleta !== "3") {
          const [chartRsi, chartGeracao] = await Promise.all([
            chartInstance.chart.dataURI(),
            chartGeracaoInstance.chart.dataURI(),
          ]);
          chartRsiLet = chartRsi;
          chartGeracaoLet = chartGeracao;
        }

        const somaConsumos = ucs
          .filter((u: any) => u.isAmpliacao_uc_coleta === "1")
          .map((uc: any) =>
            uc.tipoValor === "Mensal"
              ? calcMonthly(uc.valor)
              : Number(uc.valor) || 0
          )
          .reduce((acc: number, cur: number) => acc + cur, 0);
        const data = form.control._formValues;
        const dataColeta: any = {
          ...data,
          id_coleta: idColeta,
          consumoTotal:
            dadosCard.tipoNegocio_coleta === "3"
              ? somaConsumos
              : data.consumoTotal,
          chartRsi: chartRsiLet,
          chartGeracao: chartGeracaoLet,
          idCliente: inCard ? dadosCliente["id_cliente"] : data.idCliente,
          tipoPessoa_cliente: dadosCliente["tipoPessoa_cliente"],
          id_vendedor: dadosCard["responsaveis"]["Vendedor"],
          responsaveis: dadosCard["responsaveis"],
          instituicao_financeira: data.instituicao_financeira,
          ver_foto_vendedor: defaultValues.ver_foto_vendedor_parametro,
        };

        const camposPersonalizados = Object.keys(data).filter((key) =>
          key.endsWith("_cp")
        );
        const formatarNumero = FormatFields.formatarNumero;

        const consumoOrigemCliente = ucs
          .filter((a: any) => a.isGeradora_uc_coleta === "1")
          .map((uc) =>
            uc.tipoValor == "Mensal"
              ? (
                  uc.valor.reduce(
                    (acc: number, curr: number | string) => acc + +curr,
                    0
                  ) /
                  uc.valor.filter((val: number | string) => val !== "").length
                )?.toFixed(0)
              : uc.valor
          );

        const consumoAmpliacao_cliente = ucs
          .filter((a: any) => a?.isAmpliacao_uc_coleta === "1")
          .map(
            (uc: any) =>
              (uc.tipoValor == "Mensal"
                ? (
                    uc.valor.reduce(
                      (acc: number, curr: number | string) => acc + +curr,
                      0
                    ) /
                    uc.valor.filter((val: number | string) => val !== "").length
                  )?.toFixed(0)
                : uc.valor) - Number(calcTotalConsumo() ?? 0)
          );
        const _estimativaRaw =
          dataColeta.estimativa_geracao_mensal ??
          dataColeta.estimativa_geracao_cliente;
        const estimativaBase = Array.isArray(_estimativaRaw)
          ? _estimativaRaw
          : _estimativaRaw !== undefined && _estimativaRaw !== null
            ? [_estimativaRaw]
            : [];
        const _mediaRaw = dataColeta.media_consumos_ucs_mensal;
        const mediaConsumosBase = Array.isArray(_mediaRaw)
          ? _mediaRaw
          : _mediaRaw !== undefined && _mediaRaw !== null
            ? [_mediaRaw]
            : [];

        const dataProposta = {
          ...dataColeta,
          parametros: defaultValues,
          id_card: dadosCard.id,
          totalModulos: Number(
            dataColeta.totalModulos ??
              dataColeta.quantidade_modulos ??
              dataColeta.qtd_modulos ??
              0
          ),
          potenciaKwp: Number(
            dataColeta.kitManual
              ? dataColeta.potenciaKwp
              : dataColeta.kitEscolhido?.potencia_kit
          ),
          potencia_kit:
            Number(
              dataColeta.kitManual
                ? dataColeta.potenciaKwp
                : dataColeta.kitEscolhido?.potencia_kit
            ) || 0,
          resultadoPrecificacao_proposta: dataColeta.resultadoPrecificacao
            ? JSON.stringify(dataColeta.resultadoPrecificacao)
            : "",
          ...camposPersonalizados.reduce((acc: any, key) => {
            acc[key] = data[key];
            return acc;
          }, {}),
          consumoAmpliacao_cliente:
            dadosCard.tipoNegocio_coleta === "3"
              ? consumoAmpliacao_cliente
              : null,
          consumoOrigem_cliente:
            dadosCard.tipoNegocio_coleta === "3" ? consumoOrigemCliente : null,
          estimativa_geracao_mensal: [
            ...estimativaBase,
            dadosCard.tipoNegocio_coleta === "3" && lastProposalInfo
              ? lastProposalInfo?.estimativa_proposta
              : +dataColeta.estimativa_geracao,
          ],
          media_consumos_ucs_mensal: [
            ...mediaConsumosBase,
            +dataColeta.consumoTotal,
          ],
          id_loja: dadosCard?.id_loja_coleta,
          id_tipo_negocio: dadosCard?.tipoNegocio_coleta,
          tipoNegocio_coleta: dadosCard?.tipoNegocio_coleta,
          cliente_cpf: dadosCliente?.cpfcnpj_cliente,
          // Fica por último de propósito: sobrescreve qualquer origem herdada
          // de uma proposta reaproveitada via "Buscar Dados da Proposta".
          origem_dados_default: origemDadosDefault,
          // % de Aumento de Consumo e Consumo Médio Real gravados na proposta
          // (o % pode variar de uma proposta para outra)
          percentual_aumento_consumo: obterPorcentagemAumentoConsumo(
            data.porcentagemGeracao,
            defaultValues?.margem_geracao_parametro
          ),
          consumo_medio_real:
            Number(data.consumoBase) || calcularConsumoBaseUcs(ucs),
        };
        // const validade_proposta = new Date();
        // validade_proposta.setDate(
        //   validade_proposta.getDate() +
        //     +defaultValues.tempo_validade_proposta_parametro
        // );
        const outrosCustos_Cosip = dataProposta.ucs.reduce(
          (acc: number, uc: any) => {
            return (acc += +uc.cosip_uc_coleta + +uc.outros_custos_uc_coleta);
          },
          0
        );

        const tipoLigacao =
          dadosCard.tipoLigacao_coleta == "1"
            ? 30
            : dadosCard.tipoLigacao_coleta == "2"
              ? 50
              : 100;

        const valorMensalSemSolar =
          (dataProposta.consumoTotal < tipoLigacao
            ? tipoLigacao
            : dataProposta.consumoTotal *
              +FormatFields.desformatarNumeros(
                dataProposta.precoTotal_tarifa
              )) + outrosCustos_Cosip;

        const valorMensalComSolar =
          (dataProposta.consumoTotal - +dataProposta.estimativa_geracao <
          tipoLigacao
            ? tipoLigacao
            : (dataProposta.consumoTotal - +dataProposta.estimativa_geracao) *
              +FormatFields.desformatarNumeros(
                dataProposta.precoTotal_tarifa
              )) + outrosCustos_Cosip;

        const valorMensalEconomia = valorMensalSemSolar - valorMensalComSolar;
        const potencia_kit = Number(
          dataProposta.kitManual
            ? +dataProposta.potenciaKwp
            : +dataProposta.kitEscolhido?.potencia_kit
        );
        const simultaneidade =
          dadosCard.tipoNegocio_coleta === "3" && lastProposalInfo
            ? dadosCard.cod_coleta
              ? lastProposalInfo?.simultaneidade_coleta
              : defaultValues.simultaneidade_proposta
            : dadosCard.simultaneidade_coleta;
        const tabela_geracao_val = {
          geracoes: dataProposta.estimativa_geracao_mensal.map(
            (geracao: any) => `${formatarNumero(+geracao)} kWh`
          ),
          consumos: dataProposta.media_consumos_ucs_mensal.map(
            (consumo: any) => `${formatarNumero(+consumo)} kWh`
          ),
          consumos_instantaneos: dataProposta.media_consumos_ucs_mensal.map(
            (consumo: any) =>
              `${formatarNumero(+consumo * (+simultaneidade / 100))} kWh`
          ),
          energias_ingetadas: dataProposta.estimativa_geracao_mensal.map(
            (geracao: any, index_geracao: number) =>
              `${formatarNumero(
                +geracao -
                  +dataProposta.media_consumos_ucs_mensal.map(
                    (consumo: any) => +consumo * (+simultaneidade / 100)
                  )[index_geracao] >=
                  0
                  ? +geracao -
                      +dataProposta.media_consumos_ucs_mensal.map(
                        (consumo: any) => +consumo * (+simultaneidade / 100)
                      )[index_geracao]
                  : 0
              )} kWh`
          ),
          porcentagens_geracaoes: dataProposta.estimativa_geracao_mensal.map(
            (geracao: any, index_geracao: number) =>
              `${formatarNumero((+geracao / +dataProposta.media_consumos_ucs_mensal[index_geracao]) * 100)} %`
          ),
        };

        const meses = [
          "Janeiro",
          "Fevereiro",
          "Março",
          "Abril",
          "Maio",
          "Junho",
          "Julho",
          "Agosto",
          "Setembro",
          "Outubro",
          "Novembro",
          "Dezembro",
          "Média",
        ];

        const mesesSigla = [
          "JAN",
          "FEV",
          "MAR",
          "ABR",
          "MAI",
          "JUN",
          "JUL",
          "AGO",
          "SET",
          "OUT",
          "NOV",
          "DEZ",
          "MÉD",
        ];

        const tabela_geracao = meses.reduce((acc: any[], curr, currIndex) => {
          return [
            ...acc,
            {
              mes: curr,
              mesSigla: mesesSigla[currIndex],
              geracao: tabela_geracao_val["geracoes"][currIndex],
              consumo: tabela_geracao_val["consumos"][currIndex],
              consumo_instantaneo:
                tabela_geracao_val["consumos_instantaneos"][currIndex],
              energia_injetada:
                tabela_geracao_val["energias_ingetadas"][currIndex],
              porcentagem_geracao:
                tabela_geracao_val["porcentagens_geracaoes"][currIndex],
            },
          ];
        }, []);
        let faceTelhado =
          dataProposta.distribuicaoDosModulos
            ?.map(
              (orientacaoDistribuicao: any) =>
                orientacoes?.find(
                  (orientacao: any) =>
                    orientacao.id_orientacao ==
                    orientacaoDistribuicao.orientacao
                )?.nome_orientacao
            )
            ?.join(", ") || "";

        if (
          dadosCard.tipoNegocio_coleta === "3" &&
          dadosCard.cod_coleta &&
          dadosDeJsonProposta
        ) {
          faceTelhado =
            dadosDeJsonProposta?.dadosProposta?.distribuicaoDosModulos
              ?.map(
                (orientacaoDistribuicao: any) =>
                  orientacoes?.find(
                    (orientacao: any) =>
                      orientacao.id_orientacao ==
                      orientacaoDistribuicao.orientacao
                  )?.nome_orientacao
              )
              ?.join(", ") || "";
        }
        if (dadosCard.tipoNegocio_coleta === "3" && !dadosCard.cod_coleta) {
          faceTelhado =
            orientacoes
              ?.filter((o: any) =>
                dadosAmpliacao?.orientacoes_integrador_ampliacao
                  ?.split(",")
                  .includes(o.id_orientacao)
              )
              ?.map((a: any) => a.nome_orientacao)
              ?.join(",") || "";
        }
        const tabelaInversoresOrigem = Array.isArray(
          dadosAmpliacao?.tabela_inversores_origem
        )
          ? dadosAmpliacao.tabela_inversores_origem
              .filter((item: any) => {
                const nome = String(
                  item?.descricao_item ?? item?.descricao ?? ""
                )
                  .trim()
                  .toLowerCase();
                return (
                  nome !== "proposta sem inversores" && nome !== "sem inversor"
                );
              })
              .map((item: any) => ({
                qtd_item: item?.qtd_item ?? "",
                descricao_item:
                  item?.descricao_item ?? item?.descricao ?? "Não Informado",
                fabricante: item?.fabricante ?? "",
                modelo: item?.modelo ?? "",
                fase: item?.fase ?? "",
                potencia: item?.potencia ?? "",
                cpmin: item?.cpmin ?? "",
                cpmax: item?.cpmax ?? "",
              }))
          : [];

        const primeiraLinhaInversorOrigem = tabelaInversoresOrigem[0] || null;

        const tabelaInversoresAmpliacao = (dataProposta?.componentesKit || [])
          .filter(
            (item: any) =>
              item?.id_tipo_item == "8" &&
              item?.qtd_item != 0 &&
              item?.descricao_item?.toLowerCase() !== "sem inversor"
          )
          .map((item: any) => ({
            qtd_item: item?.qtd_item ?? "",
            descricao_item: item?.descricao_item ?? "Não Informado",
            fabricante:
              fabricantes.find(
                (a: any) => a.id_fabricante === item?.codFabricante_item
              )?.nome_fabricante ?? "",
            modelo: item?.modelo_item ?? "",
            fase: item?.fases_item ?? "",
            potencia: item?.potencia_item ?? "",
            cpmin: item?.potenciaNominalMin_item ?? "",
            cpmax: item?.potenciaNominalMaxima_item ?? "",
          }));

        const pdfData = {
          min_modulos: (() => {
            const inversoresValidos = dataProposta.componentesKit.filter(
              (e: any) =>
                e.id_tipo_item == "8" &&
                e.qtd_item != 0 &&
                e.descricao_item?.toLowerCase() !== "sem inversor"
            );

            if (inversoresValidos.length === 0) {
              return "Proposta sem Inversores";
            }

            return dadosCard.tipoNegocio_coleta === "3" &&
              dataProposta.tipo_ampliacao.value == 0
              ? "Não definido"
              : dataProposta.minModulos;
          })(),
          max_modulos: (() => {
            const inversoresValidos = dataProposta.componentesKit.filter(
              (e: any) =>
                e.id_tipo_item == "8" &&
                e.qtd_item != 0 &&
                e.descricao_item?.toLowerCase() !== "sem inversor"
            );

            if (inversoresValidos.length === 0) {
              return "Proposta sem Inversores";
            }

            return dadosCard.tipoNegocio_coleta === "3" &&
              dataProposta.tipo_ampliacao.value == 0
              ? "Não definido"
              : dataProposta.maxModulos;
          })(),
          nome_cliente: dataProposta.nome,
          geracao_mensal_total_ampliacao:
            formValues?.geracao_mensal_total_ampliacao ?? "Não definido",
          geracao_anual_total_ampliacao:
            formValues?.geracao_anual_total_ampliacao ?? "Não definido",
          quantidade_modulos_total_ampliacao:
            formValues?.quantidade_modulos_total_ampliacao ?? "Não definido",
          potencia_sistema_total_ampliacao:
            formValues?.potencia_sistema_total_ampliacao ?? "Não definido",
          geracao_mensal_origem:
            formValues?.estimativa_geracao_cliente ?? "Não definido",
          geracao_anual_origem:
            (+formValues?.estimativa_geracao_cliente * 12).toFixed(2) ??
            "Não definido",
          qtd_modulos_origem: formValues?.qtd_modulos_origem,
          potencia_sistema_origem: formValues?.potencia_sistema_origem,
          potencia_sistema_total: formValues?.potencia_sistema_total,
          qtd_inversores_origem:
            dadosAmpliacao?.qtdInversores_ampliacao ??
            primeiraLinhaInversorOrigem?.qtd_item ??
            "Não definido",
          potencia_modulos_origem:
            dadosAmpliacao?.potenciaModulos_ampliacao ?? "Não definido",
          potencia_inversores_origem:
            dadosAmpliacao?.potenciaInversores_ampliacao ?? "Não definido",
          nome_vendedor: vedndedorNegocio.nome_usuario,
          telefone_vendedor: vedndedorNegocio.telefone1_usuario,
          email_vendedor: vedndedorNegocio.email_usuario,
          nome_supervisor: supervisorNegocio.nome_usuario,
          numero_proposta: undefined,
          numero_negocio: dataProposta.id_coleta,
          disjuntor_coleta: dataProposta.disjuntor_proposta,
          email_cliente: "email@mockado.com",
          telefone_cliente: dataProposta.telefone,
          cidade_cliente: dataProposta.cidade.label,
          distribuidora_energia: dataProposta.concessionaria_proposta,
          ligacao_cliente: dataProposta.nome_tipoLigacao_proposta,
          img_grafico_rsi:
            dadosCard.tipoNegocio_coleta === "3"
              ? ""
              : dataProposta.chartRsi.imgURI,
          img_grafico_geracao:
            dadosCard.tipoNegocio_coleta === "3"
              ? ""
              : dataProposta.chartGeracao.imgURI,
          potencia_kit: formatarNumero(
            dataProposta.kitManual
              ? +dataProposta.potenciaKwp
              : +dataProposta.kitEscolhido?.potencia_kit
          ),
          ...camposPersonalizados.reduce((acc: any, key) => {
            acc[key] = data[key];
            return acc;
          }, {}),
          potencia_modulos: dataProposta.potencia_modulo,
          potencia_inversores: (() => {
            const inversoresValidos = dataProposta.componentesKit.filter(
              (e: any) => e.id_tipo_item == "8" && e.qtd_item != 0
            );

            if (inversoresValidos.length === 0) {
              return "Proposta sem Inversores";
            }

            return dataProposta.potencia_inversores;
          })(),
          quantidade_modulos: dataProposta.totalModulos,
          valor_bruto: formatarValor(
            +dataProposta.resultadoPrecificacao?.preco_venda
          ),
          porcentagem_desconto: formatarValor(
            dataProposta.porcentagemValorFinal
              ? +FormatFields.desformatarNumeros(
                  dataProposta.porcentagemValorFinal
                )
              : 0
          ),
          valor_final: formatarValor(
            // +FormatFields.desformatarNumeros(
            //   dataProposta.preco_venda_aplicando_comissao
            // )
            dataProposta.ajusteValorFinalProposta
          ),
          observacoes: dataProposta.obsColeta,
          componentes_tabela_kit_val: (() => {
            let componentesFormatados = [];
            if (
              dataProposta.componentesKit &&
              dataProposta.componentesKit.length > 0
            ) {
              componentesFormatados = dataProposta.componentesKit.map(
                (componente: any) => {
                  const elementos = [1, 2, 3, 4];
                  const isModuloOuInversor =
                    componente.id_tipo_item == "9" ||
                    componente.id_tipo_item == "8";
                  const qtdCalculada =
                    componente.id_tipo_item == "9"
                      ? elementos.reduce(
                          (accumulator, currentValue) =>
                            accumulator +
                            +(
                              dataProposta[
                                `qtdModulos${currentValue}_proposta`
                              ] || 0
                            ),
                          0
                        )
                      : "INCLUSO";
                  return {
                    ...componente,
                    name: componente.descricao,
                    category: componente.categoria,
                    qtd: isModuloOuInversor ? qtdCalculada : "INCLUSO",
                  };
                }
              );
            }
            return componentesFormatados;
          })(),
          tabela_orientacoes_val: dataProposta.distribuicaoDosModulos,
          tabela_geracao_val,
          tabela_geracao,
          nome_negocio:
            dataProposta.nome_negocio || dataProposta.escolha_negocio.label,
          telhado:
            dadosCard.tipoNegocio_coleta === "3"
              ? telhados?.find(
                  (t: any) =>
                    t.id_telhado == dadosAmpliacao?.tipoTelhado_ampliacao
                )?.nome_telhado ||
                telhados?.find(
                  (t: any) => t.id_telhado == lastProposalInfo?.telhado_proposta
                )?.nome_telhado
              : dataProposta.telhado?.label || dataProposta?.structure?.label,
          concessionaria: dataProposta.concessionaria_proposta,
          instituicao_financeira: data.instituicao_financeira,
          media_consumoTotal: formatarNumero(+dataProposta.consumoTotal),
          consumoTotal_anual: (dataProposta.consumoTotal * 12).toFixed(2),
          estimativa_geracao: formatarNumero(
            +(+dataProposta.estimativa_geracao).toFixed(2)
          ),
          geracao_anual: (+dataProposta.estimativa_geracao * 12).toFixed(2),
          abatimento: formatarNumero(+dataProposta.abatimento),
          custo_por_wp: formatarValor(
            +FormatFields.desformatarNumeros(dataProposta.valorFinalProposta) /
              (Number(
                formValues.kitManual
                  ? formValues.potenciaKwp
                  : formValues.kitEscolhido?.potencia_kit
              ) *
                1000)
          ),
          area_ocupada: formatarNumero(dataProposta.area_ocupada),
          numero_uc_geradora: dataProposta.ucs[0]?.uc,
          media_consumo_uc_geradora: parseFloat(
            +dataProposta.ucs[0]?.valor == +dataProposta.ucs[0]?.valor
              ? dataProposta.ucs[0]?.valor
              : String(
                  dataProposta.ucs[0]?.valor.reduce(
                    (acc: number, curr: string) => acc + +curr,
                    0
                  ) /
                    dataProposta.ucs[0].valor.filter(
                      (val: number | string) => val !== ""
                    ).length
                )
          ).toFixed(2),
          valor_conta_energia_geradora: formatarValor(
            (+dataProposta.ucs[0]?.valor == +dataProposta.ucs[0]?.valor
              ? dataProposta.ucs[0]?.valor
              : dataProposta.ucs[0]?.valor.reduce(
                  (acc: number, curr: string) => acc + +curr,
                  0
                ) /
                dataProposta.ucs[0].valor.filter(
                  (val: number | string) => val !== ""
                ).length) *
              +FormatFields.desformatarNumeros(dataProposta.precoTotal_tarifa)
          ),
          ucs_beneficiarias: dataProposta.ucs
            .filter((_: any, index: number) => index != 0)
            .map(
              (uc: any) =>
                `${uc.uc}: ${
                  +uc.valor == +uc.valor
                    ? +uc.valor
                    : uc.valor.reduce(
                        (acc: number, curr: string) => acc + +curr,
                        0
                      ) /
                      uc.valor.filter((val: number | string) => val !== "")
                        .length
                }`
            ).join(`
`),
          tabela_porcentagem_uc: ucs?.map((a: any) => {
            return {
              nome: a.nome,
              porcentagem: a.porcentagem_uc_coleta,
            };
          }),
          tabela_ucs: dataProposta.ucs?.map((uc: any) => ({
            ...uc,
            concessionaria: dadosCard.nome_concessionaria,
            valor:
              formatarNumero(
                +uc.valor == +uc.valor
                  ? +uc.valor
                  : uc.valor.reduce(
                      (acc: number, curr: string) => acc + +curr,
                      0
                    ) /
                      uc.valor.filter((val: number | string) => val !== "")
                        .length
              ) + " kWh",
            conta: formatarValor(
              (+uc.valor == +uc.valor
                ? +uc.valor
                : uc.valor.reduce(
                    (acc: number, curr: string) => acc + +curr,
                    0
                  ) /
                  uc.valor.filter((val: number | string) => val !== "")
                    .length) *
                +FormatFields.desformatarNumeros(dataProposta.precoTotal_tarifa)
            ),
          })),
          tabela_ubs: dataProposta.ucs
            .filter((_: any, index: number) => index != 0)
            ?.map((uc: any) => ({
              ...uc,
              concessionaria: dadosCard.nome_concessionaria,
              valor:
                formatarNumero(
                  +uc.valor == +uc.valor
                    ? +uc.valor
                    : uc.valor.reduce(
                        (acc: number, curr: string) => acc + +curr,
                        0
                      ) /
                        uc.valor.filter((val: number | string) => val !== "")
                          .length
                ) + " kWh",
              conta: formatarValor(
                (+uc.valor == +uc.valor
                  ? +uc.valor
                  : uc.valor.reduce(
                      (acc: number, curr: string) => acc + +curr,
                      0
                    ) /
                    uc.valor.filter((val: number | string) => val !== "")
                      .length) *
                  +FormatFields.desformatarNumeros(
                    dataProposta.precoTotal_tarifa
                  )
              ),
            })),
          garantia_modulos: calcularAnosEMeses(
            +(
              dataProposta.garantia_modulo ||
              defaultValues.garantia_modulos_parametro
            )
          ),
          garantia_inversores: calcularAnosEMeses(
            +(
              dataProposta.garantia_inversor ||
              defaultValues.garantia_inversores_parametro
            )
          ),
          garantia_servicos: calcularAnosEMeses(
            +defaultValues.garantia_servicos_parametro
          ),
          garantia_estruturas: calcularAnosEMeses(
            dataProposta.garantia_estrutura ||
              +defaultValues.garantia_estruturas_parametro
          ),
          payback_rsi: dataProposta.payback,
          tabela_rsi_val: dataProposta.tabela_rsi,
          endereco_instalacao: dadosCard.endereco_instalacao_coleta,
          endereco_cliente: `${dadosCliente.rua_cliente ? dadosCliente.rua_cliente + ", " : ""}${
            dadosCliente.nro_cliente ? dadosCliente.nro_cliente + " - " : ""
          }${dadosCliente.bairro_cliente ? dadosCliente.bairro_cliente + ", " : ""}${
            dadosCliente.cidade_cliente
              ? dadosCliente.cidade_cliente + " - "
              : ""
          }${
            dadosCliente.estado_cliente
              ? dadosCliente.estado_cliente + ", "
              : ""
          }${dadosCliente.cep_cliente ? dadosCliente.cep_cliente : ""}`,
          eficiencia_modulos_25anos: `${
            dataProposta.modulo_proposta?.eficiencia_25anos_item ||
            defaultValues.eficiencia_25anos_modulo_parametro
          }%`,
          valorVenda_total:
            formValues.resultadoPrecificacao?.valor_maximo_venda,
          periodoEficiencia:
            dataProposta.modulo_proposta?.anos_eficiencia_item ||
            defaultValues.anos_eficiencia_modulo_parametro,
          modelo_modulo: dataProposta.modulo_proposta?.modelo_item,
          cliente_cpf: dataProposta.cpfcnpj_cliente,
          tabela_inversores: (() => {
            const inversoresValidos = dataProposta?.componentesKit
              ? dataProposta?.componentesKit?.filter(
                  (e: any) => e.id_tipo_item == "8" && e.qtd_item != 0
                )
              : [];

            if (inversoresValidos.length === 0) {
              const teste = [
                {
                  qtd_item: "0",
                  descricao_item: "Proposta sem Inversores",
                },
              ];

              return teste;
            }
            return inversoresValidos;
          })(),
          tabela_inversores_origem:
            tabelaInversoresOrigem.length > 0
              ? tabelaInversoresOrigem
              : [
                  {
                    qtd_item: "0",
                    descricao_item: "Proposta sem Inversores",
                    fabricante: "",
                    modelo: "",
                    fase: "",
                    potencia: "",
                    cpmin: "",
                    cpmax: "",
                  },
                ],
          tabela_inversores_ampliacao:
            tabelaInversoresAmpliacao.length > 0
              ? tabelaInversoresAmpliacao
              : [
                  {
                    qtd_item: "0",
                    descricao_item: "Proposta sem Inversores",
                    fabricante: "",
                    modelo: "",
                    fase: "",
                    potencia: "",
                    cpmin: "",
                    cpmax: "",
                  },
                ],
          tabela_economia: [
            {
              sem: formatarValor(valorMensalSemSolar * 12) + " / ano",
              com: formatarValor(valorMensalComSolar * 12) + " / ano",
              economia: formatarValor(valorMensalEconomia * 12) + " / ano",
            },
            {
              sem: formatarValor(valorMensalSemSolar) + " / mês",
              com: formatarValor(valorMensalComSolar) + " / mês",
              economia: formatarValor(valorMensalEconomia) + " / mês",
            },
          ],
          estimativa_geracao_por_placa: formatarNumero(
            (
              +dataProposta.estimativa_geracao / +dataProposta.totalModulos
            ).toFixed(2)
          ),
          face_telhado: faceTelhado,
          dias_prazo_entrega:
            defaultValues.tabelaPrazos.find(
              (prazo: any) =>
                +prazo.potencia_inicial_prazo <= potencia_kit &&
                +prazo.potencia_final_prazo >= potencia_kit
            )?.dias_prazo || "0",
          tabela_distribuicao_modulos: dataProposta.distribuicaoDosModulos,
          media_irradiacao_diaria: formatarNumero(
            dataProposta.irradiacao_mensal?.reduce(
              (acc: number, curr: number) => (acc += +curr),
              0
            ) / 365
          ),
        };

        setMostrarPdf(true);

        setIsLoading(false);
        setDadosProposta(dataProposta);
        setProposta(pdfData);
      } catch (error) {
        toast.error("Erro ao gerar os gráficos de geração/rsi");
        console.error(error);
        setIsLoading(false);
      }
    } else {
      console.error("Gráficos não encontrados");
      setIsLoading(false);
    }
  }

  const onSubmitEmail = (data: FieldValues) => {
    setLoadingEmail(true);
    data["id_proposta"] = dadosProposta.id_proposta;
    data["id_cliente"] = inCard ? dadosCliente["id_cliente"] : idCliente;
    data["id_usuario"] = session.id_usuario;
    data["id_card"] = dadosCard.id;

    enviarLinkPropostaEmail(data)
      .then(() => {
        setOpenModalEmail(false);
        reListarDadosKanban();
      })
      .finally(() => setLoadingEmail(false));
  };

  const onSubmitNumeroProposta = async (data: FieldValues) => {
    const idPropostaEscolhida = data.numero_proposta;

    const propostaEscolhida =
      propostasColetaAtual.find(
        (p: any) => +p.id_proposta === +idPropostaEscolhida
      ) ??
      (await listarPropostasDados(idPropostaEscolhida, session?.sigla).then(
        (res: any) => res?.[0]
      ));

    if (!propostaEscolhida?.caminhoJson_proposta) {
      toast.error(
        "Proposta informada não possui dados salvos para reaproveitar."
      );
      return;
    }

    const jsonProposta = JSON.parse(
      await baixarAwsContent(propostaEscolhida.caminhoJson_proposta)
    );
    const dadosDefaultProposta = jsonProposta?.dadosProposta;

    if (dadosDefaultProposta) {
      form.reset({
        ...form.control._formValues,
        ...dadosDefaultProposta,
      });

      // Marca que os parâmetros (Política de Preço, Política de Comissão,
      // Custos Extras e demais itens) vieram do JSON da proposta informada,
      // e não das configurações vigentes.
      setOrigemDadosDefault(origemDadosDeProposta(idPropostaEscolhida));
    }

    setOpenModalNumeroProposta(false);
  };

  const usarDadosConfiguracaoGeral = () => {
    setOrigemDadosDefault(origemDadosConfiguracaoGeral());
    setOpenModalNumeroProposta(false);
  };

  const handleStepSelected = (value: number) => {
    setYupSchema(schemas[value]);
    setStepAtual(value);
  };

  // ─── handleNext COM VALIDAÇÃO DE CAMPOS PERSONALIZADOS OBRIGATÓRIOS ──────
  const handleNext = async () => {
    // Valida campos personalizados do step atual antes de avançar
    if (!(await validarCamposObrigatoriosDoStep())) {
      return;
    }

    new Promise((resolve, reject) => {
      if (nextStepAction === undefined) {
        resolve("");
      } else {
        nextStepAction()
          .then(() => resolve(""))
          .catch((err: any) => {
            console.error("nextStepActionError:", err);
            reject("");
          });
      }
    })
      .then(() => {
        const newActiveStep = activeStep + 1;
        setActiveStep(newActiveStep);
        handleStepSelected(newActiveStep);
      })
      .catch((err) => {
        console.error("handleNextPromiseError:", err);
      });
  };
  // ─────────────────────────────────────────────────────────────────────────

  const updateDadosGerados = (value: boolean) => {
    setDadosGerados(value);
  };

  const stepperActiveManagement = (value: boolean) => {
    setActiveStepBtn(value);
  };
  const voltaPdf = (value: boolean) => {
    setMostrarPdf(value);
  };
  const cauculaConsumoTotal = (ucs: any) => {
    let total = 0;
    ucs.map((uc: any) => {
      if (isArray(uc.valor)) {
        let novoTotal = 0;
        uc.valor.map((v: number) => (novoTotal = novoTotal + +v));
        total = total + Math.ceil(novoTotal / uc.valor.length);
      } else {
        total = total + +uc.valor;
      }
    });
    return total;
  };
  const [stepInicializado, setStepInicializado] = useState(false);
  const [parametros, setParametros] = useState<any>([]);

  // const stepsComponents_old = [
  //   dadosCard.tipoNegocio_coleta === "3"
  //     ? {
  //         nome: "Dados da Ampliação",
  //         rotina: (props: any) => (
  //           <DadosGeraisAmpliacao
  //             inCard={inCard}
  //             blockNextStep={stepperActiveManagement}
  //             cidades={cidades}
  //             dadosAmpliacao={dadosAmpliacao}
  //             form={form}
  //             updateDadosGerados={updateDadosGerados}
  //             defaultValues={{
  //               ...defaultValues,
  //               instituicao_financeira: loja?.instituicao_parametro_loja,
  //             }}
  //             parametros={parametros}
  //             categoriasTelhados={categoriasTelhados}
  //             itensComp={itensComp}
  //             itensCompostos={itensCompostos}
  //             stepInicializado={stepInicializado}
  //             setStepInicializado={setStepInicializado}
  //             isLoaded={isLoaded}
  //             ucs={ucs}
  //             dadosCard={dadosCard}
  //             distribuidores={distribuidores}
  //             distribuidoresNativos={distribuidoresNativos}
  //             fabricantes={fabricantesLinks}
  //             camposPersonalizados={props?.camposPersonalizados}
  //             setDadosCard={setDadosCard}
  //           />
  //         ),
  //       }
  //     : {
  //         nome: "Dados",
  //         rotina: () =>
  //           isLoaded ? (
  //             <DadosGerais
  //               inCard={inCard}
  //               cidades={cidades}
  //               inversoresBD={inversoresBD}
  //               form={form}
  //               updateDadosGerados={updateDadosGerados}
  //               defaultValues={{
  //                 ...defaultValues,
  //                 instituicao_financeira: loja?.instituicao_parametro_loja,
  //               }}
  //               isLoaded={isLoaded}
  //               ucs={ucs}
  //               dadosCard={dadosCard}
  //               distribuidores={distribuidores}
  //               distribuidoresNativos={distribuidoresNativos}
  //               fabricantes={fabricantes}
  //               // camposPersonalizados={props?.camposPersonalizados}
  //               setDadosCard={setDadosCard}
  //             />
  //           ) : (
  //             <div className="w-full h-[500px] flex flex-col justify-center items-center">
  //               <LoaderSun />
  //             </div>
  //           ),
  //       },
  //   {
  //     nome: "Distribuição",
  //     rotina: (props: any) => (
  //       <DistribuicaoModulos
  //         form={form}
  //         ucs={ucs}
  //         blockNextStep={stepperActiveManagement}
  //         imgTelhados={imgTelhados}
  //         defaultValues={defaultValues}
  //         perdasMedias={perdasMedias}
  //         tiposInstalacao={tiposInstalacao}
  //         categoriasTelhados={categoriasTelhados}
  //         orientacoes={orientacoes}
  //         inclinacoes={inclinacoes}
  //         estruturas={estruturas}
  //         telhados={telhados}
  //         dadosCard={dadosCard}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         setNextStepAction={setNextStepAction}
  //       />
  //     ),
  //   },
  //   {
  //     nome: "Kits",
  //     rotina: (props: any) => (
  //       <KitsProposta
  //         imgTelhados={imgTelhados}
  //         form={form}
  //         parametros={parametros}
  //         setStepInicializado={setStepInicializado}
  //         blockNextStep={stepperActiveManagement}
  //         defaultValues={defaultValues}
  //         dadosCard={dadosCard}
  //         setNextStepAction={setNextStepAction}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         camposPersonalizadosData={props?.camposPersonalizadosData}
  //       />
  //     ),
  //   },

  //   {
  //     nome: "Componentes",
  //     rotina: (props: any) => (
  //       <ComponentesProposta
  //         form={form}
  //         ucs={ucs}
  //         parametros={parametros}
  //         itensComp={itensComp}
  //         perdasMedias={perdasMedias}
  //         dadosCliente={dadosCliente}
  //         dadosAmpliacao={dadosAmpliacao}
  //         defaultValues={defaultValues}
  //         stepInicializado={stepInicializado}
  //         lastProposalInfo={lastProposalInfo}
  //         setStepInicializado={setStepInicializado}
  //         valorColeta={form.control._formValues?.valorColeta}
  //         potenciasJaProcessadas={potenciasJaProcessadas}
  //         setPotenciasJaProcessadas={setPotenciasJaProcessadas}
  //         itensCompostos={itensCompostos}
  //         blockNextStep={stepperActiveManagement}
  //         distribuidores={distribuidores}
  //         dadosCard={dadosCard}
  //         setNextStepAction={setNextStepAction}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         camposPersonalizadosData={props?.camposPersonalizadosData}
  //       />
  //     ),
  //   },
  //   {
  //     nome: "Custos Extras",
  //     rotina: (props: any) => (
  //       <MarkupCustosExtrasProposta
  //         form={form}
  //         lastProposalInfo={lastProposalInfo}
  //         defaultValues={defaultValues}
  //         blockNextStep={stepperActiveManagement}
  //         valorColeta={form.control._formValues?.valorColeta}
  //         dadosCard={dadosCard}
  //         dadosCliente={dadosCliente}
  //         setNextStepAction={setNextStepAction}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         camposPersonalizadosData={props?.camposPersonalizadosData}
  //       />
  //     ),
  //   },
  //   {
  //     nome: "Precificação",
  //     rotina: (props: any) => (
  //       <PrecificacaoProposta
  //         form={form}
  //         dadosAmpliacao={dadosAmpliacao}
  //         lastProposalInfo={lastProposalInfo}
  //         blockNextStep={stepperActiveManagement}
  //         valorColeta={form.control._formValues?.valorColeta}
  //         dadosCard={dadosCard}
  //         setNextStepAction={setNextStepAction}
  //         dadosCliente={dadosCliente}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         camposPersonalizadosData={props?.camposPersonalizadosData}
  //       />
  //     ),
  //   },
  //   {
  //     nome: "Observações Da Proposta",
  //     rotina: (props: any) => (
  //       <ObservacaoColeta
  //         form={form}
  //         dadosCard={dadosCard}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         setNextStepAction={setNextStepAction}
  //         camposPersonalizadosData={props?.camposPersonalizadosData}
  //       />
  //     ),
  //   },
  //   {
  //     nome: "Resumo",
  //     rotina: (props: any) => (
  //       <ResumoColeta
  //         form={form}
  //         dadosCard={dadosCard}
  //         setIsLoading={setIsLoading}
  //         setShowResumo={setShowResumo}
  //         state={state}
  //         setState={setState}
  //         options={options}
  //         setOptions={setOptions}
  //         apexOptionsGraficoGeracao={apexOptionsGraficoGeracao}
  //         setApexOptionsGraficoGeracao={setApexOptionsGraficoGeracao}
  //         apexSeriesGraficoGeracao={apexSeriesGraficoGeracao}
  //         setApexSeriesGraficoGeracao={setApexSeriesGraficoGeracao}
  //         blockNextStep={stepperActiveManagement}
  //         setRsiProposta={setRsiProposta}
  //         setIsLoadedResumo={setIsLoadedResumo}
  //         defaultValues={defaultValues}
  //         inversor={formValues?.componente?.find(
  //           (element: any) => element.categoria == "Inversor",
  //         )}
  //         camposPersonalizados={props?.camposPersonalizados}
  //         setNextStepAction={setNextStepAction}
  //       />
  //     ),
  //   },
  // ].filter((step: any) => {
  //   if (dadosCard.tipoNegocio_coleta === "3") {
  //     return !["Dados", "Distribuição", "Kits"].includes(step.nome);
  //   }
  //   return true;
  // });
  const stepsComponents: any = [
    dadosCard.tipoNegocio_coleta === "3"
      ? {
          nome: "Dados da Ampliação",
          componente: DadosGeraisAmpliacao,
          commonProps: {
            inCard: inCard,
            blockNextStep: stepperActiveManagement,
            cidades: cidades,
            dadosAmpliacao: dadosAmpliacao,
            form: form,
            updateDadosGerados: updateDadosGerados,
            defaultValues: {
              ...defaultValues,
              instituicao_financeira: loja?.instituicao_parametro_loja,
            },
            parametros: parametros,
            categoriasTelhados: categoriasTelhados,
            itensComp: itensComp,
            itensCompostos: itensCompostos,
            stepInicializado: stepInicializado,
            setStepInicializado: setStepInicializado,
            isLoaded: isLoaded,
            ucs: ucs,
            dadosCard: dadosCard,
            distribuidores: distribuidores,
            distribuidoresNativos: distribuidoresNativos,
            fabricantes: fabricantesLinks,
            setDadosCard: setDadosCard,
            setFabricantesDistribuidor: setFabricantesDistribuidor,
          },
        }
      : {
          nome: "Dados",
          componente: isLoaded ? DadosGerais : LoaderDadosGerais,
          commonProps: {
            inCard: inCard,
            cidades: cidades,
            inversoresBD: inversoresBD,
            form: form,
            updateDadosGerados: updateDadosGerados,
            defaultValues: {
              ...defaultValues,
              instituicao_financeira: loja?.instituicao_parametro_loja,
            },
            isLoaded: isLoaded,
            ucs: ucs,
            dadosCard: dadosCard,
            distribuidores: distribuidores,
            distribuidoresNativos: distribuidoresNativos,
            fabricantes: fabricantes,
            setDadosCard: setDadosCard,
            setFabricantesDistribuidor: setFabricantesDistribuidor,
          },
        },
    {
      nome: "Distribuição",
      componente: DistribuicaoModulos,
      commonProps: {
        form: form,
        ucs: ucs,
        blockNextStep: stepperActiveManagement,
        imgTelhados: imgTelhados,
        defaultValues: defaultValues,
        perdasMedias: perdasMedias,
        tiposInstalacao: tiposInstalacao,
        categoriasTelhados: categoriasTelhados,
        orientacoes: orientacoes,
        inclinacoes: inclinacoes,
        estruturas: estruturas,
        telhados: telhados,
        dadosCard: dadosCard,
        setNextStepAction: setNextStepAction,
      },
    },
    {
      nome: "Kits",
      componente: KitsProposta,
      commonProps: {
        imgTelhados: imgTelhados,
        form: form,
        parametros: parametros,
        setStepInicializado: setStepInicializado,
        blockNextStep: stepperActiveManagement,
        defaultValues: defaultValues,
        dadosCard: dadosCard,
        setNextStepAction: setNextStepAction,
        fabricantes: fabricantesDistribuidor,
      },
    },

    {
      nome: "Componentes",
      componente: ComponentesProposta,
      commonProps: {
        form: form,
        ucs: ucs,
        parametros: parametros,
        itensComp: itensComp,
        inversoresBD: inversoresBD,
        perdasMedias: perdasMedias,
        dadosCliente: dadosCliente,
        dadosAmpliacao: dadosAmpliacao,
        defaultValues: defaultValues,
        stepInicializado: stepInicializado,
        lastProposalInfo: lastProposalInfo,
        setStepInicializado: setStepInicializado,
        valorColeta: form.control._formValues?.valorColeta,
        potenciasJaProcessadas: potenciasJaProcessadas,
        setPotenciasJaProcessadas: setPotenciasJaProcessadas,
        itensCompostos: itensCompostos,
        itensKitTabelaPreco: itensKitTabelaPreco,
        tabelasPrecos: tabelasPrecos,
        blockNextStep: stepperActiveManagement,
        distribuidores: distribuidores,
        dadosCard: dadosCard,
        setNextStepAction: setNextStepAction,
      },
    },
    {
      nome: "Custos Extras",
      componente: MarkupCustosExtrasProposta,
      commonProps: {
        form: form,
        dadosAmpliacao: dadosAmpliacao,
        lastProposalInfo: lastProposalInfo,
        defaultValues: defaultValues,
        blockNextStep: stepperActiveManagement,
        valorColeta: form.control._formValues?.valorColeta,
        dadosCard: dadosCard,
        dadosCliente: dadosCliente,
        setNextStepAction: setNextStepAction,
      },
    },
    {
      nome: "Precificação",
      componente: PrecificacaoProposta,
      commonProps: {
        form: form,
        dadosAmpliacao: dadosAmpliacao,
        lastProposalInfo: lastProposalInfo,
        blockNextStep: stepperActiveManagement,
        valorColeta: form.control._formValues?.valorColeta,
        dadosCard: dadosCard,
        setNextStepAction: setNextStepAction,
        dadosCliente: dadosCliente,
      },
    },
    {
      nome: "Observações Da Proposta",
      componente: ObservacaoColeta,
      commonProps: {
        form: form,
        dadosCard: dadosCard,
        setNextStepAction: setNextStepAction,
      },
    },
    {
      nome: "Resumo",
      componente: ResumoColeta,
      commonProps: {
        form: form,
        dadosCard: dadosCard,
        setIsLoading: setIsLoading,
        setShowResumo: setShowResumo,
        state: state,
        setState: setState,
        options: options,
        setOptions: setOptions,
        apexOptionsGraficoGeracao: apexOptionsGraficoGeracao,
        setApexOptionsGraficoGeracao: setApexOptionsGraficoGeracao,
        apexSeriesGraficoGeracao: apexSeriesGraficoGeracao,
        setApexSeriesGraficoGeracao: setApexSeriesGraficoGeracao,
        blockNextStep: stepperActiveManagement,
        setRsiProposta: setRsiProposta,
        setIsLoadedResumo: setIsLoadedResumo,
        defaultValues: defaultValues,
        inversor: formValues?.componente?.find(
          (element: any) => element.categoria == "Inversor"
        ),
        setNextStepAction: setNextStepAction,
      },
    },
  ].filter((step: any) => {
    if (dadosCard.tipoNegocio_coleta === "3") {
      return !["Dados", "Distribuição", "Kits"].includes(step.nome);
    }
    return true;
  });

  useEffect(() => {
    listarParametros().then(setParametros);
  }, []);

  return propostaHelte ? (
    <FormELB
      inCard={inCard}
      dadosCliente={dadosCliente}
      idColeta={idColeta}
      dadosCard={dadosCard}
      rsi_table={rsi_table}
      tarifaEnergia={tarifaEnergia}
    />
  ) : (
    <Fragment>
      {isLoading ? (
        <>
          <div className="flex justify-center w-full mt-19">
            <LoaderSun />
          </div>
        </>
      ) : !mostrarPdf ? (
        <Fragment>
          {!inCard && <Breadcrumb pageName="Proposta" />}
          <ModalComponente
            hasForm={false}
            header="Quando já Existir Propostas Geradas"
            defaultW="w-[400px]"
            opened={openModalNumeroProposta}
            onClose={usarDadosConfiguracaoGeral}
            hasSaveButton={false}
          >
            <div className="mt-5">
              <div className="bg-secondaryMenu bg-opacity-30 text-black-2 rounded-lg text-center text-base mb-5 p-3">
                <span>
                  Já existem propostas geradas para este negócio. Caso deseja
                  gerar uma nova proposta baseada em uma existente, informe o
                  número da proposta e clique no botão &quot;Buscar Dados da
                  Proposta&quot;,{" "}
                  <strong>
                    LEMBRANDO que neste caso, a Política de Preço, a Política de
                    Comissão , os Custos Extras e demais itens, são puxados da
                    Proposta informada, e se houve alterações recentes nas
                    POLÍTICAS, não serão consideradas.
                  </strong>
                </span>
              </div>

              <form
                className="flex flex-col gap-5"
                onSubmit={handleNumeroProposta(onSubmitNumeroProposta)}
              >
                <Input
                  formulario={formNumeroProposta}
                  label="Número da Proposta"
                  name="numero_proposta"
                  mascara="numerico"
                  error="Informe o Número da Proposta"
                  required
                  defaultValue={ultimaPropostaGerada?.id_proposta}
                />
                <Button type="submit" className="w-full bg-primary mt-5">
                  Buscar Dados da Proposta
                </Button>
                <Button
                  type="button"
                  className="w-full bg-secondary"
                  onClick={usarDadosConfiguracaoGeral}
                >
                  Usar Dados da Configuração Geral
                </Button>
                <span className="text-xs text-center text-black-2 dark:text-white">
                  Usando a Configuração Geral, a Política de Preço, a Política
                  de Comissão e os Custos Extras vigentes agora é que serão
                  aplicados.
                </span>
              </form>
            </div>
          </ModalComponente>
          <form action="#" onSubmit={submitFormFunction}>
            {origemDadosDefault ? (
              <div
                className={`flex flex-row gap-3 items-start rounded-lg border-l-4 p-3 mb-4 ${
                  origemDadosDefault.tipo === "PROPOSTA_EXISTENTE"
                    ? "border-warning bg-warning bg-opacity-10"
                    : "border-primary bg-primary bg-opacity-10"
                }`}
              >
                <Info size={20} className="shrink-0 mt-0.5" />
                <div className="flex flex-col gap-1">
                  <span className="font-bold text-sm dark:text-white">
                    Como esta proposta está sendo gerada
                  </span>
                  <span className="text-xs dark:text-white">
                    {origemDadosDefault.descricao}
                  </span>
                </div>
              </div>
            ) : null}
            <StepperEtapa
              stepperActiveManagement={activeStepBtn}
              onStepChange={handleStepSelected}
              form={form}
              dadosCard={dadosCard}
              onStepCompletion={() => {
                submitFormFunction();
              }}
              voltaPdf={voltaPdf}
              edicaoDados={edicaoDados}
              dadosGerados={dadosGerados}
              onValidateStep={validarCamposObrigatoriosDoStep}
              setIsLoading={setIsLoading}
              stepsList={stepsComponents}
              stepAtual={stepAtual}
              activeStep={activeStep}
              setActiveStep={setActiveStep}
              handleNext={handleNext}
            ></StepperEtapa>

            <Container
              className={`${showResumo ? "" : "hidden"} max-sm:h-[75vh] max-sm:overflow-auto`}
            >
              <div>
                {isLoadedResumo ? (
                  <ResumoProposta
                    {...{
                      isLoadedResumo,
                      tarifasEnergia,
                      form,
                      id_coleta: dadosCard.id_coleta_cliente,
                      cod_coleta: dadosCard.cod_coleta,
                      tipo_kit: formValues.kitManual
                        ? "Kit Próprio"
                        : "Kit Distribuidor",
                      nome_distribuidor: formValues.kitManual
                        ? formValues.distribuidor?.nome_distribuidor
                        : formValues.distribuidores?.find(
                            (distribuidor: any) =>
                              distribuidor.id_distribuidor ==
                              formValues.kitEscolhido?.distribuidor
                          )?.nome_distribuidor,
                      nome_telhado:
                        dadosCard.tipoNegocio_coleta === "3"
                          ? telhados?.find(
                              (t: any) =>
                                t.id_telhado ==
                                dadosAmpliacao?.tipoTelhado_ampliacao
                            )?.nome_telhado ||
                            telhados?.find(
                              (t: any) =>
                                t.id_telhado ==
                                lastProposalInfo?.telhado_proposta
                            )?.nome_telhado
                          : formValues.nomeTelhadoEscolhido,
                      data_geracao_proposta: getDateTimeBrasil({
                        day: "2-digit",
                        month: "long",
                        year: "numeric",
                      }),
                      // Válido até: data atual + dias configurados nos
                      // Parâmetros (Validade da Proposta)
                      validade_proposta: (() => {
                        const dataValidade = new Date();
                        dataValidade.setDate(
                          dataValidade.getDate() +
                            (Number(
                              defaultValues?.tempo_validade_proposta_parametro
                            ) || 0)
                        );
                        return dataValidade.toLocaleDateString("pt-BR");
                      })(),
                      seguro_percentual: defaultValues?.seguro_rsi_parametro,
                      estimativa_geracao_cliente:
                        formValues?.estimativa_geracao_cliente,
                      origem_dados_default: origemDadosDefault,
                      lastProposalInfo: lastProposalInfo,
                      tipo_ampliacao: formValues?.tipo_ampliacao,
                      consumoAmpliacao_cliente:
                        formValues?.consumoAmpliacao_cliente,
                      nome_usuario: usuario?.nome_usuario,
                      valor_simultaneidade_proposta:
                        formValues.valor_simultaneidade_proposta ??
                        defaultValues?.simultaneidade_proposta,
                      qtd_visualizacoes_proposta: 0,
                      obs_proposta: formValues.obsColeta,
                      valorTotal_proposta: formValues.ajusteValorFinalProposta,
                      performance_ratio_parametro:
                        defaultValues?.performance_ratio_parametro,
                      media_irradiacao_mensal:
                        formValues.media_irradiacao_mensal,
                      sombreamentos_coleta:
                        defaultValues?.sombreamento_parametro,
                      perdaMedia: perdasMedias.find(
                        (perda: any) =>
                          perda.cod_orientacao_solar ==
                            defaultValues.orientacao_parametro &&
                          perda.cod_inclinacao_telhado ==
                            defaultValues.inclinacao_parametro
                      )?.valor_perda,
                      preco_tarifa: desformatarNumeros(
                        formValues.precoTotal_tarifa
                      ),
                      valor_desconto: formValues.valorDesconto,
                      valor_total_sem_desconto:
                        formValues.resultadoPrecificacao?.valor_maximo_venda,
                      valor_acrescimo: +FormatFields.desformatarNumeros(
                        formValues.valorAcrescimo
                      ),
                      valor_total_sem_acrescimo:
                        formValues.resultadoPrecificacao?.valor_maximo_venda,
                      payback: rsiProposta.payback,
                      potencia_sistema: Number(
                        formValues.kitManual
                          ? formValues.potenciaKwp
                          : formValues.kitEscolhido?.potencia_kit
                      ),
                      nome_concessisonaria: formValues.concessionaria_proposta,
                      nome_tipoLigacao_proposta:
                        formValues.nome_tipoLigacao_proposta,
                      grupo_proposta:
                        dadosCard.tipoNegocio_coleta === "3" &&
                        dadosCard.cod_coleta
                          ? lastProposalInfo?.grupo_coleta
                          : formValues.grupo_proposta,
                      subgrupo_proposta:
                        dadosCard.tipoNegocio_coleta === "3" &&
                        dadosCard.cod_coleta
                          ? lastProposalInfo?.subgrupo_coleta
                          : formValues.subgrupo_proposta,
                      ucs,
                      consumoTotal: formValues.ucs.reduce(
                        (acc: number, uc: any) =>
                          (acc +=
                            +uc.valor == +uc.valor
                              ? +uc.valor
                              : uc.valor.reduce(
                                  (acc: number, curr: string) => acc + +curr,
                                  0
                                ) /
                                uc.valor.filter(
                                  (val: number | string) => val !== ""
                                ).length),
                        0
                      ),
                      estimativa_geracao: +formValues.estimativa_geracao,
                      abatimento: formValues.abatimento,
                      abatimentoCliente: formValues.abatimento_cliente,
                      dadosAmpliacao: dadosAmpliacao,
                      qtd_modulos:
                        (dadosCard.tipoNegocio_coleta === "3"
                          ? formValues?.quantidade_modulos_ampliacao
                          : formValues.totalModulos) || "0",
                      fiob_tarifa:
                        dadosCard.tipoNegocio_coleta === "3"
                          ? tarifasEnergia[0]?.fiob_tarifa
                          : tarifaEnergia?.fiob_tarifa,
                      potencia_modulo: formValues.potencia_modulo,
                      modulo: formValues.modulo,
                      fabricanteModulo: formValues?.marcaModulo_ampliacao,
                      fabricantes,
                      area_ocupada: formValues.area_ocupada,
                      apexOptionsGraficoGeracao,
                      apexSeriesGraficoGeracao,
                      apexOptionsGraficoRsi: options,
                      apexSeriesGraficoRsi: state.series,
                      area_modulo: formValues.area_modulo,
                      inversores_proposta: formValues.inversores_proposta,
                      tipoNegocio_coleta: dadosCard.tipoNegocio_coleta,
                      tabela_rsi: rsiProposta.tabela_rsi,
                      obs_negocio: dadosCard.obs_coleta,
                      parametros_politica_vigente: {
                        id_preco_politica:
                          formValues.resultadoPrecificacao?.id_preco_politica ||
                          null,
                        id_politica_comissao:
                          formValues.resultadoPrecificacao
                            ?.id_politica_comissao || null,
                        qtd_custos_extras: Array.isArray(
                          formValues.resultadoPrecificacao?.custos_extras
                        )
                          ? formValues.resultadoPrecificacao.custos_extras
                              .length
                          : null,
                      },
                    }}
                  />
                ) : (
                  <div className="flex justify-center w-full mt-19">
                    <LoaderSun />
                  </div>
                )}
              </div>
            </Container>
          </form>
        </Fragment>
      ) : (
        <>
          <div>
            {isSavingProposal && (
              <span className="flex text-center justify-center ">
                <span className="bg-slate-200 font-semibold text-black px-9 p-3 rounded-md inline-flex items-center">
                  <span className="mr-2">Salvando Proposta</span>
                  <span aria-hidden="true">{dotsStr}</span>
                  <span className="sr-only" aria-live="polite">
                    {dots} ponto{dots === 1 ? "" : "s"}
                  </span>
                </span>
              </span>
            )}

            <h1 className="text-2xl max-sm:text-sm text-center m-4 font-medium">
              Proposta Comercial Nº {dadosProposta.id_proposta} / Rev.{" "}
              {dadosProposta.revisao} - Cliente {nome}
            </h1>
            <Divider />
            <div className="flex md:gap-2 max-sm:gap-1  justify-center">
              {!inCard ||
                (true &&
                  !isSavingProposal &&
                  botoes.map(
                    (botao, index) =>
                      botao.mostrar && (
                        <Button
                          key={index}
                          className={botao.className + ``}
                          onClick={botao.onClick}
                        >
                          {botao.icon}
                          {botao.label}
                        </Button>
                      )
                  ))}
            </div>

            <div className="flex justify-center  h-1/2 mt-4">
              {lojaAtual?.tipoAssintatura_loja === "1" ? (
                <FormPropostaDrive
                  parametros={parametros}
                  dadosProposta={proposta}
                  dadosFormProposta={dadosProposta}
                  usuario={usuario}
                  camposPersonalizados={camposPersonalizadosSearch}
                  dadosCliente={dadosCliente}
                  setStatusSavingProposta={setStatusSavingProposta}
                  setIsSavingProposal={setIsSavingProposal}
                  setDadosProposta={setDadosProposta}
                  relacionarDados={relacionarDadosProposta}
                  setMostrarPdf={setMostrarPdf}
                  dadosCard={dadosCard}
                  setActiveStepPendencias={setActiveStepPendencias}
                  activeStepPendencias={activeStepPendencias}
                  loja={loja}
                />
              ) : (
                <FormPropostaDrive
                  parametros={parametros}
                  dadosProposta={proposta}
                  dadosFormProposta={dadosProposta}
                  usuario={usuario}
                  camposPersonalizados={camposPersonalizadosSearch}
                  dadosCliente={dadosCliente}
                  setStatusSavingProposta={setStatusSavingProposta}
                  setIsSavingProposal={setIsSavingProposal}
                  setDadosProposta={setDadosProposta}
                  relacionarDados={relacionarDadosProposta}
                  setMostrarPdf={setMostrarPdf}
                  dadosCard={dadosCard}
                  setActiveStepPendencias={setActiveStepPendencias}
                  activeStepPendencias={activeStepPendencias}
                  loja={loja}
                />
              )}
            </div>
            {!inCard && (
              <div className="fixed right-10 bottom-2">
                <Button
                  onClick={() => route.replace("/CXESCRM002?funil=1")}
                  className="bg-success "
                >
                  Prosseguir
                </Button>
              </div>
            )}
          </div>
          <ModalComponente
            hasForm={false}
            header="Enviar E-mail"
            defaultW="w-[400px]"
            opened={openModalEmail}
            onClose={() => setOpenModalEmail(!openModalEmail)}
            hasSaveButton={false}
          >
            <div className="mt-5">
              <div className="bg-secondaryMenu bg-opacity-30 text-black-2 rounded-lg text-center text-lg mb-5">
                <span>
                  Por favor, preencha o:
                  <strong>
                    <i>Email</i>
                  </strong>
                </span>
              </div>

              <form
                className="flex flex-col gap-5"
                onSubmit={handleEmail(onSubmitEmail)}
              >
                <Input
                  formulario={formEmail}
                  label="Email"
                  name="email_cliente"
                  error="Preencha o Motivo"
                  required
                />
                <Button
                  type="submit"
                  disabled={loadingEmail}
                  className="w-full bg-primary mt-5"
                >
                  Enviar
                </Button>
              </form>
            </div>
          </ModalComponente>
          <ModalComponente
            hasForm={false}
            header="Enviar WhatsApp"
            defaultW="w-[400px]"
            opened={openModalWhatsApp}
            onClose={() => setOpenModalWhatsApp(!openModalWhatsApp)}
            hasSaveButton={false}
          >
            <div className="mt-5">
              <div className="bg-secondaryMenu bg-opacity-30 text-black-2 rounded-lg text-center text-lg mb-5">
                <span>
                  Por favor, preencha o:{" "}
                  <strong>
                    <i>WhatsApp</i>
                  </strong>
                </span>{" "}
              </div>

              <form
                className="flex flex-col gap-5"
                onSubmit={handleWhatsApp(onSubmitWhatsApp)}
              >
                <Input
                  formulario={formWhatsApp}
                  label="WhatsApp"
                  name="whatsapp_cliente"
                  mascara="telefone"
                  error="Informe o WhatsApp"
                  required
                />
                <Button
                  loading={isLoadingWhatsApp}
                  className="w-full bg-primary mt-5"
                >
                  Salvar
                </Button>
              </form>
            </div>
          </ModalComponente>
        </>
      )}
    </Fragment>
  );
};

export default ColetaDados;