import { useQueryClient } from '@tanstack/vue-query';
import { useFetch } from '@win2win/shared-ui';
import { isNil } from 'lodash';
import { api } from 'src/boot/axios';
import { useRequestConfirmation } from 'src/composables/useRequestConfirmation';
import { notifyError, notifySuccess } from 'src/helpers';
import { ESTADOS_TIE, Tie, TieESTADO } from 'src/models';
import { useCaptacionLite } from 'src/widgets/useStoreLite';
import { computed, ref, Ref } from 'vue';

export function useEstadoTie(idTie: Ref<number | undefined>) {
  const { id: idCaptacion } = useCaptacionLite();
  const id = computed(() => idTie.value ?? null);
  const key = computed(() => ['tie', id.value || null, 'lite']);
  const query = computed(() => `w2w-query/tie(${id.value})`);
  const { data } = useFetch<Tie | null>(key, query, {
    tie: ['id', 'estado', 'id_captacion'],
  });

  const _key = computed(() => ['captacion', idCaptacion.value, 'ties', 'lite']);
  const _query = computed(() => `w2w-query/ties(id_captacion=${idCaptacion.value})`);
  const { data: ties } = useFetch<{ id: number; estado: TieESTADO }[]>(_key, _query, {
    ties: ['id', 'estado'],
  });

  const isAcceptable = computed(() => {
    if (!ties.value) return false;
    if (ties.value.some((tie) => tie.estado === TieESTADO.ACEPTADO)) return false;
    const estado = data.value?.estado;
    if (isNil(estado) || estado === TieESTADO.BORRADOR) return false;
    return estado === TieESTADO.PUBLICADO;
  });

  const isRejectable = computed(() => {
    if (!ties.value) return false;
    const estado = data.value?.estado;
    if (isNil(estado) || estado === TieESTADO.BORRADOR) return false;
    return estado === TieESTADO.PUBLICADO || estado === TieESTADO.ACEPTADO;
  });
  const isEditable = computed(() => data.value?.estado === TieESTADO.BORRADOR);
  const isPublicable = computed(() => data.value?.estado === TieESTADO.BORRADOR);
  const loading = ref(false);
  const rejectTie = () => changeTieState(TieESTADO.RECHAZADO);
  const acceptTie = () => changeTieState(TieESTADO.ACEPTADO);
  const publishTie = () => changeTieState(TieESTADO.PUBLICADO);
  const { requestConfirmation } = useRequestConfirmation();
  const queryClient = useQueryClient();
  const getEstadoLabel = (ESTADO: TieESTADO) => ESTADOS_TIE[ESTADO].actionLabel;

  function changeTieState(ESTADO: TieESTADO) {
    const estadoLabel = getEstadoLabel(ESTADO);
    return new Promise((resolve, reject) => {
      requestConfirmation({
        title: 'Actualizar propuesta',
        message: `¿Estás seguro que quieres ${estadoLabel} esta propuesta?`,
        action: () => {
          loading.value = true;
          api
            .put(`captacion/${idCaptacion.value}/tie/` + id.value, { ESTADO })
            .then(() => {
              queryClient.invalidateQueries({ queryKey: ['tie', id.value || null] });
              queryClient.invalidateQueries({ queryKey: ['captacion', idCaptacion.value, 'ties'] });
              notifySuccess('Propuesta actualizada correctamente');
              resolve(true);
            })
            .catch(() => {
              notifyError(null, 'Error al actualizar la propuesta');
              reject();
            })
            .finally(() => (loading.value = false));
        },
      });
    });
  }

  return { isRejectable, isEditable, isPublicable, isAcceptable, loading, rejectTie, acceptTie, publishTie };
}