

<?php $__env->startSection('title', 'Gestión de Personal Administrativo'); ?>

<?php $__env->startSection('content'); ?>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-8">
    <!-- Formulario de Creación -->
    <div class="lg:col-span-1">
        <div class="bg-white rounded-xl shadow-lg p-6">
            <h2 class="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-2">
                <i class="fas fa-user-plus text-blue-600"></i>
                Nuevo Personal
            </h2>

            <?php if($errors->any()): ?>
                <div class="bg-red-100 border-l-4 border-red-500 text-red-700 p-4 mb-6 rounded">
                    <ul class="list-disc list-inside">
                        <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <li class="text-sm"><?php echo e($error); ?></li>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </ul>
                </div>
            <?php endif; ?>

            <form action="<?php echo e(route('admin.users.store-personal')); ?>" method="POST">
                <?php echo csrf_field(); ?>

                <!-- Nombre -->
                <div class="mb-5">
                    <label for="name" class="block text-sm font-semibold text-gray-700 mb-2">
                        Nombre Completo *
                    </label>
                    <input 
                        type="text" 
                        id="name" 
                        name="name" 
                        value="<?php echo e(old('name')); ?>"
                        class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
                        placeholder="Juan Pérez"
                        required
                    >
                </div>

                <!-- Rol -->
                <div class="mb-5">
                    <label for="role" class="block text-sm font-semibold text-gray-700 mb-2">
                        Rol *
                    </label>
                    <select id="role" name="role" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent" required>
                        <option value="admin" <?php echo e(old('role') == 'admin' ? 'selected' : ''); ?>>Administrador</option>
                        <option value="user" <?php echo e(old('role') == 'user' ? 'selected' : ''); ?>>Usuario</option>
                    </select>
                </div>

                <!-- Email -->
                <div class="mb-5">
                    <label for="email" class="block text-sm font-semibold text-gray-700 mb-2">
                        Correo Electrónico *
                    </label>
                    <input 
                        type="email" 
                        id="email" 
                        name="email" 
                        value="<?php echo e(old('email')); ?>"
                        class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
                        placeholder="juan@example.com"
                        required
                    >
                </div>

                <!-- Teléfono -->
                <div class="mb-5">
                    <label for="phone" class="block text-sm font-semibold text-gray-700 mb-2">
                        Teléfono
                    </label>
                    <input 
                        type="tel" 
                        id="phone" 
                        name="phone" 
                        value="<?php echo e(old('phone')); ?>"
                        class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
                        placeholder="+51 999 999 999"
                    >
                </div>

                <!-- Contraseña -->
                <div class="mb-5">
                    <label for="password" class="block text-sm font-semibold text-gray-700 mb-2">
                        Contraseña *
                    </label>
                    <input 
                        type="password" 
                        id="password" 
                        name="password" 
                        class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
                        placeholder="Mínimo 8 caracteres"
                        required
                    >
                    <p class="text-xs text-gray-500 mt-1">Mínimo 8 caracteres</p>
                </div>

                <!-- Confirmar Contraseña -->
                <div class="mb-6">
                    <label for="password_confirmation" class="block text-sm font-semibold text-gray-700 mb-2">
                        Confirmar Contraseña *
                    </label>
                    <input 
                        type="password" 
                        id="password_confirmation" 
                        name="password_confirmation" 
                        class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
                        placeholder="Repite la contraseña"
                        required
                    >
                </div>

                <!-- Botón Enviar -->
                <button 
                    type="submit" 
                    class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 rounded-lg transition transform hover:scale-105"
                >
                    <i class="fas fa-save mr-2"></i> Crear Personal
                </button>
            </form>
        </div>
    </div>

    <!-- Lista de Personal -->
    <div class="lg:col-span-2">
        <div class="bg-white rounded-xl shadow-lg overflow-hidden">
            <div class="bg-gradient-to-r from-blue-600 to-blue-700 px-6 py-4">
                <h2 class="text-xl font-bold text-white flex items-center gap-2">
                    <i class="fas fa-users-cog"></i>
                    Personal Administrativo
                    <span class="ml-2 bg-blue-800 px-3 py-1 rounded-full text-sm"><?php echo e($personalAdmins->count()); ?></span>
                </h2>
            </div>

            <?php if($personalAdmins->isEmpty()): ?>
                <div class="p-8 text-center">
                    <i class="fas fa-inbox text-6xl text-gray-300 mb-4 block"></i>
                    <p class="text-gray-500 text-lg">No hay personal administrativo registrado</p>
                </div>
            <?php else: ?>
                <div class="overflow-x-auto">
                    <table class="w-full">
                        <thead class="bg-gray-50 border-b">
                            <tr>
                                <th class="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase">Nombre</th>
                                <th class="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase hidden sm:table-cell">Email</th>
                                <th class="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase hidden md:table-cell">Teléfono</th>
                                <th class="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase">Fecha Creación</th>
                                <th class="px-6 py-4 text-center text-xs font-bold text-gray-700 uppercase">Acciones</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-gray-200">
                            <?php $__currentLoopData = $personalAdmins; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $admin): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <tr class="hover:bg-gray-50 transition">
                                <td class="px-6 py-4">
                                    <div class="flex items-center gap-3">
                                        <div class="w-10 h-10 bg-gradient-to-br from-blue-500 to-blue-600 rounded-full flex items-center justify-center text-white font-bold">
                                            <?php echo e(substr($admin->name, 0, 1)); ?>

                                        </div>
                                        <div>
                                            <p class="font-bold text-gray-900"><?php echo e($admin->name); ?></p>
                                        </div>
                                    </div>
                                </td>
                                <td class="px-6 py-4 hidden sm:table-cell">
                                    <p class="text-sm text-gray-600"><?php echo e($admin->email); ?></p>
                                </td>
                                <td class="px-6 py-4 hidden md:table-cell">
                                    <p class="text-sm text-gray-600"><?php echo e($admin->phone ?? '-'); ?></p>
                                </td>
                                <td class="px-6 py-4">
                                    <p class="text-sm text-gray-600"><?php echo e($admin->created_at->locale('es')->format('d M, Y')); ?></p>
                                </td>
                                <td class="px-6 py-4 text-center">
                                    <a href="<?php echo e(route('admin.users.edit-personal', $admin->id)); ?>" class="inline-flex items-center px-3 py-2 bg-yellow-100 hover:bg-yellow-600 text-yellow-600 hover:text-white rounded-lg text-sm font-semibold transition mr-2">
                                        <i class="fas fa-edit mr-1"></i>
                                        <span class="hidden sm:inline">Editar</span>
                                    </a>
                                    <form action="<?php echo e(route('admin.users.delete-personal', $admin->id)); ?>" method="POST" class="inline">
                                        <?php echo csrf_field(); ?>
                                        <?php echo method_field('DELETE'); ?>
                                        <button 
                                            type="submit" 
                                            onclick="return confirm('¿Estás seguro de eliminar a ' + '<?php echo e($admin->name); ?>' + '?')"
                                            class="inline-flex items-center px-3 py-2 bg-red-100 hover:bg-red-600 text-red-600 hover:text-white rounded-lg text-sm font-semibold transition"
                                        >
                                            <i class="fas fa-trash mr-1"></i>
                                            <span class="hidden sm:inline">Eliminar</span>
                                        </button>
                                    </form>
                                </td>
                            </tr>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </tbody>
                    </table>
                </div>
            <?php endif; ?>
        </div>
    </div>
</div>

<!-- Mensaje de Éxito -->
<?php if(session('success')): ?>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const message = "<?php echo e(session('success')); ?>";
        if (message) {
            alert(message);
        }
    });
</script>
<?php endif; ?>

<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.admin', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH D:\proyecto-web\diagnostika\src\resources\views/admin/users/create-personal.blade.php ENDPATH**/ ?>