import Input from "@/components/Forms/Input";
import InputGroup from "@/components/Forms/InputGroup";
import InputSelectComponent from "@/components/Forms/InputSelect";
import {
  Desc_TipoTarefa,
  Desc_Urgencia,
  Desc_Verdade,
  TipoTarefa,
  Urgencia,
  Verdade,
  getOptionsFromEnum,
} from "@/enums/enums";
import { listarTodosKanbans } from "@/requests/CRM/kanban";
import {
  listarContatos,
  listarNegociosCliente,
} from "@/requests/CRUD/Cliente/listarClientes";
import { useAuth } from "@/src/contexts/authContext";
import { format, parseISO } from "date-fns";
import { useEffect, useState } from "react";

const EditDateScheduler = ({ form, selectedDateTime, taskData }: any) => {
  const [cliente, setCliente] = useState([]);
  // const [tipoAgendamento, setTipoAgendamento] = useState<any[]>([]);
  const [negociosCliente, setNegociosCliente] = useState([]);
  const [funis, setFunis] = useState<any[]>([]);
  const [selectedFunilDestiny, setSelectedFunilDestiny] = useState<any>("");
  const [etapas, setEtapas] = useState<any[]>([]);
  const [funnelData, setFunnelData] = useState<any>();

  const [tipoSelect, setTipoSelect] = useState<any>(taskData.tipo_agendamento);

  const optionsVerdade = getOptionsFromEnum(Verdade, Desc_Verdade);
  const optionsUrgencia = getOptionsFromEnum(Urgencia, Desc_Urgencia);
  const optionsTipoTarefa = getOptionsFromEnum(TipoTarefa, Desc_TipoTarefa);

  const { usuario } = useAuth();

  // Leo - Será utilizado Enum
  //
  // const arrayOrigem = [
  //   { value: "1", label: "Baixa" },
  //   { value: "2", label: "Média" },
  //   { value: "3", label: "Alta" },
  // ];

  useEffect(() => {
    // const optionsAgendamento = [
    //   {
    //     value: "1",
    //     label: "Evento com o Cliente",
    //   },
    //   {
    //     value: "2",
    //     label: "Evento Pessoal",
    //   },
    // ];
    // setTipoAgendamento(optionsAgendamento);
    const buscarCliente = async () => {
      await listarContatos({
        id_usuario: usuario.id_usuario,
      }).then((e: any) => {
        setCliente(
          e.map((cliente: any) => ({
            value: cliente.id_cliente,
            label: cliente.nome_cliente,
          })),
        );
      });
    };
    buscarCliente();
  }, []);
  const listarFunis = () => {
    listarTodosKanbans().then((res) => setFunis(res));
  };
  // useEffect(() => {
  //   getFunnelData();
  //   listarFunis();
  //   setEtapas([...funis.map((funil: any) => funil.listas_kanban).flat()]);
  // }, [funis]);
  useEffect(() => {
    if (taskData.cod_cliente !== null) {
      buscarNegociosDoCliente(taskData.cod_cliente);
    } else {
      setNegociosCliente([]);
    }
  }, [taskData.cod_cliente]);

  const buscarNegociosDoCliente = async (idCliente: any) => {
    await listarNegociosCliente({
      cliente_coleta: idCliente,
    }).then((res: any) => {
      setNegociosCliente(
        res.map((negocio: any) => ({
          value: negocio.id_coleta,
          label: negocio.nome_negocio_coleta,
        })),
      );
    });
  };
  const handleChangeTypeScheduler = (type: any) => {
    setTipoSelect(type);
  };

  return (
    <>
      <div className="flex flex-col gap-2 ">
        {taskData.status_agendamento == 1 && (
          <div className="bg-success flex flex-col bg-opacity-60 text-white px-4 py-2 rounded-sm font-medium text-sm">
            <span>Tarefa agendada para dia {taskData.dt_fim_agendamento}</span>
            <span className="pl-3">
              Resolução: {taskData.acao_feita_agendamento}
            </span>
          </div>
        )}
        <InputGroup>
          <InputSelectComponent
            formulario={form}
            name="tipo_agendamento"
            label="Tipo Agendamento *"
            width="w-1/4"
            options={optionsTipoTarefa}
            defaultValue={taskData.tipo_agendamento}
            onChange={(e: any) => handleChangeTypeScheduler(e.value)}
            // required
            // error="Preencha o Cliente"
          />
        </InputGroup>
        <InputGroup>
          {taskData && (
            <InputSelectComponent
              formulario={form}
              name="urgencia_agendamento"
              label="Urgência *"
              width="w-1/4"
              options={optionsUrgencia}
              defaultValue={taskData.urgencia_agendamento}
              // required
              // error="Preencha a Urgência"
            />
          )}

          {taskData && tipoSelect == TipoTarefa.Cliente && (
            <InputSelectComponent
              formulario={form}
              name="cod_cliente"
              label="Cliente *"
              width="w-1/4"
              options={cliente}
              defaultValue={taskData.cod_cliente}
              // required
              // error="Preencha o Cliente"
            />
          )}
          {taskData &&
            taskData.cod_cliente &&
            tipoSelect == TipoTarefa.Cliente && (
              <>
                <InputSelectComponent
                  formulario={form}
                  name="nome_negocio"
                  label="Negócio *"
                  width="w-1/4"
                  options={negociosCliente}
                  isMulti={true}
                  defaultValue={taskData.coleta_agendamento
                    ?.split("^")
                    .join(",")}
                  // required
                  // error="Preencha o nome do Negócio"
                />

                <InputSelectComponent
                  formulario={form}
                  name="visita_cliente_agendamento"
                  label="Visita ao Cliente? *"
                  width="w-1/4"
                  options={optionsVerdade}
                  defaultValue={
                    taskData && taskData["visita_cliente_agendamento"]
                  }
                  // required
                  // error="Informe se é uma visita ao cliente"
                />
              </>
            )}
        </InputGroup>

        <InputGroup className="items-center">
          {taskData && (
            <Input
              formulario={form}
              label="Data Inicio *"
              mascara="data"
              name="dt_inicio_agendamento"
              defaultValue={format(
                parseISO(taskData.dt_inicio_agendamento),
                "dd/MM/yyyy",
              )}
              // required
            />
          )}

          {taskData && (
            <Input
              formulario={form}
              label="Hora Inicio *"
              type="time"
              name="hora_inicio_agendamento"
              defaultValue={taskData && taskData.hora_inicio_agendamento}
              // required
            />
          )}
        </InputGroup>

        <InputGroup className="items-center ">
          <>
            {taskData && (
              <Input
                formulario={form}
                name="dt_fim_agendamento"
                label="Data Fim"
                width="xl:w-1/1"
                mascara="data"
                defaultValue={
                  taskData.dt_fim_agendamento ==
                    taskData.dt_inicio_agendamento &&
                  taskData.hora_inicio_agendamento ==
                    taskData.hora_fim_agendamento
                    ? ""
                    : taskData.dt_fim_agendamento &&
                      format(
                        parseISO(taskData.dt_fim_agendamento),
                        "dd/MM/yyyy",
                      )
                }
              />
            )}

            {taskData && (
              <Input
                formulario={form}
                name="hora_fim_agendamento"
                type="time"
                label="Hora Fim"
                error="Preencha a hora"
                width="xl:w-1/1"
                defaultValue={
                  taskData.dt_fim_agendamento ==
                    taskData.dt_inicio_agendamento &&
                  taskData.hora_inicio_agendamento ==
                    taskData.hora_fim_agendamento
                    ? ""
                    : taskData && taskData.hora_fim_agendamento
                }
              />
            )}
          </>
        </InputGroup>
        {/* 
          * OS 323669 - Leonardo
          * A princípio não faremos esta automatização
          * 
        <div className="relative border rounded-md p-3 border-black border-opacity-50">
          <p className="text-black absolute bg-white px-2 top-[-13px]">
            Quando finalizar, mover card{" "}
          </p>
          <InputGroup className="items-center">
            <div className="flex flex-col sm:flex-row mt-2 items-center w-full gap-4">
              <InputSelectComponent
                formulario={form}
                name="acao_card_paralelizacao"
                label="Ação?"
                options={[
                  { label: "Mover", value: "1" },
                  { label: "Duplicar", value: "0" },
                ]}
                defaultValue={
                  taskData && taskData.tipo_acao_finaliza_agendamento
                }
              />
              <InputSelectComponent
                formulario={form}
                name="funil_destino"
                label="Funil"
                options={funis.map((funil: any) => ({
                  value: String(funil.id_funil),
                  label: funil.titulo_funil,
                }))}
                onChange={(e: any) => {
                  setSelectedFunilDestiny(String(e.value));
                }}
                defaultValue={funnelData && funnelData.id_funil_destino}
                required
                error="Selecione um funil"
              />
              <MdKeyboardArrowRight
                className={`w-20 rotate-90 sm:rotate-0 mt-2 sm:mt-0`}
              />
              <InputSelectComponent
                name="etapa_destino_funil_paralelo"
                label="Etapa"
                formulario={form}
                options={etapas
                  .filter(
                    (etapa: any) =>
                      etapa.grupo_etapa_funil == funnelData.id_funil_destino
                  )
                  .map((etapa: any) => ({
                    value: String(etapa.id_etapa_funil),
                    label: etapa.titulo_etapa_funil,
                  }))}
                defaultValue={
                  funnelData && funnelData.etapa_destino_funil_paralelo
                }
                // defaultValue={
                //   funis.find(
                //     (funil: any) => funil.id_funil == selectedFunilDestiny
                //   )?.listas_kanban[0]?.id_etapa_funil
                // }
                error="Selecione uma etapa"
                required
              />
            </div>
          </InputGroup>
        </div> */}

        {taskData && (
          <Input
            formulario={form}
            type="textarea"
            label="Descrição *"
            name="descricao_agendamento"
            defaultValue={taskData.descricao_agendamento}
            // required
            // error="Preencha a Descrição!"
          />
        )}
      </div>
    </>
  );
};

export default EditDateScheduler;