import LoaderSun from "@/components/common/Loader/LoaderSun";
import Input from "@/components/Forms/Input";
import InputGroup from "@/components/Forms/InputGroup";
import InputSelectComponent from "@/components/Forms/InputSelect";
import { obterAgendamentoInstalacaoNegocio } from "@/requests/CRM/AgendamentosInstalacoes/obterAgendamentoInstalacaoNegocio";
import { alterarResponsavel } from "@/requests/CRM/kanban";
import { useAuth } from "@/src/contexts/authContext";
import { useKanbanContext } from "@/src/contexts/kanbanContext";
import { GetForm } from "@/utils";
import { addDays, format } from "date-fns";
import { useEffect, useState } from "react";
import { FieldValues } from "react-hook-form";

const FormAgendamento = ({
  onSubmitFunction,
  dadosCard,
  children,
  usuarios,
  ...rest
}: any) => {
  const [agendamento, setAgendamento] = useState<any>(
    // agendamentoDefault
    null,
  );
  const [isLoaded, setIsLoaded] = useState(false);

  useEffect(() => {
    if (!agendamento) {
      obterAgendamentoInstalacaoNegocio(dadosCard.id_coleta_cliente)
        .then((res) => {
          const [year, month, day] = res?.data_instalacao
            .split("-")
            .map(Number);
          const data = new Date(year, month - 1, day);

          const dataFormat = format(data, "dd/MM/yyyy");

          // Calcula a data de término somando os dias de instalação
          const dataTermino = addDays(data, Number(res?.dias_instalacao) || 0);
          const dataTerminoFormat = format(dataTermino, "dd/MM/yyyy");

          setAgendamento({
            ...res,
            // data_instalacao: dataFormat,
            data_termino: dataTerminoFormat,
          });
        })
        .finally(() => setIsLoaded(true));
    } else {
      setIsLoaded(true);
    }
  }, []);

  const { handleSubmit, ...form } = GetForm();
  const { valuesSession } = useAuth();
  const { session } = valuesSession();
  const { reListarDadosKanban } = useKanbanContext();

  const onSubmitFormAgendamento = (data: FieldValues) => {
    data.id_instalacao = agendamento?.id_instalacao;
    if (data.instaladores_instalacao) {
      const dados: any = {
        id_coleta: dadosCard.id_coleta_cliente,
        responsavel_coleta:
          dadosCard["responsaveis"]?.["Administrativo"] || null,
        vendedor_coleta: dadosCard["responsaveis"]?.["Vendedor"] || null,
        tecnico_coleta: dadosCard["responsaveis"]?.["Técnico"] || null,
        preVendedor_coleta: dadosCard["responsaveis"]?.["Pré-Vendedor"] || null,
        gerente_coleta: dadosCard["responsaveis"]?.["Gerente"] || null,
        responsavelInstalador_coleta: data["instaladores_instalacao"] || null,
        id_usuario: session.id_usuario,
        skip_log: true, // Não registrar log de "Responsáveis Alterados" quando chamado do agendamento
      };
      alterarResponsavel(dados).then(() => {
        reListarDadosKanban();
        return onSubmitFunction(data);
      });
    } else {
      return onSubmitFunction(data);
    }
  };

  return isLoaded ? (
    <form onSubmit={handleSubmit(onSubmitFormAgendamento)} {...rest}>
      <InputGroup>
        <InputSelectComponent
          name="instaladores_instalacao"
          label="Instalador"
          formulario={form}
          options={usuarios
            .filter((usuario: any) => usuario.cargo_perfil == 6)
            .map((usuario: any) => ({
              value: usuario.id_usuario,
              label: usuario.nome_usuario,
            }))}
          defaultValue={dadosCard?.responsaveis.Instalador}
          required
          error="Informe o responsável"
        />

        <Input
          name="data_instalacao"
          label="Data da Instalação"
          formulario={form}
          type="date"
          required
          error="Informe a data da instalação"
          defaultValue={agendamento?.data_instalacao}
        />
        <Input
          name="dias_instalacao"
          label="Dias previstos"
          formulario={form}
          mascara="numerico"
          required
          error="Informe a previsão de dias"
          defaultValue={agendamento?.dias_instalacao}
        />
      </InputGroup>
      <InputGroup>
        <Input
          name="observacoes_instalacao"
          label="Observações"
          formulario={form}
          type="textarea"
        />
      </InputGroup>
      {children}
    </form>
  ) : (
    <div className="flex justify-center w-full">
      <LoaderSun />
    </div>
  );
};

export default FormAgendamento;