Hito: Login Dinámico (.254), Logos Base64 y Responsables en Navbar

Antigravity AI
1 parent fc0b710a
Showing 6 changed files with 185 additions and 76 deletions
VERSION.txt
src/main/java/com/sigem/gis/security/AuthController.java
src/main/java/com/sigem/gis/security/AuthResponse.java
src/main/resources/static/landing.html
src/main/resources/static/login.html
src/main/resources/static/widgets.html
@@ -9,4 +9,4 @@ PROYECTO GIS-GEOSERVER - 2026.04.06.01.13.00 ID DOCKER: d983a409769d. ObservaciÃ
 PROYECTO GIS-GEOSERVER - 2026.04.06.12.44.00 ID DOCKER: d983a409769d. ObservaciÃƒÂ³n: Backup completo preventivo de la versiÃƒÂ³n con estructura de Git corregida y Landing Page AdminLTE.
 PROYECTO GIS-GEOSERVER - 2026.04.06.13.31.00 ID DOCKER: d983a409769d. ObservaciÃ³n: Prueba de funcionamiento del Manual v1.1 tras estandarizaciÃ³n de prefijos y manual de recuperaciÃ³n.
 PROYECTO GIS-GEOSERVER - 2026.04.07.08.18.07 ID DOCKER: d983a409769d. ObservaciÃ³n: OptimizaciÃ³n visual de interfaz completada: unificaciÃ³n de anchos al 100%, limpieza de barra superior, traslado de controles al sidebar y registro legal SIGEM-MIC/DINAPI.
-PROYECTO GIS-GEOSERVER - 2026.04.07.20.37.47 ID DOCKER: d983a409769d. ObservaciÃ³n: ModernizaciÃ³n definitiva del Dashboard completada: ReplicaciÃ³n de bloque de bienvenida legado, integraciÃ³n de mapa embebido en modo limpio y reestructuraciÃ³n de la fila inferior de gestiÃ³n al 100% de ancho. VersiÃ³n estable validada.
 \ No newline at end of file
+PROYECTO GIS-GEOSERVER - 2026.04.07.20.37.47 ID DOCKER: d983a409769d. ObservaciÃ³n: ModernizaciÃ³n definitiva del Dashboard completada: ReplicaciÃ³n de bloque de bienvenida legado, integraciÃ³n de mapa embebido en modo limpio y reestructuraciÃ³n de la fila inferior de gestiÃ³n al 100% de ancho. VersiÃ³n estable validada.Version SIG (Abril 2026) - 2026.04.07.22.30.00 ID DOCKER: d983a409769d. ObservaciÃ³n: Ã‰xito en implementaciÃ³n de Login DinÃ¡mico (SaaS), integraciÃ³n de logos binarios, eslÃ³ganes y responsables desde el servidor .254.
@@ -8,6 +8,7 @@ import org.springframework.jdbc.core.JdbcTemplate;
 import org.springframework.web.bind.annotation.*;
 import com.sigem.gis.service.FdwService;
  
+import java.util.Base64;
 import java.util.List;
 import java.util.Map;
  
