backend y front estables ses creo modal para permisos de checklist backend 1.0.31 y frontend 1.0.33

PERMISOS_CHECKLIST.md

@@ -0,0 +1,283 @@
+# Sistema de Permisos por Mecánico - Checklists
+
+## ✅ Implementación Completa
+
+Se ha implementado un sistema completo de permisos que permite controlar qué mecánicos pueden usar cada checklist.
+
+---
+
+## 🎯 Características Implementadas
+
+### **Backend**
+
+1. **Nueva Tabla de Permisos**
+   - Tabla `checklist_permissions` con relación many-to-many
+   - Constraint UNIQUE para evitar duplicados
+   - Índices optimizados para consultas rápidas
+
+2. **Lógica de Acceso**
+   - **Acceso Global**: Si un checklist NO tiene permisos registrados, todos los mecánicos pueden usarlo
+   - **Acceso Restringido**: Si tiene permisos, solo esos mecánicos específicos pueden verlo
+   - **Admins**: Siempre ven todos los checklists
+
+3. **Endpoints Actualizados**
+   - `GET /api/checklists`: Filtra automáticamente por permisos del mecánico
+   - `POST /api/checklists`: Guarda permisos al crear
+   - `PUT /api/checklists/{id}`: Actualiza permisos al editar
+   - Incluye `allowed_mechanics` en las respuestas
+
+### **Frontend**
+
+1. **Creación de Checklists**
+   - Selector de mecánicos con checkboxes
+   - Opción "Acceso Global" (no seleccionar ninguno)
+   - Interfaz clara con íconos 🔐 y 🌍
+
+2. **Visualización**
+   - Badge verde "🌍 Acceso Global" para checklists sin restricciones
+   - Badge índigo "🔐 Restringido - X mecánicos" para checklists restringidos
+   - Solo visible para administradores
+
+3. **Edición de Permisos**
+   - Botón "🔐 Permisos" en cada checklist (solo admins)
+   - Modal dedicado para editar permisos
+   - Cambios se aplican inmediatamente
+
+4. **Mensajes Mejorados**
+   - Mensaje específico para mecánicos sin checklists disponibles
+   - Instrucciones claras para contactar al administrador
+
+---
+
+## 📋 Instrucciones de Uso
+
+### **Para Administradores**
+
+#### 1. Crear Checklist con Permisos
+
+1. Ve a la pestaña "Checklists"
+2. Haz clic en "+ Crear Checklist"
+3. Completa los datos del checklist
+4. En la sección "🔐 Mecánicos Autorizados":
+   - **Para acceso global**: No selecciones ningún mecánico (deja todo sin marcar)
+   - **Para acceso restringido**: Marca los mecánicos que tendrán acceso
+5. Haz clic en "Crear Checklist"
+
+#### 2. Editar Permisos de Checklist Existente
+
+1. Ve a la pestaña "Checklists"
+2. Busca el checklist que quieres modificar
+3. Haz clic en el botón "🔐 Permisos"
+4. Modifica la selección de mecánicos:
+   - Marca "🌍 Todos los mecánicos" para acceso global
+   - O selecciona mecánicos específicos
+5. Haz clic en "Guardar Permisos"
+
+**Nota**: Los cambios son inmediatos. Los mecánicos que pierdan acceso dejarán de ver el checklist instantáneamente.
+
+#### 3. Ver Estado de Permisos
+
+Cada tarjeta de checklist muestra:
+- **🌍 Acceso Global - Todos los mecánicos**: Sin restricciones
+- **🔐 Restringido - X mecánicos**: Solo esos mecánicos tienen acceso
+
+### **Para Mecánicos**
+
+- Solo verás los checklists donde tienes permiso
+- Si no ves ningún checklist, contacta al administrador
+- No puedes modificar permisos (solo el admin puede hacerlo)
+
+---
+
+## 🗄️ Migración de Base de Datos
+
+### **Ejecutar SQL**
+
+```bash
+# Usando psql
+psql -U tu_usuario -d tu_database -f migrations/add_checklist_permissions.sql
+
+# O directamente
+psql -U tu_usuario -d tu_database
+```
+
+Luego ejecuta:
+
+```sql
+-- Crear tabla de permisos checklist-mecánico
+CREATE TABLE IF NOT EXISTS checklist_permissions (
+    id SERIAL PRIMARY KEY,
+    checklist_id INTEGER NOT NULL REFERENCES checklists(id) ON DELETE CASCADE,
+    mechanic_id INTEGER NOT NULL REFERENCES users(id) ON DELETE CASCADE,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
+    UNIQUE(checklist_id, mechanic_id)
+);
+
+-- Crear índices
+CREATE INDEX idx_checklist_permissions_checklist ON checklist_permissions(checklist_id);
+CREATE INDEX idx_checklist_permissions_mechanic ON checklist_permissions(mechanic_id);
+
+-- Comentarios
+COMMENT ON TABLE checklist_permissions IS 'Control de acceso de mecánicos a checklists. Si no hay registros para un checklist, todos los mecánicos tienen acceso.';
+```
+
+### **Reiniciar Backend**
+
+Después de ejecutar el SQL, reinicia el backend para que los cambios en los modelos tomen efecto:
+
+```bash
+# Si usas Docker
+docker-compose restart backend
+
+# Si corres directamente
+# Ctrl+C y volver a ejecutar
+python -m uvicorn app.main:app --reload
+```
+
+---
+
+## 🔍 Ejemplos de Uso
+
+### Ejemplo 1: Checklist para Todos los Mecánicos
+
+**Escenario**: Checklist de "Revisión Básica" que todos pueden usar
+
+**Configuración**:
+- Al crear/editar: No seleccionar ningún mecánico
+- El sistema muestra: "🌍 Acceso Global - Todos los mecánicos"
+
+**Resultado**: Todos los mecánicos ven este checklist
+
+---
+
+### Ejemplo 2: Checklist Especializado
+
+**Escenario**: Checklist de "Mantenimiento Eléctrico" solo para mecánicos certificados
+
+**Configuración**:
+1. Al crear/editar: Seleccionar solo mecánicos con certificación eléctrica
+2. El sistema muestra: "🔐 Restringido - 3 mecánicos"
+
+**Resultado**: Solo esos 3 mecánicos ven este checklist
+
+---
+
+### Ejemplo 3: Cambio de Permisos
+
+**Escenario**: Un mecánico nuevo se certifica en electricidad
+
+**Pasos**:
+1. Admin hace clic en "🔐 Permisos" del checklist "Mantenimiento Eléctrico"
+2. Marca al nuevo mecánico en la lista
+3. Guarda cambios
+4. El mecánico inmediatamente ve el checklist en su lista
+
+---
+
+## 📊 Base de Datos
+
+### Estructura de `checklist_permissions`
+
+| Campo | Tipo | Descripción |
+|-------|------|-------------|
+| id | SERIAL | ID único de la relación |
+| checklist_id | INTEGER | ID del checklist |
+| mechanic_id | INTEGER | ID del mecánico autorizado |
+| created_at | TIMESTAMP | Fecha de creación del permiso |
+
+### Consultas Útiles
+
+```sql
+-- Ver permisos de un checklist específico
+SELECT u.full_name, u.email 
+FROM checklist_permissions cp
+JOIN users u ON cp.mechanic_id = u.id
+WHERE cp.checklist_id = 1;
+
+-- Ver qué checklists puede usar un mecánico
+SELECT c.name, c.description
+FROM checklist_permissions cp
+JOIN checklists c ON cp.checklist_id = c.id
+WHERE cp.mechanic_id = 5;
+
+-- Checklists sin restricciones (acceso global)
+SELECT c.id, c.name
+FROM checklists c
+LEFT JOIN checklist_permissions cp ON c.id = cp.checklist_id
+WHERE cp.id IS NULL;
+
+-- Dar acceso a un mecánico a un checklist
+INSERT INTO checklist_permissions (checklist_id, mechanic_id)
+VALUES (1, 5)
+ON CONFLICT (checklist_id, mechanic_id) DO NOTHING;
+
+-- Quitar acceso
+DELETE FROM checklist_permissions
+WHERE checklist_id = 1 AND mechanic_id = 5;
+
+-- Convertir checklist a acceso global (borrar todos los permisos)
+DELETE FROM checklist_permissions WHERE checklist_id = 1;
+```
+
+---
+
+## ⚠️ Notas Importantes
+
+1. **Permisos Vacíos = Acceso Global**
+   - Si un checklist NO tiene registros en `checklist_permissions`, TODOS los mecánicos pueden usarlo
+   - Es el comportamiento por defecto
+
+2. **Los Admins Siempre Ven Todo**
+   - Los usuarios con rol `admin` ven todos los checklists sin importar los permisos
+   - Útil para gestión y supervisión
+
+3. **Cambios Inmediatos**
+   - Al editar permisos, los cambios se aplican instantáneamente
+   - No requiere logout/login
+
+4. **Cascada en Borrado**
+   - Si borras un checklist, sus permisos se borran automáticamente
+   - Si borras un mecánico, sus permisos se borran automáticamente
+
+5. **Inspecciones Existentes**
+   - Las inspecciones ya creadas NO se ven afectadas por cambios de permisos
+   - Solo afecta la creación de nuevas inspecciones
+
+---
+
+## 🐛 Troubleshooting
+
+### Problema: "Mecánico no ve ningún checklist"
+
+**Solución**:
+1. Verificar que el mecánico esté activo: `SELECT is_active FROM users WHERE id = X;`
+2. Verificar permisos: `SELECT * FROM checklist_permissions WHERE mechanic_id = X;`
+3. Verificar si hay checklists con acceso global (sin permisos)
+4. Verificar rol del usuario: debe ser `mechanic` o `mecanico`
+
+### Problema: "Error al crear/editar permisos"
+
+**Solución**:
+1. Verificar que la tabla `checklist_permissions` existe
+2. Verificar que los IDs de mecánicos son válidos
+3. Revisar logs del backend para errores específicos
+4. Verificar que el usuario es admin
+
+### Problema: "Los permisos no se aplican"
+
+**Solución**:
+1. Hacer logout y login nuevamente
+2. Verificar que el backend se reinició después de la migración
+3. Limpiar caché del navegador (Ctrl+Shift+R)
+4. Verificar en la base de datos que los permisos se guardaron correctamente
+
+---
+
+## 🎉 Resumen
+
+✅ **Backend**: Filtrado automático por permisos  
+✅ **Frontend**: Interfaz completa para gestionar permisos  
+✅ **Base de Datos**: Migración lista para ejecutar  
+✅ **Documentación**: Completa con ejemplos  
+
+El sistema está listo para usar después de ejecutar la migración SQL y reiniciar el backend.

