import { useClienteStore } from '~/store/cliente';
import { DateFormatter, getLocalTimeZone, today } from '@internationalized/date';

export const useHistorialCliente = () => {
  const storeCliente = useClienteStore();
  const cliente = storeCliente.cliente;

  // :::::::::::::: Composables internos ::::::::::::::
  const {
    obtenerHistorialPedidos,
    obtenerDatosIniciales,
    nuevoCaso,
    historialCasosPorPedido,
    historialCasos,
    nuevoCasoEndPoint,
    casoCreado,
    titulo,
    asunto_caso_id,
    tipo_caso_id,
    tipo_origen_id,
    prioridad,
    pedido_id,
    cliente_id,
    cef_id,
    caso_errors,
    loading: loadingHistorial,
    dataHistorial,
    search,
    modalNuevoCaso,
    modalHistorial,
    pedidoSeleccionado,
    datosIniciales,
  } = useHistorialPedidos();

  const {
    obtenerActividades,
    obtenerCasos,
    obtenerTipoActividades,
    crearActividad,
    resolverCaso,
    actividades,
    tipoActividades,
    loading: loadingCasos,
    modalActividad,
    modalNuevaActividad,
    caso,
    casos: casosCliente,
    endpoint: casoEndpoint,
  } = useCasos();

  // :::::::::::::: Estado del acordeón y tabs ::::::::::::::
  const seccionAbierta = ref(false);
  const tabActiva = ref('pedidos');
  const cargadoHistorial = ref(false);
  const cargadoCasos = ref(false);

  // :::::::::::::: Calendario de rango de fechas (estilo Casos) ::::::::::::::
  const df = new DateFormatter('es-ES', { dateStyle: 'medium' });
  const tz = getLocalTimeZone();
  const hoy = today(tz);
  const fechaHistorial = ref({
    start: hoy,
    end: hoy,
  });

  const labelFechaHistorial = computed(() => {
    const { start, end } = fechaHistorial.value;
    if (!start) return 'Seleccionar fecha';
    if (!end) return df.format(start.toDate(tz));
    return `${df.format(start.toDate(tz))} - ${df.format(end.toDate(tz))}`;
  });

  // :::::::::::::: Carga del historial de pedidos ::::::::::::::
  const cargarHistorial = async (options: { force?: boolean; fechaInicio?: string; fechaFin?: string } = {}) => {
    if (cargadoHistorial.value && !options.force) return;
    cargadoHistorial.value = true;

    nuevoCasoEndPoint.value = '/admin/caso';
    casoEndpoint.value = '/admin/caso';

    const fechaInicio = options.fechaInicio ?? fechaHistorial.value.start?.toString() ?? null;
    const fechaFin = options.fechaFin ?? fechaHistorial.value.end?.toString() ?? null;

    await obtenerHistorialPedidos({
      endpoint: '/admin/cliente',
      cliente_id: cliente?.id,
      fecha_inicio: fechaInicio,
      fecha_fin: fechaFin,
      all: true,
    });

    // Cargar datos iniciales para el modal de nuevo caso (con caché en store)
    if (
      storeCliente.datos_iniciales_historial_pedidos &&
      Object.keys(storeCliente.datos_iniciales_historial_pedidos).length === 0
    ) {
      const datos = await obtenerDatosIniciales({ endpoint: '/admin/caso' });
      storeCliente.datos_iniciales_historial_pedidos = datos;
      datosIniciales.value = datos;
    } else {
      datosIniciales.value = storeCliente.datos_iniciales_historial_pedidos;
    }
  };

  // :::::::::::::: Watch: cambio de rango de fechas — recarga automática ::::::::::::::
  watch(
    () => fechaHistorial.value,
    (newRange) => {
      if (newRange?.start && newRange?.end) {
        cargarHistorial({
          force: true,
          fechaInicio: newRange.start.toString(),
          fechaFin: newRange.end.toString(),
        });
      }
    }
  );

  // :::::::::::::: Carga lazy de casos del cliente (sin filtro de fecha) ::::::::::::::
  const cargarCasos = async () => {
    if (cargadoCasos.value) return;
    cargadoCasos.value = true;
    casoEndpoint.value = '/admin/caso';
    await obtenerCasos('', '', cliente?.id ?? null);
  };

  // :::::::::::::: Toggle acordeón — carga el historial al abrirse ::::::::::::::
  const toggleSeccion = () => {
    seccionAbierta.value = !seccionAbierta.value;
    if (seccionAbierta.value) {
      cargarHistorial();
    }
  };

  // :::::::::::::: Watch: cambio de tab — carga datos si aún no se han cargado ::::::::::::::
  watch(tabActiva, (tab) => {
    if (tab === 'casos' && !cargadoCasos.value) {
      casoEndpoint.value = '/admin/caso';
      cargarCasos();
    }
    if (tab === 'pedidos' && !cargadoHistorial.value) {
      cargarHistorial();
    }
  });

  // :::::::::::::: Watch: caso creado — recarga instantánea de la lista de casos ::::::::::::::
  watch(casoCreado, (creado) => {
    if (creado) {
      casoCreado.value = false;
      cargadoCasos.value = false;
      casoEndpoint.value = '/admin/caso';
      obtenerCasos('', '', cliente?.id ?? null);
      cargadoCasos.value = true;
    }
  });

  return {
    // Estado UI
    seccionAbierta,
    tabActiva,
    toggleSeccion,
    // Calendario de fechas
    fechaHistorial,
    labelFechaHistorial,
    // Historial de pedidos
    dataHistorial,
    search,
    loadingHistorial,
    modalNuevoCaso,
    modalHistorial,
    pedidoSeleccionado,
    historialCasos,
    historialCasosPorPedido,
    // Nuevo caso
    nuevoCaso,
    datosIniciales,
    caso_errors,
    titulo,
    asunto_caso_id,
    tipo_caso_id,
    tipo_origen_id,
    prioridad,
    pedido_id,
    cliente_id,
    cef_id,
    // Casos del cliente
    casosCliente,
    casoEndpoint,
    loadingCasos,
    modalActividad,
    obtenerActividades,
    resolverCaso,
    caso,
    // Actividades
    actividades,
    tipoActividades,
    modalNuevaActividad,
    obtenerTipoActividades,
    crearActividad,
  };
};