import React, { useState } from 'react';
import { Box, Checkbox, FormControlLabel, FormGroup, Typography, Paper, Divider, TextField } from '@mui/material';
import type { PermisoAsignadoDto } from '../../../models/dtos/Usuarios/PermisoAsignadoDto';

interface PermisosChecklistProps {
  permisosDisponibles: PermisoAsignadoDto[];
  permisosSeleccionados: Set<number>;
  onPermisoChange: (permisoId: number, asignado: boolean, esPermisoSeccion?: boolean, moduloHijo?: string) => void;
  disabled?: boolean;
}

const SECCION_PERMISSIONS_PREFIX = "SS";

// Mapeo de codAcc de sección a su módulo conceptual
const getModuloFromSeccionCodAcc = (codAcc: string): string | null => {
    if (codAcc === "SS001") return "Distribución";    
    if (codAcc === "SS007") return "Suscripciones";
    if (codAcc === "SS002") return "Contables";
    if (codAcc === "SS003") return "Impresión";
    if (codAcc === "SS004") return "Reportes";
    if (codAcc === "SS006") return "Usuarios";    
    if (codAcc === "SS005") return "Radios";
    return null;
};

// Función para determinar el módulo conceptual de un permiso individual
const getModuloConceptualDelPermiso = (permisoModulo: string): string => {
    const moduloLower = permisoModulo.toLowerCase();    
    if (moduloLower.includes("distribuidores") ||
        moduloLower.includes("canillas") || // Cubre "Canillas" y "Movimientos Canillas"
        moduloLower.includes("publicaciones distribución") ||
        moduloLower.includes("zonas distribuidores") ||
        moduloLower.includes("movimientos distribuidores") ||
        moduloLower.includes("empresas") || // Módulo "Empresas"
        moduloLower.includes("otros destinos") || // Cubre "Otros Destinos" y "Salidas Otros Destinos"
        moduloLower.includes("ctrl. devoluciones")) {
        return "Distribución";
    }
    if (moduloLower.includes("suscripciones")) {
        return "Suscripciones";
    }
    if (moduloLower.includes("cuentas pagos") ||
        moduloLower.includes("cuentas notas") ||
        moduloLower.includes("cuentas tipos pagos") ||
        moduloLower.includes("cuentas cierres")) {
        return "Contables";
    }
    if (moduloLower.includes("impresión tiradas") ||
        moduloLower.includes("impresión bobinas") || // Cubre "Impresión Bobinas" y "Tipos Bobinas"
        moduloLower.includes("impresión plantas") ||
        moduloLower.includes("estados bobinas") ||
        moduloLower.includes("tipos bobinas")) { // Añadido explícitamente
        return "Impresión";
    }
    if (moduloLower.includes("radios")) { // Asumiendo que los permisos de radios tendrán "Radios" en su módulo
        return "Radios";
    }
    if (moduloLower.includes("usuarios") || // Cubre "Usuarios" y "Perfiles"
        moduloLower.includes("perfiles")) {
        return "Usuarios";
    }
    if (moduloLower.includes("reportes")) { // Para los permisos RRxxx
        return "Reportes";
    }
    if (moduloLower.includes("permisos")) { // Para "Permisos (Definición)"
      return "Permisos (Definición)";
    }
    return permisoModulo; // Fallback al nombre original si no coincide
};


