"use client";

import Button from "@/components/Forms/Button";
import { handleSweetAlert } from "@/components/Modal/SweetAlertConfirm";
import ModalComponente from "@/components/Modal/ModalComponente";
import { aprovarSolicitacao } from "@/requests/CRUD/SolicVeiculos/aprovarSolicitacao";
import { cancelarSolicitacao } from "@/requests/CRUD/SolicVeiculos/cancelarSolicitacao";
import { useState } from "react";

const InfoRow = ({ label, value }: { label: string; value: any }) => (
  <div className="flex flex-row gap-1">
    <span className="font-semibold">{label}:</span>
    <span>{value || "-"}</span>
  </div>
);

const ModalAprovarSolicitacao = ({
  solicitacao,
  onClose,
  onUpdated,
}: {
  solicitacao: any;
  onClose: () => void;
  onUpdated: () => void;
}) => {
  const [isLoading, setIsLoading] = useState(false);

  if (!solicitacao) return null;

  return (
    <ModalComponente
      hasForm={false}
      hasSaveButton={false}
      header="Aprovar Solicitação de Veículo"
      defaultW="w-[500px]"
      opened={Boolean(solicitacao)}
      onClose={onClose}
    >
      <div className="flex flex-col gap-2">
        <InfoRow label="Solicitante" value={solicitacao.nome_usuario} />
        <InfoRow label="Departamento" value={solicitacao.departamento} />
        <InfoRow
          label="Veículo"
          value={`${solicitacao.placa_veiculo || ""} - ${solicitacao.modelo_veiculo || ""}`}
        />
        <InfoRow label="Motorista" value={solicitacao.motorista_solicitacao} />
        <InfoRow label="Destino" value={solicitacao.destino_solicitacao} />
        <InfoRow label="Motivo" value={solicitacao.motivo_solicitacao} />
        <InfoRow
          label="Previsão de Saída"
          value={solicitacao.data_previsao_saida_solicitacao}
        />
        <InfoRow
          label="Previsão de Retorno"
          value={solicitacao.data_previsao_retorno_solicitacao}
        />
        <InfoRow label="Observações" value={solicitacao.observacoes_solicitacao} />

        <div className="flex flex-row gap-2 mt-4">
          <Button
            loading={isLoading}
            className="flex-1 bg-danger"
            onClick={() => {
              handleSweetAlert(
                {
                  icon: "warning",
                  title: "Cancelar Solicitação",
                  html: "Tem certeza que deseja <b>Cancelar</b> esta solicitação?",
                },
                () => {
                  setIsLoading(true);
                  cancelarSolicitacao({ id_solicitacao: solicitacao.id_solicitacao })
                    .then(() => {
                      onUpdated();
                      onClose();
                    })
                    .finally(() => setIsLoading(false));
                }
              );
            }}
          >
            Cancelar Solicitação
          </Button>
          <Button
            loading={isLoading}
            className="flex-1 bg-primary"
            onClick={() => {
              setIsLoading(true);
              aprovarSolicitacao({ id_solicitacao: solicitacao.id_solicitacao })
                .then(() => {
                  onUpdated();
                  onClose();
                })
                .finally(() => setIsLoading(false));
            }}
          >
            Aprovar
          </Button>
        </div>
      </div>
    </ModalComponente>
  );
};

export default ModalAprovarSolicitacao;