import Button from "@/components/Forms/Button";
import Input from "@/components/Forms/Input";
import InputSelectComponent from "@/components/Forms/InputSelect";
import { handleSweetAlert } from "@/components/Modal/SweetAlertConfirm";
import { FormatFields } from "@/utils";
import { Info } from "lucide-react";
import { useEffect } from "react";

const DadosGeraisCorretiva = ({
  form,
  defaultValues,
  blockNextStep,
  formasPagamento,
  loja,
  camposPersonalizados,
}: any) => {
  useEffect(() => {
    blockNextStep(false);
  }, []);
  return (
    <div className="flex flex-col gap-4">
      <div className="flex flex-row flex-wrap gap-4">
        <Input
          name="especificacoes"
          label="Especificações"
          formulario={form}
          defaultValue={
            defaultValues && defaultValues["especificacoes_tipo_servico"]
          }
          type="textarea"
          required
          error={"Informe as Especificações"}
          width={"min-w-[500px] flex-1"}
        />
        <Input
          name="informacoes_adicionais_proposta"
          label="Informações Adicionais da Proposta"
          formulario={form}
          defaultValue={
            defaultValues && defaultValues["informacoesadd_tipo_servico"]
          }
          type="textarea"
          required
          error={"Informe as Especificações"}
          width={"min-w-[500px] flex-1"}
        />
      </div>
      <div className="flex flex-row flex-wrap gap-4">
        {/* <InputSelectComponent
          name="codForma_pagamento_proposta"
          label="Forma de Pagamento"
          options={formasPagamento
            .filter(
              (forma: any) =>
                forma?.status_forma != "0" &&
                (forma?.cod_lojas_forma == "*" ||
                  forma?.cod_lojas_forma
                    ?.split(",")
                    ?.includes(defaultValues?.id_loja_coleta)) &&
                (forma?.cod_tipos_negocios == "*" ||
                  forma?.cod_tipos_negocios
                    ?.split(",")
                    ?.includes(defaultValues?.tipoNegocio_coleta))
            )
            .map((forma: any) => ({
              ...forma,
              value: forma.id_forma,
              label: forma.nome_forma,
            }))}
          formulario={form}
          required
          error="Informe a Forma de Pagamento"
          defaultValue={defaultValues && defaultValues["formaPagamentoPadrao"]}
          width={"min-w-[250px] flex-1"}
          formatOptionLabel={(forma) =>
            `${forma?.nome_forma}${forma?.prazos_forma ? ` - (${forma?.prazos_forma})` : ""}`
          }
        /> */}
        <Input
          name="totalModulos"
          label="Total de Módulos"
          mascara="numerico"
          formulario={form}
          defaultValue={defaultValues && defaultValues["qtdModulos_coleta"]}
          required
          error={"Informe as Especificações"}
          width={"min-w-[150px] flex-1"}
        />
        {/* <Input
        name="condicao_pagamento"
        label="Condição de Pagamento"
        formulario={form}
        defaultValue={
          defaultValues && defaultValues["condicao_pagamento_parametro"]
        }
        required
        error={"Informe as Especificações"}
      /> */}
        <Input
          name="valor_proposta"
          label={
            loja?.usa_precificacao_corretiva_loja == "0" ? (
              "Valor da Proposta"
            ) : (
              <div className="w-fit flex flex-row flex-nowrap gap-1">
                <div>Custo do Serviço</div>
                <div className="px-1">
                  <Button
                    type="button"
                    className={` bg-primary flex flex-row gap-2 rounded-full p-0`}
                    onClick={(e: any) => {
                      e.stopPropagation();
                      handleSweetAlert({
                        icon: "info",
                        title: "Valor do Custo do Serviço",
                        showDenyButton: false,
                        confirmButtonText: "Ok",
                        html: `Como a loja usa precificação em negócios de corretiva é necessário informar o custo do serviço e o valor da proposta será calculado após a precificação`,
                      });
                    }}
                  >
                    <Info />
                  </Button>
                </div>
              </div>
            )
          }
          mascara="numero"
          formulario={form}
          defaultValue={defaultValues && defaultValues["valor_proposta"]}
          required
          error={"Informe as Especificações"}
          onChange={(e) => {
            const valor = e?.target?.value
              ? FormatFields.desformatarNumeros(e.target.value)
              : "0";
            
            form.setValue("valorColeta", "0");
          }}
          width={"min-w-[150px] flex-1"}
        />
      </div>
      {camposPersonalizados}
    </div>
  );
};

export default DadosGeraisCorretiva;
