<?php
session_start();
require 'db/config.php';
$db = db();

if (!isset($_SESSION['user_id']) || $_SESSION['role'] !== 'admin') {
    header('Location: index.php');
    exit;
}

$role = $_SESSION['role'];

// Fetch Time Study events
$sql = "
    SELECT t.*, o.name as op_name, u.name as worker_name, j.name as job_name 
    FROM time_study_events t
    JOIN operations o ON t.operation_id = o.id
    JOIN components c ON o.component_id = c.id
    JOIN jobs j ON c.job_id = j.id
    JOIN users u ON t.user_id = u.id
    ORDER BY t.timestamp DESC
    LIMIT 100
";
$events = $db->query($sql)->fetchAll();
?>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>M-TRACK | Time Study</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
  <style>
    :root {
      --bg: #f8fafc;
      --card-bg: #ffffff;
      --primary: #1e293b;
      --accent: #3b82f6;
      --text: #334155;
      --sidebar-w: 260px;
    }
    body { font-family: 'Inter', sans-serif; background-color: var(--bg); color: var(--text); }
    .sidebar { width: var(--sidebar-w); position: fixed; top: 0; bottom: 0; left: 0; background: var(--card-bg); border-right: 1px solid #e2e8f0; padding: 2rem 1.5rem; }
    .main-content { margin-left: var(--sidebar-w); padding: 2rem; }
    .card { border: none; border-radius: 12px; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); }
    .event-start { color: #3b82f6; background: #eff6ff; padding: 2px 6px; border-radius: 4px; }
    .event-completed { color: #10b981; background: #ecfdf5; padding: 2px 6px; border-radius: 4px; }
    .event-stalled { color: #ef4444; background: #fef2f2; padding: 2px 6px; border-radius: 4px; }
    .event-resume { color: #f59e0b; background: #fffbeb; padding: 2px 6px; border-radius: 4px; }
  </style>
</head>
<body>

<div class="sidebar">
  <h4 class="fw-bold mb-5" style="color: var(--primary);"><i class="bi bi-cpu me-2"></i>M-TRACK</h4>
  <nav class="nav nav-pills flex-column">
    <a class="nav-link" href="dashboard.php"><i class="bi bi-grid-fill me-2"></i> Dashboard</a>
    <a class="nav-link" href="jobs.php"><i class="bi bi-briefcase me-2"></i> Jobs</a>
    <a class="nav-link" href="shop_floor.php"><i class="bi bi-kanban me-2"></i> Shop Floor</a>
    <a class="nav-link" href="inventory.php"><i class="bi bi-boxes me-2"></i> Inventory</a>
    <a class="nav-link" href="users.php"><i class="bi bi-people me-2"></i> Users</a>
    <a class="nav-link active" href="time_study.php"><i class="bi bi-clock-history me-2"></i> Time Study</a>
    <hr class="my-4 border-secondary opacity-25">
    <a class="nav-link text-danger" href="logout.php"><i class="bi bi-box-arrow-right me-2"></i> Logout</a>
  </nav>
</div>

<div class="main-content">
  <div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="h3 fw-bold mb-0">Time Study Analytics</h2>
    <button class="btn btn-outline-primary"><i class="bi bi-download"></i> Export CSV</button>
  </div>

  <div class="card p-0">
    <div class="table-responsive">
      <table class="table table-hover align-middle mb-0">
        <thead class="table-light">
          <tr>
            <th>Timestamp</th>
            <th>Worker</th>
            <th>Job</th>
            <th>Operation</th>
            <th>Event</th>
            <th>Reason / Note</th>
          </tr>
        </thead>
        <tbody>
          <?php foreach ($events as $e): ?>
            <tr>
              <td><?= date('Y-m-d H:i:s', strtotime($e['timestamp'])) ?></td>
              <td class="fw-medium"><?= htmlspecialchars($e['worker_name']) ?></td>
              <td><?= htmlspecialchars($e['job_name']) ?></td>
              <td><?= htmlspecialchars($e['op_name']) ?></td>
              <td>
                <span class="event-<?= $e['event_type'] ?> small fw-bold text-uppercase">
                  <?= htmlspecialchars($e['event_type']) ?>
                </span>
              </td>
              <td class="text-muted small"><?= htmlspecialchars($e['reason'] ?? '-') ?></td>
            </tr>
          <?php endforeach; ?>
          <?php if(empty($events)): ?>
            <tr><td colspan="6" class="text-center py-4 text-muted">No time study events recorded yet.</td></tr>
          <?php endif; ?>
        </tbody>
      </table>
    </div>
  </div>
</div>

</body>
</html>
