import Button from "@/components/Forms/Button";
import LoaderSun from "@/components/common/Loader/LoaderSun";
import { editarParametros } from "@/requests/CRUD/ParametrosComerciais/editarParametros";
import { listarParametros } from "@/requests/CRUD/ParametrosComerciais/listarParametros";
import { useEffect, useState } from "react";
import DesignerProposta from "./DesignerProposta";
import FormProposta from "./FormProposta";

const PropostaComponent = () => {
  const [view, setView] = useState<string>("form");
  const [isLoading, setIsLoading] = useState(false);
  const [defaultValues, setDefaultValues] = useState<any>(false);

  useEffect(() => {
    atualizarParametros();
  }, []);

  const atualizarParametros = async () => {
    return listarParametros().then((res) => setDefaultValues(res));
  };

  const onSubmitFunction = (data: any) => {
    const newData = { ...defaultValues, ...data };
    setIsLoading(true);
    delete newData["avisos"];
    delete newData["deslocamento"];
    delete newData["tipoNegocio"];
    delete newData["tipoNegocioDeslocamento"];
    delete newData["exigirDeslocamento_parametro"];
    delete newData["kmMinimoDeslocamento_parametro"];
    editarParametros(newData).finally(() =>
      atualizarParametros().then(() => setIsLoading(false)),
    );
  };

  return defaultValues ? (
    <div className="w-full">
      {view == "form" ? (
        <FormProposta
          onSubmitFunction={onSubmitFunction}
          defaultValues={defaultValues}
        >
          <div className="flex justify-center">
            <Button loading={isLoading}>Salvar</Button>
          </div>
        </FormProposta>
      ) : (
        <DesignerProposta />
      )}
    </div>
  ) : (
    <div className="w-full h-[500px] flex flex-col justify-center items-center">
      <LoaderSun />
    </div>
  );
};

export default PropostaComponent;