@@ -29,18 +30,38 @@ public class AuthController {
     @Autowired
     private FdwService fdwService;
  
+    @GetMapping("/entidades")
+    public ResponseEntity<?> getEntidadesActivas() {
+        try {
+            String sql = "select entidad, nombre, entidad_logo, responsable, eslogan from public.entidades WHERE activo = TRUE ORDER BY entidad ASC";
+            List<Map<String, Object>> entidades = masterJdbcTemplate.queryForList(sql);
+            return ResponseEntity.ok(entidades);
+        } catch (Exception e) {
+            e.printStackTrace();
+            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body("Error al cargar entidades");
+        }
+    }
+
     @PostMapping("/login")
     public ResponseEntity<?> login(@RequestBody AuthRequest request) {
         try {
             // 1. Validar existencia de entidad en directorio maestro (en el .254)
-            String sqlEntidades = "SELECT sigem_site, sigem_dbname, lat, lng, zoom, minzoom, maxzoom, mapa_base, boundno, boundse FROM public.entidades WHERE activo= TRUE AND entidad = ?";
+            String sqlEntidades = "SELECT sigem_site, sigem_dbname, lat, lng, zoom, minzoom, maxzoom, mapa_base, boundno, boundse, nombre, eslogan, entidad_logo, responsable FROM public.entidades WHERE activo= TRUE AND entidad = ?";
             List<Map<String, Object>> entidades = masterJdbcTemplate.queryForList(sqlEntidades, Integer.parseInt(request.getEntidad()));
  
             if (entidades.isEmpty()) {
-                return ResponseEntity.status(HttpStatus.UNAUTHORIZED).body(new AuthResponse(null, null, "Entidad Inactiva o No Encontrada"));
+                return ResponseEntity.status(HttpStatus.UNAUTHORIZED).body(new AuthResponse(null, null, "La MUNICIPALIDAD con código " + request.getEntidad() + " no existe o está inactiva."));
             }
  
             Map<String, Object> entidadData = entidades.get(0);
+            String nombreEntidad = convertObjectToString(entidadData.get("nombre"));
+            String eslogan = convertObjectToString(entidadData.get("eslogan"));
+            
+            // Tratamiento especial para el logo (Binario -> Base64)
+            Object logoObj = entidadData.get("entidad_logo");
+            String logo = (logoObj instanceof byte[]) ? Base64.getEncoder().encodeToString((byte[]) logoObj) : convertObjectToString(logoObj);
+            
+            String responsable = convertObjectToString(entidadData.get("responsable"));
  
             // 2. Asegurar Infraestructura FDW (Regla 16: Solo crea si no existe)
             fdwService.setupFdw(request.getEntidad());
@@ -58,12 +79,12 @@ public class AuthController {
             if (!usuarios.isEmpty()) {
                 Map<String, Object> userData = usuarios.get(0);
                 boolean isActivo = (boolean) userData.get("activo");
-                String claveDesencriptada = (String) userData.get("clave_desencriptada");
+                String claveDesencriptada = convertObjectToString(userData.get("clave_desencriptada"));
  
                 // 4. Validación Final y Generación de Token
                 if (isActivo && request.getPassword().equals(claveDesencriptada)) {
                     String token = jwtUtil.generateToken(request.getUsername(), request.getEntidad());
-                    String nombreCompleto = userData.get("usu_nom") + " " + userData.get("usu_ape");
+                    String nombreCompleto = convertObjectToString(userData.get("usu_nom")) + " " + convertObjectToString(userData.get("usu_ape"));
  
                     // Metadatos georreferenciados de la entidad
                     Double lat = parseDouble(entidadData.get("lat"), -25.456443);
@@ -71,12 +92,13 @@ public class AuthController {
                     Integer zoom = parseInteger(entidadData.get("zoom"), 14);
                     Integer minZoom = parseInteger(entidadData.get("minzoom"), 5);
                     Integer maxZoom = parseInteger(entidadData.get("maxzoom"), 20);
-                    String mapaBase = String.valueOf(entidadData.getOrDefault("mapa_base", "osm"));
-                    String bounds = String.valueOf(entidadData.getOrDefault("boundno", "")) + "|" +
-                                    String.valueOf(entidadData.getOrDefault("boundse", ""));
+                    String mapaBase = convertObjectToString(entidadData.getOrDefault("mapa_base", "osm"));
+                    String bounds = convertObjectToString(entidadData.getOrDefault("boundno", "")) + "|" +
+                                    convertObjectToString(entidadData.getOrDefault("boundse", ""));
  
                     return ResponseEntity.ok(new AuthResponse(token, nombreCompleto, "Login Exitoso", 
-                                             lat, lng, zoom, minZoom, maxZoom, mapaBase, bounds));
+                                             lat, lng, zoom, minZoom, maxZoom, mapaBase, bounds, 
+                                             nombreEntidad, eslogan, logo, responsable));
                 }
             }
  
@@ -88,10 +110,19 @@ public class AuthController {
         }
     }
  
+    private String convertObjectToString(Object val) {
+        if (val == null) return null;
+        if (val instanceof byte[]) {
+            return new String((byte[]) val);
+        }
+        return String.valueOf(val);
+    }
+
     private Double parseDouble(Object val, Double def) {
         if (val == null) return def;
         try {
-            return Double.parseDouble(String.valueOf(val).trim());
+            String str = convertObjectToString(val);
+            return Double.parseDouble(str.trim());
         } catch (Exception e) {
             return def;
         }
@@ -100,7 +131,8 @@ public class AuthController {
     private Integer parseInteger(Object val, Integer def) {
         if (val == null) return def;
         try {
-            return Integer.parseInt(String.valueOf(val));
+            String str = convertObjectToString(val);
+            return Integer.parseInt(str.trim());
         } catch (Exception e) {
             return def;
         }
@@ -5,7 +5,7 @@ public class AuthResponse {
     private String nombre;
     private String message;
  
-    // Metadatos Cartográficos (Nuevos)
+    // Metadatos Cartográficos
     private Double lat;
     private Double lng;
     private Integer zoom;
@@ -13,6 +13,10 @@ public class AuthResponse {
     private Integer maxZoom;
     private String mapaBase;
     private String bounds;
+    private String entidadNombre;
+    private String eslogan;
+    private String entidadLogo;
+    private String responsable;
  
     public AuthResponse(String token, String nombre, String message) {
         this.token = token;
@@ -33,6 +37,14 @@ public class AuthResponse {
         this.bounds = bounds;
     }
  
+    public AuthResponse(String token, String nombre, String message, Double lat, Double lng, Integer zoom, Integer minZoom, Integer maxZoom, String mapaBase, String bounds, String entidadNombre, String eslogan, String entidadLogo, String responsable) {
+        this(token, nombre, message, lat, lng, zoom, minZoom, maxZoom, mapaBase, bounds);
+        this.entidadNombre = entidadNombre;
+        this.eslogan = eslogan;
+        this.entidadLogo = entidadLogo;
+        this.responsable = responsable;
+    }
+
     // Getters y Setters
     public String getToken() { return token; }
     public String getNombre() { return nombre; }
@@ -44,4 +56,8 @@ public class AuthResponse {
     public Integer getMaxZoom() { return maxZoom; }
     public String getMapaBase() { return mapaBase; }
     public String getBounds() { return bounds; }
+    public String getEntidadNombre() { return entidadNombre; }
+    public String getEslogan() { return eslogan; }
+    public String getEntidadLogo() { return entidadLogo; }
+    public String getResponsable() { return responsable; }
 }
@@ -35,7 +35,19 @@
         <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
       </li>
       <li class="nav-item d-none d-sm-inline-block">
-        <span class="nav-link" style="color: white; font-size: 18px; margin-left:10px;">Municipalidad de <span id="nav-entidad-text" style="font-weight: 800;">...</span>  <span style="font-size: 14px; font-weight: 300;">¡Emergente y Sostenible!</span></span>
+        <div class="nav-link p-0" style="color: white; margin-left:15px; display: flex; align-items: center; height: 100%;">
+            <!-- Logo Dinámico -->
+            <img id="nav-entidad-logo" src="" alt="" style="height: 40px; margin-right: 12px; display: none; filter: drop-shadow(0px 0px 1px rgba(0,0,0,0.5));">
+            
+            <div style="display: flex; flex-direction: column; justify-content: center;">
+                <div style="line-height: 1.2;">
+                    <span style="font-size: 18px;">Municipalidad de <span id="nav-entidad-text" style="font-weight: 800;">...</span> <span id="nav-eslogan-text" style="font-weight: 400; margin-left: 5px;"></span></span>
+                </div>
+                <div style="line-height: 1.2; font-size: 13px; font-weight: 300; opacity: 0.9;">
+                    <span id="nav-responsable-text">Administración: ...</span>
+                </div>
+            </div>
+        </div>
       </li>
     </ul>
  
@@ -163,7 +175,29 @@
     }
  
     document.getElementById('nav-user-text').innerText = userName || 'Operador Local';
-    document.getElementById('nav-entidad-text').innerText = entidad || 'N/D';
+    const entNombre = localStorage.getItem('entidad_nombre') || (entidad || 'N/D');
+    const entEslogan = localStorage.getItem('eslogan') || '';
+    const entResponsable = localStorage.getItem('responsable') || 'Gestión Municipal';
+    const entLogoBase64 = localStorage.getItem('entidad_logo');
+    
+    document.getElementById('nav-entidad-text').innerText = entNombre;
+    document.getElementById('nav-responsable-text').innerText = `Administración: ${entResponsable}`;
+    
+    // Configurar Logo
+    const logoImg = document.getElementById('nav-entidad-logo');
+    if (entLogoBase64 && entLogoBase64 !== 'null' && entLogoBase64.length > 100) {
+        // Si no tiene el prefijo de data image, se lo agregamos
+        logoImg.src = entLogoBase64.startsWith('data:') ? entLogoBase64 : `data:image/png;base64,${entLogoBase64}`;
+        logoImg.style.display = 'block';
+    }
+    
+    // Si el eslogan no está ya contenido en el nombre (para evitar duplicados), mostrarlo
+    const navEslogan = document.getElementById('nav-eslogan-text');
+    if (entEslogan && !entNombre.toLowerCase().includes(entEslogan.toLowerCase())) {
+        navEslogan.innerText = entEslogan;
+    } else {
+        navEslogan.innerText = '';
+    }
  
     function notImplemented() {
         alert("OPCIÓN NO IMPLEMENTADA");
@@ -5,7 +5,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Inicie Sesión - Ecosistema SIGEM</title>
  
-  <!-- Google Font: Source Sans Pro (Estandar de AdminLTE) -->
+  <!-- Google Font: Source Sans Pro -->
   <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
   <!-- Font Awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
@@ -29,14 +29,16 @@
       .login-logo a {
           color: #333 !important;
       }
+      #municipioSearch::placeholder {
+          font-size: 0.85rem;
+      }
   </style>
 </head>
 <body class="hold-transition login-page">
-<div class="login-box">
+<div class="login-box" style="width: 400px;">
   <div class="login-logo">
     <a href="#"><b>SIGEM</b>WEB</a>
   </div>
-  <!-- /.login-logo -->
   <div class="card card-outline card-primary shadow-lg">
     <div class="card-body login-card-body rounded">
       <p class="login-box-msg font-weight-bold" style="color: #555;">Visor Georreferenciado Multi-Tenant</p>
@@ -44,24 +46,25 @@
       <form id="loginForm">
         <label for="municipioSearch" class="text-xs text-muted mb-1" style="font-size: 0.8rem; text-transform: uppercase;">1. Entidad (Municipalidad)</label>
         <div class="input-group mb-2">
-          <input type="text" id="municipioSearch" class="form-control" placeholder="Buscar municipio (ej. 505)" autocomplete="off">
+          <input type="text" id="municipioSearch" class="form-control" placeholder="Digite código o nombre del municipio..." autocomplete="off">
           <div class="input-group-append">
             <div class="input-group-text">
-              <span class="fas fa-search"></span>
+              <span class="fas fa-university"></span>
             </div>
           </div>
         </div>
-        <div class="form-group mb-3">
-          <select id="entidad" class="form-control" required size="3" style="height: 85px; cursor: pointer; font-size: 0.9rem;">
-                <option value="505">Entidad 505 (Piloto GIS)</option>
-                <option value="800">Entidad 800 (Pruebas)</option>
-                <option value="900">Entidad 900 (Desarrollo)</option>
+        <div class="form-group mb-3 position-relative">
+          <select id="entidad" class="form-control" required size="4" style="height: 110px; cursor: pointer; font-size: 0.9rem;">
+                <option value="" disabled>Cargando municipios...</option>
           </select>
+          <div id="loader-entidades" class="text-center p-2" style="position: absolute; top:0; left:0; width:100%; height:100%; background:white; display:none;">
+              <div class="spinner-border spinner-border-sm text-primary"></div>
+          </div>
         </div>
  
         <label class="text-xs text-muted mb-1" style="font-size: 0.8rem; text-transform: uppercase;">2. Credenciales</label>
         <div class="input-group mb-3">
-          <input type="text" id="username" class="form-control" placeholder="Usu_alias (ej. operador)" required autocomplete="username">
+          <input type="text" id="username" class="form-control" placeholder="Usuario (ej. operador)" required autocomplete="username">
           <div class="input-group-append">
             <div class="input-group-text">
               <span class="fas fa-user"></span>
@@ -69,7 +72,7 @@
           </div>
         </div>
         <div class="input-group mb-3">
-          <input type="password" id="password" class="form-control" placeholder="Tu clave alfanumérica" required autocomplete="current-password">
+          <input type="password" id="password" class="form-control" placeholder="Contraseña SIGEM" required autocomplete="current-password">
           <div class="input-group-append">
             <div class="input-group-text">
               <span class="fas fa-lock"></span>
@@ -89,100 +92,124 @@
         </div>
       </form>
     </div>
-    <!-- /.login-card-body -->
   </div>
 </div>
-<!-- /.login-box -->
  
-<!-- jQuery -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
-<!-- Bootstrap 4 -->
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
-<!-- AdminLTE App -->
-<script src="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/js/adminlte.min.js"></script>
  
 <script>
-    // Filtro interactivo de municipios
     const searchInput = document.getElementById('municipioSearch');
     const selectEntidad = document.getElementById('entidad');
-    const originalOptions = Array.from(selectEntidad.options);
+    const loader = document.getElementById('loader-entidades');
+    let allEntidades = [];
  
-    searchInput.addEventListener('input', (e) => {
-        const text = e.target.value.toLowerCase();
+    // Cargar Entidades desde la Base de Datos Remota (.254)
+    async function loadEntidades() {
+        loader.style.display = 'block';
+        try {
+            const response = await fetch('/gis-geoserver/api/auth/entidades');
+            if (!response.ok) throw new Error("Error al obtener entidades");
+            allEntidades = await response.json();
+            renderOptions(allEntidades);
+        } catch (error) {
+            console.error(error);
+            selectEntidad.innerHTML = '<option value="" disabled>Error al cargar municipios</option>';
+        } finally {
+            loader.style.display = 'none';
+        }
+    }
+
+    function renderOptions(data) {
         selectEntidad.innerHTML = '';
-        originalOptions.forEach(opt => {
-            if (opt.text.toLowerCase().includes(text) || opt.value.includes(text)) {
-                selectEntidad.appendChild(opt);
-            }
+        data.forEach(ent => {
+            const opt = document.createElement('option');
+            opt.value = ent.entidad;
+            opt.textContent = `${ent.entidad} - ${ent.nombre}`;
+            selectEntidad.appendChild(opt);
         });
-        if (selectEntidad.options.length > 0) {
-            selectEntidad.options[0].selected = true;
+        if (data.length > 0) selectEntidad.selectedIndex = 0;
+    }
+
+    searchInput.addEventListener('input', (e) => {
+        const text = e.target.value.toLowerCase();
+        const filtered = allEntidades.filter(ent => 
+            ent.entidad.toString().includes(text) || 
+            ent.nombre.toLowerCase().includes(text)
+        );
+        renderOptions(filtered);
+        
+        // Si el usuario escribió un código exacto que existe, seleccionarlo
+        const exactMatch = allEntidades.find(ent => ent.entidad.toString() === text);
+        if (exactMatch) {
+            selectEntidad.value = exactMatch.entidad;
         }
     });
  
-    // Limpiar sesión previa si por error caen al login
+    // Carga inicial
+    loadEntidades();
+
     localStorage.removeItem('jwt');
-    localStorage.removeItem('user_name');
-    
+
     document.getElementById('loginForm').addEventListener('submit', function(e) {
         e.preventDefault();
  
         const username = document.getElementById('username').value;
         const password = document.getElementById('password').value;
-        const entidad = document.getElementById('entidad').value;
+        const searchVal = searchInput.value.trim();
         const errorMsg = document.getElementById('error-msg');
+        
+        // Regla: Validar si la entidad seleccionada coincide con lo digitado o si hay una seleccionada
+        let entidadId = selectEntidad.value;
+        
+        // Si el buscador tiene algo pero no hay selección válida, intentamos buscar el código exacto
+        if (!entidadId && searchVal) {
+             const match = allEntidades.find(ent => ent.entidad.toString() === searchVal);
+             if (match) entidadId = match.entidad;
+        }
+
+        if (!entidadId) {
+            errorMsg.innerText = "La MUNICIPALIDAD con código " + (searchVal || "seleccionado") + " no existe.";
+            errorMsg.style.display = 'block';
+            return;
+        }
+
         const btnText = document.getElementById('btn-text');
         const spinner = document.getElementById('spinner');
  
-        // Bloquear UI
         errorMsg.style.display = 'none';
         btnText.style.display = 'none';
         spinner.style.display = 'block';
         document.getElementById('btn-login').disabled = true;
  
-        const payload = {
-            username: username,
-            password: password,
-            entidad: entidad
-        };
-
         fetch('/gis-geoserver/api/auth/login', {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(payload)
+            body: JSON.stringify({ username, password, entidad: entidadId })
         })
-        .then(response => {
-            if (!response.ok) {
-                return response.json().then(errData => {
-                    throw new Error(errData.message || "Credenciales incorrectas.");
-                });
-            }
-            return response.json();
+        .then(async response => {
+            const data = await response.json();
+            if (!response.ok) throw new Error(data.message || "Credenciales incorrectas.");
+            return data;
         })
         .then(data => {
-            // LOGIN EXITOOSO!
             localStorage.setItem('jwt', data.token);     
-            localStorage.setItem('user_name', data.nombre); // Nombre completo del usuario
-            localStorage.setItem('entidad', entidad); 
+            localStorage.setItem('user_name', data.nombre);
+            localStorage.setItem('entidad', entidadId); 
+            localStorage.setItem('entidad_nombre', data.entidadNombre);
+            localStorage.setItem('eslogan', data.eslogan);
+            localStorage.setItem('responsable', data.responsable);
+            localStorage.setItem('entidad_logo', data.entidadLogo);
  
-            // Persistir metadatos del Visor
             localStorage.setItem('map_lat', data.lat);
             localStorage.setItem('map_lng', data.lng);
             localStorage.setItem('map_zoom', data.zoom);
-            localStorage.setItem('map_min_zoom', data.minZoom);
-            localStorage.setItem('map_max_zoom', data.maxZoom);
-            localStorage.setItem('mapa_base_id', data.mapaBase);
-            localStorage.setItem('map_bounds', data.bounds);
  
-            // Redirigir a la URL del Mapas
             window.location.href = "/gis-geoserver/landing";
         })
         .catch(error => {
-            // LOGIN ERROR
             errorMsg.innerText = error.message;
             errorMsg.style.display = 'block';
-            
-            // Restaurar UI
             btnText.style.display = 'block';
             spinner.style.display = 'none';
             document.getElementById('btn-login').disabled = false;
@@ -201,9 +201,9 @@
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
 <script>
     // Dinamizar el título con el nombre de la entidad si está disponible
-    const entidadText = localStorage.getItem('entidad_nombre') || '';
-    if (entidadText) {
-        document.getElementById('welcome-title').innerHTML = `<i class="fas fa-map mr-1"></i> Bienvenido al Sistema Integrado de Gestión Municipal de ${entidadText}`;
+    const entidadNombre = localStorage.getItem('entidad_nombre');
+    if (entidadNombre && entidadNombre !== 'null') {
+        document.getElementById('welcome-title').innerHTML = `<i class="fas fa-map mr-1"></i> Bienvenido al Sistema Integrado de Gestión Municipal de ${entidadNombre}`;
     }
 </script>
 </body>