<?php
session_start();
if (!isset($_SESSION['user_id'])) {
    header("Location: login.php");
    exit;
}

include "koneksi.php";
$page = $_GET['page'] ?? 'dashboard';
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Aplikasi Spare Part Motor</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        body { font-family: Arial, sans-serif; }
        .sidebar {
            background: #343a40;
            min-height: 100vh;
            transition: all 0.3s;
            overflow-x: hidden;
            white-space: nowrap;
        }
        .sidebar.collapsed { width: 70px; }
        .sidebar a {
            display: block; 
            padding: 12px 20px;
            color: #fff;
            text-decoration: none;
            transition: all 0.2s;
        }
        .sidebar a i { width: 20px; text-align: center; }
        .sidebar a:hover, .sidebar a.active {
            background: #ffc107;
            color: #212529;
            font-weight: bold;
        }
        .main-content { background: #f8f9fa; min-height: 100vh; transition: margin-left 0.3s; }
        .collapsed ~ .main-content { margin-left: 70px !important; }
        .toggle-btn { cursor: pointer; color: #fff; font-size: 1.2rem; border: none; background: none; }
    </style>
</head>
<body>

<!-- HEADER -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container-fluid">
        <button class="toggle-btn me-3" onclick="toggleSidebar()">
            <i class="fas fa-bars"></i>
        </button>
        <a class="navbar-brand" href="index.php?page=dashboard">
            <i class="fas fa-motorcycle me-2"></i> Tampiran Spare Part 
        </a>
        <ul class="navbar-nav ms-auto">
            <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown">
                    <i class="fas fa-user-circle me-1"></i> Admin
                </a>
                <ul class="dropdown-menu dropdown-menu-end">
                    <li><a class="dropdown-item" href="index.php?page=users">
                        <i class="fas fa-user me-2"></i> Profil
                    </a></li>
                    <li><a class="dropdown-item" href="index.php?page=users">
                        <i class="fas fa-cog me-2"></i> Pengaturan
                    </a></li>
                    <li><hr class="dropdown-divider"></li>
                    <li><a class="dropdown-item" href="logout.php">
                        <i class="fas fa-sign-out-alt me-2"></i> Logout
                    </a></li>
                </ul>
            </li>
        </ul>
    </div>
</nav>

<!-- KONTEN -->
<div class="container-fluid">
    <div class="row">
        <!-- SIDEBAR -->
        <div class="col-md-2 sidebar p-0" id="sidebar">
            <a href="index.php?page=dashboard" class="<?= ($page=='dashboard')?'active':'' ?>">
                <i class="fas fa-tachometer-alt me-2"></i> <span class="menu-text">Dashboard</span>
            </a>
            <a href="index.php?page=transaksi" class="<?= ($page=='transaksi')?'active':'' ?>">
                <i class="fas fa-cash-register me-2"></i> <span class="menu-text">Transaksi</span>
            </a>
            <a href="index.php?page=produk" class="<?= ($page=='produk')?'active':'' ?>">
                <i class="fas fa-cog me-2"></i> <span class="menu-text">Spare Part</span>
            </a>
            <a href="index.php?page=Pengeluaran" class="<?= ($page=='Pengeluaran')?'active':'' ?>">
                <i class="fas fa-tags me-2"></i> <span class="menu-text">Pengeluaran</span>
            </a>
            <a href="index.php?page=pelanggan" class="<?= ($page=='pelanggan')?'active':'' ?>">
                <i class="fas fa-users me-2"></i> <span class="menu-text">Pelanggan</span>
            </a>
            <a href="index.php?page=laporan" class="<?= ($page=='laporan')?'active':'' ?>">
                <i class="fas fa-chart-bar me-2"></i> <span class="menu-text">Laporan</span>
            </a>
            <a href="index.php?page=supplier" class="<?= ($page=='supplier')?'active':'' ?>">
                <i class="fas fa-truck me-2"></i> <span class="menu-text">Supplier</span>
            </a>
            <a href="index.php?page=produk_import" class="<?= ($page=='Produk_import')?'active':'' ?>">
                <i class="fas fa-file-import me-2"></i> <span class="menu-text">Import Data</span>
            </a>
        </div>

        <!-- MAIN CONTENT -->
        <div class="col-md-10 main-content p-4" id="mainContent">
            <?php
            $file = "pages/$page.php";
            if (file_exists($file)) {
                include $file;
            } else {
                echo "<h3>Halaman <b>$page</b> tidak ditemukan!</h3>";
            }
            ?>
        </div>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
function toggleSidebar() {
    const sidebar = document.getElementById('sidebar');
    sidebar.classList.toggle('collapsed');
    sidebar.querySelectorAll('.menu-text').forEach(el => {
        el.style.display = sidebar.classList.contains('collapsed') ? 'none' : 'inline';
    });
}
</script>
</body>
</html>
