<?php
/**
 * لوحة الإحصائيات
 */
// لا نحتاج للتحقق من user_id هنا لأن dashboard.php يقوم بذلك
// فقط نحتاج للتأكد من أن الملفات موجودة
if (!class_exists('AnalyticsService') && isset($conn)) {
    require_once __DIR__ . '/analytics_service.php';
}

$deviceId = $_GET['device_id'] ?? '';
$startDate = $_GET['start_date'] ?? date('Y-m-d') . ' 00:00:00';
$endDate = $_GET['end_date'] ?? date('Y-m-d') . ' 23:59:59';
?>

<div id="analyticsPanel" class="modal-panel" style="display:none;">
  <div class="modal-content" style="max-width:800px;">
    <div class="modal-header">
      <h2>📈 الإحصائيات والتحليلات</h2>
      <button onclick="closeAnalyticsPanel()" class="close-btn">✕</button>
    </div>
    <div class="modal-body">
      <div class="analytics-controls">
        <select id="analyticsDeviceSelect">
          <option value="">اختر الجهاز</option>
        </select>
        <input type="date" id="analyticsStartDate" value="<?= date('Y-m-d') ?>">
        <input type="date" id="analyticsEndDate" value="<?= date('Y-m-d') ?>">
        <button onclick="loadAnalytics()" class="primary">🔍 تحميل</button>
        <button onclick="exportAnalytics()" class="secondary">📥 تصدير CSV</button>
      </div>
      <div id="analyticsContent">
        <p style="text-align:center; padding:20px; color:#666;">اختر الجهاز والفترة الزمنية</p>
      </div>
    </div>
  </div>
</div>

<style>
.analytics-controls {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.analytics-controls select,
.analytics-controls input {
  padding: 8px;
  border: 1px solid #ddd;
  border-radius: 5px;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 15px;
  margin-bottom: 20px;
}

.stat-card {
  background: #f8f9fa;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 15px;
  text-align: center;
}

.stat-value {
  font-size: 24px;
  font-weight: bold;
  color: #007bff;
  margin-bottom: 5px;
}

.stat-label {
  color: #666;
  font-size: 14px;
}
</style>

<script>
// هذه الدالة موجودة في dashboard_scripts.js
// function showAnalytics() { ... }

function closeAnalyticsPanel() {
  document.getElementById('analyticsPanel').style.display = 'none';
}

function loadDeviceList() {
  // جلب قائمة الأجهزة من القائمة الجانبية
  const deviceItems = document.querySelectorAll('li[data-device-id]');
  const select = document.getElementById('analyticsDeviceSelect');
  if (!select) return;
  
  select.innerHTML = '<option value="">اختر الجهاز</option>';
  
  deviceItems.forEach(item => {
    const deviceId = item.getAttribute('data-device-id');
    const deviceName = item.getAttribute('data-device-name');
    if (deviceId && deviceName) {
      const option = document.createElement('option');
      option.value = deviceId;
      option.textContent = deviceName;
      select.appendChild(option);
    }
  });
}

function loadAnalytics() {
  const deviceId = document.getElementById('analyticsDeviceSelect').value;
  const startDate = document.getElementById('analyticsStartDate').value + ' 00:00:00';
  const endDate = document.getElementById('analyticsEndDate').value + ' 23:59:59';
  
  if (!deviceId) {
    alert('يرجى اختيار جهاز');
    return;
  }
  
  if (typeof showLoading === 'function') {
    showLoading('جاري تحميل الإحصائيات...');
  }
  
  fetch(`get_analytics.php?device_id=${encodeURIComponent(deviceId)}&start_date=${encodeURIComponent(startDate)}&end_date=${encodeURIComponent(endDate)}`)
    .then(res => {
      if (!res.ok) throw new Error(`HTTP error! status: ${res.status}`);
      return res.json();
    })
    .then(data => {
      if (typeof hideLoading === 'function') {
        hideLoading();
      }
      if (data.status === 'success') {
        displayAnalytics(data.data);
      } else {
        alert('خطأ: ' + (data.message || 'فشل تحميل الإحصائيات'));
      }
    })
    .catch(err => {
      if (typeof hideLoading === 'function') {
        hideLoading();
      }
      console.error('❌ خطأ في تحميل الإحصائيات:', err);
      alert('حدث خطأ أثناء تحميل الإحصائيات');
    });
}

function displayAnalytics(stats) {
  const content = document.getElementById('analyticsContent');
  content.innerHTML = `
    <div class="stats-grid">
      <div class="stat-card">
        <div class="stat-value">${stats.total_distance || 0} كم</div>
        <div class="stat-label">المسافة الإجمالية</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.max_speed || 0} كم/س</div>
        <div class="stat-label">أقصى سرعة</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.avg_speed || 0} كم/س</div>
        <div class="stat-label">متوسط السرعة</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.total_driving_time || 0} دقيقة</div>
        <div class="stat-label">وقت القيادة</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.total_stop_time || 0} دقيقة</div>
        <div class="stat-label">وقت التوقف</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.stops_count || 0}</div>
        <div class="stat-label">عدد التوقفات</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.locations_count || 0}</div>
        <div class="stat-label">عدد المواقع</div>
      </div>
      <div class="stat-card">
        <div class="stat-value">${stats.battery_stats?.avg || 0}%</div>
        <div class="stat-label">متوسط البطارية</div>
      </div>
    </div>
  `;
}

function exportAnalytics() {
  const deviceId = document.getElementById('analyticsDeviceSelect').value;
  const startDate = document.getElementById('analyticsStartDate').value;
  const endDate = document.getElementById('analyticsEndDate').value;
  
  if (!deviceId) {
    alert('يرجى اختيار جهاز');
    return;
  }
  
  window.open(`export_locations.php?device_id=${encodeURIComponent(deviceId)}&start_date=${encodeURIComponent(startDate)}&end_date=${encodeURIComponent(endDate)}&format=csv`);
}
</script>