const PermisosChecklist: React.FC<PermisosChecklistProps> = ({
  permisosDisponibles,
  permisosSeleccionados,
  onPermisoChange,
  disabled = false,
}) => {
  const [filtrosModulo, setFiltrosModulo] = useState<Record<string, string>>({});

  const handleFiltroChange = (moduloConceptual: string, texto: string) => {
    setFiltrosModulo(prev => ({ ...prev, [moduloConceptual]: texto.toLowerCase() }));
  };

  const permisosDeSeccion = permisosDisponibles.filter(p => p.codAcc.startsWith(SECCION_PERMISSIONS_PREFIX));
  const permisosNormales = permisosDisponibles.filter(p => !p.codAcc.startsWith(SECCION_PERMISSIONS_PREFIX));

  const permisosAgrupadosConceptualmente = permisosNormales.reduce((acc, permiso) => {
    const moduloConceptual = getModuloConceptualDelPermiso(permiso.modulo);
    if (!acc[moduloConceptual]) {
      acc[moduloConceptual] = [];
    }
    acc[moduloConceptual].push(permiso);
    return acc;
  }, {} as Record<string, PermisoAsignadoDto[]>);

  const ordenModulosPrincipales = ["Distribución", "Suscripciones", "Contables", "Impresión", "Usuarios", "Reportes", "Radios","Permisos (Definición)"];
  // Añadir módulos que solo tienen permiso de sección (como Radios) pero no hijos (aún)
  permisosDeSeccion.forEach(ps => {
      const moduloConceptual = getModuloFromSeccionCodAcc(ps.codAcc);
      if (moduloConceptual && !ordenModulosPrincipales.includes(moduloConceptual)) {
          // Insertar después de un módulo conocido o al final si no hay un orden específico para él
          const indexReportes = ordenModulosPrincipales.indexOf("Reportes");
          if (indexReportes !== -1) {
            ordenModulosPrincipales.splice(indexReportes, 0, moduloConceptual);
          } else {
            ordenModulosPrincipales.push(moduloConceptual);
          }
      }
      if (moduloConceptual && !permisosAgrupadosConceptualmente[moduloConceptual]) {
          permisosAgrupadosConceptualmente[moduloConceptual] = []; // Asegurar que el grupo exista para Radios
      }
  });
  // Eliminar duplicados del orden por si acaso
  const ordenFinalModulos = [...new Set(ordenModulosPrincipales)];


  return (
    <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2.5, justifyContent: 'center' }}>
      {ordenFinalModulos.map(moduloConceptual => { // Usar ordenFinalModulos
        const permisoSeccionAsociado = permisosDeSeccion.find(
          ps => getModuloFromSeccionCodAcc(ps.codAcc) === moduloConceptual
        );
        const permisosDelModuloHijosOriginales = permisosAgrupadosConceptualmente[moduloConceptual] || [];

        // Condición para renderizar la sección
        if (!permisoSeccionAsociado && permisosDelModuloHijosOriginales.length === 0 && moduloConceptual !== "Permisos (Definición)") {
            // No renderizar si no hay permiso de sección Y no hay hijos, EXCEPTO para "Permisos (Definición)" que es especial
            return null;
        }
         if (moduloConceptual === "Permisos (Definición)" && permisosDelModuloHijosOriginales.length === 0) {
             // No renderizar "Permisos (Definición)" si no tiene hijos
            return null;
        }


        const esSeccionSeleccionada = permisoSeccionAsociado ? permisosSeleccionados.has(permisoSeccionAsociado.id) : false;
        const todosHijosSeleccionados = permisosDelModuloHijosOriginales.length > 0 && permisosDelModuloHijosOriginales.every(p => permisosSeleccionados.has(p.id));
        const ningunHijoSeleccionado = permisosDelModuloHijosOriginales.every(p => !permisosSeleccionados.has(p.id));
        const algunosHijosSeleccionados = !todosHijosSeleccionados && !ningunHijoSeleccionado && permisosDelModuloHijosOriginales.length > 0;

        const textoFiltro = filtrosModulo[moduloConceptual] || '';
        const permisosDelModuloHijosFiltrados = textoFiltro
            ? permisosDelModuloHijosOriginales.filter(permiso =>
                permiso.descPermiso.toLowerCase().includes(textoFiltro) ||
                permiso.codAcc.toLowerCase().includes(textoFiltro)
              )
            : permisosDelModuloHijosOriginales;

        return (
          <Box key={moduloConceptual} sx={{ /* ... estilos del Box ... */ 
                flexGrow: 1,
                flexBasis: { xs: '100%', sm: 'calc(50% - 20px)', md: 'calc(33.333% - 20px)' },
                minWidth: '320px', // Aumentar un poco para el filtro
                maxWidth: { xs: '100%', sm: 'calc(50% - 10px)', md: 'calc(33.333% - 10px)'},
           }}>
            <Paper elevation={2} sx={{ p: 2, height: '100%', display: 'flex', flexDirection: 'column' }}>
              <Typography variant="subtitle1" gutterBottom component="div" sx={{ fontWeight: 'bold', borderBottom: 1, borderColor: 'divider', pb: 1, mb: 1 }}>
                {moduloConceptual}
              </Typography>

              {permisosDelModuloHijosOriginales.length > 3 && ( // Mostrar filtro si hay más de 3 permisos
                 <TextField
                    label={`Buscar en ${moduloConceptual}...`}
                    variant="standard"
                    size="small"
                    fullWidth
                    value={filtrosModulo[moduloConceptual] || ''}
                    onChange={(e) => handleFiltroChange(moduloConceptual, e.target.value)}
                    sx={{ mb: 1, mt: 0.5 }}
                    disabled={disabled}
                />
              )}

              {permisoSeccionAsociado && (
                <>
                  <FormControlLabel
                    label={`Acceso a Sección ${moduloConceptual}`} // Cambiado el Label
                    labelPlacement="end"
                    sx={{mb:1, '& .MuiFormControlLabel-label': { fontWeight: 'medium'}}}
                    control={
                      <Checkbox
                        checked={esSeccionSeleccionada && (permisosDelModuloHijosOriginales.length === 0 || todosHijosSeleccionados)}
                        indeterminate={esSeccionSeleccionada && (algunosHijosSeleccionados || (ningunHijoSeleccionado && permisosDelModuloHijosOriginales.length > 0))}
                        onChange={() => onPermisoChange(permisoSeccionAsociado.id, false, true, moduloConceptual)}
                        disabled={disabled}
                        size="small"
                      />
                    }
                  />
                  {/* Mostrar Divider solo si hay hijos o es la sección Radios (que queremos que aparezca aunque esté vacía) */}
                  {(permisosDelModuloHijosOriginales.length > 0 || moduloConceptual === "Radios") && <Divider sx={{mb:1.5}}/> }
                </>
              )}
              
              <Box sx={{ maxHeight: '280px', overflowY: 'auto', flexGrow: 1 }}> {/* Aumentar un poco maxHeight */}
                  <FormGroup sx={{ pl: permisoSeccionAsociado ? 2 : 0 }}>
                    {permisosDelModuloHijosFiltrados.map((permiso) => (
                      <FormControlLabel
                        key={permiso.id}
                        control={
                          <Checkbox
                            checked={permisosSeleccionados.has(permiso.id)}
                            onChange={(e) => onPermisoChange(permiso.id, e.target.checked, false, moduloConceptual)}
                            disabled={disabled || (permisoSeccionAsociado && !esSeccionSeleccionada)}
                            size="small"
                          />
                        }
                        label={<Typography variant="body2">{`${permiso.descPermiso} (${permiso.codAcc})`}</Typography>}
                      />
                    ))}
                    {textoFiltro && permisosDelModuloHijosFiltrados.length === 0 && permisosDelModuloHijosOriginales.length > 0 && (
                        <Typography variant="caption" sx={{p:1, fontStyle: 'italic', textAlign: 'center'}}>
                            No hay permisos que coincidan con "{textoFiltro}".
                        </Typography>
                    )}
                    {/* Mensaje si no hay hijos en general (y no es por filtro) */}
                    {permisosDelModuloHijosOriginales.length === 0 && !textoFiltro && moduloConceptual !== "Permisos (Definición)" && (
                         <Typography variant="caption" sx={{p:1, fontStyle: 'italic', textAlign: 'center'}}>
                            No hay permisos específicos en esta sección.
                        </Typography>
                    )}
                  </FormGroup>
              </Box>
            </Paper>
          </Box>
        );
      })}
    </Box>
  );
};

export default PermisosChecklist;