<?php $__env->startSection('title', 'Devices & Routers - Centipid ISP CRM'); ?>
<?php $__env->startSection('breadcrumb_parent', 'NETWORK'); ?>
<?php $__env->startSection('breadcrumb_current', 'Devices'); ?>

<?php $__env->startSection('content'); ?>
<div class="space-y-6">
    <div class="flex items-center justify-between">
        <div>
            <h1 class="text-3xl font-extrabold text-white tracking-tight">Devices & <span class="text-orange-500">routers.</span></h1>
            <p class="text-xs text-slate-400 mt-1">MikroTik RouterOS NAS gateways & RADIUS authentication nodes.</p>
        </div>
        <button onclick="openAddRouterModal()" class="flex items-center gap-2 btn-orange font-bold text-xs px-4 py-2.5 rounded-xl shadow-lg shadow-orange-500/20">
            <i data-lucide="plus" class="w-4 h-4"></i>
            <span>Register Router</span>
        </button>
    </div>

    <!-- Routers Cards Grid -->
    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
        <?php $__currentLoopData = $routers; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $r): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <div class="custom-card p-6 rounded-2xl space-y-4">
                <div class="flex items-center justify-between">
                    <div class="flex items-center gap-3">
                        <div class="w-10 h-10 rounded-xl bg-orange-500/10 text-orange-500 border border-orange-500/20 flex items-center justify-center font-bold text-sm">
                            <i data-lucide="hard-drive" class="w-5 h-5"></i>
                        </div>
                        <div>
                            <h3 class="text-base font-extrabold text-white"><?php echo e($r->name); ?></h3>
                            <p class="text-xs text-slate-400 font-mono"><?php echo e($r->ip_address); ?> &bull; <?php echo e($r->location); ?></p>
                        </div>
                    </div>
                    <span class="inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-bold bg-emerald-500/10 text-emerald-400 border border-emerald-500/20">
                        <span class="w-2 h-2 rounded-full bg-emerald-400 animate-pulse"></span> <?php echo e($r->status); ?>

                    </span>
                </div>

                <div class="grid grid-cols-3 gap-3 bg-[#111113] p-3 rounded-xl border border-[#2a2a2e] text-center text-xs">
                    <div>
                        <p class="text-slate-500 text-[10px]">MODEL</p>
                        <p class="font-bold text-white mt-0.5"><?php echo e($r->model); ?></p>
                    </div>
                    <div>
                        <p class="text-slate-500 text-[10px]">CPU USAGE</p>
                        <p class="font-bold text-emerald-400 mt-0.5"><?php echo e($r->cpu_usage); ?>%</p>
                    </div>
                    <div>
                        <p class="text-slate-500 text-[10px]">SESSIONS</p>
                        <p class="font-bold text-orange-500 mt-0.5"><?php echo e($r->active_sessions); ?> Users</p>
                    </div>
                </div>

                <div class="flex items-center justify-between pt-2 text-xs">
                    <span class="text-slate-500 font-mono text-[11px]">RouterOS <?php echo e($r->os_version); ?></span>
                    <form action="<?php echo e(route('admin.network.rebootRouter', $r)); ?>" method="POST">
                        <?php echo csrf_field(); ?>
                        <button type="submit" class="px-3 py-1 rounded-lg bg-[#222226] text-slate-300 hover:text-white border border-[#2a2a2e] font-semibold text-[11px]">
                            Reboot Router
                        </button>
                    </form>
                </div>
            </div>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
    </div>
</div>

<!-- Modal: Register Router -->
<div id="addRouterModal" class="fixed inset-0 z-[9999] hidden bg-black/80 backdrop-blur-sm flex items-center justify-center p-4">
    <div class="custom-panel rounded-2xl max-w-md w-full p-6 shadow-2xl space-y-4">
        <div class="flex items-center justify-between border-b border-[#2a2a2e] pb-3">
            <h3 class="text-base font-bold text-white flex items-center gap-2">
                <i data-lucide="hard-drive" class="w-5 h-5 text-orange-500"></i>
                <span>Register MikroTik Router</span>
            </h3>
            <button onclick="closeAddRouterModal()" class="text-slate-400 hover:text-white">&times;</button>
        </div>

        <form action="<?php echo e(route('admin.network.storeRouter')); ?>" method="POST" class="space-y-4">
            <?php echo csrf_field(); ?>
            <div>
                <label class="block text-xs font-semibold text-slate-300 mb-1">Router Name *</label>
                <input type="text" name="name" required placeholder="e.g. North-CCR2004-Gateway" class="w-full bg-[#0f0f10] border border-[#2a2a2e] text-slate-100 text-xs rounded-xl px-3 py-2.5 focus:border-orange-500 focus:outline-none">
            </div>

            <div class="grid grid-cols-2 gap-4">
                <div>
                    <label class="block text-xs font-semibold text-slate-300 mb-1">IP Address *</label>
                    <input type="text" name="ip_address" required placeholder="192.168.88.1" class="w-full bg-[#0f0f10] border border-[#2a2a2e] text-slate-100 text-xs rounded-xl px-3 py-2.5 focus:border-orange-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-xs font-semibold text-slate-300 mb-1">Model</label>
                    <input type="text" name="model" value="CCR1036-12G-4S" class="w-full bg-[#0f0f10] border border-[#2a2a2e] text-slate-100 text-xs rounded-xl px-3 py-2.5 focus:border-orange-500 focus:outline-none">
                </div>
            </div>

            <div>
                <label class="block text-xs font-semibold text-slate-300 mb-1">Location / Sector</label>
                <input type="text" name="location" value="Central POP Station" class="w-full bg-[#0f0f10] border border-[#2a2a2e] text-slate-100 text-xs rounded-xl px-3 py-2.5 focus:border-orange-500 focus:outline-none">
            </div>

            <div class="flex items-center justify-end gap-3 pt-3 border-t border-[#2a2a2e]">
                <button type="button" onclick="closeAddRouterModal()" class="px-4 py-2 text-xs font-semibold text-slate-400 hover:text-white">Cancel</button>
                <button type="submit" class="btn-orange text-xs px-5 py-2.5 rounded-xl">Save Router</button>
            </div>
        </form>
    </div>
</div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script>
    function openAddRouterModal() {
        document.getElementById('addRouterModal').classList.remove('hidden');
    }
    function closeAddRouterModal() {
        document.getElementById('addRouterModal').classList.add('hidden');
    }
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.admin', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\Users\RentEz\Desktop\projects\billingCRM\resources\views/admin/network/routers.blade.php ENDPATH**/ ?>