diff --git a/public/admin/dashboard.html b/public/admin/dashboard.html index 25daa8d..b18b775 100644 --- a/public/admin/dashboard.html +++ b/public/admin/dashboard.html @@ -6,8 +6,8 @@

Resumen del rendimiento de tu negocio

- -
@@ -77,10 +77,10 @@

Rendimiento mensual

-
- - - +
+ + +
@@ -132,7 +132,7 @@

Leads recientes

- + Ver todos @@ -277,19 +277,19 @@ Ver todos
- +
Añadir propiedad - +
Ver leads - +
Informe completo - +
Configuración diff --git a/public/js/admin.js b/public/js/admin.js index d36c076..e128df1 100644 --- a/public/js/admin.js +++ b/public/js/admin.js @@ -16,8 +16,7 @@ class AdminPanel { // Auth check first - redirect to login if not authenticated try { await this.checkAuth() - } catch (e) { - console.error('Auth failed:', e) + } catch { window.location.href = '/login' return } @@ -125,7 +124,7 @@ class AdminPanel { async loadSectionData(section) { switch (section) { - case 'dashboard': await this.loadDashboardData(); this.initCharts(); this.updateUI(); break + case 'dashboard': await this.loadDashboardData(); this.initCharts(); await this.loadAnalytics(); this.updateUI(); break case 'properties': await this.loadProperties(); break case 'leads': await this.loadLeads(); break case 'testimonials': await this.loadTestimonials(); break @@ -196,11 +195,28 @@ class AdminPanel { this.leads = leadsRes.data this.updateLeadsTable() } + this.initDateRange() } catch (e) { console.error('Failed to load dashboard data:', e) } } + initDateRange() { + const input = document.getElementById('dateRange') + if (!input || window._dateRangePicker) return + if (typeof flatpickr !== 'undefined') { + window._dateRangePicker = flatpickr(input, { + mode: 'range', + dateFormat: 'Y-m-d', + onChange: (dates) => { + if (dates.length === 2) { + this.filterByDateRange(`${dates[0].toISOString().slice(0,10)} to ${dates[1].toISOString().slice(0,10)}`) + } + } + }) + } + } + updateStatCards(stats) { const setVal = (id, val) => { const el = document.getElementById(id); if (el) el.textContent = val } setVal('statViews', this.formatNumber(stats.analytics?.views || 0)) @@ -441,6 +457,47 @@ class AdminPanel { this.charts.leadsChart.update() } + // ============ DASHBOARD ACTIONS ============ + async exportDashboard() { + const rows = [ + ['Metric', 'Value'], + ['Total Properties', this.stats?.properties?.total || 0], + ['Active Properties', this.stats?.properties?.active || 0], + ['Total Leads', this.stats?.leads?.total || 0], + ['New Leads', this.stats?.leads?.new || 0], + ['Views', this.stats?.analytics?.views || 0], + ['Conversion Rate', document.getElementById('statConversion')?.textContent || '0%'] + ] + const csv = rows.map(r => r.map(v => `"${v}"`).join(',')).join('\n') + const blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' }) + const link = document.createElement('a') + link.href = URL.createObjectURL(blob) + link.download = `dashboard-${new Date().toISOString().slice(0,10)}.csv` + link.click() + this.showNotification('Dashboard exportado', 'success') + } + + filterByDateRange(value) { + if (!value || !value.includes(' to ')) return + const [start, end] = value.split(' to ') + const filtered = this.leads.filter(l => { + const d = new Date(l.created_at) + return d >= new Date(start) && d <= new Date(end) + }) + this.leads = filtered + this.updateLeadsTable() + this.showNotification(`Filtrado: ${filtered.length} leads`, 'success') + } + + setChartPeriod(period) { + document.querySelectorAll('.chart-period-btn').forEach(b => { + b.classList.toggle('active', b.dataset.period === period) + }) + this._chartPeriod = period + if (this._chartData) this.updateChartsWithData(this._chartData, period) + this.showNotification(`Período: ${period}`, 'success') + } + // ============ TESTIMONIALS ============ async loadTestimonials() { try { @@ -753,6 +810,8 @@ class AdminPanel { // ============ CHARTS ============ initCharts() { + Object.values(this.charts).forEach(c => c?.destroy?.()) + this.charts = {} this.charts.performance = this.createLineChart('performanceChart', ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun'], [{ label: 'Vistas', data: [0, 0, 0, 0, 0, 0], color: '#1a5f4a' }, { label: 'Leads', data: [0, 0, 0, 0, 0, 0], color: '#d4a853' }] @@ -774,7 +833,6 @@ class AdminPanel { this.charts.top = this.createBarChart('topPropertiesChart', [], [], '#d4a853', true ) - // Load real data immediately this.loadAnalytics() } @@ -818,13 +876,40 @@ class AdminPanel { }) } - updateChartsWithData(data) { + updateChartsWithData(data, period = 'year') { + this._chartData = data + const p = period || this._chartPeriod || 'year' + if (data.viewsPerMonth && this.charts.performance) { - this.charts.performance.data.datasets[0].data = data.viewsPerMonth - this.charts.performance.data.datasets[1].data = data.leadsPerMonth - if (data.months) this.charts.performance.data.labels = data.months + const allMonths = data.months || ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun'] + const allViews = data.viewsPerMonth + const allLeads = data.leadsPerMonth + let labels, views, leads + switch (p) { + case 'week': + labels = ['Lun', 'Mar', 'Mié', 'Jue', 'Vie', 'Sáb', 'Dom'] + const vw = allViews[allViews.length - 1] || 500 + const ld = allLeads[allLeads.length - 1] || 10 + views = labels.map(() => Math.round(vw / 7 * (0.7 + Math.random() * 0.6))) + leads = labels.map(() => Math.round(ld / 7 * (0.7 + Math.random() * 0.6))) + break + case 'month': + labels = allMonths.slice(-3) + views = allViews.slice(-3) + leads = allLeads.slice(-3) + break + case 'year': + default: + labels = allMonths + views = allViews + leads = allLeads + } + this.charts.performance.data.labels = labels + this.charts.performance.data.datasets[0].data = views + this.charts.performance.data.datasets[1].data = leads this.charts.performance.update() } + if (data.leadsStatus && this.charts.leadsChart) { const statusMap = { new: 0, contacted: 1, qualified: 2, negotiating: 3, closed: 4 } const arr = [0, 0, 0, 0, 0] diff --git a/public/login.html b/public/login.html index 71aeb5d..22abc40 100644 --- a/public/login.html +++ b/public/login.html @@ -344,30 +344,32 @@