backend/app/schemas.py

@@ -72,7 +72,12 @@ class ChecklistBase(BaseModel):
 class ChecklistCreate(ChecklistBase):
     mechanic_ids: Optional[List[int]] = []  # IDs de mecánicos autorizados
 
-class ChecklistUpdate(ChecklistBase):
+class ChecklistUpdate(BaseModel):
+    name: Optional[str] = None
+    description: Optional[str] = None
+    ai_mode: Optional[str] = None
+    scoring_enabled: Optional[bool] = None
+    logo_url: Optional[str] = None
     is_active: Optional[bool] = None
     mechanic_ids: Optional[List[int]] = None  # IDs de mecánicos autorizados
 

frontend/src/App.jsx

@@ -1344,8 +1344,10 @@ function QuestionsManagerModal({ checklist, onClose }) {
 function ChecklistsTab({ checklists, user, onChecklistCreated, onStartInspection }) {
   const [showCreateModal, setShowCreateModal] = useState(false)
   const [showQuestionsModal, setShowQuestionsModal] = useState(false)
+  const [showEditPermissionsModal, setShowEditPermissionsModal] = useState(false)
   const [selectedChecklist, setSelectedChecklist] = useState(null)
   const [creating, setCreating] = useState(false)
+  const [updating, setUpdating] = useState(false)
   const [mechanics, setMechanics] = useState([])
   const [formData, setFormData] = useState({
     name: '',
@@ -1354,6 +1356,9 @@ function ChecklistsTab({ checklists, user, onChecklistCreated, onStartInspection
     scoring_enabled: true,
     mechanic_ids: []
   })
+  const [editPermissionsData, setEditPermissionsData] = useState({
+    mechanic_ids: []
+  })
 
   useEffect(() => {
     loadMechanics()
@@ -1417,6 +1422,39 @@ function ChecklistsTab({ checklists, user, onChecklistCreated, onStartInspection
     }
   }
 
+  const handleEditPermissions = async (e) => {
+    e.preventDefault()
+    setUpdating(true)
+
+    try {
+      const token = localStorage.getItem('token')
+      const API_URL = import.meta.env.VITE_API_URL || ''
+      
+      const response = await fetch(`${API_URL}/api/checklists/${selectedChecklist.id}`, {
+        method: 'PUT',
+        headers: {
+          'Authorization': `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(editPermissionsData),
+      })
+
+      if (response.ok) {
+        setShowEditPermissionsModal(false)
+        setSelectedChecklist(null)
+        setEditPermissionsData({ mechanic_ids: [] })
+        onChecklistCreated() // Reload checklists
+      } else {
+        alert('Error al actualizar permisos')
+      }
+    } catch (error) {
+      console.error('Error:', error)
+      alert('Error al actualizar permisos')
+    } finally {
+      setUpdating(false)
+    }
+  }
+
   return (
     <div className="space-y-4">
       {user.role === 'admin' && (
@@ -1432,14 +1470,24 @@ function ChecklistsTab({ checklists, user, onChecklistCreated, onStartInspection
 
       {checklists.length === 0 ? (
         <div className="text-center py-12">
-          <p className="text-gray-500">No hay checklists activos</p>
+          {user.role === 'admin' ? (
-          {user.role === 'admin' && (
+            <>
-            <button
+              <p className="text-gray-500">No hay checklists activos</p>
-              onClick={() => setShowCreateModal(true)}
+              <button
-              className="mt-4 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition"
+                onClick={() => setShowCreateModal(true)}
-            >
+                className="mt-4 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition"
-              Crear tu primer checklist
+              >
-            </button>
+                Crear tu primer checklist
+              </button>
+            </>
+          ) : (
+            <>
+              <div className="text-4xl mb-3">🔒</div>
+              <p className="text-gray-700 font-semibold">No tienes checklists disponibles</p>
+              <p className="text-sm text-gray-500 mt-2">
+                Contacta con el administrador para que te asigne permisos a los checklists que necesites usar.
+              </p>
+            </>
           )}
         </div>
       ) : (
@@ -1477,6 +1525,19 @@ function ChecklistsTab({ checklists, user, onChecklistCreated, onStartInspection
               <div className="flex gap-2">
                 {user.role === 'admin' && (
                   <>
+                    <button 
+                      onClick={() => {
+                        setSelectedChecklist(checklist)
+                        setEditPermissionsData({ 
+                          mechanic_ids: checklist.allowed_mechanics || [] 
+                        })
+                        setShowEditPermissionsModal(true)
+                      }}
+                      className="px-3 py-2 bg-gradient-to-r from-orange-500 to-amber-500 text-white rounded-lg hover:from-orange-600 hover:to-amber-600 transition-all transform hover:scale-105 shadow-lg text-sm"
+                      title="Editar permisos"
+                    >
+                      🔐 Permisos
+                    </button>
                     <button 
                       onClick={() => {
                         setSelectedChecklist(checklist)
@@ -1702,6 +1763,106 @@ function ChecklistsTab({ checklists, user, onChecklistCreated, onStartInspection
           </div>
         </div>
       )}
+
+      {/* Modal Editar Permisos */}
+      {showEditPermissionsModal && selectedChecklist && (
+        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
+          <div className="bg-white rounded-lg max-w-2xl w-full max-h-[90vh] overflow-y-auto">
+            <div className="p-6">
+              <h2 className="text-2xl font-bold text-gray-900 mb-2">Editar Permisos de Checklist</h2>
+              <p className="text-sm text-gray-600 mb-4">
+                {selectedChecklist.name}
+              </p>
+              
+              <form onSubmit={handleEditPermissions} className="space-y-4">
+                <div className="border-t pt-4">
+                  <label className="block text-sm font-medium text-gray-700 mb-2">
+                    🔐 Mecánicos Autorizados
+                  </label>
+                  <div className="bg-gray-50 border border-gray-300 rounded-lg p-3 max-h-96 overflow-y-auto">
+                    {mechanics.length === 0 ? (
+                      <p className="text-sm text-gray-500">No hay mecánicos disponibles</p>
+                    ) : (
+                      <div className="space-y-2">
+                        <div className="flex items-center pb-2 border-b">
+                          <input
+                            type="checkbox"
+                            checked={editPermissionsData.mechanic_ids.length === 0}
+                            onChange={(e) => {
+                              if (e.target.checked) {
+                                setEditPermissionsData({ mechanic_ids: [] })
+                              }
+                            }}
+                            className="w-4 h-4 text-green-600 border-gray-300 rounded focus:ring-green-500"
+                          />
+                          <label className="ml-2 text-sm font-semibold text-green-700">
+                            🌍 Todos los mecánicos (acceso global)
+                          </label>
+                        </div>
+                        {mechanics.map((mechanic) => (
+                          <div key={mechanic.id} className="flex items-center">
+                            <input
+                              type="checkbox"
+                              checked={editPermissionsData.mechanic_ids.includes(mechanic.id)}
+                              onChange={(e) => {
+                                if (e.target.checked) {
+                                  setEditPermissionsData({ 
+                                    mechanic_ids: [...editPermissionsData.mechanic_ids, mechanic.id]
+                                  })
+                                } else {
+                                  setEditPermissionsData({ 
+                                    mechanic_ids: editPermissionsData.mechanic_ids.filter(id => id !== mechanic.id)
+                                  })
+                                }
+                              }}
+                              className="w-4 h-4 text-indigo-600 border-gray-300 rounded focus:ring-indigo-500"
+                            />
+                            <label className="ml-2 text-sm text-gray-700">
+                              {mechanic.full_name || mechanic.username} ({mechanic.email})
+                            </label>
+                          </div>
+                        ))}
+                      </div>
+                    )}
+                  </div>
+                  <p className="mt-2 text-xs text-gray-500">
+                    💡 Si no seleccionas ningún mecánico, todos podrán usar este checklist. 
+                    Si seleccionas mecánicos específicos, solo ellos tendrán acceso.
+                  </p>
+                </div>
+
+                <div className="bg-blue-50 border border-blue-200 rounded-lg p-4">
+                  <p className="text-sm text-blue-800">
+                    ℹ️ Los cambios se aplicarán inmediatamente. Los mecánicos que pierdan acceso ya no verán este checklist.
+                  </p>
+                </div>
+
+                <div className="flex gap-3 pt-4">
+                  <button
+                    type="button"
+                    onClick={() => {
+                      setShowEditPermissionsModal(false)
+                      setSelectedChecklist(null)
+                      setEditPermissionsData({ mechanic_ids: [] })
+                    }}
+                    className="flex-1 px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition"
+                    disabled={updating}
+                  >
+                    Cancelar
+                  </button>
+                  <button
+                    type="submit"
+                    className="flex-1 px-4 py-2 bg-orange-600 text-white rounded-lg hover:bg-orange-700 transition disabled:opacity-50"
+                    disabled={updating}
+                  >
+                    {updating ? 'Guardando...' : 'Guardar Permisos'}
+                  </button>
+                </div>
+              </form>
+            </div>
+          </div>
+        </div>
+      )}
     </div>
   )
 }