UniqueSoft/TenerifeProp
2
0
Fork 0
Code Issues 13 Pull Requests Actions Packages Projects Releases Wiki Activity
Files
436e0cbf5a0dfec4f603854a3920a3a1d0f6be73
TenerifeProp/public/admin/dashboard.html
TenerifeProp Dev 9cffbb3bf3 refactor: split admin.html into modular section files with dynamic loading 
- Extracted 10 sections from admin.html (3315 lines) into separate files:
  - dashboard.html (298 lines)
  - properties.html (242 lines)
  - leads.html (280 lines)
  - testimonials.html (78 lines)
  - faq.html (91 lines)
  - services.html (61 lines)
  - settings.html (93 lines)
  - users.html (73 lines)
  - analytics.html (64 lines)
  - traffic.html (69 lines)
- admin.html reduced from 3315 to 1582 lines
- Added dynamic section loader via fetch()
- Sections load on-demand when clicking sidebar links
- Previously loaded sections cached in memory
- Updated server routes to serve all section files
- DataTables initialized per-section on load
2026-04-07 00:25:36 +01:00

299 lines
13 KiB
HTML
Raw Blame History

<!-- ============ DASHBOARD SECTION ============ -->
<section class="page-section active" id="section-dashboard">
<div class="page-header">
<div>
<h1 class="page-title" data-i18n="dashboard.title">Dashboard</h1>
<p class="page-subtitle" data-i18n="dashboard.subtitle">Resumen del rendimiento de tu negocio</p>
</div>
<div class="d-flex gap-3">
<input type="text" id="dateRange" class="form-control" style="width: 250px;" placeholder="Seleccionar rango de fechas">
<button class="btn btn-primary">
<i class="bi bi-download me-2"></i>Exportar
</button>
</div>
</div>
<!-- Stats Grid -->
<div class="stats-grid">
<div class="stat-card animate-fade-in">
<div class="stat-card-header">
<div class="stat-card-icon green">
<i class="bi bi-eye"></i>
</div>
<div class="stat-card-trend up">
<i class="bi bi-arrow-up"></i>
12.5%
</div>
</div>
<div class="stat-card-value" id="statViews">24,892</div>
<div class="stat-card-label" data-i18n="dashboard.views">Vistas de propiedades</div>
</div>
<div class="stat-card animate-fade-in">
<div class="stat-card-header">
<div class="stat-card-icon blue">
<i class="bi bi-cursor-click"></i>
</div>
<div class="stat-card-trend up">
<i class="bi bi-arrow-up"></i>
8.3%
</div>
</div>
<div class="stat-card-value" id="statClicks">3,421</div>
<div class="stat-card-label" data-i18n="dashboard.clicks">Clics en WhatsApp</div>
</div>
<div class="stat-card animate-fade-in">
<div class="stat-card-header">
<div class="stat-card-icon orange">
<i class="bi bi-envelope"></i>
</div>
<div class="stat-card-trend up">
<i class="bi bi-arrow-up"></i>
15.7%
</div>
</div>
<div class="stat-card-value" id="statLeads">156</div>
<div class="stat-card-label" data-i18n="dashboard.leads">Nuevos leads</div>
</div>
<div class="stat-card animate-fade-in">
<div class="stat-card-header">
<div class="stat-card-icon red">
<i class="bi bi-percent"></i>
</div>
<div class="stat-card-trend up">
<i class="bi bi-arrow-up"></i>
2.1%
</div>
</div>
<div class="stat-card-value" id="statConversion">13.7%</div>
<div class="stat-card-label" data-i18n="dashboard.conversion">Tasa de conversión</div>
</div>
</div>
<!-- Charts -->
<div class="charts-grid">
<div class="chart-card">
<div class="chart-card-header">
<h4 class="chart-card-title" data-i18n="dashboard.analytics">Rendimiento mensual</h4>
<div class="chart-card-actions">
<button class="chart-period-btn" data-period="week">Semana</button>
<button class="chart-period-btn active" data-period="month">Mes</button>
<button class="chart-period-btn" data-period="year">Año</button>
</div>
</div>
<div class="chart-container">
<canvas id="performanceChart"></canvas>
</div>
</div>
<div class="chart-card">
<div class="chart-card-header">
<h4 class="chart-card-title" data-i18n="dashboard.sources">Fuentes de tráfico</h4>
</div>
<div class="chart-container">
<canvas id="trafficChart"></canvas>
</div>
</div>
</div>
<!-- Additional Charts Row -->
<div class="rows-grid">
<div class="chart-card">
<div class="chart-card-header">
<h4 class="chart-card-title" data-i18n="dashboard.propertyTypes">Propiedades por tipo</h4>
</div>
<div class="chart-container" style="height: 220px;">
<canvas id="typesChart"></canvas>
</div>
</div>
<div class="chart-card">
<div class="chart-card-header">
<h4 class="chart-card-title" data-i18n="dashboard.leadsStatus">Estado de leads</h4>
</div>
<div class="chart-container" style="height: 220px;">
<canvas id="leadsChart"></canvas>
</div>
</div>
<div class="chart-card">
<div class="chart-card-header">
<h4 class="chart-card-title" data-i18n="dashboard.topProperties">Top 5 propiedades</h4>
</div>
<div class="chart-container" style="height: 220px;">
<canvas id="topPropertiesChart"></canvas>
</div>
</div>
</div>
<!-- Recent Leads Table -->
<div class="table-card mt-4">
<div class="table-card-header">
<h4 class="table-card-title" data-i18n="dashboard.recentLeads">Leads recientes</h4>
<a href="#" class="table-card-action" data-section="leads">
<i class="bi bi-eye"></i>
Ver todos
</a>
</div>
<div class="table-wrapper">
<table class="table table-hover mb-0" id="leadsTable">
<thead>
<tr>
<th data-i18n="table.client">Cliente</th>
<th data-i18n="table.property">Propiedad</th>
<th data-i18n="table.source">Fuente</th>
<th data-i18n="table.date">Fecha</th>
<th data-i18n="table.status">Estado</th>
<th data-i18n="table.actions">Acciones</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="table-user">
<img src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop" class="table-user-avatar">
<div class="table-user-info">
Michael Schmidt
<small>+34 600 123 456</small>
</div>
</div>
</td>
<td>
<div class="table-property">
<img src="https://images.unsplash.com/photo-1564013799919-ab600027ffc6?w=100&q=80" class="table-property-img">
<div class="table-property-info">
<h6>Terreno Urbano Adeje</h6>
<span>385.000 €</span>
</div>
</div>
</td>
<td><span class="badge bg-info">WhatsApp</span></td>
<td>15/01/2024 14:32</td>
<td><span class="table-badge pending">Pendiente</span></td>
<td>
<div class="table-actions">
<button class="table-action-btn view" title="Ver"><i class="bi bi-eye"></i></button>
<button class="table-action-btn edit" title="Editar"><i class="bi bi-pencil"></i></button>
<button class="table-action-btn delete" title="Eliminar"><i class="bi bi-trash"></i></button>
</div>
</td>
</tr>
<tr>
<td>
<div class="table-user">
<img src="https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=100&h=100&fit=crop" class="table-user-avatar">
<div class="table-user-info">
Anna Petrova
<small>anna@mail.com</small>
</div>
</div>
</td>
<td>
<div class="table-property">
<img src="https://images.unsplash.com/photo-1500382017468-9049fed747ef?w=100&q=80" class="table-property-img">
<div class="table-property-info">
<h6>Terreno Agrícola Güímar</h6>
<span>125.000 €</span>
</div>
</div>
</td>
<td><span class="badge bg-secondary">Formulario</span></td>
<td>15/01/2024 12:18</td>
<td><span class="table-badge new">Nuevo</span></td>
<td>
<div class="table-actions">
<button class="table-action-btn view" title="Ver"><i class="bi bi-eye"></i></button>
<button class="table-action-btn edit" title="Editar"><i class="bi bi-pencil"></i></button>
<button class="table-action-btn delete" title="Eliminar"><i class="bi bi-trash"></i></button>
</div>
</td>
</tr>
<tr>
<td>
<div class="table-user">
<img src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100&h=100&fit=crop" class="table-user-avatar">
<div class="table-user-info">
Pierre Dubois
<small>+33 600 789 012</small>
</div>
</div>
</td>
<td>
<div class="table-property">
<img src="https://images.unsplash.com/photo-1613490493576-7fde63acd811?w=100&q=80" class="table-property-img">
<div class="table-property-info">
<h6>Villa Los Cristianos</h6>
<span>595.000 €</span>
</div>
</div>
</td>
<td><span class="badge bg-primary">Directo</span></td>
<td>14/01/2024 18:45</td>
<td><span class="table-badge completed">Contactado</span></td>
<td>
<div class="table-actions">
<button class="table-action-btn view" title="Ver"><i class="bi bi-eye"></i></button>
<button class="table-action-btn edit" title="Editar"><i class="bi bi-pencil"></i></button>
<button class="table-action-btn delete" title="Eliminar"><i class="bi bi-trash"></i></button>
</div>
</td>
</tr>
<tr>
<td>
<div class="table-user">
<img src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=100&h=100&fit=crop" class="table-user-avatar">
<div class="table-user-info">
Carlos García
<small>carlos.g@mail.com</small>
</div>
</div>
</td>
<td>
<div class="table-property">
<img src="https://images.unsplash.com/photo-1502672260266-1c1ef2d93688?w=100&q=80" class="table-property-img">
<div class="table-property-info">
<h6>Apartamento Puerto Cruz</h6>
<span>245.000 €</span>
</div>
</div>
</td>
<td><span class="badge bg-success">Referido</span></td>
<td>14/01/2024 10:22</td>
<td><span class="table-badge completed">En proceso</span></td>
<td>
<div class="table-actions">
<button class="table-action-btn view" title="Ver"><i class="bi bi-eye"></i></button>
<button class="table-action-btn edit" title="Editar"><i class="bi bi-pencil"></i></button>
<button class="table-action-btn delete" title="Eliminar"><i class="bi bi-trash"></i></button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Quick Actions -->
<div class="quick-actions">
<a href="#" class="quick-action" data-section="properties">
<div class="quick-action-icon"><i class="bi bi-plus-lg"></i></div>
<span data-i18n="dashboard.addProperty">Añadir propiedad</span>
</a>
<a href="#" class="quick-action" data-section="leads">
<div class="quick-action-icon"><i class="bi bi-envelope-plus"></i></div>
<span data-i18n="dashboard.viewLeads">Ver leads</span>
</a>
<a href="#" class="quick-action" data-section="analytics">
<div class="quick-action-icon"><i class="bi bi-bar-chart"></i></div>
<span data-i18n="dashboard.fullReport">Informe completo</span>
</a>
<a href="#" class="quick-action" data-section="settings">
<div class="quick-action-icon"><i class="bi bi-gear"></i></div>
<span data-i18n="dashboard.settings">Configuración</span>
</a>
</div>
</section>
Reference in New Issue View Git Blame Copy Permalink