widgets.html 10.2 KB
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- 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">
  <!-- Theme style AdminLTE 3 -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@3.2/dist/css/adminlte.min.css">
  <style>
      body { background-color: #f4f6f9; padding: 20px; font-family: 'Source Sans Pro', sans-serif; }
      .welcome-header { font-size: 24px; color: #333; margin-bottom: 20px; font-weight: 600;}
      /* Estilos para el mapa embebido */
      .map-container {
          width: 100%;
          height: 500px;
          border-radius: 8px;
          overflow: hidden;
          background-color: #0f172a;
          position: relative;
      }
      iframe#welcome-map {
          width: 100%;
          height: 100%;
          border: none;
      }
  </style>
</head>
<body>
    <div class="welcome-header">
        <i class="fas fa-home text-primary"></i> Tablero General (Estadísticas Simuladas)
    </div>
    
    <!-- FILA 1: INFO BOXES ESTILO LEGADO (ESTADÍSTICAS) -->
    <div class="row">
        <!-- CONTRIBUYENTES -->
        <div class="col-md-2 col-sm-6 col-12">
            <div class="info-box shadow-sm">
                <span class="info-box-icon bg-danger"><i class="fas fa-users"></i></span>
                <div class="info-box-content">
                    <span class="info-box-text" id="contribtext">CONTRIBUYENTES</span>
                    <span class="info-box-number" id="contribnum">---</span>
                </div>
            </div>
        </div>
        <!-- PROPIEDADES -->
        <div class="col-md-2 col-sm-6 col-12">
            <div class="info-box shadow-sm">
                <span class="info-box-icon bg-danger"><i class="fas fa-map-marker-alt"></i></span>
                <div class="info-box-content">
                    <span class="info-box-text" id="proptext">PROPIEDADES</span>
                    <span class="info-box-number" id="propnum">---</span>
                </div>
            </div>
        </div>
        <!-- COMERCIOS -->
        <div class="col-md-2 col-sm-6 col-12">
            <div class="info-box shadow-sm">
                <span class="info-box-icon bg-success"><i class="fas fa-money-bill-wave"></i></span>
                <div class="info-box-content">
                    <span class="info-box-text" id="comtext">COMERCIOS</span>
                    <span class="info-box-number" id="comnum">---</span>
                </div>
            </div>
        </div>
        <!-- VEHICULOS -->
        <div class="col-md-2 col-sm-6 col-12">
            <div class="info-box shadow-sm">
                <span class="info-box-icon bg-success"><i class="fas fa-car"></i></span>
                <div class="info-box-content">
                    <span class="info-box-text" id="vehitext">VEHICULOS</span>
                    <span class="info-box-number" id="vehinum">---</span>
                </div>
            </div>
        </div>
        <!-- LICENCIAS -->
        <div class="col-md-2 col-sm-6 col-12">
            <div class="info-box shadow-sm">
                <span class="info-box-icon bg-success"><i class="fas fa-credit-card"></i></span>
                <div class="info-box-content">
                    <span class="info-box-text" id="licentext">LICENCIAS</span>
                    <span class="info-box-number" id="licennum">---</span>
                </div>
            </div>
        </div>
    </div>

    <!-- FILA 2: BIENVENIDA Y SOPORTE -->
    <div class="row mt-4">
        <div class="col-md-8">
            <div class="card card-outline card-primary shadow-sm" style="border-top: 3px solid #0056b3;">
                <div class="card-header">
                    <h3 class="card-title text-muted font-weight-bold" id="welcome-title"><i class="fas fa-map mr-1"></i> Bienvenido al Sistema Integrado de Gestión Municipal</h3>
                    <div class="card-tools">
                        <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
                    </div>
                </div>
                <div class="card-body p-0">
                    <div class="map-container">
                        <!-- Mapa embebido de Control de Gestión (Modo Limpio) -->
                        <iframe id="welcome-map" src="/gis-geoserver/mapas?mode=embed"></iframe>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <!-- SOPORTE Y APOYO TECNICO -->
            <div class="info-box bg-gradient-info shadow-sm mx-auto" style="max-width: 80%;">
                <span class="info-box-icon"><i class="fas fa-headset"></i></span>
                <div class="info-box-content text-center">
                    <span class="info-box-text font-weight-bold">SOPORTE Y APOYO TÉCNICO</span>
                    <span class="info-box-number">CONSULTORA YVAGA</span>
                    <div class="text-xs mt-2">
                        <i class="fas fa-globe mr-1"></i> www.yvaga.com.py<br>
                        <i class="fas fa-envelope mr-1"></i> soporte@yvaga.com.py<br>
                        <i class="fas fa-phone mr-1"></i> 0981-413151
                    </div>
                </div>
            </div>
            
            <!-- INFRAESTRUCTURA Y TECNOLOGIA -->
            <div class="info-box bg-success shadow-sm mx-auto" style="max-width: 80%;">
                <span class="info-box-icon"><i class="fas fa-cloud-upload-alt"></i></span>
                <div class="info-box-content text-center">
                    <span class="info-box-text font-weight-bold">INFRAESTRUCTURA Y TECNOLOGÍA</span>
                    <span class="info-box-number">YVAGA EAS</span>
                    <div class="text-xs mt-2">
                        <i class="fas fa-globe mr-1"></i> www.yvaga.com.py<br>
                        <i class="fas fa-envelope mr-1"></i> soporte@yvaga.com.py<br>
                        <i class="fas fa-phone mr-1"></i> 0981-413151
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- FILA 3 (INFERIOR): MÓDULOS DE GESTIÓN (ANCHO COMPLETO) -->
    <div class="row mt-4">
        <!-- GESTIÓN FINANCIERA -->
        <div class="col-md-4">
            <div class="card card-outline card-success shadow-sm h-100">
                <div class="card-header">
                    <h3 class="card-title font-weight-bold">GESTIÓN FINANCIERA</h3>
                    <div class="card-tools">
                        <span class="badge badge-danger">Próximamente!</span>
                        <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
                    </div>
                </div>
                <div class="card-body p-0 text-center d-flex align-items-center justify-content-center">
                    <img src="https://sigemtest.yvaga.com.py/dist/img/sigem/gestion_financiera.png" alt="GESTIÓN FINANCIERA" class="img-fluid p-3" style="max-height: 200px;">
                </div>
                <div class="card-footer text-center mt-auto">
                    <a href="javascript:void(0)" class="text-sm font-weight-bold text-uppercase">Acceder a Versión Escritorio</a>
                </div>
            </div>
        </div>

        <!-- GESTIÓN TRIBUTARIA -->
        <div class="col-md-4">
            <div class="card card-outline card-success shadow-sm h-100">
                <div class="card-header">
                    <h3 class="card-title font-weight-bold">GESTIÓN TRIBUTARIA</h3>
                    <div class="card-tools">
                        <span class="badge badge-danger">Próximamente!</span>
                        <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
                    </div>
                </div>
                <div class="card-body p-0 text-center d-flex align-items-center justify-content-center">
                    <img src="https://sigemtest.yvaga.com.py/dist/img/sigem/gestion_tributaria.png" alt="GESTIÓN TRIBUTARIA" class="img-fluid p-3" style="max-height: 200px;">
                </div>
                <div class="card-footer text-center mt-auto">
                    <a href="javascript:void(0)" class="text-sm font-weight-bold text-uppercase">Acceder a Versión Escritorio</a>
                </div>
            </div>
        </div>

        <!-- INFORMES GERENCIALES -->
        <div class="col-md-4">
            <div class="card card-outline card-success shadow-sm h-100">
                <div class="card-header">
                    <h3 class="card-title font-weight-bold">INFORMES GERENCIALES</h3>
                    <div class="card-tools">
                        <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
                    </div>
                </div>
                <div class="card-body p-0 text-center d-flex align-items-center justify-content-center">
                    <img src="https://sigemtest.yvaga.com.py/dist/img/sigem/informes.png" alt="INFORMES" class="img-fluid p-3" style="max-height: 200px;">
                </div>
                <div class="card-footer text-center mt-auto">
                    <a href="javascript:void(0)" class="text-sm font-weight-bold text-uppercase">Acceder</a>
                </div>
            </div>
        </div>
    </div>
    <br>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<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 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>
</html>
GitLab Appliance - Powered by TurnKey Linux