import { Icon } from "@iconify/react";
import {
  Box,
  Button,
  Card,
  CardContent,
  Chip,
  CircularProgress,
  MenuItem,
  Stack,
  Table,
  TableBody,
  TableCell,
  TableContainer,
  TableHead,
  TableRow,
  TextField,
  Tooltip,
  Typography,
} from "@mui/material";
import { useMemo, useState } from "react";
import { useNavigate } from "react-router-dom";
import { EmptyState, ScreenGuia } from "../components/_standards";
import {
  TIPOS_ENTIDAD_PROVEEDOR,
  TIPOS_ENTIDAD_PROVEEDOR_LIST,
  getTipoEntidadProveedor,
} from "../components/_standards/enums/tiposEntidadProveedor";
import { AccesoRestringido } from "../components/common/AccesoRestringido";
import { ProveedorReclasificarDialog } from "../components/organismos/ProveedoresDesign/ProveedorReclasificarDialog";
import { usePermission } from "../hooks/usePermission";
import { useReporteClasificacionProveedoresQuery } from "../tanstack/ProveedoresStack";
import { fmtMoneda } from "../components/_standards/enums/monedas";
import { useAuthStore } from "../store/AuthStore";

const ORIGEN_LABEL = {
  OVERRIDE: { label: "Override manual", color: "primary", icon: "mdi:tune-variant" },
  CONCEPTO_PROVEEDORES: { label: "Concepto: Proveedores", color: "default", icon: "mdi:link-variant" },
  CONCEPTO_PROVEEDORES_EXTERIOR: {
    label: "Concepto: Prov. exterior",
    color: "info",
    icon: "mdi:earth",
  },
  CONCEPTO_ACREEDORES_VARIOS: {
    label: "Concepto: Acreedores varios",
    color: "warning",
    icon: "mdi:receipt-text-outline",
  },
};

