

<?php $__env->startSection('content'); ?>
<!-- Header -->
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-fluid mb-fluid">
    <div>
        <h2 class="text-fluid-xl font-bold text-gray-800 dark:text-gray-100">Device Monitor</h2>
        <p class="text-gray-500 dark:text-gray-400 text-fluid-sm mt-1">Track all devices using your licenses</p>
    </div>
    <div class="flex items-center gap-2">
        <form action="<?php echo e(route('devices.cleanup')); ?>" method="POST" class="inline">
            <?php echo csrf_field(); ?>
            <button type="submit" class="px-4 py-2 border border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-300 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors flex items-center gap-2 text-fluid-base">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"></path>
                </svg>
                <span class="hidden sm:inline">Cleanup Stale</span>
            </button>
        </form>
    </div>
</div>

<!-- Filters -->
<div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 p-fluid mb-fluid">
    <form method="GET" class="flex flex-col sm:flex-row gap-fluid">
        <select name="status" class="px-4 py-2 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-white rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent text-fluid-base">
            <option value="">All Status</option>
            <option value="active" <?php echo e(request('status') == 'active' ? 'selected' : ''); ?>>Active</option>
            <option value="inactive" <?php echo e(request('status') == 'inactive' ? 'selected' : ''); ?>>Inactive</option>
        </select>
        <select name="device_type" class="px-4 py-2 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-white rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent text-fluid-base">
            <option value="">All Types</option>
            <option value="desktop" <?php echo e(request('device_type') == 'desktop' ? 'selected' : ''); ?>>Desktop</option>
            <option value="mobile" <?php echo e(request('device_type') == 'mobile' ? 'selected' : ''); ?>>Mobile</option>
            <option value="tablet" <?php echo e(request('device_type') == 'tablet' ? 'selected' : ''); ?>>Tablet</option>
        </select>
        <select name="action" class="px-4 py-2 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-white rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent text-fluid-base">
            <option value="">All Actions</option>
            <option value="login" <?php echo e(request('action') == 'login' ? 'selected' : ''); ?>>Login</option>
            <option value="logout" <?php echo e(request('action') == 'logout' ? 'selected' : ''); ?>>Logout</option>
            <option value="heartbeat" <?php echo e(request('action') == 'heartbeat' ? 'selected' : ''); ?>>Heartbeat</option>
            <option value="blocked" <?php echo e(request('action') == 'blocked' ? 'selected' : ''); ?>>Blocked</option>
        </select>
        <button type="submit" class="px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 transition-colors text-fluid-base">
            Filter
        </button>
    </form>
</div>

<!-- Devices Table -->
<div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden">
    <div class="overflow-x-auto">
        <table class="table">
            <thead class="bg-gray-50 dark:bg-gray-700 border-b border-gray-200 dark:border-gray-600">
                <tr>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Device</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden md:table-cell">License</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden lg:table-cell">Type</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden sm:table-cell">OS</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden md:table-cell">Location</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Status</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden sm:table-cell">Last Seen</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Actions</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100 dark:divide-gray-700">
                <?php $__empty_1 = true; $__currentLoopData = $deviceLogs; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $device): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                <tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
                    <td class="px-4 sm:px-6 py-4">
                        <div class="flex items-center gap-3">
                            <div class="w-10 h-10 bg-purple-100 dark:bg-purple-900 rounded-lg flex items-center justify-center">
                                <?php if($device->device_type === 'mobile'): ?>
                                    <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
                                    </svg>
                                <?php elseif($device->device_type === 'tablet'): ?>
                                    <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
                                    </svg>
                                <?php else: ?>
                                    <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
                                    </svg>
                                <?php endif; ?>
                            </div>
                            <div>
                                <div class="text-fluid-sm font-medium text-gray-800 dark:text-gray-100"><?php echo e($device->device_name); ?></div>
                                <div class="text-fluid-xs text-gray-500 dark:text-gray-400"><?php echo e($device->browser); ?></div>
                            </div>
                        </div>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden md:table-cell">
                        <a href="<?php echo e(route('licenses.show', $device->license_id)); ?>" class="text-fluid-sm text-purple-600 dark:text-purple-400 hover:text-purple-700 dark:hover:text-purple-300 font-mono">
                            <?php echo e($device->license->key ?? 'N/A'); ?>

                        </a>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden lg:table-cell">
                        <span class="text-fluid-sm text-gray-600 dark:text-gray-400 capitalize"><?php echo e($device->device_type); ?></span>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden sm:table-cell">
                        <span class="text-fluid-sm text-gray-600 dark:text-gray-400"><?php echo e($device->os); ?></span>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden md:table-cell">
                        <span class="text-fluid-sm text-gray-600 dark:text-gray-400">
                            <?php echo e($device->city ? $device->city . ', ' : ''); ?><?php echo e($device->country ?? 'Unknown'); ?>

                        </span>
                    </td>
                    <td class="px-4 sm:px-6 py-4">
                        <?php if($device->is_active): ?>
                            <span class="px-2 py-1 text-fluid-xs font-medium rounded-full bg-green-100 text-green-700 dark:bg-green-900 dark:text-green-300">Active</span>
                        <?php else: ?>
                            <span class="px-2 py-1 text-fluid-xs font-medium rounded-full bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300">Inactive</span>
                        <?php endif; ?>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden sm:table-cell">
                        <span class="text-fluid-sm text-gray-500 dark:text-gray-400"><?php echo e($device->last_seen?->diffForHumans() ?? '-'); ?></span>
                    </td>
                    <td class="px-4 sm:px-6 py-4">
                        <div class="flex items-center gap-2">
                            <?php if($device->is_active): ?>
                                <form action="<?php echo e(route('devices.block', $device->id)); ?>" method="POST" class="inline">
                                    <?php echo csrf_field(); ?>
                                    <button type="submit" class="p-2 text-gray-400 hover:text-red-600 dark:hover:text-red-400 transition-colors" title="Block Device">
                                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636"></path>
                                        </svg>
                                    </button>
                                </form>
                            <?php else: ?>
                                <form action="<?php echo e(route('devices.unblock', $device->id)); ?>" method="POST" class="inline">
                                    <?php echo csrf_field(); ?>
                                    <button type="submit" class="p-2 text-gray-400 hover:text-green-600 dark:hover:text-green-400 transition-colors" title="Unblock Device">
                                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                                        </svg>
                                    </button>
                                </form>
                            <?php endif; ?>
                            <a href="<?php echo e(route('devices.show', $device->id)); ?>" class="p-2 text-gray-400 hover:text-purple-600 dark:hover:text-purple-400 transition-colors" title="View Details">
                                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"></path>
                                </svg>
                            </a>
                        </div>
                    </td>
                </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                <tr>
                    <td colspan="8" class="px-4 sm:px-6 py-12 text-center text-gray-500 dark:text-gray-400">
                        <svg class="w-12 h-12 mx-auto text-gray-300 dark:text-gray-600 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
                        </svg>
                        <p>No device logs found</p>
                    </td>
                </tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
    
    <!-- Pagination -->
    <div class="px-4 sm:px-6 py-4 border-t border-gray-100 dark:border-gray-700">
        <?php echo e($deviceLogs->links()); ?>

    </div>
</div>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\xampp\htdocs\license-panel\resources\views/devices/index.blade.php ENDPATH**/ ?>