<?php
/**
 * IBVTE College – Activity Log (Read-Only)
 */
require_once __DIR__ . '/../config.php';
require_once __DIR__ . '/../includes/db.php';
require_once __DIR__ . '/../includes/auth.php';

$collegePage = 'activity';
Auth()->requireRole(['college']);

$db   = DB();
$user = Auth()->getUser();

// Pagination
$perPage = 20;
$page    = max(1, intval($_GET['page'] ?? 1));
$offset  = ($page - 1) * $perPage;

$total = $db->fetchColumn(
    "SELECT COUNT(*) FROM college_activity_logs WHERE college_id = ?",
    [$user['id']]
);
$totalPages = ceil($total / $perPage);

$logs = $db->fetchAll(
    "SELECT * FROM college_activity_logs WHERE college_id = ?
     ORDER BY created_at DESC LIMIT $perPage OFFSET $offset",
    [$user['id']]
);

// Action icon/color map
function getActionStyle($action) {
    $map = [
        'LOGIN'            => ['icon'=>'fas fa-sign-in-alt',    'color'=>'text-success', 'bg'=>'bg-success'],
        'LOGOUT'           => ['icon'=>'fas fa-sign-out-alt',   'color'=>'text-secondary','bg'=>'bg-secondary'],
        'PASSWORD_CHANGED' => ['icon'=>'fas fa-key',            'color'=>'text-warning', 'bg'=>'bg-warning'],
        'STUDENT_ADDED'    => ['icon'=>'fas fa-user-plus',      'color'=>'text-primary', 'bg'=>'bg-primary'],
        'STUDENT_UPDATED'  => ['icon'=>'fas fa-user-edit',      'color'=>'text-info',    'bg'=>'bg-info'],
        'RESULT_ADDED'     => ['icon'=>'fas fa-scroll',         'color'=>'text-purple',  'bg'=>'bg-primary'],
        'FUND_REQUEST'     => ['icon'=>'fas fa-wallet',         'color'=>'text-warning', 'bg'=>'bg-warning'],
        'PROFILE_UPDATED'  => ['icon'=>'fas fa-edit',           'color'=>'text-info',    'bg'=>'bg-info'],
    ];
    foreach ($map as $key => $style) {
        if (stripos($action, $key) !== false) return $style;
    }
    return ['icon'=>'fas fa-circle', 'color'=>'text-muted', 'bg'=>'bg-secondary'];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Activity Log – <?= APP_SHORT_NAME ?></title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <style>
        /* ── College Sidebar ─────────────────────────── */
        :root { --primary:#3b0b7c; --secondary:#6c4ab6; }
        .college-sidebar {
            width: 250px;
            background: white;
            min-height: 100vh;
            position: fixed;
            top: 0; left: 0;
            display: flex;
            flex-direction: column;
            box-shadow: 3px 0 15px rgba(59,11,124,0.08);
            z-index: 1040;
            transition: transform .3s;
        }
        .sidebar-brand {
            padding: 28px 20px 20px;
            text-align: center;
            background: linear-gradient(135deg, var(--primary), var(--secondary));
        }
        .sidebar-logo {
            width: 68px; height: 68px;
            border-radius: 50%;
            border: 3px solid rgba(255,255,255,.35);
            object-fit: cover;
            margin-bottom: 12px;
        }
        .sidebar-college-name {
            color: white;
            font-weight: 700;
            font-size: .9rem;
            line-height: 1.3;
        }
        .sidebar-code {
            color: rgba(255,255,255,.65);
            font-size: .75rem;
            margin-top: 4px;
        }
        .sidebar-nav {
            flex: 1;
            padding: 16px 12px;
            overflow-y: auto;
        }
        .sidebar-link {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 11px 16px;
            border-radius: 10px;
            color: #555;
            text-decoration: none;
            font-size: .9rem;
            font-weight: 500;
            margin-bottom: 4px;
            transition: background .2s, color .2s, transform .15s;
        }
        .sidebar-link:hover {
            background: #f0ebf8;
            color: var(--primary);
            transform: translateX(3px);
        }
        .sidebar-link.active {
            background: linear-gradient(135deg, var(--primary), var(--secondary));
            color: white !important;
            box-shadow: 0 4px 12px rgba(59,11,124,.25);
        }
        .sidebar-icon { width: 18px; text-align: center; flex-shrink: 0; font-size: .95rem; }
        .sidebar-footer { padding: 12px; border-top: 1px solid #f0f0f0; }
        .sidebar-logout { color: #dc3545 !important; }
        .sidebar-logout:hover { background: #fff0f0; color: #dc3545 !important; }
        .college-main { margin-left: 250px; padding: 30px; min-height: 100vh; background: #f8f9fa; }
        @media (max-width: 768px) {
            .college-sidebar { transform: translateX(-100%); }
            .college-sidebar.open { transform: translateX(0); }
            .college-main { margin-left: 0; padding: 20px 15px; }
            .mobile-menu-btn { display: flex !important; }
        }

        :root { --primary:#3b0b7c; --secondary:#6c4ab6; }
        body { background:#f8f9fa; font-family:'Segoe UI',sans-serif; }
        .sidebar { width:250px; background:white; min-height:100vh; position:fixed; box-shadow:2px 0 10px rgba(0,0,0,.05); z-index:1000; }
        .main-content { margin-left:250px; padding:30px; }
        .nav-link-item { padding:12px 25px; display:block; color:#555; text-decoration:none; transition:.3s; margin:4px 15px; border-radius:10px; }
        .nav-link-item:hover,.nav-link-item.active { background:var(--primary); color:white; }

        /* Timeline */
        .timeline { position:relative; padding-left:50px; }
        .timeline::before { content:''; position:absolute; left:20px; top:0; bottom:0; width:2px; background:#e9ecef; }
        .timeline-item { position:relative; margin-bottom:24px; }
        .tl-dot {
            position:absolute; left:-39px; top:4px;
            width:32px; height:32px; border-radius:50%;
            display:flex; align-items:center; justify-content:center;
            font-size:.8rem; color:white; opacity:.9;
        }
        .tl-card { background:white; border-radius:12px; padding:14px 18px; box-shadow:0 2px 10px rgba(0,0,0,.05); border-left:3px solid #e9ecef; }
        .tl-card:hover { box-shadow:0 4px 15px rgba(0,0,0,.1); }
        .tl-action { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
        .tl-desc { color:#555; margin:4px 0 0; font-size:.9rem; }
        .tl-meta { font-size:.75rem; color:#aaa; margin-top:6px; }
        .empty-state { text-align:center; padding:60px 20px; color:#aaa; }

        @media(max-width:768px){.sidebar{display:none;}.main-content{margin-left:0;}}
    </style>
</head>
<body>

<?php include __DIR__ . '/../includes/college_sidebar.php'; ?>

<!-- Mobile menu button -->
<button class="btn btn-sm mobile-menu-btn d-md-none"
        style="display:none;position:fixed;top:15px;left:15px;z-index:1050;background:var(--primary);color:white;border-radius:8px;padding:8px 12px;"
        onclick="toggleSidebar()" id="mobileMenuBtn">
    <i class="fas fa-bars"></i>
</button>
<div class="overlay d-none" id="sidebarOverlay" onclick="toggleSidebar()"
     style="position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1039;"></div>

<div class="college-main">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h3 class="fw-bold mb-1"><i class="fas fa-history me-2 text-primary"></i>Activity Log</h3>
            <p class="text-muted mb-0">Read-only record of all actions performed in your college portal</p>
        </div>
        <span class="badge bg-primary fs-6"><?= number_format($total) ?> Records</span>
    </div>

    <!-- Info banner -->
    <div class="alert alert-info d-flex align-items-center gap-2 rounded-3 mb-4">
        <i class="fas fa-info-circle fa-lg"></i>
        <div>This log is <strong>read-only</strong>. Records cannot be edited or deleted for audit compliance.</div>
    </div>

    <?php if (empty($logs)): ?>
    <div class="card border-0 shadow-sm rounded-4">
        <div class="card-body empty-state">
            <i class="fas fa-history fa-3x mb-3 opacity-25"></i>
            <h5 class="fw-bold">No Activity Yet</h5>
            <p>Your activity will appear here as you use the portal.</p>
        </div>
    </div>
    <?php else: ?>

    <div class="timeline">
        <?php foreach ($logs as $log):
            $style = getActionStyle($log['action']);
        ?>
        <div class="timeline-item">
            <div class="tl-dot <?= $style['bg'] ?>">
                <i class="<?= $style['icon'] ?>"></i>
            </div>
            <div class="tl-card">
                <div class="d-flex justify-content-between align-items-start">
                    <span class="tl-action <?= $style['color'] ?>"><?= htmlspecialchars(str_replace('_', ' ', $log['action'])) ?></span>
                    <small class="text-muted ms-3 text-nowrap"><?= formatDateTime($log['created_at']) ?></small>
                </div>
                <?php if ($log['description']): ?>
                <p class="tl-desc"><?= htmlspecialchars($log['description']) ?></p>
                <?php endif; ?>
                <div class="tl-meta">
                    <?php if ($log['entity_type'] && $log['entity_id']): ?>
                        <i class="fas fa-tag me-1"></i><?= htmlspecialchars(ucfirst($log['entity_type'])) ?> #<?= $log['entity_id'] ?> &nbsp;|&nbsp;
                    <?php endif; ?>
                    <i class="fas fa-network-wired me-1"></i>IP: <?= htmlspecialchars($log['ip_address'] ?? '-') ?>
                </div>
            </div>
        </div>
        <?php endforeach; ?>
    </div>

    <!-- Pagination -->
    <?php if ($totalPages > 1): ?>
    <nav class="mt-4">
        <ul class="pagination justify-content-center">
            <li class="page-item <?= $page <= 1 ? 'disabled' : '' ?>">
                <a class="page-link" href="?page=<?= $page-1 ?>">‹ Prev</a>
            </li>
            <?php for($i=1;$i<=$totalPages;$i++): ?>
            <li class="page-item <?= $i==$page ? 'active' : '' ?>">
                <a class="page-link" href="?page=<?= $i ?>"><?= $i ?></a>
            </li>
            <?php endfor; ?>
            <li class="page-item <?= $page >= $totalPages ? 'disabled' : '' ?>">
                <a class="page-link" href="?page=<?= $page+1 ?>">Next ›</a>
            </li>
        </ul>
    </nav>
    <?php endif; ?>

    <?php endif; ?>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