export function ReporteClasificacionTerceros() {
  const navigate = useNavigate();
  const compras = usePermission("COMPRAS");
  const canVer = compras.can("CMP_PRV_PROVEEDOR_LISTAR");
  const canReclasificar = compras.can("CMP_PRV_PROVEEDOR_EDITAR");
  const hasModulePlan = useAuthStore((s) => s.hasModulePlan);
  const contabilidadContratada = hasModulePlan?.("CONTABILIDAD") ?? false;

  const [tipoFiltro, setTipoFiltro] = useState("TODOS");
  const [activoFiltro, setActivoFiltro] = useState("true");
  const [busqueda, setBusqueda] = useState("");
  const [reclasificarTarget, setReclasificarTarget] = useState(null);

  const filtros = useMemo(
    () => ({
      tipoEntidad: tipoFiltro === "TODOS" ? undefined : tipoFiltro,
      activo: activoFiltro === "" ? undefined : activoFiltro === "true",
    }),
    [tipoFiltro, activoFiltro],
  );
  const { data, isLoading, isFetching } = useReporteClasificacionProveedoresQuery(filtros);

  const itemsFiltrados = useMemo(() => {
    const items = data?.items ?? [];
    if (!busqueda.trim()) return items;
    const q = busqueda.trim().toLowerCase();
    return items.filter(
      (i) =>
        (i.razon_social || "").toLowerCase().includes(q) ||
        (i.ruc || "").toLowerCase().includes(q) ||
        (i.nro_documento || "").toLowerCase().includes(q),
    );
  }, [data?.items, busqueda]);

  const saldoTotal = useMemo(
    () => itemsFiltrados.reduce((a, r) => a + Number(r.saldo_cxp || 0), 0),
    [itemsFiltrados],
  );

  if (!canVer) return <AccesoRestringido />;
  if (!contabilidadContratada) return <AccesoRestringido mensaje="Este reporte requiere el módulo Contabilidad." />;

  return (
    <Box p={2}>
      <Stack direction="row" alignItems="center" spacing={1} mb={1.5}>
        <Button
          size="small"
          variant="outlined"
          startIcon={<Icon icon="mdi:arrow-left" />}
          onClick={() => navigate(-1)}
        >
          Volver
        </Button>
        <Typography variant="h6" sx={{ ml: 1 }}>
          Clasificación contable de terceros
        </Typography>
      </Stack>

      <ScreenGuia
        titulo="Clasificación de terceros"
        moduloPadre="Compras · Reportes"
        intro="Vista consolidada para el contador: cada proveedor con su tipo, cuenta contable efectiva y saldo CxP abierto. Desde acá se puede reclasificar terceros para ordenar la cartera."
        pasos={[
          {
            icon: "mdi:filter-variant",
            color: "#3b82f6",
            titulo: "1. Filtrar",
            desc: "Por tipo (local / exterior / acreedor) y estado activo. Buscá por razón social, RUC o documento.",
          },
          {
            icon: "mdi:tag-outline",
            color: "#f59e0b",
            titulo: "2. Revisar cuenta efectiva",
            desc: "Si el proveedor tiene override, se usa esa cuenta. Si no, se resuelve por el concepto contable del tipo.",
          },
          {
            icon: "mdi:tag-arrow-right-outline",
            color: "#6366f1",
            titulo: "3. Reclasificar",
            desc: "Cambiá el tipo cuando corresponda. Los saldos existentes NO migran: sólo documentos nuevos usan la cuenta destino.",
          },
        ]}
        notas={[
          {
            icon: "mdi:information-outline",
            text: "El saldo mostrado suma cuotas CxP con estado distinto de 'pagada' y 'anulada', en la moneda de cada documento (no se convierte).",
          },
          {
            icon: "mdi:lock-outline",
            text: "La cuenta pasivo de cada CxP quedó congelada al momento del asiento. Reclasificar no reabre esos asientos.",
          },
        ]}
      />

      <Card sx={{ mb: 2 }}>
        <CardContent>
          <Stack
            direction={{ xs: "column", md: "row" }}
            spacing={2}
            alignItems={{ md: "center" }}
          >
            <TextField
              select
              size="small"
              label="Tipo de entidad"
              value={tipoFiltro}
              onChange={(e) => setTipoFiltro(e.target.value)}
              sx={{ minWidth: 240 }}
            >
              <MenuItem value="TODOS">Todos</MenuItem>
              {TIPOS_ENTIDAD_PROVEEDOR_LIST.map((t) => (
                <MenuItem key={t.value} value={t.value}>
                  <Box sx={{ display: "flex", alignItems: "center", gap: 1 }}>
                    <Icon icon={t.icon} width={16} />
                    <span>{t.label}</span>
                  </Box>
                </MenuItem>
              ))}
            </TextField>
            <TextField
              select
              size="small"
              label="Estado"
              value={activoFiltro}
              onChange={(e) => setActivoFiltro(e.target.value)}
              sx={{ minWidth: 160 }}
            >
              <MenuItem value="">Todos</MenuItem>
              <MenuItem value="true">Activos</MenuItem>
              <MenuItem value="false">Inactivos</MenuItem>
            </TextField>
            <TextField
              size="small"
              label="Buscar (razón social / RUC / documento)"
              value={busqueda}
              onChange={(e) => setBusqueda(e.target.value)}
              sx={{ flex: 1, minWidth: 260 }}
              InputProps={{
                startAdornment: (
                  <Icon icon="mdi:magnify" width={18} style={{ marginRight: 6, opacity: 0.6 }} />
                ),
              }}
            />
          </Stack>

          {data && (
            <Stack direction="row" spacing={1} mt={2} flexWrap="wrap">
              <Chip
                icon={<Icon icon="mdi:sigma" />}
                label={`${data.total} terceros`}
              />
              <Chip
                icon={<Icon icon={TIPOS_ENTIDAD_PROVEEDOR.PROVEEDOR_LOCAL.icon} />}
                color="primary"
                variant="outlined"
                label={`Locales: ${data.resumen.PROVEEDOR_LOCAL}`}
              />
              <Chip
                icon={<Icon icon={TIPOS_ENTIDAD_PROVEEDOR.PROVEEDOR_EXTERIOR.icon} />}
                color="info"
                variant="outlined"
                label={`Exterior: ${data.resumen.PROVEEDOR_EXTERIOR}`}
              />
              <Chip
                icon={<Icon icon={TIPOS_ENTIDAD_PROVEEDOR.ACREEDOR_VARIO.icon} />}
                color="warning"
                variant="outlined"
                label={`Acreedores: ${data.resumen.ACREEDOR_VARIO}`}
              />
              <Chip
                variant="outlined"
                icon={<Icon icon="mdi:cash-multiple" />}
                label={`Saldo CxP visible: ${fmtMoneda(saldoTotal, "PYG")}`}
              />
            </Stack>
          )}
        </CardContent>
      </Card>

      <Card>
        <CardContent>
          {isLoading ? (
            <Box display="flex" justifyContent="center" py={4}>
              <CircularProgress />
            </Box>
          ) : !itemsFiltrados.length ? (
            <EmptyState
              icon="mdi:account-search"
              title="Sin terceros para el filtro"
              description="Ajustá los filtros o revisá si hay proveedores dados de alta."
            />
          ) : (
            <TableContainer>
              <Table size="small" stickyHeader>
                <TableHead>
                  <TableRow>
                    <TableCell>Tercero</TableCell>
                    <TableCell>RUC / Doc.</TableCell>
                    <TableCell>Tipo</TableCell>
                    <TableCell>Cuenta efectiva</TableCell>
                    <TableCell>Origen</TableCell>
                    <TableCell align="right">CxP abiertas</TableCell>
                    <TableCell align="right">Saldo CxP</TableCell>
                    <TableCell align="center">Acciones</TableCell>
                  </TableRow>
                </TableHead>
                <TableBody>
                  {itemsFiltrados.map((r) => {
                    const tipoInfo = getTipoEntidadProveedor(r.tipo_entidad);
                    const origen = ORIGEN_LABEL[r.cuenta_efectiva_origen] || ORIGEN_LABEL.CONCEPTO_PROVEEDORES;
                    return (
                      <TableRow key={r.id} hover>
                        <TableCell>
                          <Stack>
                            <Typography variant="body2" fontWeight={600}>
                              {r.razon_social || "—"}
                            </Typography>
                            {!r.activo && (
                              <Chip
                                size="small"
                                label="Inactivo"
                                variant="outlined"
                                sx={{ mt: 0.3, alignSelf: "flex-start" }}
                              />
                            )}
                          </Stack>
                        </TableCell>
                        <TableCell>
                          {r.ruc ? `${r.ruc}${r.dv ? `-${r.dv}` : ""}` : r.nro_documento || "—"}
                        </TableCell>
                        <TableCell>
                          <Chip
                            size="small"
                            color={tipoInfo.color}
                            variant="outlined"
                            icon={<Icon icon={tipoInfo.icon} />}
                            label={tipoInfo.label}
                          />
                        </TableCell>
                        <TableCell>
                          {r.cuenta_override ? (
                            <Tooltip title="Override manual de cuenta contable">
                              <Typography variant="body2">
                                {r.cuenta_override.codigo} — {r.cuenta_override.descripcion}
                              </Typography>
                            </Tooltip>
                          ) : (
                            <Typography variant="body2" color="text.secondary">
                              (por mapeo de concepto)
                            </Typography>
                          )}
                        </TableCell>
                        <TableCell>
                          <Chip
                            size="small"
                            color={origen.color}
                            variant="outlined"
                            icon={<Icon icon={origen.icon} />}
                            label={origen.label}
                          />
                        </TableCell>
                        <TableCell align="right">{r.cxp_abiertas}</TableCell>
                        <TableCell align="right">{fmtMoneda(r.saldo_cxp, "PYG")}</TableCell>
                        <TableCell align="center">
                          {canReclasificar && (
                            <Tooltip title="Reclasificar tipo de entidad">
                              <Button
                                size="small"
                                variant="text"
                                startIcon={<Icon icon="mdi:tag-arrow-right-outline" />}
                                onClick={() =>
                                  setReclasificarTarget({
                                    id: r.id,
                                    tipo_entidad: r.tipo_entidad,
                                    cuenta_contable_id: r.cuenta_override?.id ?? null,
                                    personas: { razon_social: r.razon_social },
                                  })
                                }
                              >
                                Reclasificar
                              </Button>
                            </Tooltip>
                          )}
                        </TableCell>
                      </TableRow>
                    );
                  })}
                </TableBody>
              </Table>
            </TableContainer>
          )}
          {isFetching && !isLoading && (
            <Box mt={1} display="flex" alignItems="center" gap={1}>
              <CircularProgress size={14} />
              <Typography variant="caption" color="text.secondary">
                Actualizando…
              </Typography>
            </Box>
          )}
        </CardContent>
      </Card>

      <ProveedorReclasificarDialog
        open={!!reclasificarTarget}
        onClose={() => setReclasificarTarget(null)}
        proveedor={reclasificarTarget}
      />
    </Box>
  );
}

export default ReporteClasificacionTerceros;
