import Container from "@/components/Forms/Container";
import { handleSweetAlert } from "@/components/Modal/SweetAlertConfirm";
import ReactTable from "@/components/ReactTable/ReactTable";
import { cadastrarMotivosNegociosPerdidos } from "@/requests/CRUD/NegociosPerdido/cadastrarMotivoNegocioPerdido";
import {
  deletarMotivoNegocioPerdido,
  editarMotivosNegociosPerdidos,
} from "@/requests/CRUD/NegociosPerdido/editarMotivoNegocioPerdido";
import {
  listarCardsMotivoNegocioPerdido,
  listarMotivoNegocioPerdido,
} from "@/requests/CRUD/NegociosPerdido/listarMotivoNegocioPerdido";
import { useEffect, useState } from "react";
import { FieldValues } from "react-hook-form";
import { BiTrash } from "react-icons/bi";
import FormMotivosNegociosPerdidos from "./FormMotivosNegociosPerdidos";

const ConsultaMotivosNegociosPerdidos = () => {
  const columns = [
    {
      header: "Código",
      accessorKey: "id_perdido",
    },
    {
      header: "Status",
      accessorKey: "status_perdido",
    },
    {
      header: "Motivo",
      accessorKey: "motivo_perdido",
    },
    {
      header: "Detalhar",
      accessorKey: "motivo_detalhado_perdido",
    },
  ];

  const onSubmitFunction = async (data: FieldValues) => {
    data["motivo_perdido"];

    return cadastrarMotivosNegociosPerdidos(data);
  };

  const formatFunction = (data: any) => {
    return data.map((e: any) => {
      e["motivo_detalhado_perdido"] =
        e["motivo_detalhado_perdido"] == "true" ? "Sim" : "Não";
      return e;
    });
  };

  return (
    <>
      <Container>
        <ReactTable
          columns={columns}
          listFunction={listarMotivoNegocioPerdido}
          formatFunction={formatFunction}
          idCol="id_perdido"
          isActiveCol="status_perdido"
          canEdit
          modalWidth="sm"
          canDesactive
          editFunction={editarMotivosNegociosPerdidos}
          createFunction={onSubmitFunction}
          Form={FormMotivosNegociosPerdidos}
          pageName="Motivos de Negócios Perdidos"
          actionButtons={(
            data: any,
            updateTable: any,
            setIsLoading: any,
            { idCol, isActive, isActiveCol, pageName, editFunction }: any
          ) => [
            {
              className: `navButton buttonDanger`,
              onClick: (e: any) => {
                handleSweetAlert(
                  {
                    icon: "warning",
                    title: `Deletar o motivo código ${data[idCol]}?`,
                    html: `Tem certeza que deseja <b>deletar</b> o motivo </br> <b>
                    ${data["motivo_perdido"]}</b>?`,
                  },
                  async () => {
                    const id = data[idCol];
                    return deletarMotivoNegocioPerdido(id).then(() =>
                      updateTable()
                    );
                  }
                );
              },
              content: <BiTrash />,
            },
          ]}
        />
      </Container>
    </>
  );
};

export default ConsultaMotivosNegociosPerdidos;