PHP Classes

File: modules/dashboard/templates/users.php

Recommend this page to a friend!
  Classes of Adrian M   upMVC   modules/dashboard/templates/users.php   Download  
File: modules/dashboard/templates/users.php
Role: Auxiliary script
Content type: text/plain
Description: Configuration script
Class: upMVC
Pure PHP web development without other frameworks
Author: By
Last change: up
Date: 1 month ago
Size: 11,435 bytes
 

Contents

Class file image Download
<div class="bg-white dark:bg-gray-800 shadow rounded-lg"> <!-- Header with Add User Button --> <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700 flex justify-between items-center"> <h2 class="text-xl font-semibold text-gray-800 dark:text-white">User Management</h2> <button onclick="openModal('addUserModal')" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center"> <i class="fas fa-user-plus mr-2"></i> Add User </button> </div> <!-- Users Table --> <div class="overflow-x-auto"> <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700"> <thead class="bg-gray-50 dark:bg-gray-700"> <tr> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider"> User </th> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider"> Role </th> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider"> Status </th> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider"> Last Login </th> <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider"> Actions </th> </tr> </thead> <tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700"> <?php foreach ($users as $user): ?> <tr> <td class="px-6 py-4 whitespace-nowrap"> <div class="flex items-center"> <div class="flex-shrink-0 h-10 w-10"> <i class="fas fa-user-circle text-gray-400 text-2xl"></i> </div> <div class="ml-4"> <div class="text-sm font-medium text-gray-900 dark:text-white"> <?= htmlspecialchars($user['name']) ?> </div> <div class="text-sm text-gray-500 dark:text-gray-400"> <?= htmlspecialchars($user['email']) ?> </div> </div> </div> </td> <td class="px-6 py-4 whitespace-nowrap"> <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full <?= $user['role'] === 'admin' ? 'bg-purple-100 text-purple-800' : 'bg-green-100 text-green-800' ?>"> <?= ucfirst(htmlspecialchars($user['role'])) ?> </span> </td> <td class="px-6 py-4 whitespace-nowrap"> <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800"> Active </span> </td> <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400"> <?= $user['last_login'] ?? 'Never' ?> </td> <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> <button onclick="openModal('editUserModal', <?= htmlspecialchars(json_encode($user)) ?>)" class="text-blue-600 hover:text-blue-900 mr-3"> <i class="fas fa-edit"></i> </button> <button onclick="confirmDelete(<?= $user['id'] ?>)" class="text-red-600 hover:text-red-900"> <i class="fas fa-trash"></i> </button> </td> </tr> <?php endforeach; ?> </tbody> </table> </div> </div> <!-- Add User Modal --> <div id="addUserModal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full"> <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white dark:bg-gray-800 dark:border-gray-700"> <div class="mt-3"> <h3 class="text-lg font-medium text-gray-900 dark:text-white mb-4">Add New User</h3> <form id="addUserForm" action="<?php echo BASE_URL ?>/dashboard/users/add" method="POST" class="space-y-4"> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Name</label> <input type="text" name="name" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> </div> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Email</label> <input type="email" name="email" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> </div> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Password</label> <input type="password" name="password" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> </div> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Role</label> <select name="role" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> <option value="user">User</option> <option value="admin">Admin</option> </select> </div> <div class="flex justify-end space-x-3"> <button type="button" onclick="closeModal('addUserModal')" class="bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-300 px-4 py-2 rounded-md hover:bg-gray-300 dark:hover:bg-gray-600"> Cancel </button> <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700"> Add User </button> </div> </form> </div> </div> </div> <!-- Edit User Modal --> <div id="editUserModal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full"> <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white dark:bg-gray-800 dark:border-gray-700"> <div class="mt-3"> <h3 class="text-lg font-medium text-gray-900 dark:text-white mb-4">Edit User</h3> <form id="editUserForm" action="<?php echo BASE_URL ?>/dashboard/users/edit" method="POST" class="space-y-4"> <input type="hidden" name="id" id="editUserId"> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Name</label> <input type="text" name="name" id="editUserName" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> </div> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Email</label> <input type="email" name="email" id="editUserEmail" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> </div> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Password</label> <input type="password" name="password" id="editUserPassword" class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500" placeholder="Leave empty to keep current password"> </div> <div> <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Role</label> <select name="role" id="editUserRole" required class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500"> <option value="user">User</option> <option value="admin">Admin</option> </select> </div> <div class="flex justify-end space-x-3"> <button type="button" onclick="closeModal('editUserModal')" class="bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-300 px-4 py-2 rounded-md hover:bg-gray-300 dark:hover:bg-gray-600"> Cancel </button> <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700"> Save Changes </button> </div> </form> </div> </div> </div> <script> const BASE_URL = '<?php echo BASE_URL ?>'; function openModal(modalId, userData = null) { document.getElementById(modalId).classList.remove('hidden'); if (modalId === 'editUserModal' && userData) { document.getElementById('editUserId').value = userData.id; document.getElementById('editUserName').value = userData.name; document.getElementById('editUserEmail').value = userData.email; document.getElementById('editUserRole').value = userData.role; } } function closeModal(modalId) { document.getElementById(modalId).classList.add('hidden'); } function confirmDelete(userId) { if (confirm('Are you sure you want to delete this user?')) { window.location.href = `${BASE_URL}/dashboard/users/delete/?userid=${userId}`; } } // Close modals when clicking outside window.onclick = function(event) { if (event.target.classList.contains('fixed')) { event.target.classList.add('hidden'); } } </script>