<?php
function activeUrl($url)
{
    return $url && strpos(current_url(), site_url($url)) !== false;
}
?>

<!DOCTYPE html>
<html>

<head>
    <title><?= $title ?? 'SIP4GN Enterprise' ?></title>

    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.2.1/flowbite.min.css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.2.1/flowbite.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">

</head>

<body class="bg-gray-100">

    <!-- NAVBAR -->
    <nav class="bg-white border-b shadow-sm px-4 py-3 flex justify-between">
        <h1 class="font-bold text-lg">SIP4GN Enterprise</h1>

        <a href="<?= site_url('logout') ?>" class="text-red-500 font-semibold">
            Logout
        </a>
    </nav>

    <div class="flex">

        <!-- SIDEBAR -->
        <aside class="w-72 min-h-screen bg-gray-900 text-white p-4">

            <ul class="space-y-1">

                <!-- Dashboard -->
                <li>
                    <a href="<?= site_url('dashboard') ?>" class="flex items-center gap-2 p-3 rounded 
               <?= activeUrl('dashboard') ? 'bg-blue-600' : 'hover:bg-gray-700' ?>">
                        <i class="fa fa-gauge"></i> Dashboard
                    </a>
                </li>

                <!-- Example Dropdown -->
                <li>
                    <button type="button" class="flex items-center justify-between w-full p-3 rounded hover:bg-gray-700"
                        data-collapse-toggle="master-menu">
                        <span><i class="fa fa-database mr-2"></i> Master Data</span>
                        <i class="fa fa-chevron-down"></i>
                    </button>

                    <ul id="master-menu" class="hidden pl-6 space-y-1 mt-1">
                        <li><a href="<?= site_url('master/employees') ?>"
                                class="block p-2 hover:bg-gray-700 rounded">Karyawan</a></li>
                        <li><a href="<?= site_url('master/program') ?>"
                                class="block p-2 hover:bg-gray-700 rounded">Program P4GN</a></li>
                        <li><a href="<?= site_url('master/year') ?>" class="block p-2 hover:bg-gray-700 rounded">Tahun
                                Program</a></li>
                        <li><a href="<?= site_url('master/parameter') ?>"
                                class="block p-2 hover:bg-gray-700 rounded">Parameter</a></li>
                    </ul>
                </li>

                <!-- Tambahkan menu enterprise lain di sini
             tinggal copy pola di atas -->
            </ul>

        </aside>

        <!-- CONTENT -->
        <main class="flex-1 p-6">
            <?= $this->renderSection('content') ?>
        </main>

    </div>


    <script>
        document.addEventListener('DOMContentLoaded', function () {

            const input = document.getElementById('amount');

            function formatRupiah(value) {
                let number = value.replace(/[^0-9]/g, '');
                if (number === '') return '';

                let sisa = number.length % 3;
                let rupiah = number.substr(0, sisa);
                let ribuan = number.substr(sisa).match(/\d{3}/g);

                if (ribuan) {
                    let separator = sisa ? '.' : '';
                    rupiah += separator + ribuan.join('.');
                }

                return 'Rp ' + rupiah;
            }

            input.addEventListener('keyup', function (e) {

                // Abaikan tombol navigasi
                if (
                    e.key === 'ArrowLeft' ||
                    e.key === 'ArrowRight' ||
                    e.key === 'Backspace' ||
                    e.key === 'Delete'
                ) {
                    return;
                }

                let cursorPos = this.selectionStart;
                let beforeLength = this.value.length;

                let raw = this.value.replace(/[^0-9]/g, '');
                this.value = formatRupiah(raw);

                let afterLength = this.value.length;
                let diff = afterLength - beforeLength;

                this.setSelectionRange(cursorPos + diff, cursorPos + diff);
            });

            // 🔒 pastikan submit ke server tetap numeric
            input.closest('form').addEventListener('submit', function () {
                input.value = input.value.replace(/[^0-9]/g, '');
            });

        });
    </script>

</body>

</html>